Merge pull request #3405 from rachel-fenichel/path_obj_set_class

Move lots of update style functions from block_svg to path_object

core/block_svg.js

@@ -250,7 +250,7 @@ Blockly.BlockSvg.prototype.initSvg = function() {
     icons[i].createIcon();
   }
   this.applyColour();
-  this.updateMovable();
+  this.pathObject.updateMovable(this.isMovable());
   var svg = this.getSvgRoot();
   if (!this.workspace.options.readOnly && !this.eventsInit_ && svg) {
     Blockly.bindEventWithChecks_(
@@ -881,26 +881,13 @@ Blockly.BlockSvg.prototype.setDragging = function(adding) {
   }
 };
 
-/**
- * Add or remove the UI indicating if this block is movable or not.
- */
-Blockly.BlockSvg.prototype.updateMovable = function() {
-  if (this.isMovable()) {
-    Blockly.utils.dom.addClass(
-        /** @type {!Element} */ (this.svgGroup_), 'blocklyDraggable');
-  } else {
-    Blockly.utils.dom.removeClass(
-        /** @type {!Element} */ (this.svgGroup_), 'blocklyDraggable');
-  }
-};
-
 /**
  * Set whether this block is movable or not.
  * @param {boolean} movable True if movable.
  */
 Blockly.BlockSvg.prototype.setMovable = function(movable) {
   Blockly.BlockSvg.superClass_.setMovable.call(this, movable);
-  this.updateMovable();
+  this.pathObject.updateMovable(movable);
 };
 
 /**
@@ -937,8 +924,7 @@ Blockly.BlockSvg.prototype.setInsertionMarker = function(insertionMarker) {
   this.isInsertionMarker_ = insertionMarker;
   if (this.isInsertionMarker_) {
     this.setColour(Blockly.INSERTION_MARKER_COLOUR);
-    Blockly.utils.dom.addClass(/** @type {!Element} */ (this.svgGroup_),
-        'blocklyInsertionMarker');
+    this.pathObject.updateInsertionMarker(true);
   }
 };
 
@@ -1038,19 +1024,8 @@ Blockly.BlockSvg.prototype.applyColour = function() {
  * Enable or disable a block.
  */
 Blockly.BlockSvg.prototype.updateDisabled = function() {
-  if (!this.isEnabled() || this.getInheritedDisabled()) {
-    var added = Blockly.utils.dom.addClass(
-        /** @type {!Element} */ (this.svgGroup_), 'blocklyDisabled');
-    if (added) {
-      this.pathObject.setDisabled(true, this.isShadow());
-    }
-  } else {
-    var removed = Blockly.utils.dom.removeClass(
-        /** @type {!Element} */ (this.svgGroup_), 'blocklyDisabled');
-    if (removed) {
-      this.pathObject.setDisabled(false, this.isShadow());
-    }
-  }
+  var isDisabled = !this.isEnabled() || this.getInheritedDisabled();
+  this.pathObject.updateDisabled(isDisabled, this.isShadow());
   var children = this.getChildren(false);
   for (var i = 0, child; (child = children[i]); i++) {
     child.updateDisabled();
@@ -1235,23 +1210,21 @@ Blockly.BlockSvg.prototype.setHighlighted = function(highlighted) {
   if (!this.rendered) {
     return;
   }
-  this.pathObject.setHighlighted(highlighted);
+  this.pathObject.updateHighlighted(highlighted);
 };
 
 /**
  * Select this block.  Highlight it visually.
  */
 Blockly.BlockSvg.prototype.addSelect = function() {
-  Blockly.utils.dom.addClass(
-      /** @type {!Element} */ (this.svgGroup_), 'blocklySelected');
+  this.pathObject.updateSelected(true);
 };
 
 /**
  * Unselect this block.  Remove its highlighting.
  */
 Blockly.BlockSvg.prototype.removeSelect = function() {
-  Blockly.utils.dom.removeClass(
-      /** @type {!Element} */ (this.svgGroup_), 'blocklySelected');
+  this.pathObject.updateSelected(false);
 };
 
 /**
@@ -1261,13 +1234,7 @@ Blockly.BlockSvg.prototype.removeSelect = function() {
  * @package
  */
 Blockly.BlockSvg.prototype.setDeleteStyle = function(enable) {
-  if (enable) {
-    Blockly.utils.dom.addClass(/** @type {!Element} */ (this.svgGroup_),
-        'blocklyDraggingDelete');
-  } else {
-    Blockly.utils.dom.removeClass(/** @type {!Element} */ (this.svgGroup_),
-        'blocklyDraggingDelete');
-  }
+  this.pathObject.updateDraggingDelete(enable);
 };
 
 

core/renderers/common/i_path_object.js

@@ -70,12 +70,44 @@ Blockly.blockRendering.IPathObject.prototype.flipRTL;
  * Set whether the block shows a highlight or not.  Block highlighting is
  * often used to visually mark blocks currently being executed.
  * @param {boolean} highlighted True if highlighted.
+ * @package
  */
-Blockly.blockRendering.IPathObject.prototype.setHighlighted;
+Blockly.blockRendering.IPathObject.prototype.updateHighlighted;
 
 /**
  * Set whether the block shows a disable pattern or not.
  * @param {boolean} disabled True if disabled.
  * @param {boolean} isShadow True if the block is a shadow block.
+ * @package
  */
-Blockly.blockRendering.IPathObject.prototype.setDisabled;
+Blockly.blockRendering.IPathObject.prototype.updateDisabled;
+
+/**
+ * Add or remove styling showing that a block is selected.
+ * @param {boolean} enable True if selection is enabled, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.IPathObject.prototype.updateSelected;
+
+/**
+ * Add or remove styling showing that a block is dragged over a delete area.
+ * @param {boolean} enable True if the block is being dragged over a delete
+ *     area, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.IPathObject.prototype.updateDraggingDelete;
+
+/**
+ * Add or remove styling showing that a block is an insertion marker.
+ * @param {boolean} enable True if the block is an insertion marker, false
+ *     otherwise.
+ * @package
+ */
+Blockly.blockRendering.IPathObject.prototype.updateInsertionMarker;
+
+/**
+ * Add or remove styling showing that a block is movable.
+ * @param {boolean} enable True if the block is movable, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.IPathObject.prototype.updateMovable;

core/renderers/common/path_object.js

@@ -44,6 +44,7 @@ Blockly.blockRendering.PathObject = function(root, constants) {
   /**
    * The renderer's constant provider.
    * @type {!Blockly.blockRendering.ConstantProvider}
+   * @protected
    */
   this.constants_ = constants;
 
@@ -121,14 +122,33 @@ Blockly.blockRendering.PathObject.prototype.setStyle = function(blockStyle) {
   this.style = blockStyle;
 };
 
+/**
+ * Add or remove the given CSS class on the path object's root SVG element.
+ * @param {string} className The name of the class to add or remove
+ * @param {boolean} add True if the class should be added.  False if it should
+ *     be removed.
+ * @protected
+ */
+Blockly.blockRendering.PathObject.prototype.setClass_ = function(
+    className, add) {
+  if (add) {
+    Blockly.utils.dom.addClass(/** @type {!Element} */ (this.svgRoot),
+        className);
+  } else {
+    Blockly.utils.dom.removeClass(/** @type {!Element} */ (this.svgRoot),
+        className);
+  }
+};
+
 /**
  * Set whether the block shows a highlight or not.  Block highlighting is
  * often used to visually mark blocks currently being executed.
- * @param {boolean} highlighted True if highlighted.
+ * @param {boolean} enable True if highlighted.
+ * @package
  */
-Blockly.blockRendering.PathObject.prototype.setHighlighted = function(
-    highlighted) {
-  if (highlighted) {
+Blockly.blockRendering.PathObject.prototype.updateHighlighted = function(
+    enable) {
+  if (enable) {
     this.svgPath.setAttribute('filter',
         'url(#' + this.constants_.embossFilterId + ')');
   } else {
@@ -140,9 +160,12 @@ Blockly.blockRendering.PathObject.prototype.setHighlighted = function(
  * Set whether the block shows a disable pattern or not.
  * @param {boolean} disabled True if disabled.
  * @param {boolean} isShadow True if the block is a shadow block.
+ * @package
  */
-Blockly.blockRendering.PathObject.prototype.setDisabled = function(disabled,
+Blockly.blockRendering.PathObject.prototype.updateDisabled = function(disabled,
     isShadow) {
+
+  this.setClass_('blocklyDisabled', disabled);
   if (disabled) {
     this.svgPath.setAttribute('fill',
         'url(#' + this.constants_.disabledPatternId + ')');
@@ -150,3 +173,43 @@ Blockly.blockRendering.PathObject.prototype.setDisabled = function(disabled,
     this.applyColour(isShadow);
   }
 };
+
+/**
+ * Add or remove styling showing that a block is selected.
+ * @param {boolean} enable True if selection is enabled, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.PathObject.prototype.updateSelected = function(enable) {
+  this.setClass_('blocklySelected', enable);
+};
+
+/**
+ * Add or remove styling showing that a block is dragged over a delete area.
+ * @param {boolean} enable True if the block is being dragged over a delete
+ *     area, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.PathObject.prototype.updateDraggingDelete = function(
+    enable) {
+  this.setClass_('blocklyDraggingDelete', enable);
+};
+
+/**
+ * Add or remove styling showing that a block is an insertion marker.
+ * @param {boolean} enable True if the block is an insertion marker, false
+ *     otherwise.
+ * @package
+ */
+Blockly.blockRendering.PathObject.prototype.updateInsertionMarker = function(
+    enable) {
+  this.setClass_('blocklyInsertionMarker', enable);
+};
+
+/**
+ * Add or remove styling showing that a block is movable.
+ * @param {boolean} enable True if the block is movable, false otherwise.
+ * @package
+ */
+Blockly.blockRendering.PathObject.prototype.updateMovable = function(enable) {
+  this.setClass_('blocklyDraggable', enable);
+};

core/renderers/geras/path_object.js

@@ -153,7 +153,7 @@ Blockly.geras.PathObject.prototype.setStyle = function(blockStyle) {
 /**
  * @override
  */
-Blockly.geras.PathObject.prototype.setHighlighted = function(highlighted) {
+Blockly.geras.PathObject.prototype.updateHighlighted = function(highlighted) {
   if (highlighted) {
     this.svgPath.setAttribute('filter',
         'url(#' + this.constants_.embossFilterId + ')');
@@ -167,7 +167,8 @@ Blockly.geras.PathObject.prototype.setHighlighted = function(highlighted) {
 /**
  * @override
  */
-Blockly.geras.PathObject.prototype.setDisabled = function(disabled, isShadow) {
+Blockly.geras.PathObject.prototype.updateDisabled = function(
+    disabled, isShadow) {
   if (disabled) {
     this.svgPath.setAttribute('fill',
         'url(#' + this.constants_.disabledPatternId + ')');