Fixes carlosperate/ardublockly#3 and carlosperate/ardublockly#9

ardublockly/ardublockly.js

@@ -26,6 +26,8 @@ window.addEventListener('load', function load(event) {
   ArduinoMaterial.bindDesignEventListeners_();
   ArduinoMaterial.bindBlocklyEventListeners_();
 
+  ArduinoMaterial.resizeToggleToolboxBotton();
+
   // Check if not running locally (including developer's local network IP)
   if (document.location.hostname != 'localhost' &&
       document.location.hostname != '192.168.0.7') {
@@ -423,7 +425,7 @@ ArduinoMaterial.toogleToolbox = function() {
         function() { ArduinoMaterial.showToolboxButtonState(false); });
     ArduinoMaterial.workspace.toolbox_.flyout_.hide();
   } else {
-     ArduinoMaterial.showToolboxButtonState(true);
+    ArduinoMaterial.showToolboxButtonState(true);
     ArduinoMaterial.showToolbox(true);
   }
   ArduinoMaterial.TOOLBAR_SHOWING_ = !ArduinoMaterial.TOOLBAR_SHOWING_;

ardublockly/ardublockly_blockly.js

@@ -54,7 +54,7 @@ ArduinoMaterial.injectBlockly = function(blocklyEl, toolboxPath) {
             trashcan: true });
       ArduinoMaterial.BLOCKLY_INJECTED = true;
     }
-  }
+  };
 
   // If file run locally Chrome will fail here
   try {
@@ -159,15 +159,16 @@ ArduinoMaterial.loadBlocksfromXmlDom = function(blocksXmlDom) {
  */
 ArduinoMaterial.showToolbox = function(show, callback) {
   var resizeWorkspaceAndCallback = function() {
-    /* For some reason the workspace only resizes after second call */
-    //Blockly.fireUiEvent(window, 'resize');
-    //Blockly.fireUiEvent(window, 'resize');
-    //callback.call();
-  }
+    ArduinoMaterial.workspace.render(); 
+    if (callback && ((typeof callback) === (typeof Function))) {
+      callback();
+    }
+  };
+
   if (show == false) {
-    $('.blocklyToolboxDiv').slideUp(300, callback);
+    $('.blocklyToolboxDiv').slideUp(300, resizeWorkspaceAndCallback);
   } else {
-    $('.blocklyToolboxDiv').slideDown(300, callback);
+    $('.blocklyToolboxDiv').slideDown(300, resizeWorkspaceAndCallback);
   }
 };
 
@@ -177,7 +178,7 @@ ArduinoMaterial.showToolbox = function(show, callback) {
 ArduinoMaterial.discard = function() {
   var blockCount = ArduinoMaterial.workspace.getAllBlocks().length;
   if (blockCount == 1) {
-    Blockly.mainWorkspace.clear();
+    ArduinoMaterial.workspace.clear();
     ArduinoMaterial.renderContent();
   } else if (blockCount > 1) {
     ArduinoMaterial.materialAlert(
@@ -186,7 +187,7 @@ ArduinoMaterial.discard = function() {
         sure you want to delete them?',
         true,
         function() {
-          Blockly.mainWorkspace.clear();
+          ArduinoMaterial.workspace.clear();
           ArduinoMaterial.renderContent();
         });
   }
@@ -215,4 +216,4 @@ ArduinoMaterial.ajaxRequest = function() {
     }
   }
   return request;
-};
\ No newline at end of file
+};

ardublockly/ardublockly_design.js

@@ -80,14 +80,14 @@ ArduinoMaterial.showToolboxButtonState = function(toolboxVisible) {
   // Element conatins several classes, use replace to maintain the rest
   if (toolboxVisible == true) {
     toolboxButton.className = toolboxButton.className.replace(
-      'button_toggle_toolbox_on', 'button_toggle_toolbox_off'); 
+        'button_toggle_toolbox_on', 'button_toggle_toolbox_off'); 
     toolboxButtonIcon.className = toolboxButtonIcon.className.replace(
-     'mdi-action-visibility', 'mdi-action-visibility-off');
+       'mdi-action-visibility', 'mdi-action-visibility-off');
   } else {
     toolboxButton.className = toolboxButton.className.replace(
-      'button_toggle_toolbox_off', 'button_toggle_toolbox_on'); 
+        'button_toggle_toolbox_off', 'button_toggle_toolbox_on'); 
     toolboxButtonIcon.className = toolboxButtonIcon.className.replace(
-     'mdi-action-visibility-off', 'mdi-action-visibility');
+        'mdi-action-visibility-off', 'mdi-action-visibility');
   }
 };
 
@@ -109,17 +109,26 @@ ArduinoMaterial.resizeBlocklyWorkspace = function() {
   contentBlocks.style.width = wrapperPanelSize.width + 'px';
   contentBlocks.style.width =
       (2 * wrapperPanelSize.width - contentBlocks.offsetWidth) + 'px';
+};
 
-  //Blockly.MsvgResize();
-  //Blockly.mainWorkspace.render();
-  //alert(
-  //  'resized ' + wrapperPanelSize.width + ' ' + contentBlocks.style.width);
-
-  // Sets the toolbox toggle button width to that of the toolbox
-  if ( ArduinoMaterial.isToolboxVisible() &&
-       ArduinoMaterial.workspace.toolbox_.width ) {
-    // For some reason normal set style and getElementById didn't work
-    $('#button_toggle_toolbox').width(ArduinoMaterial.workspace.toolbox_.width);
+/**
+ * Resizes the toolbox button to toggle its visibility to the width of the
+ * toolbox.
+ * The toolbox width does not change with workspace width, so safe to do once,
+ * but it needs to be done after blockly has been injected.
+ * @private
+ */
+ArduinoMaterial.resizeToggleToolboxBotton = function() {
+  // As the toolbox inject is asynchronous we need to wait
+  if (ArduinoMaterial.BLOCKLY_INJECTED == false) {
+    setTimeout(ArduinoMaterial.resizeToggleToolboxBotton, 50);
+  } else {
+    // Sets the toolbox toggle button width to that of the toolbox
+    if ( ArduinoMaterial.isToolboxVisible() &&
+         ArduinoMaterial.workspace.toolbox_.width ) {
+      // For some reason normal set style and getElementById didn't work
+      $('#button_toggle_toolbox').width(ArduinoMaterial.workspace.toolbox_.width);
+    }
   }
 };