Add shadow blocks and category colours to code demo.

blockly_compressed.js

@@ -1226,7 +1226,7 @@ a.svgGroup_);this.flyout_.init(a);this.CONFIG_.cleardotPath=a.options.pathToMedi
 Blockly.Toolbox.prototype.dispose=function(){this.flyout_.dispose();this.tree_.dispose();goog.dom.removeNode(this.HtmlDiv);this.lastCategory_=this.workspace_=null};
 Blockly.Toolbox.prototype.position=function(){var a=this.HtmlDiv;if(a){var b=this.workspace_.options.svg,c=goog.style.getPageOffset(b),b=Blockly.svgSize(b);a.style.left=this.workspace_.RTL?c.x+b.width-a.offsetWidth+"px":c.x+"px";a.style.height=b.height+"px";a.style.top=c.y+"px";this.width=a.offsetWidth;this.workspace_.RTL||--this.width;this.flyout_.position()}};
 Blockly.Toolbox.prototype.populate_=function(a){function b(a,e){for(var f=0,g;g=a.childNodes[f];f++)if(g.tagName)switch(g.tagName.toUpperCase()){case "CATEGORY":var h=c.createNode(g.getAttribute("name"));h.blocks=[];e.add(h);var k=g.getAttribute("custom");k?h.blocks=k:b(g,h);k=g.getAttribute("colour");h.hexColour=goog.isString(k)?Blockly.makeColour(k):"";"true"==g.getAttribute("expanded")&&(h.blocks.length&&c.setSelectedItem(h),h.setExpanded(!0));break;case "SEP":e.add(new Blockly.Toolbox.TreeSeparator);
-break;case "BLOCK":e.blocks.push(g)}}var c=this.tree_;c.removeChildren();c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level.";Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.addColour_=function(a){a=a.getChildren();for(var b=0,c;c=a[b];b++){var d="8px solid "+(c.hexColour||"#ddd");this.workspace_.RTL?c.getElement().style.borderLeft=d:c.getElement().style.borderRight=d;this.addColour_(c)}};
+break;case "BLOCK":e.blocks.push(g)}}var c=this.tree_;c.removeChildren();c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level.";Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.addColour_=function(a){a=a.getChildren();for(var b=0,c;c=a[b];b++){var d=c.getElement();if(d){var e="8px solid "+(c.hexColour||"#ddd");this.workspace_.RTL?d.style.borderLeft=e:d.style.borderRight=e}this.addColour_(c)}};
 Blockly.Toolbox.prototype.clearSelection=function(){this.tree_.setSelectedItem(null)};Blockly.Toolbox.prototype.getRect=function(){var a=this.workspace_.RTL?Blockly.svgSize(this.workspace_.options.svg).width-this.width:-1E7;return new goog.math.Rect(a,-1E7,1E7+this.width,2E7)};Blockly.Toolbox.TreeControl=function(a,b){this.toolbox_=a;goog.ui.tree.TreeControl.call(this,goog.html.SafeHtml.EMPTY,b)};goog.inherits(Blockly.Toolbox.TreeControl,goog.ui.tree.TreeControl);
 Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);if(goog.events.BrowserFeature.TOUCH_ENABLED){var a=this.getElement();Blockly.bindEvent_(a,goog.events.EventType.TOUCHSTART,this,this.handleTouchEvent_)}};Blockly.Toolbox.TreeControl.prototype.handleTouchEvent_=function(a){a.preventDefault();var b=this.getNodeFromEvent_(a);b&&a.type===goog.events.EventType.TOUCHSTART&&setTimeout(function(){b.onMouseDown(a)},1)};
 Blockly.Toolbox.TreeControl.prototype.createNode=function(a){return new Blockly.Toolbox.TreeNode(this.toolbox_,a?goog.html.SafeHtml.htmlEscape(a):goog.html.SafeHtml.EMPTY,this.getConfig(),this.getDomHelper())};

blockly_uncompressed.js

@@ -73,7 +73,7 @@ goog.addDependency("array/array.js", ['goog.array', 'goog.array.ArrayLike'], ['g
 goog.addDependency("asserts/asserts.js", ['goog.asserts', 'goog.asserts.AssertionError'], ['goog.debug.Error', 'goog.dom.NodeType', 'goog.string']);
 goog.addDependency("async/freelist.js", ['goog.async.FreeList'], []);
 goog.addDependency("async/nexttick.js", ['goog.async.nextTick', 'goog.async.throwException'], ['goog.debug.entryPointRegistry', 'goog.dom.TagName', 'goog.functions', 'goog.labs.userAgent.browser', 'goog.labs.userAgent.engine']);
-goog.addDependency("async/run.js", ['goog.async.run'], ['goog.async.WorkQueue', 'goog.async.nextTick', 'goog.async.throwException', 'goog.testing.watchers']);
+goog.addDependency("async/run.js", ['goog.async.run'], ['goog.async.WorkQueue', 'goog.async.nextTick', 'goog.async.throwException']);
 goog.addDependency("async/workqueue.js", ['goog.async.WorkItem', 'goog.async.WorkQueue'], ['goog.asserts', 'goog.async.FreeList']);
 goog.addDependency("color/color.js", ['goog.color', 'goog.color.Hsl', 'goog.color.Hsv', 'goog.color.Rgb'], ['goog.color.names', 'goog.math']);
 goog.addDependency("color/names.js", ['goog.color.names'], []);
@@ -146,7 +146,6 @@ goog.addDependency("structs/set.js", ['goog.structs.Set'], ['goog.structs', 'goo
 goog.addDependency("structs/structs.js", ['goog.structs'], ['goog.array', 'goog.object']);
 goog.addDependency("structs/trie.js", ['goog.structs.Trie'], ['goog.object', 'goog.structs']);
 goog.addDependency("style/style.js", ['goog.style'], ['goog.array', 'goog.asserts', 'goog.dom', 'goog.dom.NodeType', 'goog.dom.TagName', 'goog.dom.vendor', 'goog.math.Box', 'goog.math.Coordinate', 'goog.math.Rect', 'goog.math.Size', 'goog.object', 'goog.string', 'goog.userAgent']);
-goog.addDependency("testing/watchers.js", ['goog.testing.watchers'], []);
 goog.addDependency("timer/timer.js", ['goog.Timer'], ['goog.Promise', 'goog.events.EventTarget']);
 goog.addDependency("ui/colorpalette.js", ['goog.ui.ColorPalette'], ['goog.array', 'goog.color', 'goog.dom.TagName', 'goog.style', 'goog.ui.Palette', 'goog.ui.PaletteRenderer']);
 goog.addDependency("ui/colorpicker.js", ['goog.ui.ColorPicker', 'goog.ui.ColorPicker.EventType'], ['goog.ui.ColorPalette', 'goog.ui.Component']);

core/toolbox.js

@@ -244,11 +244,14 @@ Blockly.Toolbox.prototype.populate_ = function(newTree) {
 Blockly.Toolbox.prototype.addColour_ = function(tree) {
   var children = tree.getChildren();
   for (var i = 0, child; child = children[i]; i++) {
-    var border = '8px solid ' + (child.hexColour || '#ddd');
-    if (this.workspace_.RTL) {
-      child.getElement().style.borderLeft = border;
-    } else {
-      child.getElement().style.borderRight = border;
+    var element = child.getElement();
+    if (element) {
+      var border = '8px solid ' + (child.hexColour || '#ddd');
+      if (this.workspace_.RTL) {
+        element.style.borderLeft = border;
+      } else {
+        element.style.borderRight = border;
+      }
     }
     this.addColour_(child);
   }

demos/code/index.html

@@ -70,7 +70,7 @@
   <textarea id="content_xml" class="content" wrap="off"></textarea>
 
   <xml id="toolbox" style="display: none">
-    <category id="catLogic">
+    <category id="catLogic" colour="210">
       <block type="controls_if"></block>
       <block type="logic_compare"></block>
       <block type="logic_operation"></block>
@@ -79,128 +79,216 @@
       <block type="logic_null"></block>
       <block type="logic_ternary"></block>
     </category>
-    <category id="catLoops">
+    <category id="catLoops" colour="120">
       <block type="controls_repeat_ext">
         <value name="TIMES">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">10</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="controls_whileUntil"></block>
       <block type="controls_for">
         <value name="FROM">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">1</field>
-          </block>
+          </shadow>
         </value>
         <value name="TO">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">10</field>
-          </block>
+          </shadow>
         </value>
         <value name="BY">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">1</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="controls_forEach"></block>
       <block type="controls_flow_statements"></block>
     </category>
-    <category id="catMath">
+    <category id="catMath" colour="230">
       <block type="math_number"></block>
-      <block type="math_arithmetic"></block>
-      <block type="math_single"></block>
-      <block type="math_trig"></block>
-      <block type="math_constant"></block>
-      <block type="math_number_property"></block>
-      <block type="math_change">
-        <value name="DELTA">
-          <block type="math_number">
+      <block type="math_arithmetic">
+        <value name="A">
+          <shadow type="math_number">
             <field name="NUM">1</field>
-          </block>
+          </shadow>
+        </value>
+        <value name="B">
+          <shadow type="math_number">
+            <field name="NUM">1</field>
+          </shadow>
         </value>
       </block>
-      <block type="math_round"></block>
-      <block type="math_on_list"></block>
-      <block type="math_modulo"></block>
-      <block type="math_constrain">
-        <value name="LOW">
-          <block type="math_number">
+      <block type="math_single">
+        <value name="NUM">
+          <shadow type="math_number">
+            <field name="NUM">9</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_trig">
+        <value name="NUM">
+          <shadow type="math_number">
+            <field name="NUM">45</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_constant"></block>
+      <block type="math_number_property">
+        <value name="NUMBER_TO_CHECK">
+          <shadow type="math_number">
+            <field name="NUM">0</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_change">
+        <value name="DELTA">
+          <shadow type="math_number">
             <field name="NUM">1</field>
-          </block>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_round">
+        <value name="NUM">
+          <shadow type="math_number">
+            <field name="NUM">3.1</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_on_list"></block>
+      <block type="math_modulo">
+        <value name="DIVIDEND">
+          <shadow type="math_number">
+            <field name="NUM">64</field>
+          </shadow>
+        </value>
+        <value name="DIVISOR">
+          <shadow type="math_number">
+            <field name="NUM">10</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="math_constrain">
+        <value name="VALUE">
+          <shadow type="math_number">
+            <field name="NUM">50</field>
+          </shadow>
+        </value>
+        <value name="LOW">
+          <shadow type="math_number">
+            <field name="NUM">1</field>
+          </shadow>
         </value>
         <value name="HIGH">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">100</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="math_random_int">
         <value name="FROM">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">1</field>
-          </block>
+          </shadow>
         </value>
         <value name="TO">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">100</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="math_random_float"></block>
     </category>
-    <category id="catText">
+    <category id="catText" colour="160">
       <block type="text"></block>
       <block type="text_join"></block>
       <block type="text_append">
         <value name="TEXT">
-          <block type="text"></block>
+          <shadow type="text"></shadow>
+        </value>
+      </block>
+      <block type="text_length">
+        <value name="VALUE">
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="text_isEmpty">
+        <value name="VALUE">
+          <shadow type="text">
+            <field name="TEXT"></field>
+          </shadow>
         </value>
       </block>
-      <block type="text_length"></block>
-      <block type="text_isEmpty"></block>
       <block type="text_indexOf">
         <value name="VALUE">
           <block type="variables_get">
-            <field name="VAR" class="textVar">...</field>
+            <field name="VAR">text</field>
           </block>
         </value>
+        <value name="FIND">
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
+        </value>
       </block>
       <block type="text_charAt">
         <value name="VALUE">
           <block type="variables_get">
-            <field name="VAR" class="textVar">...</field>
+            <field name="VAR">text</field>
           </block>
         </value>
       </block>
       <block type="text_getSubstring">
         <value name="STRING">
           <block type="variables_get">
-            <field name="VAR" class="textVar">...</field>
+            <field name="VAR">text</field>
           </block>
         </value>
       </block>
-      <block type="text_changeCase"></block>
-      <block type="text_trim"></block>
-      <block type="text_print"></block>
+      <block type="text_changeCase">
+        <value name="TEXT">
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="text_trim">
+        <value name="TEXT">
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
+        </value>
+      </block>
+      <block type="text_print">
+        <value name="TEXT">
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
+        </value>
+      </block>
       <block type="text_prompt_ext">
         <value name="TEXT">
-          <block type="text"></block>
+          <shadow type="text">
+            <field name="TEXT">abc</field>
+          </shadow>
         </value>
       </block>
     </category>
-    <category id="catLists">
+    <category id="catLists" colour="260">
       <block type="lists_create_with">
         <mutation items="0"></mutation>
       </block>
       <block type="lists_create_with"></block>
       <block type="lists_repeat">
         <value name="NUM">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">5</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="lists_length"></block>
@@ -208,80 +296,80 @@
       <block type="lists_indexOf">
         <value name="VALUE">
           <block type="variables_get">
-            <field name="VAR" class="listVar">...</field>
+            <field name="VAR">list</field>
           </block>
         </value>
       </block>
       <block type="lists_getIndex">
         <value name="VALUE">
           <block type="variables_get">
-            <field name="VAR" class="listVar">...</field>
+            <field name="VAR">list</field>
           </block>
         </value>
       </block>
       <block type="lists_setIndex">
         <value name="LIST">
           <block type="variables_get">
-            <field name="VAR" class="listVar">...</field>
+            <field name="VAR">list</field>
           </block>
         </value>
       </block>
       <block type="lists_getSublist">
         <value name="LIST">
           <block type="variables_get">
-            <field name="VAR" class="listVar">...</field>
+            <field name="VAR">list</field>
           </block>
         </value>
       </block>
       <block type="lists_split">
         <value name="DELIM">
-          <block type="text">
+          <shadow type="text">
             <field name="TEXT">,</field>
-          </block>
+          </shadow>
         </value>
       </block>
     </category>
-    <category id="catColour">
+    <category id="catColour" colour="20">
       <block type="colour_picker"></block>
       <block type="colour_random"></block>
       <block type="colour_rgb">
         <value name="RED">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">100</field>
-          </block>
+          </shadow>
         </value>
         <value name="GREEN">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">50</field>
-          </block>
+          </shadow>
         </value>
         <value name="BLUE">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">0</field>
-          </block>
+          </shadow>
         </value>
       </block>
       <block type="colour_blend">
         <value name="COLOUR1">
-          <block type="colour_picker">
+          <shadow type="colour_picker">
             <field name="COLOUR">#ff0000</field>
-          </block>
+          </shadow>
         </value>
         <value name="COLOUR2">
-          <block type="colour_picker">
+          <shadow type="colour_picker">
             <field name="COLOUR">#3333ff</field>
-          </block>
+          </shadow>
         </value>
         <value name="RATIO">
-          <block type="math_number">
+          <shadow type="math_number">
             <field name="NUM">0.5</field>
-          </block>
+          </shadow>
         </value>
       </block>
     </category>
     <sep></sep>
-    <category id="catVariables" custom="VARIABLE"></category>
-    <category id="catFunctions" custom="PROCEDURE"></category>
+    <category id="catVariables" colour="330" custom="VARIABLE"></category>
+    <category id="catFunctions" colour="290" custom="PROCEDURE"></category>
   </xml>
 
 </body>