From e8ab929b6ae9f1d84962c91489a5f6a04792b728 Mon Sep 17 00:00:00 2001 From: Neil Fraser Date: Fri, 22 May 2015 17:08:59 -0700 Subject: [PATCH] Fix visibility changes with toolbox. --- blockly_compressed.js | 15 +++++++------- core/toolbox.js | 46 +++++++++++++++++++++---------------------- core/workspace.js | 3 +++ core/workspace_svg.js | 24 +++++++++++++++++++++- demos/code/code.js | 8 +++++++- tests/playground.html | 4 ++-- 6 files changed, 65 insertions(+), 35 deletions(-) diff --git a/blockly_compressed.js b/blockly_compressed.js index 30083c77a..fefbd0032 100644 --- a/blockly_compressed.js +++ b/blockly_compressed.js @@ -848,7 +848,7 @@ Blockly.Workspace.prototype.removeTopBlock=function(a){for(var b=!1,c,d=0;c=this Blockly.Workspace.prototype.getTopBlocks=function(a){var b=[].concat(this.topBlocks_);if(a&&1=this.remainingCapacity())){Blockly.terminateDrag_();var b=Blockly.Xml.domToBlock(this,a),c=parseInt(a.getAttribute("x"),10);a=parseInt(a.getAttribute("y"),10);if(!isNaN(c)&&!isNaN(a)){this.RTL&&(c=-c);do for(var d=!1,e=this.getAllBlocks(),f=0,g;g=e[f];f++)g=g.getRelativeToSurfaceXY(),1>=Math.abs(c-g.x)&&1>=Math.abs(a-g.y)&&(c=this.RTL?c-Blockly.SNAP_RADIUS:c+Blockly.SNAP_RADIUS,a+=2*Blockly.SNAP_RADIUS, @@ -1008,7 +1009,7 @@ Blockly.WorkspaceSvg.prototype.showContextMenu_=function(a){if(!this.options.rea 0,b=0;b separator tag in the toolbox XML needs to be changed to (due to a bug in IE)."):"SEP"==h?e.add(new Blockly.Toolbox.TreeSeparator): -"BLOCK"==h&&e.blocks.push(g)}}var c=this.tree_;c.removeChildren();c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level.";Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.clearSelection=function(){this.tree_.setSelectedItem(null)};Blockly.Toolbox.prototype.getRect=function(){var a=this.workspace_.RTL?Blockly.svgSize(this.workspace_.options.svg).width-this.width:-1E7;return new goog.math.Rect(a,-1E7,1E7+this.width,2E7)}; -Blockly.Toolbox.TreeControl=function(a,b){this.toolbox_=a;goog.ui.tree.TreeControl.call(this,goog.html.SafeHtml.EMPTY,b)};goog.inherits(Blockly.Toolbox.TreeControl,goog.ui.tree.TreeControl);Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);if(goog.events.BrowserFeature.TOUCH_ENABLED){var a=this.getElement();Blockly.bindEvent_(a,goog.events.EventType.TOUCHSTART,this,this.handleTouchEvent_)}}; -Blockly.Toolbox.TreeControl.prototype.handleTouchEvent_=function(a){a.preventDefault();var b=this.getNodeFromEvent_(a);b&&a.type===goog.events.EventType.TOUCHSTART&&setTimeout(function(){b.onMouseDown(a)},1)};Blockly.Toolbox.TreeControl.prototype.createNode=function(a){return new Blockly.Toolbox.TreeNode(this.toolbox_,a?goog.html.SafeHtml.htmlEscape(a):goog.html.SafeHtml.EMPTY,this.getConfig(),this.getDomHelper())}; +Blockly.Toolbox.prototype.populate_=function(a){function b(a,e){for(var f=0,g;g=a.childNodes[f];f++)if(g.tagName)switch(g.tagName.toUpperCase()){case "CATEGORY":var h=c.createNode(g.getAttribute("name"));h.blocks=[];"true"==g.getAttribute("expanded")&&h.setExpanded(!0);e.add(h);var k=g.getAttribute("custom");k?h.blocks=k:b(g,h);break;case "SEP":e.add(new Blockly.Toolbox.TreeSeparator);break;case "BLOCK":e.blocks.push(g)}}var c=this.tree_;c.removeChildren();c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level."; +Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.clearSelection=function(){this.tree_.setSelectedItem(null)};Blockly.Toolbox.prototype.getRect=function(){var a=this.workspace_.RTL?Blockly.svgSize(this.workspace_.options.svg).width-this.width:-1E7;return new goog.math.Rect(a,-1E7,1E7+this.width,2E7)};Blockly.Toolbox.TreeControl=function(a,b){this.toolbox_=a;goog.ui.tree.TreeControl.call(this,goog.html.SafeHtml.EMPTY,b)};goog.inherits(Blockly.Toolbox.TreeControl,goog.ui.tree.TreeControl); +Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);if(goog.events.BrowserFeature.TOUCH_ENABLED){var a=this.getElement();Blockly.bindEvent_(a,goog.events.EventType.TOUCHSTART,this,this.handleTouchEvent_)}};Blockly.Toolbox.TreeControl.prototype.handleTouchEvent_=function(a){a.preventDefault();var b=this.getNodeFromEvent_(a);b&&a.type===goog.events.EventType.TOUCHSTART&&setTimeout(function(){b.onMouseDown(a)},1)}; +Blockly.Toolbox.TreeControl.prototype.createNode=function(a){return new Blockly.Toolbox.TreeNode(this.toolbox_,a?goog.html.SafeHtml.htmlEscape(a):goog.html.SafeHtml.EMPTY,this.getConfig(),this.getDomHelper())}; Blockly.Toolbox.TreeControl.prototype.setSelectedItem=function(a){Blockly.removeAllRanges();if(this.selectedItem_!=a){goog.ui.tree.TreeControl.prototype.setSelectedItem.call(this,a);var b=this.toolbox_;a&&a.blocks&&a.blocks.length?(b.flyout_.show(a.blocks),b.lastCategory_!=a.blocks&&(b.flyout_.scrollToTop(),b.lastCategory_=a.blocks)):b.flyout_.hide()}}; Blockly.Toolbox.TreeNode=function(a,b,c,d){goog.ui.tree.TreeNode.call(this,b,c,d);a&&(b=function(){Blockly.fireUiEvent(window,"resize")},goog.events.listen(a.tree_,goog.ui.tree.BaseNode.EventType.EXPAND,b),goog.events.listen(a.tree_,goog.ui.tree.BaseNode.EventType.COLLAPSE,b))};goog.inherits(Blockly.Toolbox.TreeNode,goog.ui.tree.TreeNode);Blockly.Toolbox.TreeNode.prototype.getExpandIconSafeHtml=function(){return goog.html.SafeHtml.create("span")}; Blockly.Toolbox.TreeNode.prototype.onMouseDown=function(a){this.hasChildren()&&this.isUserCollapsible_?(this.toggle(),this.select()):this.isSelected()?this.getTree().setSelectedItem(null):this.select();this.updateRow()};Blockly.Toolbox.TreeNode.prototype.onDoubleClick_=function(a){};Blockly.Toolbox.TreeSeparator=function(){Blockly.Toolbox.TreeNode.call(this,null,"",Blockly.Toolbox.TreeSeparator.CONFIG_)};goog.inherits(Blockly.Toolbox.TreeSeparator,Blockly.Toolbox.TreeNode); diff --git a/core/toolbox.js b/core/toolbox.js index ad7b75910..8704a470a 100644 --- a/core/toolbox.js +++ b/core/toolbox.js @@ -180,30 +180,28 @@ Blockly.Toolbox.prototype.populate_ = function(newTree) { // Skip over text. continue; } - var name = childIn.tagName.toUpperCase(); - if (name == 'CATEGORY') { - var childOut = rootOut.createNode(childIn.getAttribute('name')); - childOut.blocks = []; - if (childIn.getAttribute('expanded') == 'true') { - childOut.setExpanded(true); - } - treeOut.add(childOut); - var custom = childIn.getAttribute('custom'); - if (custom) { - // Variables and procedures have special categories that are dynamic. - childOut.blocks = custom; - } else { - syncTrees(childIn, childOut); - } - } else if (name == 'HR') { - //
tag is deprecated, use instead. - // https://github.com/google/blockly/issues/50 - console.warn('The
separator tag in the toolbox XML needs to be ' + - 'changed to (due to a bug in IE).'); - } else if (name == 'SEP') { - treeOut.add(new Blockly.Toolbox.TreeSeparator()); - } else if (name == 'BLOCK') { - treeOut.blocks.push(childIn); + switch (childIn.tagName.toUpperCase()) { + case 'CATEGORY': + var childOut = rootOut.createNode(childIn.getAttribute('name')); + childOut.blocks = []; + if (childIn.getAttribute('expanded') == 'true') { + childOut.setExpanded(true); + } + treeOut.add(childOut); + var custom = childIn.getAttribute('custom'); + if (custom) { + // Variables and procedures are special dynamic categories. + childOut.blocks = custom; + } else { + syncTrees(childIn, childOut); + } + break; + case 'SEP': + treeOut.add(new Blockly.Toolbox.TreeSeparator()); + break; + case 'BLOCK': + treeOut.blocks.push(childIn); + break; } } } diff --git a/core/workspace.js b/core/workspace.js index 520505cc4..dd245bd68 100644 --- a/core/workspace.js +++ b/core/workspace.js @@ -214,3 +214,6 @@ Blockly.Workspace.prototype.updateToolbox = function(tree) { this.flyout_.show(tree.childNodes); } }; + +// Export symbols that would otherwise be renamed by Closure compiler. +Blockly.Workspace.prototype['clear'] = Blockly.Workspace.prototype.clear; diff --git a/core/workspace_svg.js b/core/workspace_svg.js index 3c4a31550..51c0dcaad 100644 --- a/core/workspace_svg.js +++ b/core/workspace_svg.js @@ -278,6 +278,27 @@ Blockly.WorkspaceSvg.prototype.getWidth = function() { return this.getMetrics().viewWidth; }; +/** + * Toggles the visibility of the workspace. + * Currently only intended for main workspace. + * @param {boolean} isVisible True if workspace should be visible. + */ +Blockly.WorkspaceSvg.prototype.setVisible = function(isVisible) { + this.options.svg.style.display = isVisible ? 'block' : 'none'; + if (this.toolbox_) { + // Currently does not support toolboxes in mutators. + this.toolbox_.HtmlDiv.style.display = isVisible ? 'block' : 'none'; + } + if (isVisible) { + this.render(); + if (this.toolbox_) { + this.toolbox_.position(); + } + } else { + Blockly.hideChaff(true); + } +}; + /** * Render all blocks in workspace. */ @@ -657,7 +678,8 @@ Blockly.WorkspaceSvg.prototype.markFocused = function() { }; // Export symbols that would otherwise be renamed by Closure compiler. -Blockly.WorkspaceSvg.prototype['clear'] = Blockly.WorkspaceSvg.prototype.clear; +Blockly.WorkspaceSvg.prototype['setVisible'] = + Blockly.WorkspaceSvg.prototype.setVisible; Blockly.WorkspaceSvg.prototype['addChangeListener'] = Blockly.WorkspaceSvg.prototype.addChangeListener; Blockly.WorkspaceSvg.prototype['removeChangeListener'] = diff --git a/demos/code/code.js b/demos/code/code.js index abbe14e13..109378278 100644 --- a/demos/code/code.js +++ b/demos/code/code.js @@ -273,6 +273,9 @@ Code.tabClick = function(clickedName) { } } + if (document.getElementById('tab_blocks').className == 'tabon') { + Code.workspace.setVisible(false); + } // Deselect all tabs and hide all panes. for (var i = 0; i < Code.TABS_.length; i++) { var name = Code.TABS_[i]; @@ -287,6 +290,9 @@ Code.tabClick = function(clickedName) { document.getElementById('content_' + clickedName).style.visibility = 'visible'; Code.renderContent(); + if (clickedName == 'blocks') { + Code.workspace.setVisible(true); + } Blockly.fireUiEvent(window, 'resize'); }; @@ -417,7 +423,7 @@ Code.init = function() { Code.initLanguage = function() { // Set the HTML's language and direction. var rtl = Code.isRtl(); - document.head.parentElement.setAttribute('dir', rtl ? 'rtl' : 'ltr'); + document.dir = rtl ? 'rtl' : 'ltr'; document.head.parentElement.setAttribute('lang', Code.LANG); // Sort languages alphabetically. diff --git a/tests/playground.html b/tests/playground.html index da90cdb1e..b42f4c27f 100644 --- a/tests/playground.html +++ b/tests/playground.html @@ -418,8 +418,8 @@ h1 {

Blockly Playground

-

Show - - Hide

+

Show + - Hide