Bug 892605 - part 0: add callMethod to WidgetHelpers, checkItem to SideMenuWidget; r=vporof

browser/devtools/shared/widgets/SideMenuWidget.jsm

@@ -57,6 +57,7 @@ this.SideMenuWidget = function SideMenuWidget(aNode, aOptions={}) {
   this._groupsByName = new Map(); // Can't use a WeakMap because keys are strings.
   this._orderedGroupElementsArray = [];
   this._orderedMenuElementsArray = [];
+  this._itemsByElement = new Map();
 
   // This widget emits events that can be handled in a MenuContainer.
   EventEmitter.decorate(this);
@@ -166,6 +167,7 @@ SideMenuWidget.prototype = {
 
     this._orderedMenuElementsArray.splice(
       this._orderedMenuElementsArray.indexOf(aChild), 1);
+    this._itemsByElement.delete(aChild);
 
     if (this._selectedItem == aChild) {
       this._selectedItem = null;
@@ -188,6 +190,7 @@ SideMenuWidget.prototype = {
     this._groupsByName.clear();
     this._orderedGroupElementsArray.length = 0;
     this._orderedMenuElementsArray.length = 0;
+    this._itemsByElement.clear();
   },
 
   /**
@@ -328,6 +331,22 @@ SideMenuWidget.prototype = {
     }
   },
 
+  /**
+   * Set the checkbox state for the item associated with the given node.
+   *
+   * @param nsIDOMNode aNode
+   *        The dom node for an item we want to check.
+   * @param boolean aCheckState
+   *        True to check, false to uncheck.
+   */
+  checkItem: function(aNode, aCheckState) {
+    const widgetItem = this._itemsByElement.get(aNode);
+    if (!widgetItem) {
+      throw new Error("No item for " + aNode);
+    }
+    widgetItem.check(aCheckState);
+  },
+
   /**
    * Sets the text displayed in this container as a notice.
    * @param string aValue
@@ -424,6 +443,7 @@ SideMenuWidget.prototype = {
   _groupsByName: null,
   _orderedGroupElementsArray: null,
   _orderedMenuElementsArray: null,
+  _itemsByElement: null,
   _ensureVisibleTimeout: null,
   _noticeTextContainer: null,
   _noticeTextNode: null,
@@ -478,6 +498,7 @@ function SideMenuGroup(aWidget, aName) {
 SideMenuGroup.prototype = {
   get _orderedGroupElementsArray() this.ownerView._orderedGroupElementsArray,
   get _orderedMenuElementsArray() this.ownerView._orderedMenuElementsArray,
+  get _itemsByElement() { return this.ownerView._itemsByElement; },
 
   /**
    * Inserts this group in the parent container at the specified index.
@@ -549,19 +570,6 @@ function SideMenuItem(aGroup, aContents, aTooltip, aArrowFlag, aCheckboxFlag, aA
   this.window = aGroup.window;
   this.ownerView = aGroup;
 
-  let makeCheckbox = () => {
-    let checkbox = this.document.createElement("checkbox");
-    checkbox.className = "side-menu-widget-item-checkbox";
-    checkbox.setAttribute("checked", aAttachment.checkboxState);
-    checkbox.setAttribute("tooltiptext", aAttachment.checkboxTooltip);
-    checkbox.addEventListener("command", function () {
-      ViewHelpers.dispatchEvent(checkbox, "check", {
-        checked: checkbox.checked,
-      });
-    }, false);
-    return checkbox;
-  };
-
   if (aArrowFlag || aCheckboxFlag) {
     let container = this._container = this.document.createElement("hbox");
     container.className = "side-menu-widget-item";
@@ -573,7 +581,7 @@ function SideMenuItem(aGroup, aContents, aTooltip, aArrowFlag, aCheckboxFlag, aA
 
     // Show a checkbox before the content.
     if (aCheckboxFlag) {
-      let checkbox = this._checkbox = makeCheckbox();
+      let checkbox = this._checkbox = this._makeCheckbox(aAttachment);
       container.appendChild(checkbox);
     }
 
@@ -599,6 +607,36 @@ function SideMenuItem(aGroup, aContents, aTooltip, aArrowFlag, aCheckboxFlag, aA
 SideMenuItem.prototype = {
   get _orderedGroupElementsArray() this.ownerView._orderedGroupElementsArray,
   get _orderedMenuElementsArray() this.ownerView._orderedMenuElementsArray,
+  get _itemsByElement() { return this.ownerView._itemsByElement; },
+
+  /**
+   * Create the checkbox used when the checkbox flag is true. Emits a "check"
+   * event whenever the checkbox is checked or unchecked by the user.
+   *
+   * @param Object aAttachment
+   *        The attachment object. The following properties are used:
+   *          - checkboxState: true for checked, false for unchecked
+   8          - checkboxTooltip: The tooltip text of the checkbox
+   */
+  _makeCheckbox: function (aAttachment) {
+    let checkbox = this.document.createElement("checkbox");
+    checkbox.className = "side-menu-widget-item-checkbox";
+    checkbox.setAttribute("tooltiptext", aAttachment.checkboxTooltip);
+
+    if (aAttachment.checkboxState) {
+      checkbox.setAttribute("checked", true);
+    } else {
+      checkbox.removeAttribute("checked");
+    }
+
+    checkbox.addEventListener("command", function () {
+      ViewHelpers.dispatchEvent(checkbox, "check", {
+        checked: checkbox.checked,
+      });
+    }, false);
+
+    return checkbox;
+  },
 
   /**
    * Inserts this item in the parent group at the specified index.
@@ -619,10 +657,28 @@ SideMenuItem.prototype = {
       ownerList.appendChild(this._container);
       menuArray.push(this._target);
     }
+    this._itemsByElement.set(this._target, this);
 
     return this._target;
   },
 
+  /**
+   * Check or uncheck the checkbox associated with this item.
+   *
+   * @param boolean aCheckState
+   *        True to check, false to uncheck.
+   */
+  check: function(aCheckState) {
+    if (!this._checkbox) {
+      throw new Error("Cannot check items that do not have checkboxes.");
+    }
+    if (aCheckState) {
+      this._checkbox.setAttribute("checked", true);
+    } else {
+      this._checkbox.removeAttribute("checked");
+    }
+  },
+
   /**
    * Sets the contents displayed in this item's view.
    *
@@ -655,5 +711,6 @@ SideMenuItem.prototype = {
   ownerView: null,
   _target: null,
   _container: null,
+  _checkbox: null,
   _arrow: null
 };

browser/devtools/shared/widgets/ViewHelpers.jsm

@@ -1612,6 +1612,19 @@ this.WidgetMethods = {
     return +(aFirst._label.toLowerCase() > aSecond._label.toLowerCase());
   },
 
+  /**
+   * Call a method on this widget named `aMethodName`. Any further arguments are
+   * passed on to the method. Returns the result of the method call.
+   *
+   * @param String aMethodName
+   *        The name of the method you want to call.
+   * @param aArgs
+   *        Optional. Any arguments you want to pass through to the method.
+   */
+  callMethod: function(aMethodName, ...aArgs) {
+    return this._widget[aMethodName].apply(this._widget, aArgs);
+  },
+
   _widget: null,
   _preferredValue: null,
   _cachedCommandDispatcher: null