From 669f9fa7bf7950fdb9f6737e8b4dfceee2e42f2b Mon Sep 17 00:00:00 2001
From: Peter Piela <ppiela@cray.com>
Date: Thu, 23 Feb 2017 10:01:49 -0500
Subject: [PATCH] Fix Javascript unassignable errors

Replaced several instances of the action directive with HTML list-item/
anchor equivalents. Because the action uses two-way bound scope
variables for "callback" and "item" arguments you cannot specify a
literal value as an argument to the callback function. Two-way bound
variables must be assignable. In my mind there is some question as
to whether the action directive should have been implemented in this
way, but for now I am proposing to use an ng-click directive within
an anchor to implement callback functionality when a literal argument
is needed.

Change-Id: I2baf17c2784faeb92da362544c53e444e6d01afc
---
 .../ironic/maintenance/maintenance.service.js | 21 +++++-
 .../ironic/node-details/node-details.html     | 23 +++----
 .../node-details/sections/configuration.html  | 15 ++--
 .../admin/ironic/node-list/node-list.html     | 68 ++++++++++---------
 4 files changed, 75 insertions(+), 52 deletions(-)

diff --git a/ironic_ui/static/dashboard/admin/ironic/maintenance/maintenance.service.js b/ironic_ui/static/dashboard/admin/ironic/maintenance/maintenance.service.js
index 166ecbd8..3647d76f 100644
--- a/ironic_ui/static/dashboard/admin/ironic/maintenance/maintenance.service.js
+++ b/ironic_ui/static/dashboard/admin/ironic/maintenance/maintenance.service.js
@@ -36,13 +36,14 @@
 
   function maintenanceService($uibModal, basePath, nodeActions) {
     var service = {
-      putNodeInMaintenanceMode: putNodeInMaintenanceMode,
-      removeNodeFromMaintenanceMode: removeNodeFromMaintenanceMode
+      setMaintenance: setMaintenance
     };
     return service;
 
     /*
-     * @description Put a specified list of nodes into mainenance
+     * @description Put a specified list of nodes into mainenance.
+     * A modal dialog is used to prompt the user for a reason for
+     * putting the nodes in maintenance mode.
      *
      * @param {object[]} nodes - List of node objects
      * @return {promise}
@@ -66,5 +67,19 @@
     function removeNodeFromMaintenanceMode(nodes) {
       return nodeActions.removeNodeFromMaintenanceMode(nodes);
     }
+
+    /*
+     * @description Set the maintenance mode of a specified list of nodes
+     *
+     * @param {object[]} nodes - List of node objects
+     * @param {boolean} mode - Desired maintenance state.
+     *  'true' -> Node is in maintenance mode
+     *  'false' -> Node is not in maintenance mode
+     * @return {promise}
+    */
+    function setMaintenance(nodes, mode) {
+      return mode ? putNodeInMaintenanceMode(nodes)
+        : removeNodeFromMaintenanceMode(nodes);
+    }
   }
 })();
diff --git a/ironic_ui/static/dashboard/admin/ironic/node-details/node-details.html b/ironic_ui/static/dashboard/admin/ironic/node-details/node-details.html
index bacf7e98..c3121724 100644
--- a/ironic_ui/static/dashboard/admin/ironic/node-details/node-details.html
+++ b/ironic_ui/static/dashboard/admin/ironic/node-details/node-details.html
@@ -26,18 +26,17 @@
             <span>{$ transition.label $}</span>
           </a>
         </li>
-        <action button-type="menu-item"
-                callback="ctrl.maintenanceService.putNodeInMaintenanceMode"
-                item="[ctrl.node]"
-                disabled="ctrl.node.maintenance">
-          {$ ::'Maintenance on' | translate $}
-        </action>
-        <action button-type="menu-item"
-                callback="ctrl.maintenanceService.removeNodeFromMaintenanceMode"
-                item="[ctrl.node]"
-                disabled="!ctrl.node.maintenance">
-          {$ ::'Maintenance off' | translate $}
-        </action>
+        <li role="presentation">
+          <a role="menuitem"
+             ng-click="ctrl.maintenanceService.setMaintenance(
+                       [ctrl.node],
+                       !ctrl.node.maintenance);
+                       $event.stopPropagation();
+                       $event.preventDefault()">
+            <span>{$ ctrl.node.maintenance ?
+              "Maintenance off" : "Maintenance on" | translate $}</span>
+          </a>
+        </li>
         <li role="presentation"
             ng-repeat="transition in ctrl.nodeStateTransitions">
           <a role="menuitem"
diff --git a/ironic_ui/static/dashboard/admin/ironic/node-details/sections/configuration.html b/ironic_ui/static/dashboard/admin/ironic/node-details/sections/configuration.html
index dc67af90..af04f239 100644
--- a/ironic_ui/static/dashboard/admin/ironic/node-details/sections/configuration.html
+++ b/ironic_ui/static/dashboard/admin/ironic/node-details/sections/configuration.html
@@ -98,12 +98,15 @@
                 {$ ::'Edit port' | translate $}
               </action>
               <menu>
-                <action button-type="menu-item"
-                        callback="ctrl.deletePort"
-                        item="[port]">
-                  <span class="fa fa-trash"></span>
-                  {$ ::'Delete port' | translate $}
-                </action>
+                <li role="presentation">
+                  <a role="menuitem"
+                     ng-click="ctrl.deletePort([port]);
+                               $event.stopPropagation();
+                               $event.preventDefault()">
+                    <span class="fa fa-trash"></span>
+                    <span>{$ :: 'Delete port' | translate $}</span>
+                  </a>
+                </li>
               </menu>
             </action-list>
           </td>
diff --git a/ironic_ui/static/dashboard/admin/ironic/node-list/node-list.html b/ironic_ui/static/dashboard/admin/ironic/node-list/node-list.html
index 2060dcc5..c0edced4 100644
--- a/ironic_ui/static/dashboard/admin/ironic/node-list/node-list.html
+++ b/ironic_ui/static/dashboard/admin/ironic/node-list/node-list.html
@@ -49,18 +49,18 @@
                       <span>{$ transition.label $}</span>
                     </a>
                   </li>
-                  <action button-type="menu-item"
-                          callback="table.maintenanceService.putNodeInMaintenanceMode"
-                          item="tCtrl.selected"
-                          disabled="tCtrl.selected.length === 0">
-                    {$ ::'Maintenance on' | translate $}
-                  </action>
-                  <action button-type="menu-item"
-                          callback="table.maintenanceService.removeNodeFromMaintenanceMode"
-                          item="tCtrl.selected"
-                          disabled="tCtrl.selected.length === 0">
-                    {$ ::'Maintenance off' | translate $}
-                  </action>
+                  <li role="presentation"
+                      ng-class="{disabled: tCtrl.selected.length === 0}"
+                      ng-repeat="mode in [true, false]">
+                    <a role="menuitem"
+                       ng-click="table.maintenanceService.setMaintenance(
+                                 tCtrl.selected,
+                                 mode);
+                                 $event.stopPropagation();
+                                 $event.preventDefault()">
+                      <span>{$ mode ? 'Maintenance on' : 'Maintenance off' | translate $}</span>
+                    </a>
+                  </li>
                 </menu>
               </action-list>
             </div>
@@ -152,25 +152,31 @@
                     <span>{$ transition.label $}</span>
                   </a>
                 </li>
-                <action button-type="menu-item"
-                        callback="table.maintenanceService.putNodeInMaintenanceMode"
-                        item="[node]"
-                        disabled="node.maintenance">
-                  {$ ::'Maintenance on' | translate $}
-                </action>
-                <action button-type="menu-item"
-                        callback="table.maintenanceService.removeNodeFromMaintenanceMode"
-                        item="[node]"
-                        disabled="!node.maintenance">
-                  {$ ::'Maintenance off' | translate $}
-                </action>
-                <action button-type="menu-item"
-                        callback="table.deleteNode"
-                        disabled="!(node.provision_state === 'available' || node.provision_state === 'nostate' || node.provision_state === 'manageable' || node.provision_state === 'enroll')"
-                        item="[node]">
-                  <span class="fa fa-trash"></span>
-                  {$ ::'Delete node' | translate $}
-                </action>
+                <li role="presentation">
+                  <a role="menuitem"
+                     ng-click="table.maintenanceService.setMaintenance(
+                               [node],
+                               !node.maintenance);
+                               $event.stopPropagation();
+                               $event.preventDefault()">
+                    <span>{$ node.maintenance ?
+                      "Maintenance off" : "Maintenance on" | translate $}</span>
+                  </a>
+                </li>
+                <li role="presentation"
+                    ng-class="{disabled: !(
+                              node.provision_state === 'available' ||
+                              node.provision_state === 'nostate' ||
+                              node.provision_state === 'manageable' ||
+                              node.provision_state === 'enroll')}">
+                  <a role="menuitem"
+                     ng-click="table.deleteNode([node]);
+                               $event.stopPropagation();
+                               $event.preventDefault()">
+                    <span class="fa fa-trash"></span>
+                    {$ ::'Delete node' | translate $}
+                  </a>
+                </li>
                 <action button-type="menu-item"
                         callback="table.createPort"
                         item="node">