From 2844da768f00661c5b2886f73a5be427013673dc Mon Sep 17 00:00:00 2001 From: Neil Fraser Date: Wed, 21 Jan 2015 18:23:10 -0800 Subject: [PATCH] Speed up rendering. --- blockly_compressed.js | 17 ++++---- blockly_uncompressed.js | 30 ++++++------- core/block_svg.js | 26 ++++++----- core/xml.js | 95 ++++++++++++++++++++++++----------------- 4 files changed, 96 insertions(+), 72 deletions(-) diff --git a/blockly_compressed.js b/blockly_compressed.js index cc02db181..795c962d9 100644 --- a/blockly_compressed.js +++ b/blockly_compressed.js @@ -942,12 +942,13 @@ b.setAttribute("collapsed",!0);a.disabled&&b.setAttribute("disabled",!0);a.isDel Blockly.Xml.domToPrettyText=function(a){a=Blockly.Xml.domToText(a).split("<");for(var b="",c=1;c"!=d.slice(-2)&&(b+=" ")}a=a.join("\n");a=a.replace(/(<(\w+)\b[^>]*>[^\n]*)\n *<\/\2>/g,"$1");return a.replace(/^\n/,"")}; Blockly.Xml.textToDom=function(a){a=(new DOMParser).parseFromString(a,"text/xml");if(!a||!a.firstChild||"xml"!=a.firstChild.nodeName.toLowerCase()||a.firstChild!==a.lastChild)throw"Blockly.Xml.textToDom did not obtain a valid XML tree.";return a.firstChild}; Blockly.Xml.domToWorkspace=function(a,b){var c;Blockly.RTL&&(c=a.getWidth());for(var d=0,e;e=b.childNodes[d];d++)if("block"==e.nodeName.toLowerCase()){var f=Blockly.Xml.domToBlock(a,e),g=parseInt(e.getAttribute("x"),10);e=parseInt(e.getAttribute("y"),10);isNaN(g)||isNaN(e)||f.moveBy(Blockly.RTL?c-g:g,e)}}; -Blockly.Xml.domToBlock=function(a,b,c){var d=null,e=b.getAttribute("type");if(!e)throw"Block type unspecified: \n"+b.outerHTML;var f=b.getAttribute("id");if(c&&f){d=Blockly.Block.getById(f,a);if(!d)throw"Couldn't get Block with id: "+f;f=d.getParent();d.workspace&&d.dispose(!0,!1,!0);d.fill(a,e);d.parent_=f}else d=Blockly.Block.obtain(a,e);d.initSvg&&d.initSvg();(f=b.getAttribute("inline"))&&d.setInputsInline("true"==f);(f=b.getAttribute("disabled"))&&d.setDisabled("true"==f);(f=b.getAttribute("deletable"))&& -d.setDeletable("true"==f);(f=b.getAttribute("movable"))&&d.setMovable("true"==f);(f=b.getAttribute("editable"))&&d.setEditable("true"==f);for(var g=null,f=0,h;h=b.childNodes[f];f++)if(3!=h.nodeType||!h.data.match(/^\s*$/)){for(var g=null,k=0,l;l=h.childNodes[k];k++)3==l.nodeType&&l.data.match(/^\s*$/)||(g=l);k=h.getAttribute("name");switch(h.nodeName.toLowerCase()){case "mutation":d.domToMutation&&(d.domToMutation(h),d.initSvg&&d.initSvg());break;case "comment":d.setCommentText(h.textContent);var p= -h.getAttribute("pinned");p&&setTimeout(function(){d.comment&&d.comment.setVisible&&d.comment.setVisible("true"==p)},1);g=parseInt(h.getAttribute("w"),10);h=parseInt(h.getAttribute("h"),10);!isNaN(g)&&!isNaN(h)&&d.comment&&d.comment.setVisible&&d.comment.setBubbleSize(g,h);break;case "title":case "field":d.setFieldValue(h.textContent,k);break;case "value":case "statement":h=d.getInput(k);if(!h)throw"Input "+k+" does not exist in block "+e;if(g&&"block"==g.nodeName.toLowerCase())if(g=Blockly.Xml.domToBlock(a, -g,c),g.outputConnection)h.connection.connect(g.outputConnection);else if(g.previousConnection)h.connection.connect(g.previousConnection);else throw"Child block does not have output or previous statement.";break;case "next":if(g&&"block"==g.nodeName.toLowerCase()){if(!d.nextConnection)throw"Next statement does not exist.";if(d.nextConnection.targetConnection)throw"Next statement is already connected.";g=Blockly.Xml.domToBlock(a,g,c);if(!g.previousConnection)throw"Next block does not have previous statement."; -d.nextConnection.connect(g.previousConnection)}break;default:console.log("Ignoring unknown tag: "+h.nodeName)}}(b=b.getAttribute("collapsed"))&&d.setCollapsed("true"==b);a.rendered&&((a=d.getNextBlock())?a.render():d.render());return d};Blockly.Xml.deleteNext=function(a){for(var b=0,c;c=a.childNodes[b];b++)if("next"==c.nodeName.toLowerCase()){a.removeChild(c);break}};goog.global.Blockly||(goog.global.Blockly={});goog.global.Blockly.Xml||(goog.global.Blockly.Xml={}); -goog.global.Blockly.Xml.domToText=Blockly.Xml.domToText;goog.global.Blockly.Xml.domToWorkspace=Blockly.Xml.domToWorkspace;goog.global.Blockly.Xml.textToDom=Blockly.Xml.textToDom;goog.global.Blockly.Xml.workspaceToDom=Blockly.Xml.workspaceToDom; +Blockly.Xml.domToBlock=function(a,b,c){b=Blockly.Xml.domToBlockHeadless_(a,b,c);if(a.rendered){a=b.getDescendants();for(c=a.length-1;0<=c;c--)a[c].initSvg();for(c=a.length-1;0<=c;c--)a[c].render(!1);b.updateDisabled();Blockly.fireUiEvent(window,"resize")}return b}; +Blockly.Xml.domToBlockHeadless_=function(a,b,c){var d=null,e=b.getAttribute("type");if(!e)throw"Block type unspecified: \n"+b.outerHTML;var f=b.getAttribute("id");if(c&&f){d=Blockly.Block.getById(f,a);if(!d)throw"Couldn't get Block with id: "+f;f=d.getParent();d.workspace&&d.dispose(!0,!1,!0);d.fill(a,e);d.parent_=f}else d=Blockly.Block.obtain(a,e);for(var g=null,f=0,h;h=b.childNodes[f];f++)if(3!=h.nodeType||!h.data.match(/^\s*$/)){for(var g=null,k=0,l;l=h.childNodes[k];k++)3==l.nodeType&&l.data.match(/^\s*$/)|| +(g=l);k=h.getAttribute("name");switch(h.nodeName.toLowerCase()){case "mutation":d.domToMutation&&(d.domToMutation(h),d.initSvg&&d.initSvg());break;case "comment":d.setCommentText(h.textContent);var p=h.getAttribute("pinned");p&&setTimeout(function(){d.comment&&d.comment.setVisible&&d.comment.setVisible("true"==p)},1);g=parseInt(h.getAttribute("w"),10);h=parseInt(h.getAttribute("h"),10);!isNaN(g)&&!isNaN(h)&&d.comment&&d.comment.setVisible&&d.comment.setBubbleSize(g,h);break;case "title":case "field":d.setFieldValue(h.textContent, +k);break;case "value":case "statement":h=d.getInput(k);if(!h)throw"Input "+k+" does not exist in block "+e;if(g&&"block"==g.nodeName.toLowerCase())if(g=Blockly.Xml.domToBlockHeadless_(a,g,c),g.outputConnection)h.connection.connect(g.outputConnection);else if(g.previousConnection)h.connection.connect(g.previousConnection);else throw"Child block does not have output or previous statement.";break;case "next":if(g&&"block"==g.nodeName.toLowerCase()){if(!d.nextConnection)throw"Next statement does not exist."; +if(d.nextConnection.targetConnection)throw"Next statement is already connected.";g=Blockly.Xml.domToBlockHeadless_(a,g,c);if(!g.previousConnection)throw"Next block does not have previous statement.";d.nextConnection.connect(g.previousConnection)}break;default:console.log("Ignoring unknown tag: "+h.nodeName)}}(a=b.getAttribute("inline"))&&d.setInputsInline("true"==a);(a=b.getAttribute("disabled"))&&d.setDisabled("true"==a);(a=b.getAttribute("deletable"))&&d.setDeletable("true"==a);(a=b.getAttribute("movable"))&& +d.setMovable("true"==a);(a=b.getAttribute("editable"))&&d.setEditable("true"==a);(b=b.getAttribute("collapsed"))&&d.setCollapsed("true"==b);return d};Blockly.Xml.deleteNext=function(a){for(var b=0,c;c=a.childNodes[b];b++)if("next"==c.nodeName.toLowerCase()){a.removeChild(c);break}};goog.global.Blockly||(goog.global.Blockly={});goog.global.Blockly.Xml||(goog.global.Blockly.Xml={});goog.global.Blockly.Xml.domToText=Blockly.Xml.domToText;goog.global.Blockly.Xml.domToWorkspace=Blockly.Xml.domToWorkspace; +goog.global.Blockly.Xml.textToDom=Blockly.Xml.textToDom;goog.global.Blockly.Xml.workspaceToDom=Blockly.Xml.workspaceToDom; // Copyright 2014 Google Inc. Apache License 2.0 Blockly.WorkspaceSvg=function(a,b){Blockly.WorkspaceSvg.superClass_.constructor.call(this);this.getMetrics=a;this.setMetrics=b;Blockly.ConnectionDB.init(this)};goog.inherits(Blockly.WorkspaceSvg,Blockly.Workspace);Blockly.WorkspaceSvg.prototype.rendered=!0;Blockly.WorkspaceSvg.prototype.isFlyout=!1;Blockly.WorkspaceSvg.prototype.dragMode=!1;Blockly.WorkspaceSvg.prototype.scrollX=0;Blockly.WorkspaceSvg.prototype.scrollY=0;Blockly.WorkspaceSvg.prototype.trashcan=null; Blockly.WorkspaceSvg.prototype.fireChangeEventPid_=null;Blockly.WorkspaceSvg.prototype.scrollbar=null;Blockly.WorkspaceSvg.prototype.createDom=function(){this.svgGroup_=Blockly.createSvgElement("g",{},null);this.svgBlockCanvas_=Blockly.createSvgElement("g",{},this.svgGroup_);this.svgBubbleCanvas_=Blockly.createSvgElement("g",{},this.svgGroup_);this.fireChangeEvent();return this.svgGroup_}; @@ -1056,9 +1057,9 @@ Blockly.BlockSvg.prototype.updateColour=function(){if(!this.disabled){var a=Bloc Blockly.BlockSvg.prototype.updateDisabled=function(){var a=Blockly.hasClass_(this.svgGroup_,"blocklyDisabled");this.disabled||this.getInheritedDisabled()?a||(Blockly.addClass_(this.svgGroup_,"blocklyDisabled"),this.svgPath_.setAttribute("fill","url(#blocklyDisabledPattern)")):a&&(Blockly.removeClass_(this.svgGroup_,"blocklyDisabled"),this.updateColour());for(var a=this.getChildren(),b=0,c;c=a[b];b++)c.updateDisabled()}; Blockly.BlockSvg.prototype.getCommentText=function(){return this.comment?this.comment.getText().replace(/\s+$/,"").replace(/ +\n/g,"\n"):""};Blockly.BlockSvg.prototype.setCommentText=function(a){var b=!1;goog.isString(a)?(this.comment||(this.comment=new Blockly.Comment(this),b=!0),this.comment.setText(a)):this.comment&&(this.comment.dispose(),b=!0);b&&this.rendered&&(this.render(),this.bumpNeighbours_())}; Blockly.BlockSvg.prototype.setWarningText=function(a){this.isInFlyout&&(a=null);var b=!1;goog.isString(a)?(this.warning||(this.warning=new Blockly.Warning(this),b=!0),this.warning.setText(a)):this.warning&&(this.warning.dispose(),b=!0);b&&this.rendered&&(this.render(),this.bumpNeighbours_())};Blockly.BlockSvg.prototype.setMutator=function(a){this.mutator&&this.mutator!==a&&this.mutator.dispose();a&&(a.block_=this,this.mutator=a,this.rendered&&a.createIcon())}; -Blockly.BlockSvg.prototype.setDisabled=function(a){this.disabled!=a&&(Blockly.BlockSvg.superClass_.setDisabled.call(this,a),this.updateDisabled(),this.workspace.fireChangeEvent())};Blockly.BlockSvg.prototype.addSelect=function(){Blockly.addClass_(this.svgGroup_,"blocklySelected");this.svgGroup_.parentNode.appendChild(this.svgGroup_)};Blockly.BlockSvg.prototype.removeSelect=function(){Blockly.removeClass_(this.svgGroup_,"blocklySelected")}; +Blockly.BlockSvg.prototype.setDisabled=function(a){this.disabled!=a&&(Blockly.BlockSvg.superClass_.setDisabled.call(this,a),this.rendered&&this.updateDisabled(),this.workspace.fireChangeEvent())};Blockly.BlockSvg.prototype.addSelect=function(){Blockly.addClass_(this.svgGroup_,"blocklySelected");this.svgGroup_.parentNode.appendChild(this.svgGroup_)};Blockly.BlockSvg.prototype.removeSelect=function(){Blockly.removeClass_(this.svgGroup_,"blocklySelected")}; Blockly.BlockSvg.prototype.addDragging=function(){Blockly.addClass_(this.svgGroup_,"blocklyDragging")};Blockly.BlockSvg.prototype.removeDragging=function(){Blockly.removeClass_(this.svgGroup_,"blocklyDragging")}; -Blockly.BlockSvg.prototype.render=function(){this.rendered=!0;var a=Blockly.BlockSvg.SEP_SPACE_X;Blockly.RTL&&(a=-a);for(var b=this.getIcons(),c=0;c= 0; i--) { + blocks[i].initSvg(); + } + for (var i = blocks.length -1; i >= 0; i--) { + blocks[i].render(false); + } + topBlock.updateDisabled(); + // Fire an event to allow scrollbars to resize. + Blockly.fireUiEvent(window, 'resize'); + } + return topBlock; +}; + +/** + * Decode an XML block tag and create a block (and possibly sub blocks) on the + * workspace. + * @param {!Blockly.Workspace} workspace The workspace. + * @param {!Element} xmlBlock XML block element. + * @param {boolean=} opt_reuseBlock Optional arg indicating whether to + * reinitialize an existing block. + * @return {!Blockly.Block} The root block created. + * @private + */ +Blockly.Xml.domToBlockHeadless_ = + function(workspace, xmlBlock, opt_reuseBlock) { var block = null; var prototypeName = xmlBlock.getAttribute('type'); if (!prototypeName) { @@ -263,31 +295,6 @@ Blockly.Xml.domToBlock = function(workspace, xmlBlock, opt_reuseBlock) { } else { block = Blockly.Block.obtain(workspace, prototypeName); } - if (block.initSvg) { - // SVG blocks are rendered, headless blocks are not. - block.initSvg(); - } - - var inline = xmlBlock.getAttribute('inline'); - if (inline) { - block.setInputsInline(inline == 'true'); - } - var disabled = xmlBlock.getAttribute('disabled'); - if (disabled) { - block.setDisabled(disabled == 'true'); - } - var deletable = xmlBlock.getAttribute('deletable'); - if (deletable) { - block.setDeletable(deletable == 'true'); - } - var movable = xmlBlock.getAttribute('movable'); - if (movable) { - block.setMovable(movable == 'true'); - } - var editable = xmlBlock.getAttribute('editable'); - if (editable) { - block.setEditable(editable == 'true'); - } var blockChild = null; for (var i = 0, xmlChild; xmlChild = xmlBlock.childNodes[i]; i++) { @@ -351,8 +358,8 @@ Blockly.Xml.domToBlock = function(workspace, xmlBlock, opt_reuseBlock) { } if (firstRealGrandchild && firstRealGrandchild.nodeName.toLowerCase() == 'block') { - blockChild = Blockly.Xml.domToBlock(workspace, firstRealGrandchild, - opt_reuseBlock); + blockChild = Blockly.Xml.domToBlockHeadless_(workspace, + firstRealGrandchild, opt_reuseBlock); if (blockChild.outputConnection) { input.connection.connect(blockChild.outputConnection); } else if (blockChild.previousConnection) { @@ -371,8 +378,8 @@ Blockly.Xml.domToBlock = function(workspace, xmlBlock, opt_reuseBlock) { // This could happen if there is more than one XML 'next' tag. throw 'Next statement is already connected.'; } - blockChild = Blockly.Xml.domToBlock(workspace, firstRealGrandchild, - opt_reuseBlock); + blockChild = Blockly.Xml.domToBlockHeadless_(workspace, + firstRealGrandchild, opt_reuseBlock); if (!blockChild.previousConnection) { throw 'Next block does not have previous statement.'; } @@ -385,20 +392,30 @@ Blockly.Xml.domToBlock = function(workspace, xmlBlock, opt_reuseBlock) { } } + var inline = xmlBlock.getAttribute('inline'); + if (inline) { + block.setInputsInline(inline == 'true'); + } + var disabled = xmlBlock.getAttribute('disabled'); + if (disabled) { + block.setDisabled(disabled == 'true'); + } + var deletable = xmlBlock.getAttribute('deletable'); + if (deletable) { + block.setDeletable(deletable == 'true'); + } + var movable = xmlBlock.getAttribute('movable'); + if (movable) { + block.setMovable(movable == 'true'); + } + var editable = xmlBlock.getAttribute('editable'); + if (editable) { + block.setEditable(editable == 'true'); + } var collapsed = xmlBlock.getAttribute('collapsed'); if (collapsed) { block.setCollapsed(collapsed == 'true'); } - if (workspace.rendered) { - var next = block.getNextBlock(); - if (next) { - // Next block in a stack needs to square off its corners. - // Rendering a child will render its parent. - next.render(); - } else { - block.render(); - } - } return block; };