writing comment to myself re: why there's weird code in View.prototype.initialRender. Hack hack hack...

image/private/kernel.js

@@ -173,12 +173,12 @@ BaseImage.prototype.toDomNode = function(params) {
     var canvas = makeCanvas(width, height);
     var ctx;
 
-    // Try best effort to render to screen at this point.
-    try {
-	ctx = canvas.getContext("2d");
-	that.render(ctx, 0, 0);
-    } catch (e) {
-    }
+    // // Try best effort to render to screen at this point.
+    // try {
+    //     ctx = canvas.getContext("2d");
+    //     that.render(ctx, 0, 0);
+    // } catch (e) {
+    // }
     // KLUDGE: on IE, the canvas rendering functions depend on a
     // context where the canvas is attached to the DOM tree.
     // We initialize an afterAttach hook; the client's responsible
@@ -190,6 +190,10 @@ BaseImage.prototype.toDomNode = function(params) {
 	that.render(ctx, 0, 0);
     };
     $(canvas).bind('afterAttach', onAfterAttach);
+
+    // Canvases lose their drawn content on cloning.  data may help us to preserve it.
+    $(canvas).data('toRender', onAfterAttach);
+
     return canvas;
 };
 

web-world/js-impl.js

@@ -43,7 +43,9 @@
 
 
     var shallowCloneNode = function(node) {
-        return node.cloneNode(false);
+        var result = node.cloneNode(false);
+        $(result).data($(node).data());
+        return result;
     };
 
 
@@ -88,7 +90,7 @@
             function(tree) {
                 return tree[0].nodeType !== 1;
             };
-        return TreeCursor.adaptTreeCursor(domNodeToArrayTree(dom.cloneNode(true)),
+        return TreeCursor.adaptTreeCursor(domNodeToArrayTree($(dom).clone(true).get(0)),
                                           domOpenF,
                                           domCloseF,
                                           domAtomicF);
@@ -563,7 +565,10 @@
 
     View.prototype.toString = function() { return "#<View>"; };
 
-    View.prototype.initialRender = function(top) {
+
+    var defaultToRender = function(){};
+ 
+   View.prototype.initialRender = function(top) {
         $(top).empty();
         // Special case: if this.top is an html, we merge into the
         // existing page.
@@ -574,7 +579,22 @@
         $(document.head).append($(this.top).children("link"));
 
         $(top).append(this.top);
-    };
+
+       // The snip here is meant to accomodate weirdness with canvas dom
+       // elements.  cloning a canvas doesn't preserve how it draws.
+       // However, we attach a toRender using jQuery's data(), which does
+       // do the preservation we need.  On an initial render, we walk
+       // through all the elements and toRender them.
+
+       // It may be that this will deprecate the afterAttach stuff
+       // that I'm using earlier.
+       ($(this.top).data('toRender') || defaultToRender)();
+       $('*', this.top).each(
+           function(index, elt) {
+               ($(elt).data('toRender') || defaultToRender).call(elt);
+           });
+   };
+
 
     View.prototype.addEventHandler = function(handler) {
         this.eventHandlers.push(handler);