more cleanup - updating comments and deleting commented out stuff.

Clean up some more unused stuff in flyout. Saving the x & y became absolute when we made the getInjectionDivXY helper
Remove repositionBubble callback hook. Since we put mutator flyouts back as children of the svg, we do not need this anymore.
2016-11-03 13:01:15 -07:00 · 2016-11-03 12:00:51 -07:00 · 2016-11-03 10:14:29 -07:00 · 2016-11-03 09:50:19 -07:00 · 2016-11-03 09:37:25 -07:00 · 2016-11-01 12:54:15 -07:00
@@ -1044,11 +1044,48 @@ Blockly.SPRITE.url);c=Blockly.createSvgElement("clipPath",{id:"blocklyZoomresetC
 a.scrollCenter();Blockly.Touch.clearTouchIdentifier();b.stopPropagation();b.preventDefault()});Blockly.bindEventWithChecks_(e,"mousedown",null,function(b){a.zoomCenter(1);Blockly.Touch.clearTouchIdentifier();b.stopPropagation();b.preventDefault()});Blockly.bindEventWithChecks_(d,"mousedown",null,function(b){a.zoomCenter(-1);Blockly.Touch.clearTouchIdentifier();b.stopPropagation();b.preventDefault()});return this.svgGroup_};
 Blockly.ZoomControls.prototype.init=function(a){this.bottom_=this.MARGIN_BOTTOM_+a;return this.bottom_+this.HEIGHT_};Blockly.ZoomControls.prototype.dispose=function(){this.svgGroup_&&(goog.dom.removeNode(this.svgGroup_),this.svgGroup_=null);this.workspace_=null};
 Blockly.ZoomControls.prototype.position=function(){var a=this.workspace_.getMetrics();a&&(this.workspace_.RTL?(this.left_=this.MARGIN_SIDE_+Blockly.Scrollbar.scrollbarThickness,a.toolboxPosition==Blockly.TOOLBOX_AT_LEFT&&(this.left_+=a.flyoutWidth,this.workspace_.toolbox_&&(this.left_+=a.absoluteLeft))):(this.left_=a.viewWidth+a.absoluteLeft-this.WIDTH_-this.MARGIN_SIDE_-Blockly.Scrollbar.scrollbarThickness,a.toolboxPosition==Blockly.TOOLBOX_AT_RIGHT&&(this.left_-=a.flyoutWidth)),this.top_=a.viewHeight+
-a.absoluteTop-this.HEIGHT_-this.bottom_,a.toolboxPosition==Blockly.TOOLBOX_AT_BOTTOM&&(this.top_-=a.flyoutHeight),this.svgGroup_.setAttribute("transform","translate("+this.left_+","+this.top_+")"))};
+a.absoluteTop-this.HEIGHT_-this.bottom_,a.toolboxPosition==Blockly.TOOLBOX_AT_BOTTOM&&(this.top_-=a.flyoutHeight),this.svgGroup_.setAttribute("transform","translate("+this.left_+","+this.top_+")"))};Blockly.utils={};Blockly.addClass_=function(a,b){var c=a.getAttribute("class")||"";-1==(" "+c+" ").indexOf(" "+b+" ")&&(c&&(c+=" "),a.setAttribute("class",c+b))};Blockly.removeClass_=function(a,b){var c=a.getAttribute("class");if(-1!=(" "+c+" ").indexOf(" "+b+" ")){for(var c=c.split(/\s+/),d=0;d<c.length;d++)c[d]&&c[d]!=b||(c.splice(d,1),d--);c.length?a.setAttribute("class",c.join(" ")):a.removeAttribute("class")}};
+Blockly.hasClass_=function(a,b){return-1!=(" "+a.getAttribute("class")+" ").indexOf(" "+b+" ")};
+Blockly.bindEventWithChecks_=function(a,b,c,d,e){var f=!1,g=function(a){var b=!e;a=Blockly.Touch.splitEventByTouches(a);for(var g=0,h;h=a[g];g++)if(!b||Blockly.Touch.shouldHandleEvent(h))Blockly.Touch.setClientFromTouch(h),c?d.call(c,h):d(h),f=!0};a.addEventListener(b,g,!1);var h=[[a,b,g]];if(b in Blockly.Touch.TOUCH_MAP)for(var k=function(a){g(a);f&&a.preventDefault()},m=0,p;p=Blockly.Touch.TOUCH_MAP[b][m];m++)a.addEventListener(p,k,!1),h.push([a,p,k]);return h};
+Blockly.bindEvent_=function(a,b,c,d){var e=function(a){c?d.call(c,a):d(a)};a.addEventListener(b,e,!1);var f=[[a,b,e]];if(b in Blockly.Touch.TOUCH_MAP)for(var g=function(a){if(1==a.changedTouches.length){var b=a.changedTouches[0];a.clientX=b.clientX;a.clientY=b.clientY}e(a);a.preventDefault()},h=0,k;k=Blockly.Touch.TOUCH_MAP[b][h];h++)a.addEventListener(k,g,!1),f.push([a,k,g]);return f};Blockly.unbindEvent_=function(a){for(;a.length;){var b=a.pop(),c=b[2];b[0].removeEventListener(b[1],c,!1)}return c};
+Blockly.noEvent=function(a){a.preventDefault();a.stopPropagation()};Blockly.isTargetInput_=function(a){return"textarea"==a.target.type||"text"==a.target.type||"number"==a.target.type||"email"==a.target.type||"password"==a.target.type||"search"==a.target.type||"tel"==a.target.type||"url"==a.target.type||a.target.isContentEditable};
+Blockly.getRelativeXY_=function(a){var b=new goog.math.Coordinate(0,0),c=a.getAttribute("x");c&&(b.x=parseInt(c,10));if(c=a.getAttribute("y"))b.y=parseInt(c,10);if(a=(a=a.getAttribute("transform"))&&a.match(Blockly.getRelativeXY_.XY_REGEXP_))b.x+=parseFloat(a[1]),a[3]&&(b.y+=parseFloat(a[3]));return b};Blockly.getRelativeXY_.XY_REGEXP_=/translate\(\s*([-+\d.e]+)([ ,]\s*([-+\d.e]+)\s*\))?/;
+Blockly.getSvgXY_=function(a,b){var c=0,d=0,e=1;if(goog.dom.contains(b.getCanvas(),a)||goog.dom.contains(b.getBubbleCanvas(),a))e=b.scale;do{var f=Blockly.getRelativeXY_(a);if(a==b.getCanvas()||a==b.getBubbleCanvas())e=1;c+=f.x*e;d+=f.y*e;a=a.parentNode}while(a&&a!=b.getParentSvg());return new goog.math.Coordinate(c,d)};
+Blockly.createSvgElement=function(a,b,c,d){a=document.createElementNS(Blockly.SVG_NS,a);for(var e in b)a.setAttribute(e,b[e]);document.body.runtimeStyle&&(a.runtimeStyle=a.currentStyle=a.style);c&&c.appendChild(a);return a};Blockly.isRightButton=function(a){return a.ctrlKey&&goog.userAgent.MAC?!0:2==a.button};Blockly.mouseToSvg=function(a,b,c){var d=b.createSVGPoint();d.x=a.clientX;d.y=a.clientY;c||(c=b.getScreenCTM().inverse());return d.matrixTransform(c)};
+Blockly.shortestStringLength=function(a){if(!a.length)return 0;for(var b=a[0].length,c=1;c<a.length;c++)b=Math.min(b,a[c].length);return b};Blockly.commonWordPrefix=function(a,b){if(!a.length)return 0;if(1==a.length)return a[0].length;for(var c=0,d=b||Blockly.shortestStringLength(a),e=0;e<d;e++){for(var f=a[0][e],g=1;g<a.length;g++)if(f!=a[g][e])return c;" "==f&&(c=e+1)}for(g=1;g<a.length;g++)if((f=a[g][e])&&" "!=f)return c;return d};
+Blockly.commonWordSuffix=function(a,b){if(!a.length)return 0;if(1==a.length)return a[0].length;for(var c=0,d=b||Blockly.shortestStringLength(a),e=0;e<d;e++){for(var f=a[0].substr(-e-1,1),g=1;g<a.length;g++)if(f!=a[g].substr(-e-1,1))return c;" "==f&&(c=e+1)}for(g=1;g<a.length;g++)if((f=a[g].charAt(a[g].length-e-1))&&" "!=f)return c;return d};Blockly.isNumber=function(a){return!!a.match(/^\s*-?\d+(\.\d+)?\s*$/)};
+Blockly.utils.tokenizeInterpolation=function(a){var b=[];a=a.split("");a.push("");for(var c=0,d=[],e=null,f=0;f<a.length;f++){var g=a[f];0==c?"%"==g?c=1:d.push(g):1==c?"%"==g?(d.push(g),c=0):"0"<=g&&"9">=g?(c=2,e=g,(g=d.join(""))&&b.push(g),d.length=0):(d.push("%",g),c=0):2==c&&("0"<=g&&"9">=g?e+=g:(b.push(parseInt(e,10)),f--,c=0))}(g=d.join(""))&&b.push(g);return b};
+Blockly.genUid=function(){for(var a=Blockly.genUid.soup_.length,b=[],c=0;20>c;c++)b[c]=Blockly.genUid.soup_.charAt(Math.random()*a);return b.join("")};Blockly.genUid.soup_="!#$%()*+,-./:;=?@[]^_`{|}~ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";Blockly.utils.wrap=function(a,b){for(var c=a.split("\n"),d=0;d<c.length;d++)c[d]=Blockly.utils.wrap_line_(c[d],b);return c.join("\n")};
+Blockly.utils.wrap_line_=function(a,b){if(a.length<=b)return a;for(var c=a.trim().split(/\s+/),d=0;d<c.length;d++)c[d].length>b&&(b=c[d].length);var e,d=-Infinity,f,g=1;do{e=d;f=a;for(var h=[],k=c.length/g,m=1,d=0;d<c.length-1;d++)m<(d+1.5)/k?(m++,h[d]=!0):h[d]=!1;h=Blockly.utils.wrapMutate_(c,h,b);d=Blockly.utils.wrapScore_(c,h,b);a=Blockly.utils.wrapToText_(c,h);g++}while(d>e);return f};
+Blockly.utils.wrapScore_=function(a,b,c){for(var d=[0],e=[],f=0;f<a.length;f++)d[d.length-1]+=a[f].length,!0===b[f]?(d.push(0),e.push(a[f].charAt(a[f].length-1))):!1===b[f]&&d[d.length-1]++;a=Math.max.apply(Math,d);for(f=b=0;f<d.length;f++)b-=2*Math.pow(Math.abs(c-d[f]),1.5),b-=Math.pow(a-d[f],1.5),-1!=".?!".indexOf(e[f])?b+=c/3:-1!=",;)]}".indexOf(e[f])&&(b+=c/4);1<d.length&&d[d.length-1]<=d[d.length-2]&&(b+=.5);return b};
+Blockly.utils.wrapMutate_=function(a,b,c){for(var d=Blockly.utils.wrapScore_(a,b,c),e,f=0;f<b.length-1;f++)if(b[f]!=b[f+1]){var g=[].concat(b);g[f]=!g[f];g[f+1]=!g[f+1];var h=Blockly.utils.wrapScore_(a,g,c);h>d&&(d=h,e=g)}return e?Blockly.utils.wrapMutate_(a,e,c):b};Blockly.utils.wrapToText_=function(a,b){for(var c=[],d=0;d<a.length;d++)c.push(a[d]),void 0!==b[d]&&c.push(b[d]?"\n":" ");return c.join("")};/*
+
+ Visual Blocks Editor
+
+ Copyright 2016 Massachusetts Institute of Technology
+ All rights reserved.
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
+*/
+Blockly.WsDragSurfaceSvg=function(a){this.container_=a};Blockly.WsDragSurfaceSvg.prototype.SVG_=null;Blockly.WsDragSurfaceSvg.prototype.dragGroup_=null;Blockly.WsDragSurfaceSvg.prototype.container_=null;Blockly.WsDragSurfaceSvg.prototype.scale_=1;Blockly.WsDragSurfaceSvg.prototype.dragShadowFilterId_="";Blockly.WsDragSurfaceSvg.SHADOW_STD_DEVIATION=6;
+Blockly.WsDragSurfaceSvg.prototype.createDom=function(){this.SVG_||(this.SVG_=Blockly.createSvgElement("svg",{xmlns:Blockly.SVG_NS,"xmlns:html":Blockly.HTML_NS,"xmlns:xlink":"http://www.w3.org/1999/xlink",version:"1.1","class":"blocklyWsDragSurface"},this.container_),Blockly.createSvgElement("defs",{},this.SVG_))};
+Blockly.WsDragSurfaceSvg.prototype.translateSurface=function(a,b){a*=this.scale_;b*=this.scale_;a=a.toFixed(2);b=b.toFixed(2);this.SVG_.setAttribute("style","transform: translate3d("+a+"px, "+b+"px, 0px); display: block;")};Blockly.WsDragSurfaceSvg.prototype.getSurfaceTranslation=function(){var a=Blockly.getRelativeXY_(this.SVG_);return new goog.math.Coordinate(a.x/this.scale_,a.y/this.scale_)};Blockly.WsDragSurfaceSvg.prototype.getChildGroup=function(){return this.SVG_.childNodes[0]};
+Blockly.WsDragSurfaceSvg.prototype.clearAndHide=function(a){a.appendChild(this.getChildGroup());this.SVG_.style.display="none";goog.asserts.assert(0==this.SVG_.childNodes.length,"Drag group was not cleared.")};Blockly.WsDragSurfaceSvg.prototype.setBlocksAndShow=function(a){goog.asserts.assert(0==this.SVG_.childNodes.length,"Already dragging a block.");this.SVG_.appendChild(a);this.SVG_.style.display="block"};
 // Copyright 2014 Google Inc.  Apache License 2.0
-Blockly.WorkspaceSvg=function(a){Blockly.WorkspaceSvg.superClass_.constructor.call(this,a);this.getMetrics=a.getMetrics||Blockly.WorkspaceSvg.getTopLevelWorkspaceMetrics_;this.setMetrics=a.setMetrics||Blockly.WorkspaceSvg.setTopLevelWorkspaceMetrics_;Blockly.ConnectionDB.init(this);this.SOUNDS_=Object.create(null)};goog.inherits(Blockly.WorkspaceSvg,Blockly.Workspace);Blockly.WorkspaceSvg.prototype.resizeHandlerWrapper_=null;Blockly.WorkspaceSvg.prototype.rendered=!0;
+Blockly.WorkspaceSvg=function(a,b){Blockly.WorkspaceSvg.superClass_.constructor.call(this,a);this.getMetrics=a.getMetrics||Blockly.WorkspaceSvg.getTopLevelWorkspaceMetrics_;this.setMetrics=a.setMetrics||Blockly.WorkspaceSvg.setTopLevelWorkspaceMetrics_;Blockly.ConnectionDB.init(this);b&&(this.wsDragSurface=b);this.SOUNDS_=Object.create(null)};goog.inherits(Blockly.WorkspaceSvg,Blockly.Workspace);Blockly.WorkspaceSvg.prototype.resizeHandlerWrapper_=null;Blockly.WorkspaceSvg.prototype.rendered=!0;
 Blockly.WorkspaceSvg.prototype.isFlyout=!1;Blockly.WorkspaceSvg.prototype.isMutator=!1;Blockly.WorkspaceSvg.prototype.dragMode_=Blockly.DRAG_NONE;Blockly.WorkspaceSvg.prototype.scrollX=0;Blockly.WorkspaceSvg.prototype.scrollY=0;Blockly.WorkspaceSvg.prototype.startScrollX=0;Blockly.WorkspaceSvg.prototype.startScrollY=0;Blockly.WorkspaceSvg.prototype.dragDeltaXY_=null;Blockly.WorkspaceSvg.prototype.scale=1;Blockly.WorkspaceSvg.prototype.trashcan=null;Blockly.WorkspaceSvg.prototype.scrollbar=null;
-Blockly.WorkspaceSvg.prototype.lastSound_=null;Blockly.WorkspaceSvg.prototype.lastRecordedPageScroll_=null;Blockly.WorkspaceSvg.prototype.inverseScreenCTM_=null;Blockly.WorkspaceSvg.prototype.getInverseScreenCTM=function(){return this.inverseScreenCTM_};Blockly.WorkspaceSvg.prototype.updateInverseScreenCTM=function(){var a=this.getParentSvg().getScreenCTM();a&&(this.inverseScreenCTM_=a.inverse())};Blockly.WorkspaceSvg.prototype.setResizeHandlerWrapper=function(a){this.resizeHandlerWrapper_=a};
+Blockly.WorkspaceSvg.prototype.lastSound_=null;Blockly.WorkspaceSvg.prototype.wsDragSurface=null;Blockly.WorkspaceSvg.prototype.lastRecordedPageScroll_=null;Blockly.WorkspaceSvg.prototype.inverseScreenCTM_=null;Blockly.WorkspaceSvg.prototype.getInverseScreenCTM=function(){return this.inverseScreenCTM_};Blockly.WorkspaceSvg.prototype.updateInverseScreenCTM=function(){var a=this.getParentSvg().getScreenCTM();a&&(this.inverseScreenCTM_=a.inverse())};
+Blockly.WorkspaceSvg.prototype.setResizeHandlerWrapper=function(a){this.resizeHandlerWrapper_=a};
 Blockly.WorkspaceSvg.prototype.createDom=function(a){this.svgGroup_=Blockly.createSvgElement("g",{"class":"blocklyWorkspace"},null);a&&(this.svgBackground_=Blockly.createSvgElement("rect",{height:"100%",width:"100%","class":a},this.svgGroup_),"blocklyMainBackground"==a&&(this.svgBackground_.style.fill="url(#"+this.options.gridPattern.id+")"));this.svgBlockCanvas_=Blockly.createSvgElement("g",{"class":"blocklyBlockCanvas"},this.svgGroup_,this);this.svgBubbleCanvas_=Blockly.createSvgElement("g",{"class":"blocklyBubbleCanvas"},
 this.svgGroup_,this);a=Blockly.Scrollbar.scrollbarThickness;this.options.hasTrashcan&&(a=this.addTrashcan_(a));this.options.zoomOptions&&this.options.zoomOptions.controls&&(a=this.addZoomControls_(a));if(!this.isFlyout){Blockly.bindEventWithChecks_(this.svgGroup_,"mousedown",this,this.onMouseDown_);var b=this;Blockly.bindEventWithChecks_(this.svgGroup_,"touchstart",null,function(a){Blockly.longStart_(a,b)});this.options.zoomOptions&&this.options.zoomOptions.wheel&&Blockly.bindEventWithChecks_(this.svgGroup_,
 "wheel",this,this.onMouseWheel_)}this.options.hasCategories?this.toolbox_=new Blockly.Toolbox(this):this.options.languageTree&&this.addFlyout_();this.updateGridPattern_();this.recordDeleteAreas();return this.svgGroup_};
@@ -1405,34 +1442,35 @@ Blockly.Toolbox.prototype.refreshSelection=function(){var a=this.tree_.getSelect
 Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);var a=this.getElement();goog.events.BrowserFeature.TOUCH_ENABLED&&Blockly.bindEventWithChecks_(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){var b=this.toolbox_;if(a!=this.selectedItem_&&a!=b.tree_){b.lastCategory_&&(b.lastCategory_.getRowElement().style.backgroundColor="");if(a){var c=a.hexColour||"#57e";a.getRowElement().style.backgroundColor=c;b.addColour_(a)}c=this.getSelectedItem();goog.ui.tree.TreeControl.prototype.setSelectedItem.call(this,a);a&&a.blocks&&a.blocks.length?(b.flyout_.show(a.blocks),b.lastCategory_!=a&&b.flyout_.scrollToStart()):b.flyout_.hide();c!=
-a&&c!=this&&(c=new Blockly.Events.Ui(null,"category",c&&c.getHtml(),a&&a.getHtml()),c.workspaceId=b.workspace_.id,Blockly.Events.fire(c));a&&(b.lastCategory_=a)}};Blockly.Toolbox.TreeNode=function(a,b,c,d){goog.ui.tree.TreeNode.call(this,b,c,d);a&&(this.horizontalLayout_=a.horizontalLayout_,b=function(){Blockly.svgResize(a.workspace_)},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.TreeNode.prototype.onKeyDown=function(a){if(this.horizontalLayout_){var b={};b[goog.events.KeyCodes.RIGHT]=goog.events.KeyCodes.DOWN;b[goog.events.KeyCodes.LEFT]=goog.events.KeyCodes.UP;b[goog.events.KeyCodes.UP]=goog.events.KeyCodes.LEFT;b[goog.events.KeyCodes.DOWN]=goog.events.KeyCodes.RIGHT;a.keyCode=b[a.keyCode]||a.keyCode}return Blockly.Toolbox.TreeNode.superClass_.onKeyDown.call(this,a)};Blockly.Toolbox.TreeSeparator=function(a){Blockly.Toolbox.TreeNode.call(this,null,"",a)};
-goog.inherits(Blockly.Toolbox.TreeSeparator,Blockly.Toolbox.TreeNode);Blockly.Css={};Blockly.Css.Cursor={OPEN:"handopen",CLOSED:"handclosed",DELETE:"handdelete"};Blockly.Css.currentCursor_="";Blockly.Css.styleSheet_=null;Blockly.Css.mediaPath_="";
+a&&c!=this&&(c=new Blockly.Events.Ui(null,"category",c&&c.getHtml(),a&&a.getHtml()),c.workspaceId=b.workspace_.id,Blockly.Events.fire(c));a&&(b.lastCategory_=a)}};Blockly.Toolbox.TreeNode=function(a,b,c,d){goog.ui.tree.TreeNode.call(this,b,c,d);a&&(b=function(){Blockly.svgResize(a.workspace_)},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.TreeNode.prototype.onKeyDown=function(a){if(this.tree.toolbox_.horizontalLayout_){var b={},c=goog.events.KeyCodes.DOWN,d=goog.events.KeyCodes.UP;b[goog.events.KeyCodes.RIGHT]=this.rightToLeft_?d:c;b[goog.events.KeyCodes.LEFT]=this.rightToLeft_?c:d;b[goog.events.KeyCodes.UP]=goog.events.KeyCodes.LEFT;b[goog.events.KeyCodes.DOWN]=goog.events.KeyCodes.RIGHT;a.keyCode=b[a.keyCode]||a.keyCode}return Blockly.Toolbox.TreeNode.superClass_.onKeyDown.call(this,a)};
+Blockly.Toolbox.TreeSeparator=function(a){Blockly.Toolbox.TreeNode.call(this,null,"",a)};goog.inherits(Blockly.Toolbox.TreeSeparator,Blockly.Toolbox.TreeNode);Blockly.Css={};Blockly.Css.Cursor={OPEN:"handopen",CLOSED:"handclosed",DELETE:"handdelete"};Blockly.Css.currentCursor_="";Blockly.Css.styleSheet_=null;Blockly.Css.mediaPath_="";
 Blockly.Css.inject=function(a,b){if(!Blockly.Css.styleSheet_){var c=".blocklyDraggable {}\n";a&&(c+=Blockly.Css.CONTENT.join("\n"),Blockly.FieldDate&&(c+=Blockly.FieldDate.CSS.join("\n")));Blockly.Css.mediaPath_=b.replace(/[\\\/]$/,"");var c=c.replace(/<<<PATH>>>/g,Blockly.Css.mediaPath_),d=document.createElement("style");document.head.appendChild(d);c=document.createTextNode(c);d.appendChild(c);Blockly.Css.styleSheet_=d.sheet;Blockly.Css.setCursor(Blockly.Css.Cursor.OPEN)}};
 Blockly.Css.setCursor=function(a){if(Blockly.Css.currentCursor_!=a){Blockly.Css.currentCursor_=a;var b="url("+Blockly.Css.mediaPath_+"/"+a+".cur), auto",c=".blocklyDraggable {\n  cursor: "+b+";\n}\n";Blockly.Css.styleSheet_.deleteRule(0);Blockly.Css.styleSheet_.insertRule(c,0);for(var c=document.getElementsByClassName("blocklyToolboxDiv"),d=0,e;e=c[d];d++)e.style.cursor=a==Blockly.Css.Cursor.DELETE?b:"";document.body.parentNode.style.cursor=a==Blockly.Css.Cursor.OPEN?"":b}};
 Blockly.Css.CONTENT=[".blocklySvg {","background-color: #fff;","outline: none;","overflow: hidden;","display: block;","}",".blocklyWidgetDiv {","display: none;","position: absolute;","z-index: 99999;","}",".injectionDiv {","height: 100%;","position: relative;","}",".blocklyNonSelectable {","user-select: none;","-moz-user-select: none;","-webkit-user-select: none;","-ms-user-select: none;","}",".blocklyTooltipDiv {","background-color: #ffffc7;","border: 1px solid #ddc;","box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);",
-"color: #000;","display: none;","font-family: sans-serif;","font-size: 9pt;","opacity: 0.9;","padding: 2px;","position: absolute;","z-index: 100000;","}",".blocklyResizeSE {","cursor: se-resize;","fill: #aaa;","}",".blocklyResizeSW {","cursor: sw-resize;","fill: #aaa;","}",".blocklyResizeLine {","stroke: #888;","stroke-width: 1;","}",".blocklyHighlightedConnectionPath {","fill: none;","stroke: #fc3;","stroke-width: 4px;","}",".blocklyPathLight {","fill: none;","stroke-linecap: round;","stroke-width: 1;",
-"}",".blocklySelected>.blocklyPath {","stroke: #fc3;","stroke-width: 3px;","}",".blocklySelected>.blocklyPathLight {","display: none;","}",".blocklyDragging>.blocklyPath,",".blocklyDragging>.blocklyPathLight {","fill-opacity: .8;","stroke-opacity: .8;","}",".blocklyDragging>.blocklyPathDark {","display: none;","}",".blocklyDisabled>.blocklyPath {","fill-opacity: .5;","stroke-opacity: .5;","}",".blocklyDisabled>.blocklyPathLight,",".blocklyDisabled>.blocklyPathDark {","display: none;","}",".blocklyText {",
-"cursor: default;","fill: #fff;","font-family: sans-serif;","font-size: 11pt;","}",".blocklyNonEditableText>text {","pointer-events: none;","}",".blocklyNonEditableText>rect,",".blocklyEditableText>rect {","fill: #fff;","fill-opacity: .6;","}",".blocklyNonEditableText>text,",".blocklyEditableText>text {","fill: #000;","}",".blocklyEditableText:hover>rect {","stroke: #fff;","stroke-width: 2;","}",".blocklyBubbleText {","fill: #000;","}",".blocklyFlyoutButton {","fill: #888;","cursor: default;","}",
-".blocklyFlyoutButtonShadow {","fill: #666;","}",".blocklyFlyoutButton:hover {","fill: #aaa;","}",".blocklySvg text {","user-select: none;","-moz-user-select: none;","-webkit-user-select: none;","cursor: inherit;","}",".blocklyHidden {","display: none;","}",".blocklyFieldDropdown:not(.blocklyHidden) {","display: block;","}",".blocklyIconGroup {","cursor: default;","}",".blocklyIconGroup:not(:hover),",".blocklyIconGroupReadonly {","opacity: .6;","}",".blocklyIconShape {","fill: #00f;","stroke: #fff;",
-"stroke-width: 1px;","}",".blocklyIconSymbol {","fill: #fff;","}",".blocklyMinimalBody {","margin: 0;","padding: 0;","}",".blocklyCommentTextarea {","background-color: #ffc;","border: 0;","margin: 0;","padding: 2px;","resize: none;","}",".blocklyHtmlInput {","border: none;","border-radius: 4px;","font-family: sans-serif;","height: 100%;","margin: 0;","outline: none;","padding: 0 1px;","width: 100%","}",".blocklyMainBackground {","stroke-width: 1;","stroke: #c6c6c6;","}",".blocklyMutatorBackground {",
-"fill: #fff;","stroke: #ddd;","stroke-width: 1;","}",".blocklyFlyoutBackground {","fill: #ddd;","fill-opacity: .8;","}",".blocklyScrollbarBackground {","opacity: 0;","}",".blocklyScrollbarHandle {","fill: #ccc;","}",".blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,",".blocklyScrollbarHandle:hover {","fill: #bbb;","}",".blocklyZoom>image {","opacity: .4;","}",".blocklyZoom>image:hover {","opacity: .6;","}",".blocklyZoom>image:active {","opacity: .8;","}",".blocklyFlyout .blocklyScrollbarHandle {",
-"fill: #bbb;","}",".blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,",".blocklyFlyout .blocklyScrollbarHandle:hover {","fill: #aaa;","}",".blocklyInvalidInput {","background: #faa;","}",".blocklyAngleCircle {","stroke: #444;","stroke-width: 1;","fill: #ddd;","fill-opacity: .8;","}",".blocklyAngleMarks {","stroke: #444;","stroke-width: 1;","}",".blocklyAngleGauge {","fill: #f88;","fill-opacity: .8;","}",".blocklyAngleLine {","stroke: #f00;","stroke-width: 2;","stroke-linecap: round;",
-"}",".blocklyContextMenu {","border-radius: 4px;","}",".blocklyDropdownMenu {","padding: 0 !important;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;","}",".blocklyToolboxDiv {","background-color: #ddd;","overflow-x: visible;","overflow-y: auto;","position: absolute;","}",".blocklyTreeRoot {","padding: 4px 0;","}",".blocklyTreeRoot:focus {",
-"outline: none;","}",".blocklyTreeRow {","height: 22px;","line-height: 22px;","margin-bottom: 3px;","padding-right: 8px;","white-space: nowrap;","}",".blocklyHorizontalTree {","float: left;","margin: 1px 5px 8px 0;","}",".blocklyHorizontalTreeRtl {","float: right;","margin: 1px 0 8px 5px;","}",'.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {',"margin-left: 8px;","}",".blocklyTreeRow:not(.blocklyTreeSelected):hover {","background-color: #e4e4e4;","}",".blocklyTreeSeparator {","border-bottom: solid #e5e5e5 1px;",
-"height: 0;","margin: 5px 0;","}",".blocklyTreeSeparatorHorizontal {","border-right: solid #e5e5e5 1px;","width: 0;","padding: 5px 0;","margin: 0 5px;","}",".blocklyTreeIcon {","background-image: url(<<<PATH>>>/sprites.png);","height: 16px;","vertical-align: middle;","width: 16px;","}",".blocklyTreeIconClosedLtr {","background-position: -32px -1px;","}",".blocklyTreeIconClosedRtl {","background-position: 0px -1px;","}",".blocklyTreeIconOpen {","background-position: -16px -1px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedLtr {",
-"background-position: -32px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedRtl {","background-position: 0px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconOpen {","background-position: -16px -17px;","}",".blocklyTreeIconNone,",".blocklyTreeSelected>.blocklyTreeIconNone {","background-position: -48px -1px;","}",".blocklyTreeLabel {","cursor: default;","font-family: sans-serif;","font-size: 16px;","padding: 0 3px;","vertical-align: middle;","}",".blocklyTreeSelected .blocklyTreeLabel {",
-"color: #fff;","}",".blocklyWidgetDiv .goog-palette {","outline: none;","cursor: default;","}",".blocklyWidgetDiv .goog-palette-table {","border: 1px solid #666;","border-collapse: collapse;","}",".blocklyWidgetDiv .goog-palette-cell {","height: 13px;","width: 15px;","margin: 0;","border: 0;","text-align: center;","vertical-align: middle;","border-right: 1px solid #666;","font-size: 1px;","}",".blocklyWidgetDiv .goog-palette-colorswatch {","position: relative;","height: 13px;","width: 15px;","border: 1px solid #666;",
-"}",".blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {","border: 1px solid #FFF;","}",".blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {","border: 1px solid #000;","color: #fff;","}",".blocklyWidgetDiv .goog-menu {","background: #fff;","border-color: #ccc #666 #666 #ccc;","border-style: solid;","border-width: 1px;","cursor: default;","font: normal 13px Arial, sans-serif;","margin: 0;","outline: none;","padding: 4px 0;","position: absolute;","overflow-y: auto;",
-"overflow-x: hidden;","max-height: 100%;","z-index: 20000;","}",".blocklyWidgetDiv .goog-menuitem {","color: #000;","font: normal 13px Arial, sans-serif;","list-style: none;","margin: 0;","padding: 4px 7em 4px 28px;","white-space: nowrap;","}",".blocklyWidgetDiv .goog-menuitem.goog-menuitem-rtl {","padding-left: 7em;","padding-right: 28px;","}",".blocklyWidgetDiv .goog-menu-nocheckbox .goog-menuitem,",".blocklyWidgetDiv .goog-menu-noicon .goog-menuitem {","padding-left: 12px;","}",".blocklyWidgetDiv .goog-menu-noaccel .goog-menuitem {",
-"padding-right: 20px;","}",".blocklyWidgetDiv .goog-menuitem-content {","color: #000;","font: normal 13px Arial, sans-serif;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-accel,",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content {","color: #ccc !important;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-icon {","opacity: 0.3;","-moz-opacity: 0.3;","filter: alpha(opacity=30);","}",".blocklyWidgetDiv .goog-menuitem-highlight,",".blocklyWidgetDiv .goog-menuitem-hover {",
-"background-color: #d6e9f8;","border-color: #d6e9f8;","border-style: dotted;","border-width: 1px 0;","padding-bottom: 3px;","padding-top: 3px;","}",".blocklyWidgetDiv .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-icon {","background-repeat: no-repeat;","height: 16px;","left: 6px;","position: absolute;","right: auto;","vertical-align: middle;","width: 16px;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-icon {",
-"left: auto;","right: 6px;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;","}",".blocklyWidgetDiv .goog-menuitem-accel {","color: #999;","direction: ltr;","left: auto;","padding: 0 6px;","position: absolute;","right: 0;","text-align: right;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-accel {","left: 0;","right: auto;",
-"text-align: left;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-hint {","text-decoration: underline;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-separator {","color: #999;","font-size: 12px;","padding-left: 4px;","}",".blocklyWidgetDiv .goog-menuseparator {","border-top: 1px solid #ccc;","margin: 4px 0;","padding: 0;","}",""];Blockly.WidgetDiv={};Blockly.WidgetDiv.DIV=null;Blockly.WidgetDiv.owner_=null;Blockly.WidgetDiv.dispose_=null;Blockly.WidgetDiv.createDom=function(){Blockly.WidgetDiv.DIV||(Blockly.WidgetDiv.DIV=goog.dom.createDom("DIV","blocklyWidgetDiv"),document.body.appendChild(Blockly.WidgetDiv.DIV))};
+"color: #000;","display: none;","font-family: sans-serif;","font-size: 9pt;","opacity: 0.9;","padding: 2px;","position: absolute;","z-index: 100000;","}",".blocklyDragSurface {","display: none;","position: absolute;","top: 0;","left: 0;","right: 0;","bottom: 0;","overflow: visible !important;","z-index: 5000;","-webkit-backface-visibility: hidden;","backface-visibility: hidden;","-webkit-perspective: 1000;","perspective: 1000;","}",".blocklyResizeSE {","cursor: se-resize;","fill: #aaa;","}",".blocklyResizeSW {",
+"cursor: sw-resize;","fill: #aaa;","}",".blocklyResizeLine {","stroke: #888;","stroke-width: 1;","}",".blocklyHighlightedConnectionPath {","fill: none;","stroke: #fc3;","stroke-width: 4px;","}",".blocklyPathLight {","fill: none;","stroke-linecap: round;","stroke-width: 1;","}",".blocklySelected>.blocklyPath {","stroke: #fc3;","stroke-width: 3px;","}",".blocklySelected>.blocklyPathLight {","display: none;","}",".blocklyDragging>.blocklyPath,",".blocklyDragging>.blocklyPathLight {","fill-opacity: .8;",
+"stroke-opacity: .8;","}",".blocklyDragging>.blocklyPathDark {","display: none;","}",".blocklyDisabled>.blocklyPath {","fill-opacity: .5;","stroke-opacity: .5;","}",".blocklyDisabled>.blocklyPathLight,",".blocklyDisabled>.blocklyPathDark {","display: none;","}",".blocklyText {","cursor: default;","fill: #fff;","font-family: sans-serif;","font-size: 11pt;","}",".blocklyNonEditableText>text {","pointer-events: none;","}",".blocklyNonEditableText>rect,",".blocklyEditableText>rect {","fill: #fff;","fill-opacity: .6;",
+"}",".blocklyNonEditableText>text,",".blocklyEditableText>text {","fill: #000;","}",".blocklyEditableText:hover>rect {","stroke: #fff;","stroke-width: 2;","}",".blocklyBubbleText {","fill: #000;","}",".blocklyFlyoutButton {","fill: #888;","cursor: default;","}",".blocklyFlyoutButtonShadow {","fill: #666;","}",".blocklyFlyoutButton:hover {","fill: #aaa;","}",".blocklySvg text {","user-select: none;","-moz-user-select: none;","-webkit-user-select: none;","cursor: inherit;","}",".blocklyHidden {","display: none;",
+"}",".blocklyFieldDropdown:not(.blocklyHidden) {","display: block;","}",".blocklyIconGroup {","cursor: default;","}",".blocklyIconGroup:not(:hover),",".blocklyIconGroupReadonly {","opacity: .6;","}",".blocklyIconShape {","fill: #00f;","stroke: #fff;","stroke-width: 1px;","}",".blocklyIconSymbol {","fill: #fff;","}",".blocklyMinimalBody {","margin: 0;","padding: 0;","}",".blocklyCommentTextarea {","background-color: #ffc;","border: 0;","margin: 0;","padding: 2px;","resize: none;","}",".blocklyHtmlInput {",
+"border: none;","border-radius: 4px;","font-family: sans-serif;","height: 100%;","margin: 0;","outline: none;","padding: 0 1px;","width: 100%","}",".blocklyMainBackground {","stroke-width: 1;","stroke: #c6c6c6;","}",".blocklyMutatorBackground {","fill: #fff;","stroke: #ddd;","stroke-width: 1;","}",".blocklyFlyoutBackground {","fill: #ddd;","fill-opacity: .8;","}",".blocklyScrollbarBackground {","opacity: 0;","}",".blocklyScrollbarHandle {","fill: #ccc;","}",".blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,",
+".blocklyScrollbarHandle:hover {","fill: #bbb;","}",".blocklyZoom>image {","opacity: .4;","}",".blocklyZoom>image:hover {","opacity: .6;","}",".blocklyZoom>image:active {","opacity: .8;","}",".blocklyFlyout .blocklyScrollbarHandle {","fill: #bbb;","}",".blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,",".blocklyFlyout .blocklyScrollbarHandle:hover {","fill: #aaa;","}",".blocklyInvalidInput {","background: #faa;","}",".blocklyAngleCircle {","stroke: #444;","stroke-width: 1;",
+"fill: #ddd;","fill-opacity: .8;","}",".blocklyAngleMarks {","stroke: #444;","stroke-width: 1;","}",".blocklyAngleGauge {","fill: #f88;","fill-opacity: .8;","}",".blocklyAngleLine {","stroke: #f00;","stroke-width: 2;","stroke-linecap: round;","}",".blocklyContextMenu {","border-radius: 4px;","}",".blocklyDropdownMenu {","padding: 0 !important;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;",
+"}",".blocklyToolboxDiv {","background-color: #ddd;","overflow-x: visible;","overflow-y: auto;","position: absolute;","}",".blocklyTreeRoot {","padding: 4px 0;","}",".blocklyTreeRoot:focus {","outline: none;","}",".blocklyTreeRow {","height: 22px;","line-height: 22px;","margin-bottom: 3px;","padding-right: 8px;","white-space: nowrap;","}",".blocklyHorizontalTree {","float: left;","margin: 1px 5px 8px 0;","}",".blocklyHorizontalTreeRtl {","float: right;","margin: 1px 0 8px 5px;","}",'.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {',
+"margin-left: 8px;","}",".blocklyTreeRow:not(.blocklyTreeSelected):hover {","background-color: #e4e4e4;","}",".blocklyTreeSeparator {","border-bottom: solid #e5e5e5 1px;","height: 0;","margin: 5px 0;","}",".blocklyTreeSeparatorHorizontal {","border-right: solid #e5e5e5 1px;","width: 0;","padding: 5px 0;","margin: 0 5px;","}",".blocklyTreeIcon {","background-image: url(<<<PATH>>>/sprites.png);","height: 16px;","vertical-align: middle;","width: 16px;","}",".blocklyTreeIconClosedLtr {","background-position: -32px -1px;",
+"}",".blocklyTreeIconClosedRtl {","background-position: 0px -1px;","}",".blocklyTreeIconOpen {","background-position: -16px -1px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedLtr {","background-position: -32px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedRtl {","background-position: 0px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconOpen {","background-position: -16px -17px;","}",".blocklyTreeIconNone,",".blocklyTreeSelected>.blocklyTreeIconNone {","background-position: -48px -1px;",
+"}",".blocklyTreeLabel {","cursor: default;","font-family: sans-serif;","font-size: 16px;","padding: 0 3px;","vertical-align: middle;","}",".blocklyTreeSelected .blocklyTreeLabel {","color: #fff;","}",".blocklyWidgetDiv .goog-palette {","outline: none;","cursor: default;","}",".blocklyWidgetDiv .goog-palette-table {","border: 1px solid #666;","border-collapse: collapse;","}",".blocklyWidgetDiv .goog-palette-cell {","height: 13px;","width: 15px;","margin: 0;","border: 0;","text-align: center;","vertical-align: middle;",
+"border-right: 1px solid #666;","font-size: 1px;","}",".blocklyWidgetDiv .goog-palette-colorswatch {","position: relative;","height: 13px;","width: 15px;","border: 1px solid #666;","}",".blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {","border: 1px solid #FFF;","}",".blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {","border: 1px solid #000;","color: #fff;","}",".blocklyWidgetDiv .goog-menu {","background: #fff;","border-color: #ccc #666 #666 #ccc;","border-style: solid;",
+"border-width: 1px;","cursor: default;","font: normal 13px Arial, sans-serif;","margin: 0;","outline: none;","padding: 4px 0;","position: absolute;","overflow-y: auto;","overflow-x: hidden;","max-height: 100%;","z-index: 20000;","}",".blocklyWidgetDiv .goog-menuitem {","color: #000;","font: normal 13px Arial, sans-serif;","list-style: none;","margin: 0;","padding: 4px 7em 4px 28px;","white-space: nowrap;","}",".blocklyWidgetDiv .goog-menuitem.goog-menuitem-rtl {","padding-left: 7em;","padding-right: 28px;",
+"}",".blocklyWidgetDiv .goog-menu-nocheckbox .goog-menuitem,",".blocklyWidgetDiv .goog-menu-noicon .goog-menuitem {","padding-left: 12px;","}",".blocklyWidgetDiv .goog-menu-noaccel .goog-menuitem {","padding-right: 20px;","}",".blocklyWidgetDiv .goog-menuitem-content {","color: #000;","font: normal 13px Arial, sans-serif;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-accel,",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content {","color: #ccc !important;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-icon {",
+"opacity: 0.3;","-moz-opacity: 0.3;","filter: alpha(opacity=30);","}",".blocklyWidgetDiv .goog-menuitem-highlight,",".blocklyWidgetDiv .goog-menuitem-hover {","background-color: #d6e9f8;","border-color: #d6e9f8;","border-style: dotted;","border-width: 1px 0;","padding-bottom: 3px;","padding-top: 3px;","}",".blocklyWidgetDiv .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-icon {","background-repeat: no-repeat;","height: 16px;","left: 6px;","position: absolute;","right: auto;","vertical-align: middle;",
+"width: 16px;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-icon {","left: auto;","right: 6px;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;","}",".blocklyWidgetDiv .goog-menuitem-accel {","color: #999;","direction: ltr;","left: auto;","padding: 0 6px;",
+"position: absolute;","right: 0;","text-align: right;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-accel {","left: 0;","right: auto;","text-align: left;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-hint {","text-decoration: underline;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-separator {","color: #999;","font-size: 12px;","padding-left: 4px;","}",".blocklyWidgetDiv .goog-menuseparator {","border-top: 1px solid #ccc;","margin: 4px 0;","padding: 0;","}",""];Blockly.WidgetDiv={};Blockly.WidgetDiv.DIV=null;Blockly.WidgetDiv.owner_=null;Blockly.WidgetDiv.dispose_=null;Blockly.WidgetDiv.createDom=function(){Blockly.WidgetDiv.DIV||(Blockly.WidgetDiv.DIV=goog.dom.createDom("DIV","blocklyWidgetDiv"),document.body.appendChild(Blockly.WidgetDiv.DIV))};
 Blockly.WidgetDiv.show=function(a,b,c){Blockly.WidgetDiv.hide();Blockly.WidgetDiv.owner_=a;Blockly.WidgetDiv.dispose_=c;a=goog.style.getViewportPageOffset(document);Blockly.WidgetDiv.DIV.style.top=a.y+"px";Blockly.WidgetDiv.DIV.style.direction=b?"rtl":"ltr";Blockly.WidgetDiv.DIV.style.display="block"};
 Blockly.WidgetDiv.hide=function(){Blockly.WidgetDiv.owner_&&(Blockly.WidgetDiv.owner_=null,Blockly.WidgetDiv.DIV.style.display="none",Blockly.WidgetDiv.DIV.style.left="",Blockly.WidgetDiv.DIV.style.top="",Blockly.WidgetDiv.dispose_&&Blockly.WidgetDiv.dispose_(),Blockly.WidgetDiv.dispose_=null,goog.dom.removeChildren(Blockly.WidgetDiv.DIV))};Blockly.WidgetDiv.isVisible=function(){return!!Blockly.WidgetDiv.owner_};Blockly.WidgetDiv.hideIfOwner=function(a){Blockly.WidgetDiv.owner_==a&&Blockly.WidgetDiv.hide()};
-Blockly.WidgetDiv.position=function(a,b,c,d,e){b<d.y&&(b=d.y);e?a>c.width+d.x&&(a=c.width+d.x):a<d.x&&(a=d.x);Blockly.WidgetDiv.DIV.style.left=a+"px";Blockly.WidgetDiv.DIV.style.top=b+"px";Blockly.WidgetDiv.DIV.style.height=c.height+"px"};Blockly.inject=function(a,b){goog.isString(a)&&(a=document.getElementById(a)||document.querySelector(a));if(!goog.dom.contains(document,a))throw"Error: container is not in current document.";var c=new Blockly.Options(b||{}),d=goog.dom.createDom("div","injectionDiv");a.appendChild(d);d=Blockly.createDom_(d,c);c=Blockly.createMainWorkspace_(d,c);Blockly.init_(c);c.markFocused();Blockly.bindEventWithChecks_(d,"focus",c,c.markFocused);Blockly.svgResize(c);return c};
+Blockly.WidgetDiv.position=function(a,b,c,d,e){b<d.y&&(b=d.y);e?a>c.width+d.x&&(a=c.width+d.x):a<d.x&&(a=d.x);Blockly.WidgetDiv.DIV.style.left=a+"px";Blockly.WidgetDiv.DIV.style.top=b+"px";Blockly.WidgetDiv.DIV.style.height=c.height+"px"};Blockly.inject=function(a,b){goog.isString(a)&&(a=document.getElementById(a)||document.querySelector(a));if(!goog.dom.contains(document,a))throw"Error: container is not in current document.";var c=new Blockly.Options(b||{}),d=goog.dom.createDom("div","injectionDiv");a.appendChild(d);var e=Blockly.createDom_(d,c),d=new Blockly.WsDragSurfaceSvg(d);d.createDom();c=Blockly.createMainWorkspace_(e,c,d);Blockly.init_(c);c.markFocused();Blockly.bindEventWithChecks_(e,"focus",c,c.markFocused);Blockly.svgResize(c);
+return c};
 Blockly.createDom_=function(a,b){a.setAttribute("dir","LTR");goog.ui.Component.setDefaultRightToLeft(b.RTL);Blockly.Css.inject(b.hasCss,b.pathToMedia);var c=Blockly.createSvgElement("svg",{xmlns:"http://www.w3.org/2000/svg","xmlns:html":"http://www.w3.org/1999/xhtml","xmlns:xlink":"http://www.w3.org/1999/xlink",version:"1.1","class":"blocklySvg"},a),d=Blockly.createSvgElement("defs",{},c),e=String(Math.random()).substring(2),f=Blockly.createSvgElement("filter",{id:"blocklyEmbossFilter"+e},d);Blockly.createSvgElement("feGaussianBlur",
 {"in":"SourceAlpha",stdDeviation:1,result:"blur"},f);var g=Blockly.createSvgElement("feSpecularLighting",{"in":"blur",surfaceScale:1,specularConstant:.5,specularExponent:10,"lighting-color":"white",result:"specOut"},f);Blockly.createSvgElement("fePointLight",{x:-5E3,y:-1E4,z:2E4},g);Blockly.createSvgElement("feComposite",{"in":"specOut",in2:"SourceAlpha",operator:"in",result:"specOut"},f);Blockly.createSvgElement("feComposite",{"in":"SourceGraphic",in2:"specOut",operator:"arithmetic",k1:0,k2:1,k3:1,
 k4:0},f);b.embossFilterId=f.id;f=Blockly.createSvgElement("pattern",{id:"blocklyDisabledPattern"+e,patternUnits:"userSpaceOnUse",width:10,height:10},d);Blockly.createSvgElement("rect",{width:10,height:10,fill:"#aaa"},f);Blockly.createSvgElement("path",{d:"M 0 0 L 10 10 M 10 0 L 0 10",stroke:"#cc0"},f);b.disabledPatternId=f.id;d=Blockly.createSvgElement("pattern",{id:"blocklyGridPattern"+e,patternUnits:"userSpaceOnUse"},d);0<b.gridOptions.length&&0<b.gridOptions.spacing&&(Blockly.createSvgElement("line",
@@ -1444,21 +1482,7 @@ b.toolboxPosition==Blockly.TOOLBOX_AT_RIGHT&&(a.scrollX*=-1),a.translate(a.scrol
 Blockly.inject.bindDocumentEvents_=function(){Blockly.documentEventsBound_||(Blockly.bindEventWithChecks_(document,"keydown",null,Blockly.onKeyDown_),Blockly.bindEventWithChecks_(document,"touchend",null,Blockly.longStop_),Blockly.bindEventWithChecks_(document,"touchcancel",null,Blockly.longStop_),document.addEventListener("mouseup",Blockly.onMouseUp_,!1),goog.userAgent.IPAD&&Blockly.bindEventWithChecks_(window,"orientationchange",document,function(){Blockly.svgResize(Blockly.getMainWorkspace())}));
 Blockly.documentEventsBound_=!0};
 Blockly.inject.loadSounds_=function(a,b){b.loadAudio_([a+"click.mp3",a+"click.wav",a+"click.ogg"],"click");b.loadAudio_([a+"disconnect.wav",a+"disconnect.mp3",a+"disconnect.ogg"],"disconnect");b.loadAudio_([a+"delete.mp3",a+"delete.ogg",a+"delete.wav"],"delete");var c=[],d=function(){for(;c.length;)Blockly.unbindEvent_(c.pop());b.preloadAudio_()};c.push(Blockly.bindEventWithChecks_(document,"mousemove",null,d,!0));c.push(Blockly.bindEventWithChecks_(document,"touchstart",null,d,!0))};
-Blockly.updateToolbox=function(a){console.warn("Deprecated call to Blockly.updateToolbox, use workspace.updateToolbox instead.");Blockly.getMainWorkspace().updateToolbox(a)};Blockly.utils={};Blockly.addClass_=function(a,b){var c=a.getAttribute("class")||"";-1==(" "+c+" ").indexOf(" "+b+" ")&&(c&&(c+=" "),a.setAttribute("class",c+b))};Blockly.removeClass_=function(a,b){var c=a.getAttribute("class");if(-1!=(" "+c+" ").indexOf(" "+b+" ")){for(var c=c.split(/\s+/),d=0;d<c.length;d++)c[d]&&c[d]!=b||(c.splice(d,1),d--);c.length?a.setAttribute("class",c.join(" ")):a.removeAttribute("class")}};
-Blockly.hasClass_=function(a,b){return-1!=(" "+a.getAttribute("class")+" ").indexOf(" "+b+" ")};
-Blockly.bindEventWithChecks_=function(a,b,c,d,e){var f=!1,g=function(a){var b=!e;a=Blockly.Touch.splitEventByTouches(a);for(var g=0,h;h=a[g];g++)if(!b||Blockly.Touch.shouldHandleEvent(h))Blockly.Touch.setClientFromTouch(h),c?d.call(c,h):d(h),f=!0};a.addEventListener(b,g,!1);var h=[[a,b,g]];if(b in Blockly.Touch.TOUCH_MAP)for(var k=function(a){g(a);f&&a.preventDefault()},m=0,p;p=Blockly.Touch.TOUCH_MAP[b][m];m++)a.addEventListener(p,k,!1),h.push([a,p,k]);return h};
-Blockly.bindEvent_=function(a,b,c,d){var e=function(a){c?d.call(c,a):d(a)};a.addEventListener(b,e,!1);var f=[[a,b,e]];if(b in Blockly.Touch.TOUCH_MAP)for(var g=function(a){if(1==a.changedTouches.length){var b=a.changedTouches[0];a.clientX=b.clientX;a.clientY=b.clientY}e(a);a.preventDefault()},h=0,k;k=Blockly.Touch.TOUCH_MAP[b][h];h++)a.addEventListener(k,g,!1),f.push([a,k,g]);return f};Blockly.unbindEvent_=function(a){for(;a.length;){var b=a.pop(),c=b[2];b[0].removeEventListener(b[1],c,!1)}return c};
-Blockly.noEvent=function(a){a.preventDefault();a.stopPropagation()};Blockly.isTargetInput_=function(a){return"textarea"==a.target.type||"text"==a.target.type||"number"==a.target.type||"email"==a.target.type||"password"==a.target.type||"search"==a.target.type||"tel"==a.target.type||"url"==a.target.type||a.target.isContentEditable};
-Blockly.getRelativeXY_=function(a){var b=new goog.math.Coordinate(0,0),c=a.getAttribute("x");c&&(b.x=parseInt(c,10));if(c=a.getAttribute("y"))b.y=parseInt(c,10);if(a=(a=a.getAttribute("transform"))&&a.match(Blockly.getRelativeXY_.XY_REGEXP_))b.x+=parseFloat(a[1]),a[3]&&(b.y+=parseFloat(a[3]));return b};Blockly.getRelativeXY_.XY_REGEXP_=/translate\(\s*([-+\d.e]+)([ ,]\s*([-+\d.e]+)\s*\))?/;
-Blockly.getSvgXY_=function(a,b){var c=0,d=0,e=1;if(goog.dom.contains(b.getCanvas(),a)||goog.dom.contains(b.getBubbleCanvas(),a))e=b.scale;do{var f=Blockly.getRelativeXY_(a);if(a==b.getCanvas()||a==b.getBubbleCanvas())e=1;c+=f.x*e;d+=f.y*e;a=a.parentNode}while(a&&a!=b.getParentSvg());return new goog.math.Coordinate(c,d)};
-Blockly.createSvgElement=function(a,b,c,d){a=document.createElementNS(Blockly.SVG_NS,a);for(var e in b)a.setAttribute(e,b[e]);document.body.runtimeStyle&&(a.runtimeStyle=a.currentStyle=a.style);c&&c.appendChild(a);return a};Blockly.isRightButton=function(a){return a.ctrlKey&&goog.userAgent.MAC?!0:2==a.button};Blockly.mouseToSvg=function(a,b,c){var d=b.createSVGPoint();d.x=a.clientX;d.y=a.clientY;c||(c=b.getScreenCTM().inverse());return d.matrixTransform(c)};
-Blockly.shortestStringLength=function(a){if(!a.length)return 0;for(var b=a[0].length,c=1;c<a.length;c++)b=Math.min(b,a[c].length);return b};Blockly.commonWordPrefix=function(a,b){if(!a.length)return 0;if(1==a.length)return a[0].length;for(var c=0,d=b||Blockly.shortestStringLength(a),e=0;e<d;e++){for(var f=a[0][e],g=1;g<a.length;g++)if(f!=a[g][e])return c;" "==f&&(c=e+1)}for(g=1;g<a.length;g++)if((f=a[g][e])&&" "!=f)return c;return d};
-Blockly.commonWordSuffix=function(a,b){if(!a.length)return 0;if(1==a.length)return a[0].length;for(var c=0,d=b||Blockly.shortestStringLength(a),e=0;e<d;e++){for(var f=a[0].substr(-e-1,1),g=1;g<a.length;g++)if(f!=a[g].substr(-e-1,1))return c;" "==f&&(c=e+1)}for(g=1;g<a.length;g++)if((f=a[g].charAt(a[g].length-e-1))&&" "!=f)return c;return d};Blockly.isNumber=function(a){return!!a.match(/^\s*-?\d+(\.\d+)?\s*$/)};
-Blockly.utils.tokenizeInterpolation=function(a){var b=[];a=a.split("");a.push("");for(var c=0,d=[],e=null,f=0;f<a.length;f++){var g=a[f];0==c?"%"==g?c=1:d.push(g):1==c?"%"==g?(d.push(g),c=0):"0"<=g&&"9">=g?(c=2,e=g,(g=d.join(""))&&b.push(g),d.length=0):(d.push("%",g),c=0):2==c&&("0"<=g&&"9">=g?e+=g:(b.push(parseInt(e,10)),f--,c=0))}(g=d.join(""))&&b.push(g);return b};
-Blockly.genUid=function(){for(var a=Blockly.genUid.soup_.length,b=[],c=0;20>c;c++)b[c]=Blockly.genUid.soup_.charAt(Math.random()*a);return b.join("")};Blockly.genUid.soup_="!#$%()*+,-./:;=?@[]^_`{|}~ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";Blockly.utils.wrap=function(a,b){for(var c=a.split("\n"),d=0;d<c.length;d++)c[d]=Blockly.utils.wrap_line_(c[d],b);return c.join("\n")};
-Blockly.utils.wrap_line_=function(a,b){if(a.length<=b)return a;for(var c=a.trim().split(/\s+/),d=0;d<c.length;d++)c[d].length>b&&(b=c[d].length);var e,d=-Infinity,f,g=1;do{e=d;f=a;for(var h=[],k=c.length/g,m=1,d=0;d<c.length-1;d++)m<(d+1.5)/k?(m++,h[d]=!0):h[d]=!1;h=Blockly.utils.wrapMutate_(c,h,b);d=Blockly.utils.wrapScore_(c,h,b);a=Blockly.utils.wrapToText_(c,h);g++}while(d>e);return f};
-Blockly.utils.wrapScore_=function(a,b,c){for(var d=[0],e=[],f=0;f<a.length;f++)d[d.length-1]+=a[f].length,!0===b[f]?(d.push(0),e.push(a[f].charAt(a[f].length-1))):!1===b[f]&&d[d.length-1]++;a=Math.max.apply(Math,d);for(f=b=0;f<d.length;f++)b-=2*Math.pow(Math.abs(c-d[f]),1.5),b-=Math.pow(a-d[f],1.5),-1!=".?!".indexOf(e[f])?b+=c/3:-1!=",;)]}".indexOf(e[f])&&(b+=c/4);1<d.length&&d[d.length-1]<=d[d.length-2]&&(b+=.5);return b};
-Blockly.utils.wrapMutate_=function(a,b,c){for(var d=Blockly.utils.wrapScore_(a,b,c),e,f=0;f<b.length-1;f++)if(b[f]!=b[f+1]){var g=[].concat(b);g[f]=!g[f];g[f+1]=!g[f+1];var h=Blockly.utils.wrapScore_(a,g,c);h>d&&(d=h,e=g)}return e?Blockly.utils.wrapMutate_(a,e,c):b};Blockly.utils.wrapToText_=function(a,b){for(var c=[],d=0;d<a.length;d++)c.push(a[d]),void 0!==b[d]&&c.push(b[d]?"\n":" ");return c.join("")};var CLOSURE_DEFINES={"goog.DEBUG":!1};Blockly.mainWorkspace=null;Blockly.selected=null;Blockly.highlightedConnection_=null;Blockly.localConnection_=null;Blockly.draggingConnections_=[];Blockly.clipboardXml_=null;Blockly.clipboardSource_=null;Blockly.dragMode_=Blockly.DRAG_NONE;Blockly.hueToRgb=function(a){return goog.color.hsvToHex(a,Blockly.HSV_SATURATION,255*Blockly.HSV_VALUE)};Blockly.svgSize=function(a){return{width:a.cachedWidth_,height:a.cachedHeight_}};Blockly.resizeSvgContents=function(a){a.resizeContents()};
+Blockly.updateToolbox=function(a){console.warn("Deprecated call to Blockly.updateToolbox, use workspace.updateToolbox instead.");Blockly.getMainWorkspace().updateToolbox(a)};var CLOSURE_DEFINES={"goog.DEBUG":!1};Blockly.mainWorkspace=null;Blockly.selected=null;Blockly.highlightedConnection_=null;Blockly.localConnection_=null;Blockly.draggingConnections_=[];Blockly.clipboardXml_=null;Blockly.clipboardSource_=null;Blockly.dragMode_=Blockly.DRAG_NONE;Blockly.hueToRgb=function(a){return goog.color.hsvToHex(a,Blockly.HSV_SATURATION,255*Blockly.HSV_VALUE)};Blockly.svgSize=function(a){return{width:a.cachedWidth_,height:a.cachedHeight_}};Blockly.resizeSvgContents=function(a){a.resizeContents()};
 Blockly.svgResize=function(a){for(;a.options.parentWorkspace;)a=a.options.parentWorkspace;var b=a.getParentSvg(),c=b.parentNode;if(c){var d=c.offsetWidth,c=c.offsetHeight;b.cachedWidth_!=d&&(b.setAttribute("width",d+"px"),b.cachedWidth_=d);b.cachedHeight_!=c&&(b.setAttribute("height",c+"px"),b.cachedHeight_=c);a.resize()}};
 Blockly.onKeyDown_=function(a){if(!Blockly.mainWorkspace.options.readOnly&&!Blockly.isTargetInput_(a)){var b=!1;if(27==a.keyCode)Blockly.hideChaff();else if(8==a.keyCode||46==a.keyCode)a.preventDefault(),Blockly.selected&&Blockly.selected.isDeletable()&&(b=!0);else if(a.altKey||a.ctrlKey||a.metaKey)Blockly.selected&&Blockly.selected.isDeletable()&&Blockly.selected.isMovable()&&(67==a.keyCode?(Blockly.hideChaff(),Blockly.copy_(Blockly.selected)):88==a.keyCode&&(Blockly.copy_(Blockly.selected),b=!0)),
 86==a.keyCode?Blockly.clipboardXml_&&(Blockly.Events.setGroup(!0),Blockly.clipboardSource_.paste(Blockly.clipboardXml_),Blockly.Events.setGroup(!1)):90==a.keyCode&&(Blockly.hideChaff(),Blockly.mainWorkspace.undo(a.shiftKey));b&&(Blockly.Events.setGroup(!0),Blockly.hideChaff(),Blockly.selected.dispose(Blockly.dragMode_!=Blockly.DRAG_FREE,!0),Blockly.highlightedConnection_&&(Blockly.highlightedConnection_.unhighlight(),Blockly.highlightedConnection_=null),Blockly.Events.setGroup(!1))}};
@@ -66,7 +66,7 @@ goog.addDependency("../../../" + dir + "/core/flyout.js", ['Blockly.Flyout'], ['
 goog.addDependency("../../../" + dir + "/core/flyout_button.js", ['Blockly.FlyoutButton'], ['goog.dom', 'goog.math.Coordinate']);
 goog.addDependency("../../../" + dir + "/core/generator.js", ['Blockly.Generator'], ['Blockly.Block', 'goog.asserts']);
 goog.addDependency("../../../" + dir + "/core/icon.js", ['Blockly.Icon'], ['goog.dom', 'goog.math.Coordinate']);
-goog.addDependency("../../../" + dir + "/core/inject.js", ['Blockly.inject'], ['Blockly.Css', 'Blockly.Options', 'Blockly.WorkspaceSvg', 'goog.dom', 'goog.ui.Component', 'goog.userAgent']);
+goog.addDependency("../../../" + dir + "/core/inject.js", ['Blockly.inject'], ['Blockly.Css', 'Blockly.Options', 'Blockly.WorkspaceSvg', 'goog.dom', 'goog.ui.Component', 'goog.userAgent', 'Blockly.WsDragSurfaceSvg']);
 goog.addDependency("../../../" + dir + "/core/input.js", ['Blockly.Input'], ['Blockly.Connection', 'Blockly.FieldLabel', 'goog.asserts']);
 goog.addDependency("../../../" + dir + "/core/msg.js", ['Blockly.Msg'], []);
 goog.addDependency("../../../" + dir + "/core/mutator.js", ['Blockly.Mutator'], ['Blockly.Bubble', 'Blockly.Icon', 'Blockly.WorkspaceSvg', 'goog.Timer', 'goog.dom']);
@@ -84,7 +84,8 @@ goog.addDependency("../../../" + dir + "/core/variables.js", ['Blockly.Variables
 goog.addDependency("../../../" + dir + "/core/warning.js", ['Blockly.Warning'], ['Blockly.Bubble', 'Blockly.Icon']);
 goog.addDependency("../../../" + dir + "/core/widgetdiv.js", ['Blockly.WidgetDiv'], ['Blockly.Css', 'goog.dom', 'goog.dom.TagName', 'goog.style']);
 goog.addDependency("../../../" + dir + "/core/workspace.js", ['Blockly.Workspace'], ['goog.array', 'goog.math']);
-goog.addDependency("../../../" + dir + "/core/workspace_svg.js", ['Blockly.WorkspaceSvg'], ['Blockly.ConnectionDB', 'Blockly.constants', 'Blockly.Options', 'Blockly.ScrollbarPair', 'Blockly.Touch', 'Blockly.Trashcan', 'Blockly.Workspace', 'Blockly.Xml', 'Blockly.ZoomControls', 'goog.dom', 'goog.math.Coordinate', 'goog.userAgent']);
+goog.addDependency("../../../" + dir + "/core/workspace_svg.js", ['Blockly.WorkspaceSvg'], ['Blockly.ConnectionDB', 'Blockly.constants', 'Blockly.Options', 'Blockly.ScrollbarPair', 'Blockly.Touch', 'Blockly.Trashcan', 'Blockly.Workspace', 'Blockly.Xml', 'Blockly.ZoomControls', 'Blockly.WsDragSurfaceSvg', 'goog.dom', 'goog.math.Coordinate', 'goog.userAgent']);
+goog.addDependency("../../../" + dir + "/core/ws_drag_surface_svg.js", ['Blockly.WsDragSurfaceSvg'], ['Blockly.utils', 'goog.asserts', 'goog.math.Coordinate']);
 goog.addDependency("../../../" + dir + "/core/xml.js", ['Blockly.Xml'], ['goog.asserts', 'goog.dom']);
 goog.addDependency("../../../" + dir + "/core/zoom_controls.js", ['Blockly.ZoomControls'], ['Blockly.Touch', 'goog.dom']);
 goog.addDependency("../../alltests.js", [], []);
@@ -1654,6 +1655,7 @@ goog.require('Blockly.Warning');
 goog.require('Blockly.WidgetDiv');
 goog.require('Blockly.Workspace');
 goog.require('Blockly.WorkspaceSvg');
+goog.require('Blockly.WsDragSurfaceSvg');
 goog.require('Blockly.Xml');
 goog.require('Blockly.ZoomControls');
 goog.require('Blockly.constants');
@@ -136,6 +136,7 @@ Blockly.Css.CONTENT = [
    'outline: none;',
    'overflow: hidden;',  /* IE overflows by default. */
    'display: block;',
+    'position:absolute;',
  '}',

  '.blocklyWidgetDiv {',
@@ -169,6 +170,27 @@ Blockly.Css.CONTENT = [
    'position: absolute;',
    'z-index: 100000;', /* big value for bootstrap3 compatibility */
  '}',
+  '#wsDragLayerWrapper {',
+    'overflow:hidden;',
+    'position:absolute;',
+    'left:0;',
+    'top:0;',
+    'z-index:10;',
+  '}',
+  '.blocklyWsDragSurface {',
+    'display: none;',
+    'position: absolute;',
+    'overflow:visible;',
+    'top: 0;',
+    'left: 0;',
+    'right: 0;',
+    'bottom: 0;',
+    '-webkit-backface-visibility: hidden;',
+    'backface-visibility: hidden;',
+    '-webkit-perspective: 1000;',
+    'perspective: 1000;',
+  '}',
+

  '.blocklyResizeSE {',
    'cursor: se-resize;',
@@ -262,6 +284,11 @@ Blockly.Css.CONTENT = [
    'cursor: default;',
  '}',

+  '.blocklyFlyout {',
+    'position:absolute;',
+    'z-index: 20;',
+  '}',
+
  '.blocklyFlyoutButtonShadow {',
    'fill: #666;',
  '}',
@@ -342,7 +369,17 @@ Blockly.Css.CONTENT = [
    'stroke: #ddd;',
    'stroke-width: 1;',
  '}',
-
+'.blocklyScrollbarVertical {',
+     'position:absolute;',
+     'outline: none;',
+     'z-index:30;',
+   '}',
+ 
+   '.blocklyScrollbarHorizontal {',
+     'position:absolute;',
+     'outline: none;',
+     'z-index: 30;',
+   '}',
  '.blocklyFlyoutBackground {',
    'fill: #ddd;',
    'fill-opacity: .8;',
@@ -431,6 +468,7 @@ Blockly.Css.CONTENT = [
    'overflow-x: visible;',
    'overflow-y: auto;',
    'position: absolute;',
+    'z-index: 100;',
  '}',

  '.blocklyTreeRoot {',
@@ -259,19 +259,38 @@ Blockly.Flyout.prototype.dragMode_ = Blockly.DRAG_NONE;
 */
 Blockly.Flyout.prototype.dragAngleRange_ = 70;

+/**
+ * Whether the scrollbar handle is visible.
+ * @type {boolean}
+ * @private
+ */
+Blockly.Flyout.prototype.isVisible_ = false;
+
+/**
+ * Whether the workspace containing this scrollbar is visible.
+ * @type {boolean}
+ * @private
+ */
+Blockly.Flyout.prototype.containerVisible_ = true;
+
+
 /**
 * Creates the flyout's DOM.  Only needs to be called once.
+ * @param {string} tagName The type of tag to put the flyout in. 
+ * This is usually an svg or g.
 * @return {!Element} The flyout's SVG group.
 */
-Blockly.Flyout.prototype.createDom = function() {
+Blockly.Flyout.prototype.createDom = function(tagName) {
  /*
-  <g>
+  <svg | g>
    <path class="blocklyFlyoutBackground"/>
    <g class="blocklyFlyout"></g>
-  </g>
+  </svg | g>
  */
-  this.svgGroup_ = Blockly.createSvgElement('g',
-      {'class': 'blocklyFlyout'}, null);
+  // Setting style to display none to start.  The toolbox and flyout
+  // hide/show code  will set up the proper visibility and size later.
+  this.svgGroup_ = Blockly.createSvgElement(tagName,
+      {'class': 'blocklyFlyout', 'style': 'display:none'}, null);
  this.svgBackground_ = Blockly.createSvgElement('path',
      {'class': 'blocklyFlyoutBackground'}, this.svgGroup_);
  this.svgGroup_.appendChild(this.workspace_.createDom());
@@ -385,7 +404,7 @@ Blockly.Flyout.prototype.getMetrics_ = function() {
    }
    var viewHeight = this.height_;
    if (this.toolboxPosition_ == Blockly.TOOLBOX_AT_TOP) {
-      viewHeight += this.MARGIN - this.SCROLLBAR_PADDING;
+      viewHeight -= this.SCROLLBAR_PADDING;
    }
    var viewWidth = this.width_ - 2 * this.SCROLLBAR_PADDING;
  } else {
@@ -447,16 +466,16 @@ Blockly.Flyout.prototype.position = function() {
    // Hidden components will return null.
    return;
  }
-  var edgeWidth = this.horizontalLayout_ ?
-      targetWorkspaceMetrics.viewWidth : this.width_;
-  edgeWidth -= this.CORNER_RADIUS;
-  if (this.toolboxPosition_ == Blockly.TOOLBOX_AT_RIGHT) {
-    edgeWidth *= -1;
-  }

-  this.setBackgroundPath_(edgeWidth,
-      this.horizontalLayout_ ? this.height_ :
-      targetWorkspaceMetrics.viewHeight);
+  var edgeWidth = this.horizontalLayout_ ?
+      targetWorkspaceMetrics.viewWidth - 2 * this.CORNER_RADIUS : 
+      this.width_ - this.CORNER_RADIUS;
+
+  var edgeHeight = this.horizontalLayout_ ?
+      this.height_ - this.CORNER_RADIUS :
+      targetWorkspaceMetrics.viewHeight - 2 * this.CORNER_RADIUS;
+  
+  this.setBackgroundPath_(edgeWidth, edgeHeight);

  var x = targetWorkspaceMetrics.absoluteLeft;
  if (this.toolboxPosition_ == Blockly.TOOLBOX_AT_RIGHT) {
@@ -470,8 +489,6 @@ Blockly.Flyout.prototype.position = function() {
    y -= this.height_;
  }

-  this.svgGroup_.setAttribute('transform', 'translate(' + x + ',' + y + ')');
-
  // Record the height for Blockly.Flyout.getMetrics_, or width if the layout is
  // horizontal.
  if (this.horizontalLayout_) {
@@ -479,9 +496,16 @@ Blockly.Flyout.prototype.position = function() {
  } else {
    this.height_ = targetWorkspaceMetrics.viewHeight;
  }
+  this.svgGroup_.setAttribute("width", this.width_);
+  this.svgGroup_.setAttribute("height", this.height_);
+  // Fix for browsers that don't support translate3d.
+  var transform = 'translate3d(' + x + 'px,' + y + 'px,0px)';  
+  this.svgGroup_.style.transform = transform;
+

  // Update the scrollbar (if one exists).
  if (this.scrollbar_) {
+    this.scrollbar_.setOrigin(x, y);
    this.scrollbar_.resize();
  }
 };
@@ -513,24 +537,26 @@ Blockly.Flyout.prototype.setBackgroundPath_ = function(width, height) {
 */
 Blockly.Flyout.prototype.setBackgroundPathVertical_ = function(width, height) {
  var atRight = this.toolboxPosition_ == Blockly.TOOLBOX_AT_RIGHT;
+  var totalWidth = width + this.CORNER_RADIUS;
+
  // Decide whether to start on the left or right.
-  var path = ['M ' + (atRight ? this.width_ : 0) + ',0'];
+  var path = ['M ' + (atRight ? totalWidth : 0) + ',0'];
  // Top.
-  path.push('h', width);
+  path.push('h', atRight ? -width : width);
  // Rounded corner.
  path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0,
      atRight ? 0 : 1,
      atRight ? -this.CORNER_RADIUS : this.CORNER_RADIUS,
      this.CORNER_RADIUS);
  // Side closest to workspace.
-  path.push('v', Math.max(0, height - this.CORNER_RADIUS * 2));
+  path.push('v', Math.max(0, height));
  // Rounded corner.
  path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0,
      atRight ? 0 : 1,
      atRight ? this.CORNER_RADIUS : -this.CORNER_RADIUS,
      this.CORNER_RADIUS);
  // Bottom.
-  path.push('h', -width);
+  path.push('h', atRight ? width : -width);
  path.push('z');
  this.svgBackground_.setAttribute('d', path.join(' '));
 };
@@ -552,13 +578,13 @@ Blockly.Flyout.prototype.setBackgroundPathHorizontal_ = function(width,

  if (atTop) {
    // Top.
-    path.push('h', width + this.CORNER_RADIUS);
+    path.push('h', width + 2 * this.CORNER_RADIUS);
    // Right.
    path.push('v', height);
    // Bottom.
    path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0, 1,
        -this.CORNER_RADIUS, this.CORNER_RADIUS);
-    path.push('h', -1 * (width - this.CORNER_RADIUS));
+    path.push('h', -1 * (width));
    // Left.
    path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0, 1,
        -this.CORNER_RADIUS, -this.CORNER_RADIUS);
@@ -567,13 +593,13 @@ Blockly.Flyout.prototype.setBackgroundPathHorizontal_ = function(width,
    // Top.
    path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0, 1,
        this.CORNER_RADIUS, -this.CORNER_RADIUS);
-    path.push('h', width - this.CORNER_RADIUS);
+    path.push('h', width);
     // Right.
    path.push('a', this.CORNER_RADIUS, this.CORNER_RADIUS, 0, 0, 1,
        this.CORNER_RADIUS, this.CORNER_RADIUS);
-    path.push('v', height - this.CORNER_RADIUS);
+    path.push('v', height);
    // Bottom.
-    path.push('h', -width - this.CORNER_RADIUS);
+    path.push('h', -width - 2 * this.CORNER_RADIUS);
    // Left.
    path.push('z');
  }
@@ -617,14 +643,57 @@ Blockly.Flyout.prototype.wheel_ = function(e) {
  e.stopPropagation();
 };

+
 /**
- * Is the flyout visible?
+ * Is the scrollbar visible.  Non-paired scrollbars disappear when they aren't
+ * needed.
 * @return {boolean} True if visible.
 */
 Blockly.Flyout.prototype.isVisible = function() {
-  return this.svgGroup_ && this.svgGroup_.style.display == 'block';
+  return this.isVisible_;
 };

+/**
+ * Set whether the scrollbar is visible.
+ * Only applies to non-paired scrollbars.
+ * @param {boolean} visible True if visible.
+ */
+Blockly.Flyout.prototype.setVisible = function(visible) {
+  var visibilityChanged = (visible != this.isVisible());
+
+  this.isVisible_ = visible;
+  if (visibilityChanged) {
+    this.updateDisplay_();
+  }
+};
+
+/**
+ * Set whether this scrollbar's container is visible.
+ * @param {boolean} visible Whether the container is visible.
+ */
+Blockly.Flyout.prototype.setContainerVisible = function(visible) {
+  var visibilityChanged = (visible != this.containerVisible_);
+  this.containerVisible_ = visible;
+  if (visibilityChanged) {
+    this.updateDisplay_();
+  }
+};
+
+/**
+ * Update the visibility of the scrollbar based whether it thinks it should
+ * be visible and whether its containing workspace is visible.
+ */
+Blockly.Flyout.prototype.updateDisplay_ = function() {
+  var show = true;
+  if (!this.containerVisible_) {
+    show = false; 
+  } else {
+    show = this.isVisible();
+  }
+  this.svgGroup_.style.display = show ? 'block' : 'none';
+  this.scrollbar_.setContainerVisible(show);
+
+};
 /**
 * Hide and empty the flyout.
 */
@@ -632,7 +701,7 @@ Blockly.Flyout.prototype.hide = function() {
  if (!this.isVisible()) {
    return;
  }
-  this.svgGroup_.style.display = 'none';
+  this.setVisible(false);
  // Delete all the event listeners.
  for (var x = 0, listen; listen = this.listeners_[x]; x++) {
    Blockly.unbindEvent_(listen);
@@ -665,7 +734,8 @@ Blockly.Flyout.prototype.show = function(xmlList) {
        Blockly.Procedures.flyoutCategory(this.workspace_.targetWorkspace);
  }

-  this.svgGroup_.style.display = 'block';
+  this.setVisible(true);
+
  // Create the blocks to be shown in this flyout.
  var contents = [];
  var gaps = [];
@@ -1139,7 +1209,12 @@ Blockly.Flyout.prototype.placeNewBlock_ = function(originBlock) {
  }
  // Figure out where the original block is on the screen, relative to the upper
  // left corner of the main workspace.
-  var xyOld = Blockly.getSvgXY_(svgRootOld, targetWorkspace);
+  var element = svgRootOld;
+  var xyOld = Blockly.getInjectionDivXY_(svgRootOld);
+  if (targetWorkspace.isMutator) {
+    xyOld = Blockly.getSvgXY_(svgRootOld, this.workspace_);
+  }
+
  // Take into account that the flyout might have been scrolled horizontally
  // (separately from the main workspace).
  // Generally a no-op in vertical mode but likely to happen in horizontal
@@ -1183,7 +1258,11 @@ Blockly.Flyout.prototype.placeNewBlock_ = function(originBlock) {
  // upper left corner of the workspace.  This may not be the same as the
  // original block because the flyout's origin may not be the same as the
  // main workspace's origin.
-  var xyNew = Blockly.getSvgXY_(svgRootNew, targetWorkspace);
+  var xyNew = Blockly.getInjectionDivXY_(svgRootNew);
+   if (targetWorkspace.isMutator) {
+     xyNew = Blockly.getSvgXY_(svgRootNew, targetWorkspace);
+   }
+
  // Scale the scroll (getSvgXY_ did not do this).
  xyNew.x +=
      targetWorkspace.scrollX / targetWorkspace.scale - targetWorkspace.scrollX;
@@ -32,6 +32,7 @@ goog.require('Blockly.WorkspaceSvg');
 goog.require('goog.dom');
 goog.require('goog.ui.Component');
 goog.require('goog.userAgent');
+goog.require('Blockly.WsDragSurfaceSvg')


 /**
@@ -54,7 +55,9 @@ Blockly.inject = function(container, opt_options) {
  var subContainer = goog.dom.createDom('div', 'injectionDiv');
  container.appendChild(subContainer);
  var svg = Blockly.createDom_(subContainer, options);
-  var workspace = Blockly.createMainWorkspace_(svg, options);
+  var wsDragSurface = new Blockly.WsDragSurfaceSvg(subContainer);
+  wsDragSurface.createDom();
+  var workspace = Blockly.createMainWorkspace_(svg, options, wsDragSurface);
  Blockly.init_(workspace);
  workspace.markFocused();
  Blockly.bindEventWithChecks_(svg, 'focus', workspace, workspace.markFocused);
@@ -180,14 +183,21 @@ Blockly.createDom_ = function(container, options) {
 * Create a main workspace and add it to the SVG.
 * @param {!Element} svg SVG element with pattern defined.
 * @param {!Blockly.Options} options Dictionary of options.
+ * @param {?Blockly.WsDragSurfaceSvg} dragSurface  The surface to hold the
+ * workspace while dragging.
 * @return {!Blockly.Workspace} Newly created main workspace.
 * @private
 */
-Blockly.createMainWorkspace_ = function(svg, options) {
+Blockly.createMainWorkspace_ = function(svg, options, dragSurface) {
  options.parentWorkspace = null;
-  var mainWorkspace = new Blockly.WorkspaceSvg(options);
+  var mainWorkspace = new Blockly.WorkspaceSvg(options, dragSurface);
  mainWorkspace.scale = options.zoomOptions.startScale;
  svg.appendChild(mainWorkspace.createDom('blocklyMainBackground'));
+  if (!options.hasCategories && options.languageTree) {
+    // add flyout as its own <svg>
+    var flyout = mainWorkspace.addFlyout_('svg');
+    Blockly.utils.insertAfter_(flyout, svg);
+  }
  // A null translation will also apply the correct initial scale.
  mainWorkspace.translate(0, 0);
  mainWorkspace.markFocused();
@@ -279,6 +289,7 @@ Blockly.init_ = function(mainWorkspace) {
      mainWorkspace.toolbox_.init(mainWorkspace);
    } else if (mainWorkspace.flyout_) {
      // Build a fixed flyout with the root blocks.
+      //mainWorkspace.addFlyout_();
      mainWorkspace.flyout_.init(mainWorkspace);
      mainWorkspace.flyout_.show(options.languageTree.childNodes);
      mainWorkspace.flyout_.scrollToStart();
@@ -130,8 +130,14 @@ Blockly.Mutator.prototype.createEditor_ = function() {
  };
  this.workspace_ = new Blockly.WorkspaceSvg(workspaceOptions);
  this.workspace_.isMutator = true;
-  this.svgDialog_.appendChild(
-      this.workspace_.createDom('blocklyMutatorBackground'));
+  // Mutator flyouts go inside the mutator workspace's <g> rather than in
+  // their own <svg> tags.  This is because mutator a workspace's scale is
+  // always 1.0.  Instead of handling scale itself, it inherits it from the
+  // parent workspace due to the dom heirarchy.
+  var flyoutSvg =  this.workspace_.addFlyout_('g');
+  var bg = this.workspace_.createDom('blocklyMutatorBackground');
+  bg.appendChild(flyoutSvg);
+  this.svgDialog_.appendChild(bg);
  return this.svgDialog_;
 };

@@ -198,6 +204,7 @@ Blockly.Mutator.prototype.resizeBubble_ = function() {
  }
  this.workspace_.resize();
 };
+ 

 /**
 * Show or hide the mutator bubble.
@@ -338,11 +345,13 @@ Blockly.Mutator.prototype.workspaceChanged_ = function() {
 * @private
 */
 Blockly.Mutator.prototype.getFlyoutMetrics_ = function() {
+  var absTop = 0;
+  var absLeft = 0;
  return {
    viewHeight: this.workspaceHeight_,
    viewWidth: this.workspaceWidth_,
-    absoluteTop: 0,
-    absoluteLeft: 0
+    absoluteTop: absTop,
+    absoluteLeft: absLeft
  };
 };

@@ -44,7 +44,7 @@ Blockly.ScrollbarPair = function(workspace) {
      {'height': Blockly.Scrollbar.scrollbarThickness,
      'width': Blockly.Scrollbar.scrollbarThickness,
      'class': 'blocklyScrollbarBackground'}, null);
-  Blockly.Scrollbar.insertAfter_(this.corner_, workspace.getBubbleCanvas());
+  Blockly.utils.insertAfter_(this.corner_, workspace.getBubbleCanvas());
 };

 /**
@@ -69,6 +69,15 @@ Blockly.ScrollbarPair.prototype.dispose = function() {
  this.vScroll = null;
 };

+/**
+ * Set whether this scrollbar's container is visible.
+ * @param {boolean} visible Whether the container is visible.
+ */
+Blockly.ScrollbarPair.prototype.setContainerVisible = function(visible) {
+  this.hScroll.setContainerVisible(visible);
+  this.vScroll.setContainerVisible(visible);
+};
+
 /**
 * Recalculate both of the scrollbars' locations and lengths.
 * Also reposition the corner rectangle.
@@ -189,6 +198,8 @@ Blockly.Scrollbar = function(workspace, horizontal, opt_pair) {
  this.pair_ = opt_pair || false;
  this.horizontal_ = horizontal;
  this.oldHostMetrics_ = null;
+  this.originX_ = 0;
+  this.originY_ = 0;

  this.createDom_();

@@ -202,6 +213,8 @@ Blockly.Scrollbar = function(workspace, horizontal, opt_pair) {
  if (horizontal) {
    this.svgBackground_.setAttribute('height',
        Blockly.Scrollbar.scrollbarThickness);
+    this.outerSvg_.setAttribute('height',
+          Blockly.Scrollbar.scrollbarThickness);
    this.svgHandle_.setAttribute('height',
        Blockly.Scrollbar.scrollbarThickness - 5);
    this.svgHandle_.setAttribute('y', 2.5);
@@ -211,6 +224,8 @@ Blockly.Scrollbar = function(workspace, horizontal, opt_pair) {
  } else {
    this.svgBackground_.setAttribute('width',
        Blockly.Scrollbar.scrollbarThickness);
+    this.outerSvg_.setAttribute('width',
+          Blockly.Scrollbar.scrollbarThickness);
    this.svgHandle_.setAttribute('width',
        Blockly.Scrollbar.scrollbarThickness - 5);
    this.svgHandle_.setAttribute('x', 2.5);
@@ -253,6 +268,13 @@ Blockly.Scrollbar.prototype.handlePosition_ = 0;
 */
 Blockly.Scrollbar.prototype.isVisible_ = true;

+/**
+ * Whether the workspace containing this scrollbar is visible.
+ * @type {boolean}
+ * @private
+ */
+Blockly.Scrollbar.prototype.containerVisible_ = true;
+
 /**
 * Width of vertical scrollbar or height of horizontal scrollbar.
 * Increase the size of scrollbars on touch devices.
@@ -263,6 +285,11 @@ if (goog.events.BrowserFeature.TOUCH_ENABLED) {
  Blockly.Scrollbar.scrollbarThickness = 25;
 }

+Blockly.Scrollbar.prototype.setOrigin = function(x, y) {
+  this.originX_ = x;
+  this.originY_ = y;
+};
+
 /**
 * @param {!Object} first An object containing computed measurements of a
 *    workspace.
@@ -303,7 +330,8 @@ Blockly.Scrollbar.prototype.dispose = function() {
  Blockly.unbindEvent_(this.onMouseDownHandleWrapper_);
  this.onMouseDownHandleWrapper_ = null;

-  goog.dom.removeNode(this.svgGroup_);
+  goog.dom.removeNode(this.outerSvg_);
+  this.outerSvg_ = null;
  this.svgGroup_ = null;
  this.svgBackground_ = null;
  this.svgHandle_ = null;
@@ -338,6 +366,7 @@ Blockly.Scrollbar.prototype.setHandlePosition = function(newPosition) {
 */
 Blockly.Scrollbar.prototype.setScrollViewSize_ = function(newSize) {
  this.scrollViewSize_ = newSize;
+  this.outerSvg_.setAttribute(this.lengthAttribute_, this.scrollViewSize_);
  this.svgBackground_.setAttribute(this.lengthAttribute_, this.scrollViewSize_);
 };

@@ -349,9 +378,10 @@ Blockly.Scrollbar.prototype.setScrollViewSize_ = function(newSize) {
 Blockly.Scrollbar.prototype.setPosition = function(x, y) {
  this.position_.x = x;
  this.position_.y = y;
-
-  this.svgGroup_.setAttribute('transform',
-      'translate(' + this.position_.x + ',' + this.position_.y + ')');
+  var tempX = this.position_.x + this.originX_;
+  var tempY = this.position_.y + this.originY_;
+  var transform = 'translate3d(' + tempX + 'px,' + tempY + 'px,0px)';
+  this.outerSvg_.style.transform = transform;
 };

 /**
@@ -539,6 +569,7 @@ Blockly.Scrollbar.prototype.resizeContentVertical = function(hostMetrics) {
 */
 Blockly.Scrollbar.prototype.createDom_ = function() {
  /* Create the following DOM:
+  // TODO: Update comment.
  <g class="blocklyScrollbarHorizontal">
    <rect class="blocklyScrollbarBackground" />
    <rect class="blocklyScrollbarHandle" rx="8" ry="8" />
@@ -546,15 +577,18 @@ Blockly.Scrollbar.prototype.createDom_ = function() {
  */
  var className = 'blocklyScrollbar' +
      (this.horizontal_ ? 'Horizontal' : 'Vertical');
-  this.svgGroup_ = Blockly.createSvgElement('g', {'class': className}, null);
+   this.outerSvg_ = Blockly.createSvgElement('svg',
+     {'class': className},
+     null);
+  this.svgGroup_ = Blockly.createSvgElement('g', {}, this.outerSvg_);
  this.svgBackground_ = Blockly.createSvgElement('rect',
      {'class': 'blocklyScrollbarBackground'}, this.svgGroup_);
  var radius = Math.floor((Blockly.Scrollbar.scrollbarThickness - 5) / 2);
  this.svgHandle_ = Blockly.createSvgElement('rect',
      {'class': 'blocklyScrollbarHandle', 'rx': radius, 'ry': radius},
      this.svgGroup_);
-  Blockly.Scrollbar.insertAfter_(this.svgGroup_,
-                                 this.workspace_.getBubbleCanvas());
+  Blockly.utils.insertAfter_(this.outerSvg_,
+                                 this.workspace_.getParentSvg());
 };

 /**
@@ -572,23 +606,46 @@ Blockly.Scrollbar.prototype.isVisible = function() {
 * @param {boolean} visible True if visible.
 */
 Blockly.Scrollbar.prototype.setVisible = function(visible) {
-  if (visible == this.isVisible()) {
-    return;
-  }
+  var visibilityChanged = (visible != this.isVisible());
  // Ideally this would also apply to scrollbar pairs, but that's a bigger
  // headache (due to interactions with the corner square).
  if (this.pair_) {
    throw 'Unable to toggle visibility of paired scrollbars.';
  }
-
  this.isVisible_ = visible;
+  if (visibilityChanged) {
+    this.updateDisplay_();
+  }
+};

-  if (visible) {
-    this.svgGroup_.setAttribute('display', 'block');
+/**
+ * Set whether this scrollbar's container is visible.
+ * @param {boolean} visible Whether the container is visible.
+ */
+Blockly.Scrollbar.prototype.setContainerVisible = function(visible) {
+  var visibilityChanged = (visible != this.containerVisible_);
+
+  this.containerVisible_ = visible;
+  if (visibilityChanged) {
+    this.updateDisplay_();
+  }
+};
+
+/**
+ * Update the visibility of the scrollbar based whether it thinks it should
+ * be visible and whether its containing workspace is visible.
+ */
+Blockly.Scrollbar.prototype.updateDisplay_ = function() {
+  var show = true;
+  if (!this.containerVisible_) {
+    show = false; 
  } else {
-    // Hide the scrollbar.
-    this.workspace_.setMetrics({x: 0, y: 0});
-    this.svgGroup_.setAttribute('display', 'none');
+    show = this.isVisible();
+  }
+  if (show) {
+    this.outerSvg_.setAttribute('display', 'block');
+  } else {
+    this.outerSvg_.setAttribute('display', 'none');    
  }
 };

@@ -611,7 +668,7 @@ Blockly.Scrollbar.prototype.onMouseDownBar_ = function(e) {
      this.workspace_.getInverseScreenCTM());
  var mouseLocation = this.horizontal_ ? mouseXY.x : mouseXY.y;

-  var handleXY = Blockly.getSvgXY_(this.svgHandle_, this.workspace_);
+  var handleXY = Blockly.getInjectionDivXY_(this.svgHandle_);
  var handleStart = this.horizontal_ ? handleXY.x : handleXY.y;
  var handlePosition = this.handlePosition_;

@@ -648,7 +705,7 @@ Blockly.Scrollbar.prototype.onMouseDownHandle_ = function(e) {
  // Look up the current translation and record it.
  this.startDragHandle = this.handlePosition_;
  // Record the current mouse position.
-  this.startDragMouse = this.horizontal_ ? e.clientX : e.clientY;
+  this.startDragMouse = this.horizontal_ ? e.clientX : e.clientY;  
  Blockly.Scrollbar.onMouseUpWrapper_ = Blockly.bindEventWithChecks_(document,
      'mouseup', this, this.onMouseUpHandle_);
  Blockly.Scrollbar.onMouseMoveWrapper_ = Blockly.bindEventWithChecks_(document,
@@ -740,22 +797,4 @@ Blockly.Scrollbar.prototype.set = function(value) {
  this.onScroll_();
 };

-/**
- * Insert a node after a reference node.
- * Contrast with node.insertBefore function.
- * @param {!Element} newNode New element to insert.
- * @param {!Element} refNode Existing element to precede new node.
- * @private
- */
-Blockly.Scrollbar.insertAfter_ = function(newNode, refNode) {
-  var siblingNode = refNode.nextSibling;
-  var parentNode = refNode.parentNode;
-  if (!parentNode) {
-    throw 'Reference node has no parent.';
-  }
-  if (siblingNode) {
-    parentNode.insertBefore(newNode, siblingNode);
-  } else {
-    parentNode.appendChild(newNode);
-  }
-};
+
@@ -179,7 +179,8 @@ Blockly.Toolbox.prototype.init = function() {
   * @private
   */
  this.flyout_ = new Blockly.Flyout(workspaceOptions);
-  goog.dom.insertSiblingAfter(this.flyout_.createDom(), workspace.svgGroup_);
+  Blockly.utils.insertAfter_(this.flyout_.createDom('svg'),
+                                 this.workspace_.getParentSvg());
  this.flyout_.init(workspace);

  this.config_['cleardotPath'] = workspace.options.pathToMedia + '1x1.gif';
@@ -107,6 +107,7 @@ Blockly.onMouseUp_ = function(e) {
    return;
  }
  Blockly.Touch.clearTouchIdentifier();
+  workspace.resetDragSurface();
  Blockly.Css.setCursor(Blockly.Css.Cursor.OPEN);
  workspace.dragMode_ = Blockly.DRAG_NONE;
  // Unbind the touch event if it exists.
@@ -257,18 +257,55 @@ Blockly.getRelativeXY_ = function(element) {
  if (y) {
    xy.y = parseInt(y, 10);
  }
+  
  // Second, check for transform="translate(...)" attribute.
  var transform = element.getAttribute('transform');
-  var r = transform && transform.match(Blockly.getRelativeXY_.XY_REGEXP_);
-  if (r) {
-    xy.x += parseFloat(r[1]);
-    if (r[3]) {
-      xy.y += parseFloat(r[3]);
+   if (transform) {
+    var transformComponents =
+        transform.match(Blockly.getRelativeXY_.XY_REGEXP_);
+    if (transformComponents) {
+      xy.x += parseFloat(transformComponents[1]);
+      if (transformComponents[3]) {
+        xy.y += parseFloat(transformComponents[3]);
+      }
    }
  }
+
+  // Third, check for style="transform: translate3d(...)".
+  var style = element.getAttribute('style');
+  if (style && style.indexOf('translate3d') > -1) {
+    var styleComponents = style.match(Blockly.getRelativeXY_.XY_3D_REGEXP_);
+    if (styleComponents) {
+      xy.x += parseFloat(styleComponents[1]);
+      if (styleComponents[3]) {
+        xy.y += parseFloat(styleComponents[3]);
+      }
+    }
+  }
+
  return xy;
 };

+/**
+ * Return the scale of this element.
+ * @param {!Element} element  The element to find the coordinates of.
+ * @return {!number} number represending the scale applied to the element.
+ * @private
+ */
+Blockly.getScale_ = function(element) {
+  var scale = 1;  
+  var transform = element.getAttribute('transform');
+   if (transform) {
+    var transformComponents =
+        transform.match(Blockly.getScale_.REGEXP_);
+    if (transformComponents && transformComponents[0]) {
+      scale = parseFloat(transformComponents[0]);
+    }
+  }
+  // Add in 3d scale parsing.
+  return scale;
+};
+
 /**
 * Static regex to pull the x,y values out of an SVG translate() directive.
 * Note that Firefox and IE (9,10) return 'translate(12)' instead of
@@ -281,6 +318,35 @@ Blockly.getRelativeXY_ = function(element) {
 Blockly.getRelativeXY_.XY_REGEXP_ =
    /translate\(\s*([-+\d.e]+)([ ,]\s*([-+\d.e]+)\s*\))?/;

+Blockly.getScale_REGEXP_ = /scale\(\s*([-+\d.e]+)\s*\)/;
+
+/**
+ * Static regex to pull the x,y,z values out of a translate3d() style property.
+ * Accounts for same exceptions as XY_REGEXP_.
+ * @type {!RegExp}
+ * @private
+ */
+Blockly.getRelativeXY_.XY_3D_REGEXP_ =
+  /transform:\s*translate3d\(\s*([-+\d.e]+)px([ ,]\s*([-+\d.e]+)\s*)px([ ,]\s*([-+\d.e]+)\s*)px\)?/;
+
+Blockly.getInjectionDivXY_ = function(element) {
+  var x = 0;
+  var y = 0;
+  var scale = 1;
+  while (element) {
+    var xy = Blockly.getRelativeXY_(element);
+    // what is scale?!
+    var scale = Blockly.getScale_(element);
+    x = (x * scale) + xy.x;
+    y = (y * scale) + xy.y;
+    if (Blockly.hasClass_(element, 'injectionDiv')) {
+      break;
+    }
+    element = element.parentNode;
+  }
+  return new goog.math.Coordinate(x, y);    
+};
+
 /**
 * Return the absolute coordinates of the top-left corner of this element,
 * scales that after canvas SVG element, if it's a descendant.
@@ -719,3 +785,23 @@ Blockly.utils.wrapToText_ = function(words, wordBreaks) {
  }
  return text.join('');
 };
+
+/**
+ * Insert a node after a reference node.
+ * Contrast with node.insertBefore function.
+ * @param {!Element} newNode New element to insert.
+ * @param {!Element} refNode Existing element to precede new node.
+ * @private
+ */
+Blockly.utils.insertAfter_ = function(newNode, refNode) {
+  var siblingNode = refNode.nextSibling;
+  var parentNode = refNode.parentNode;
+  if (!parentNode) {
+    throw 'Reference node has no parent.';
+  }
+  if (siblingNode) {
+    parentNode.insertBefore(newNode, siblingNode);
+  } else {
+    parentNode.appendChild(newNode);
+  }
+};
@@ -37,6 +37,7 @@ goog.require('Blockly.Trashcan');
 goog.require('Blockly.Workspace');
 goog.require('Blockly.Xml');
 goog.require('Blockly.ZoomControls');
+goog.require('Blockly.WsDragSurfaceSvg');

 goog.require('goog.dom');
 goog.require('goog.math.Coordinate');
@@ -47,10 +48,11 @@ goog.require('goog.userAgent');
 * Class for a workspace.  This is an onscreen area with optional trashcan,
 * scrollbars, bubbles, and dragging.
 * @param {!Blockly.Options} options Dictionary of options.
+  * @param {Blockly.WsDragSurfaceSvg} opt_wsDragSurface optional drag surface
 * @extends {Blockly.Workspace}
 * @constructor
 */
-Blockly.WorkspaceSvg = function(options) {
+Blockly.WorkspaceSvg = function(options, opt_wsDragSurface) {
  Blockly.WorkspaceSvg.superClass_.constructor.call(this, options);
  this.getMetrics =
      options.getMetrics || Blockly.WorkspaceSvg.getTopLevelWorkspaceMetrics_;
@@ -59,6 +61,9 @@ Blockly.WorkspaceSvg = function(options) {

  Blockly.ConnectionDB.init(this);

+  if (opt_wsDragSurface) {
+    this.wsDragSurface_ = opt_wsDragSurface;
+  }
  /**
   * Database of pre-loaded sounds.
   * @private
@@ -159,6 +164,13 @@ Blockly.WorkspaceSvg.prototype.scrollbar = null;
 */
 Blockly.WorkspaceSvg.prototype.lastSound_ = null;

+/**
+ * This workspace's drag surface, if it exists.
+ * @type {Blockly.DragSurfaceSvg}
+ * @private
+ */
+Blockly.WorkspaceSvg.prototype.wsDragSurface_ = null;
+
 /**
 * Last known position of the page scroll.
 * This is used to determine whether we have recalculated screen coordinate
@@ -183,6 +195,22 @@ Blockly.WorkspaceSvg.prototype.getInverseScreenCTM = function() {
  return this.inverseScreenCTM_;
 };

+/**
+ * Getter for the flyout associated with this workspace.  This flyout may be
+ * owned by either the toolbox or the workspace, depending on toolbox
+ * configuration.  It will be null if there is no flyout.
+ * @return {Blockly.Flyout} The flyout on this workspace.
+ */
+Blockly.WorkspaceSvg.prototype.getFlyout = function() {
+  if (this.flyout_) {
+    return this.flyout_;
+  }
+  if (this.toolbox_) {
+    return this.toolbox_.flyout_;
+  }
+  return null;
+};
+
 /**
 * Update the inverted screen CTM.
 */
@@ -262,7 +290,7 @@ Blockly.WorkspaceSvg.prototype.createDom = function(opt_backgroundClass) {
  if (this.options.hasCategories) {
    this.toolbox_ = new Blockly.Toolbox(this);
  } else if (this.options.languageTree) {
-    this.addFlyout_();
+    //this.addFlyout_();
  }
  this.updateGridPattern_();
  this.recordDeleteAreas();
@@ -356,9 +384,11 @@ Blockly.WorkspaceSvg.prototype.addZoomControls_ = function(bottom) {

 /**
 * Add a flyout.
+ * @param {string} tagName What type of tag the flyout belongs in.
+ * @return {!Element} The element containing the flyout dom.
 * @private
 */
-Blockly.WorkspaceSvg.prototype.addFlyout_ = function() {
+Blockly.WorkspaceSvg.prototype.addFlyout_ = function(tagName) {
  var workspaceOptions = {
    disabledPatternId: this.options.disabledPatternId,
    parentWorkspace: this,
@@ -370,8 +400,10 @@ Blockly.WorkspaceSvg.prototype.addFlyout_ = function() {
  /** @type {Blockly.Flyout} */
  this.flyout_ = new Blockly.Flyout(workspaceOptions);
  this.flyout_.autoClose = false;
-  var svgFlyout = this.flyout_.createDom();
-  this.svgGroup_.insertBefore(svgFlyout, this.svgBlockCanvas_);
+  var svgFlyout = this.flyout_.createDom(tagName);
+  // Return the element so that callers can place it in their desired spot
+  // within the dom.  Unfortunately, mutators are special.
+  return svgFlyout;  
 };

 /**
@@ -483,10 +515,15 @@ Blockly.WorkspaceSvg.prototype.getParentSvg = function() {
 * @param {number} y Vertical translation.
 */
 Blockly.WorkspaceSvg.prototype.translate = function(x, y) {
-  var translation = 'translate(' + x + ',' + y + ') ' +
-      'scale(' + this.scale + ')';
-  this.svgBlockCanvas_.setAttribute('transform', translation);
-  this.svgBubbleCanvas_.setAttribute('transform', translation);
+  if (this.wsDragSurface_ && this.dragMode_ != Blockly.DRAG_NONE) {
+    this.wsDragSurface_.translateSurface(x,y);
+    //this.svgBlockCanvas.style.display = no
+  } else {
+    var translation = 'translate(' + x + ',' + y + ') ' +
+        'scale(' + this.scale + ')';
+    this.svgBlockCanvas_.setAttribute('transform', translation);
+    this.svgBubbleCanvas_.setAttribute('transform', translation);
+  }
 };

 /**
@@ -506,6 +543,12 @@ Blockly.WorkspaceSvg.prototype.getWidth = function() {
 */
 Blockly.WorkspaceSvg.prototype.setVisible = function(isVisible) {
  this.getParentSvg().style.display = isVisible ? 'block' : 'none';
+  if (this.scrollbar) {
+    this.scrollbar.setContainerVisible(isVisible);
+  }
+  if (this.getFlyout()) {
+    this.getFlyout().setContainerVisible(isVisible);
+  }
  if (this.toolbox_) {
    // Currently does not support toolboxes in mutators.
    this.toolbox_.HtmlDiv.style.display = isVisible ? 'block' : 'none';
@@ -705,6 +748,27 @@ Blockly.WorkspaceSvg.prototype.isDeleteArea = function(e) {
  return false;
 };

+Blockly.WorkspaceSvg.prototype.resetDragSurface = function() {
+  var trans = this.wsDragSurface_.getSurfaceTranslation();
+  this.wsDragSurface_.clearAndHide(this.svgGroup_);
+  var x = trans.x;
+  var translation = 'translate(' + x + ',' + trans.y + ') ' +
+        'scale(' + this.scale + ')';
+  this.svgBlockCanvas_.setAttribute('transform', translation);
+  this.svgBubbleCanvas_.setAttribute('transform', translation);
+};
+
+Blockly.WorkspaceSvg.prototype.setupDragSurface = function() {
+  // Figure out where we want to put the canvas back.
+  var previousElement = this.svgBlockCanvas_.previousSibling;
+  var w = this.getParentSvg().getAttribute("width")
+  var h = this.getParentSvg().getAttribute("height")
+  var coord = Blockly.getRelativeXY_(this.svgBlockCanvas_);
+  this.wsDragSurface_.setContentsAndShow(this.svgBlockCanvas_,
+      this.svgBubbleCanvas_, previousElement, w, h, this.scale);
+  this.wsDragSurface_.translateSurface(coord.x, coord.y);
+};
+
 /**
 * Handle a mouse-down on SVG drawing surface.
 * @param {!Event} e Mouse down event.
@@ -739,6 +803,8 @@ Blockly.WorkspaceSvg.prototype.onMouseDown_ = function(e) {
    this.startScrollX = this.scrollX;
    this.startScrollY = this.scrollY;

+    this.setupDragSurface();
+
    // If this is a touch event then bind to the mouseup so workspace drag mode
    // is turned off and double move events are not performed on a block.
    // See comment in inject.js Blockly.init_ as to why mouseup events are
@@ -765,6 +831,7 @@ Blockly.WorkspaceSvg.prototype.onMouseDown_ = function(e) {
 * @param {!goog.math.Coordinate} xy Starting location of object.
 */
 Blockly.WorkspaceSvg.prototype.startDrag = function(e, xy) {
+
  // Record the starting offset between the bubble's location and the mouse.
  var point = Blockly.mouseToSvg(e, this.getParentSvg(),
      this.getInverseScreenCTM());
@@ -0,0 +1,198 @@
+/**
+ * @license
+ * Visual Blocks Editor
+ *
+ * Copyright 2016 Google Inc.
+ * https://developers.google.com/blockly/
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+/**
+ * @fileoverview An SVG that floats on top of the workspace.
+ * Blocks are moved into this SVG during a drag, improving performance.
+ * The entire SVG is translated, so the blocks are never repainted during drag.
+ * @author katelyn@google.com (Katelyn Mann)
+ */
+
+'use strict';
+
+goog.provide('Blockly.WsDragSurfaceSvg');
+
+goog.require('Blockly.utils');
+
+goog.require('goog.asserts');
+goog.require('goog.math.Coordinate');
+
+/**
+ * Class for a Drag Surface SVG.
+ * @param {Element} container Containing element.
+ * @constructor
+ */
+Blockly.WsDragSurfaceSvg = function(container) {
+  this.container_ = container;
+};
+
+/**
+ * The SVG drag surface. Set once by Blockly.WsDragSurfaceSvg.createDom.
+ * @type {Element}
+ * @private
+ */
+Blockly.WsDragSurfaceSvg.prototype.SVG_ = null;
+
+/**
+ * SVG group inside the drag surface. This is where blocks are moved to.
+ * @type {Element}
+ * @private
+ */
+Blockly.WsDragSurfaceSvg.prototype.dragGroup_ = null;
+
+/**
+ * Containing HTML element; parent of the workspace and the drag surface.
+ * @type {Element}
+ * @private
+ */
+Blockly.WsDragSurfaceSvg.prototype.container_ = null;
+
+
+/**
+ * Create the drag surface and inject it into the container.
+ */
+Blockly.WsDragSurfaceSvg.prototype.createDom = function() {
+  if (this.SVG_) {
+    return;  // Already created.
+  }
+  this.outerDiv_ = document.createElement('div');
+  this.outerDiv_.id = 'wsDragLayerWrapper';
+  this.SVG_ = Blockly.createSvgElement('svg', {
+    'xmlns': Blockly.SVG_NS,
+    'xmlns:html': Blockly.HTML_NS,
+    'xmlns:xlink': 'http://www.w3.org/1999/xlink',
+    'version': '1.1',
+    'class': 'blocklyWsDragSurface'
+  }, this.outerDiv_);
+  this.container_.appendChild(this.outerDiv_);
+};
+
+
+/**
+ * Translate the entire drag surface during a drag.
+ * We translate the drag surface instead of the blocks inside the surface
+ * so that the browser avoids repainting the SVG.
+ * Because of this, the drag coordinates must be adjusted by scale.
+ * @param {Number} x X translation for the entire surface
+ * @param {Number} y Y translation for the entire surface
+ */
+Blockly.WsDragSurfaceSvg.prototype.translateSurface = function(x, y) {
+  // Force values to have two decimal points.
+  // This is a work-around to prevent a bug in Safari, where numbers close to 0
+  // are sometimes reported as something like "2.9842794901924208e-12".
+  // That is incompatible with translate3d, causing bugs.
+  x = x.toFixed(0);
+  y = y.toFixed(0);
+  // Ignorning browsers that don't support translate3d at the moment.
+  var transform =
+    'transform: translate3d(' + x + 'px, ' + y + 'px, 0px); display: block;';
+  this.SVG_.setAttribute('style', transform);
+};
+
+/**
+ * Reports the surface translation in scaled workspace coordinates.
+ * Use this when finishing a drag to return blocks to the correct position.
+ * @return {goog.math.Coordinate} Current translation of the surface
+ */
+Blockly.WsDragSurfaceSvg.prototype.getSurfaceTranslation = function() {
+  var xy = Blockly.getRelativeXY_(this.SVG_);
+  return new goog.math.Coordinate(xy.x, xy.y);
+};
+
+/**
+ * Get the first Element under the svg.
+ * @return {Element} Drag surface block DOM element
+ */
+Blockly.WsDragSurfaceSvg.prototype.getChildGroup = function() {
+  // For now there is only 1.  Change when there is a bubble canvas???
+  return this.SVG_.childNodes[0];
+};
+
+/**
+ * Clear the group and hide the surface;  Move everything back to newSurface.
+ * @param {!SVGElement} newSurface The element to put the drag surface contents
+ * into.
+ */
+Blockly.WsDragSurfaceSvg.prototype.clearAndHide = function(newSurface) {
+  var blockCanvas = this.SVG_.childNodes[0];
+  var bubbleCanvas = this.SVG_.childNodes[1];
+  if (!blockCanvas || !bubbleCanvas) {
+    throw 'Couldn\'t clear and hide the drag surface.  A node was missing.';
+  }
+  // This is ugly and needs some more testing and reworking.  A unittest is
+  // actually probably the easiest way to verify.
+  // Reattach the block canvas.
+  if (this.previousSibling_ != null) {
+    if (this.previousSibling_.nextSibling != null)  {
+      // There is no insertAfter so we do some silly dom stuff to get the same effect.
+      newSurface.insertBefore(blockCanvas, this.previousSibling_.nextSibling);
+    } else {
+      // there is nothing to insert it before so we stick it at the end.
+      newSurface.appendChild(blockCanvas);
+    }
+  } else if (newSurface.firstChild != null) {
+    newSurface.insertBefore(blockCanvas, newSurface.firstChild);
+  } else {
+    newSurface.appendChild(blockCanvas);
+  }
+
+  // Reattach the bubble canvas.
+  Blockly.utils.insertAfter_(bubbleCanvas, blockCanvas);
+  // check th oerder of how we do this dom manipulation.
+  this.SVG_.style.display = 'none';
+  this.outerDiv_.style.display = 'none';
+  // if defs goes back in, this is the wrong assert
+  goog.asserts.assert(this.SVG_.childNodes.length == 0, 'Drag group was not cleared.');
+  this.SVG_.style.transform = '';
+  this.previousSibling_ = null;
+};
+
+/**
+ * Set the SVG to have everything on it and how the surface.
+ * @param {!Element} blockCanvas The block canvas <g> element from the workspace.
+ * @param {!Element} bubbleCanvas The <g> element that contains the bubbles.
+ * @param {?Element} previousSibling The element to insert the block canvas &
+   bubble canvas after when it goes back in the dom at the end of a drag.
+ * @param {number} width The width of the workspace svg element.
+ * @param {number} height The height of the workspace svg element.
+ * @param {number} scale The scale of the workspace being dragged.
+ * 
+ */
+Blockly.WsDragSurfaceSvg.prototype.setContentsAndShow = function(
+    blockCanvas, bubbleCanvas, previousSibling, width, height, scale) {
+  this.previousSibling_ = previousSibling;
+  blockCanvas.setAttribute('transform', 'translate(0, 0) scale(' + scale + ')');
+  bubbleCanvas.setAttribute('transform', 'translate(0, 0) scale(' + scale + ')');
+  // if defs goes back in this is the wrong assert
+  goog.asserts.assert(this.SVG_.childNodes.length == 0,
+    'Already dragging a block.');
+  // appendChild removes the blocks from the previous parent
+  // TODO: Cost of a layout on mousedown is high.  Try updating the height
+  // continuously while these elements are invisible will help. 
+  this.outerDiv_.style.width = width;
+  this.outerDiv_.style.height = height;
+  this.SVG_.setAttribute('width', width);
+  this.SVG_.setAttribute('height', height);
+  this.SVG_.appendChild(blockCanvas);
+  this.SVG_.appendChild(bubbleCanvas);
+  this.SVG_.style.display = 'block';
+  this.outerDiv_.style.display = 'block';
+};
+
Autor	SHA1	Mensagem	Data
Katelyn Mann	3f4ea52230	more cleanup - updating comments and deleting commented out stuff.	2016-11-03 13:01:15 -07:00
Katelyn Mann	589853f896	Clean up some more unused stuff in flyout. Saving the x & y became absolute when we made the getInjectionDivXY helper	2016-11-03 12:00:51 -07:00
Katelyn Mann	2c58f318e7	Remove repositionBubble callback hook. Since we put mutator flyouts back as children of the svg, we do not need this anymore.	2016-11-03 10:14:29 -07:00
Katelyn Mann	36415513ba	A few more cleanups to workspace drag surface code.	2016-11-03 09:50:19 -07:00
Katelyn Mann	dd373862a5	Code cleanups. Get rid of scale in drag surface since it is not used. Update some comments and commented out code.	2016-11-03 09:37:25 -07:00
Katelyn Mann	978e76ee74	Put mutator flyouts back inside the main workspace svg. This is because mutators do not understand scale :(	2016-11-01 12:54:15 -07:00
Katelyn Mann	040b3ed15b	fix getInjectionDivXY_ to find injectionDiv by finding a parent with the injectionDiv class rather than document.getElementsByClassName(injectionDiv)[0]. This fixes creating new blocks for multi-workspaces.	2016-10-31 12:57:49 -07:00
Katelyn Mann	961b0a61ec	Now that the scrollbar is not in the workspace, use getInjectionDivXY_ instead of getSvgXY_	2016-10-31 11:54:30 -07:00
Katelyn Mann	68f7144d71	fix typo. disiplay= display:none to style=display:none	2016-10-31 11:06:43 -07:00
Katelyn Mann	34da0a5a63	Drop the decimal places in the drag surface transform. They seem to make the text fuzzy. Also fix a bug in the flyout. If we do not set it to display none, it seems to get a default size, sits on top of the workspace and steals clicks.	2016-10-31 09:23:39 -07:00
Katelyn Mann	1d1eec7be3	Merge branch 'develop-drag-surface-ws-drag' of https://github.com/google/blockly into develop-drag-surface-ws-drag	2016-10-27 17:28:43 -07:00
picklesrus	6a1dd7a0f2	apply zoom to the drag surface (#721 )	2016-10-27 17:28:36 -07:00
Katelyn Mann	ca316b0fb9	apply zoom to the drag surface	2016-10-27 15:51:46 -07:00
Rachel Fenichel	f91c256580	move the bubble canvas to the drag surface when dragging. (#720 )	2016-10-27 15:32:56 -07:00
Katelyn Mann	86b3e18a9b	fix mutator positioning. Add getInjectionDivXY to calculate relative positions in the new world.	2016-10-27 12:04:17 -07:00
Katelyn Mann	067da69851	fixed visiblity of things that are now top level svgs.	2016-10-26 16:59:29 -07:00
Katelyn Mann	f5e4d5b0fa	add flyout getter to workspace.	2016-10-26 16:40:00 -07:00
Katelyn Mann	d93ee6efce	Use height & width without CORNER_RADIUS when setting the background path on the flyout path.	2016-10-26 16:24:14 -07:00
Katelyn Mann	cba565302c	hacky version of fixing getrelativesvg xy	2016-10-26 14:44:06 -07:00
Katelyn Mann	77c6f44f5d	make the flyout its own svg and position it correctly. block placement is still broken when dragging out of toolbox when workspace is scaled.	2016-10-25 17:01:38 -07:00
Katelyn Mann	9302c1a598	move insertBefore method from scrollbar to utils so we can use it elsewhere.	2016-10-25 15:10:38 -07:00
Katelyn Mann	f392f7d243	Fix scrollbar visibility problems for realz.	2016-10-25 14:53:37 -07:00
Katelyn Mann	8724bdbe18	fix bug where scrollbars shows the full height of a category that does not need a scrollbar	2016-10-24 16:53:21 -07:00
Katelyn Mann	412b72a81a	Fix the position of the scrollbar (when in flyout) by taking into account the toolbox width	2016-10-24 16:26:28 -07:00
Katelyn Mann	8196b3df1f	split scrollbars into their own svg and mess with z-index so that drag layer goes under them.	2016-10-21 18:24:34 -07:00
Katelyn Mann	040a031608	make blocks scroll under toolbox and under the edges of the svg.	2016-10-21 16:03:07 -07:00
Katelyn Mann	2d5c2e9cee	Remove the border on the drag surface. Leaving the background color for visibility now but the border is what was making it jumpy.	2016-10-21 10:59:25 -07:00
Katelyn Mann	8f06aa944a	put the block canvas back in the same part of the dom we took it out of. Also turn drag surface setup stuff into a helper method.	2016-10-21 10:45:13 -07:00
Katelyn Mann	b8877e2f46	get coordinates right on drag. Except for a little jump on mouse down & up	2016-10-20 17:57:20 -07:00
Katelyn Mann	61e3c81013	add workspace drag surface and set it up to do very basic drag stuff.	2016-10-20 16:24:32 -07:00