From 83759dbbeeffadde2548ce6e3ebf2c62f2e86678 Mon Sep 17 00:00:00 2001
From: Sean Lip <sll@google.com>
Date: Fri, 22 Jul 2016 14:55:22 -0700
Subject: [PATCH] Declare field buttons declaratively.

---
 accessible/workspace-tree.component.js | 35 ++++++++++++++++++--------
 1 file changed, 25 insertions(+), 10 deletions(-)

diff --git a/accessible/workspace-tree.component.js b/accessible/workspace-tree.component.js
index 6c11b0c47..996117d36 100644
--- a/accessible/workspace-tree.component.js
+++ b/accessible/workspace-tree.component.js
@@ -63,17 +63,11 @@ blocklyApp.WorkspaceTreeComponent = ng.core
             <!-- TODO(madeeha): i18n here will need to happen in a different way due to the way grammar changes based on language. -->
             <label [id]="idMap['inputMenuLabel' + i]"> {{utilsService.getInputTypeLabel(inputBlock.connection)}} {{utilsService.getBlockTypeLabel(inputBlock)}} needed: </label>
             <ol role="group">
-              <li [id]="idMap['markSpot' + i]" role="treeitem"
-                  [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markButton' + i], 'blockly-button')"
+              <li [id]="idMap['markSpot' + i]" role="treeitem" *ngFor="#fieldButtonInfo of fieldButtonsInfo"
+                  [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap[fieldButtonInfo.baseIdKey + 'Button'], 'blockly-button', fieldButtonInfo.isDisabled(inputBlock.connection))"
                   [attr.aria-level]="level + 2" aria-selected="false">
-                <button [id]="idMap['markSpotButton + i']" (click)="clipboardService.markConnection(inputBlock.connection)">{{'MARK_THIS_SPOT'|translate}}</button>
-              </li>
-              <li [id]="idMap['paste' + i]" role="treeitem"
-                  [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteButton' + i], 'blockly-button', !isCompatibleWithClipboard(inputBlock.connection))"
-                  [attr.aria-level]="level + 2" aria-selected="false">
-                <button [id]="idMap['pasteButton' + i]" (click)="clipboardService.pasteFromClipboard(inputBlock.connection)"
-                        [disabled]="!isCompatibleWithClipboard(inputBlock.connection)">
-                  {{'PASTE'|translate}}
+                <button [id]="idMap[fieldButtonInfo.baseIdKey + 'Button']" (click)="fieldButtonInfo.action(inputBlock.connection)">
+                  {{fieldButtonInfo.translationIdForText|translate}}
                 </button>
               </li>
             </ol>
@@ -271,6 +265,27 @@ blocklyApp.WorkspaceTreeComponent = ng.core
         }
       }];
 
+      // Generate a list of action buttons.
+      this.fieldButtonsInfo = [{
+        baseIdKey: 'markSpot',
+        translationIdForText: 'MARK_THIS_SPOT',
+        action: function(connection) {
+          that.clipboardService.markConnection(connection);
+        },
+        isDisabled: function() {
+          return false;
+        }
+      }, {
+        baseIdKey: 'paste',
+        translationIdForText: 'PASTE',
+        action: function(connection) {
+          that.clipboardService.pasteFromClipboard(connection);
+        },
+        isDisabled: function(connection) {
+          return !that.isCompatibleWithClipboard(connection);
+        }
+      }];
+
       // Make a list of all the id keys.
       this.idKeys = ['blockRoot', 'blockSummary', 'listItem', 'label'];
       this.actionButtonsInfo.forEach(function(buttonInfo) {