From 65bad28f61fc7fcc0a267964977e3eb4ebcf4314 Mon Sep 17 00:00:00 2001
From: Sean Lip <sll@google.com>
Date: Tue, 29 Nov 2016 18:50:31 -0800
Subject: [PATCH] Minor refactoring. Remove unused dependencies.

---
 accessible/app.component.js            | 41 +++++++++++++++-----------
 accessible/audio.service.js            |  7 ++---
 accessible/clipboard.service.js        |  4 +--
 accessible/field-segment.component.js  |  4 +--
 accessible/keyboard-input.service.js   |  9 +++---
 accessible/notifications.service.js    | 29 ++++++++++--------
 accessible/toolbox-modal.component.js  |  6 ++--
 accessible/toolbox-modal.service.js    |  4 +--
 accessible/tree.service.js             | 21 +++++++------
 accessible/workspace-tree.component.js | 10 +++----
 10 files changed, 69 insertions(+), 66 deletions(-)

diff --git a/accessible/app.component.js b/accessible/app.component.js
index 370599c29..b57ec4aa9 100644
--- a/accessible/app.component.js
+++ b/accessible/app.component.js
@@ -27,38 +27,43 @@ blocklyApp.workspace = new Blockly.Workspace();
 blocklyApp.AppComponent = ng.core.Component({
   selector: 'blockly-app',
   template: `
-    <div>
-      <blockly-workspace></blockly-workspace>
-      <blockly-sidebar></blockly-sidebar>
-    </div>
-
-    <div *ngIf="getAriaLiveReadout()" aria-hidden="true"
-         class="blocklyAriaLiveStatus">
+    <blockly-workspace></blockly-workspace>
+    <blockly-sidebar></blockly-sidebar>
+    <div *ngIf="getAriaLiveReadout()" class="blocklyAriaLiveStatus"
+         aria-hidden="true">
       <span aria-live="polite" role="status">{{getAriaLiveReadout()}}</span>
     </div>
 
     <blockly-block-options-modal></blockly-block-options-modal>
     <blockly-toolbox-modal></blockly-toolbox-modal>
 
-    <label aria-hidden="true" hidden id="blockly-button">
+    <label id="blockly-translate-button" aria-hidden="true" hidden>
       {{'BUTTON'|translate}}
     </label>
-    <label aria-hidden="true" hidden id="blockly-workspace-block">
+    <label id="blockly-translate-workspace-block" aria-hidden="true" hidden>
       {{'WORKSPACE_BLOCK'|translate}}
     </label>
   `,
   directives: [
-      blocklyApp.BlockOptionsModalComponent, blocklyApp.SidebarComponent,
-      blocklyApp.ToolboxModalComponent, blocklyApp.WorkspaceComponent],
+    blocklyApp.BlockOptionsModalComponent,
+    blocklyApp.SidebarComponent,
+    blocklyApp.ToolboxModalComponent,
+    blocklyApp.WorkspaceComponent
+  ],
   pipes: [blocklyApp.TranslatePipe],
-  // All services are declared here, so that all components in the
-  // application use the same instance of the service.
+  // All services are declared here, so that all components in the application
+  // use the same instance of the service.
   // https://www.sitepoint.com/angular-2-components-providers-classes-factories-values/
   providers: [
-      blocklyApp.AudioService, blocklyApp.BlockOptionsModalService,
-      blocklyApp.ClipboardService, blocklyApp.KeyboardInputService,
-      blocklyApp.NotificationsService, blocklyApp.ToolboxModalService,
-      blocklyApp.TreeService, blocklyApp.UtilsService]
+    blocklyApp.AudioService,
+    blocklyApp.BlockOptionsModalService,
+    blocklyApp.ClipboardService,
+    blocklyApp.KeyboardInputService,
+    blocklyApp.NotificationsService,
+    blocklyApp.ToolboxModalService,
+    blocklyApp.TreeService,
+    blocklyApp.UtilsService
+  ]
 })
 .Class({
   constructor: [
@@ -67,6 +72,6 @@ blocklyApp.AppComponent = ng.core.Component({
     }
   ],
   getAriaLiveReadout: function() {
-    return this.notificationsService.getAriaLiveReadout();
+    return this.notificationsService.getDisplayedMessage();
   }
 });
diff --git a/accessible/audio.service.js b/accessible/audio.service.js
index 3bf51408e..3ffb22c62 100644
--- a/accessible/audio.service.js
+++ b/accessible/audio.service.js
@@ -18,7 +18,7 @@
  */
 
 /**
- * @fileoverview Angular2 Service that plays audio files.
+ * @fileoverview Angular2 Service for playing audio files.
  * @author sll@google.com (Sean Lip)
  */
 
@@ -26,6 +26,7 @@ blocklyApp.AudioService = ng.core.Class({
   constructor: [function() {
     // We do not play any audio unless a media path prefix is specified.
     this.canPlayAudio = false;
+
     if (ACCESSIBLE_GLOBALS.hasOwnProperty('mediaPathPrefix')) {
       this.canPlayAudio = true;
       var mediaPathPrefix = ACCESSIBLE_GLOBALS['mediaPathPrefix'];
@@ -36,14 +37,12 @@ blocklyApp.AudioService = ng.core.Class({
       };
     }
 
-    // TODO(sll): Add ogg and mp3 fallbacks.
     this.cachedAudioFiles_ = {};
   }],
   play_: function(audioId) {
     if (this.canPlayAudio) {
       if (!this.cachedAudioFiles_.hasOwnProperty(audioId)) {
-        this.cachedAudioFiles_[audioId] = new Audio(
-            this.AUDIO_PATHS_[audioId]);
+        this.cachedAudioFiles_[audioId] = new Audio(this.AUDIO_PATHS_[audioId]);
       }
       this.cachedAudioFiles_[audioId].play();
     }
diff --git a/accessible/clipboard.service.js b/accessible/clipboard.service.js
index 822b9e465..dc3853832 100644
--- a/accessible/clipboard.service.js
+++ b/accessible/clipboard.service.js
@@ -100,7 +100,7 @@ blocklyApp.ClipboardService = ng.core.Class({
   },
   markConnection: function(connection) {
     this.markedConnection_ = connection;
-    this.notificationsService.setAriaLiveReadout(Blockly.Msg.ADDED_LINK_MSG);
+    this.notificationsService.speak(Blockly.Msg.ADDED_LINK_MSG);
   },
   cut: function(block) {
     this.copy(block);
@@ -139,7 +139,7 @@ blocklyApp.ClipboardService = ng.core.Class({
         connection.connect(reconstitutedBlock.outputConnection);
     }
     this.audioService.playConnectSound();
-    this.notificationsService.setAriaLiveReadout(
+    this.notificationsService.speak(
         this.utilsService.getBlockDescription(reconstitutedBlock) + ' ' +
         Blockly.Msg.PASTED_BLOCK_FROM_CLIPBOARD_MSG);
     return reconstitutedBlock.id;
diff --git a/accessible/field-segment.component.js b/accessible/field-segment.component.js
index a6fc80ae0..0857c59e2 100644
--- a/accessible/field-segment.component.js
+++ b/accessible/field-segment.component.js
@@ -54,7 +54,7 @@ blocklyApp.FieldSegmentComponent = ng.core.Component({
       </label>
       <ol role="group">
         <li [id]="idMap[optionValue]" role="treeitem" *ngFor="#optionValue of getOptions()"
-            [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap[optionValue + 'Button'], 'blockly-button')"
+            [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap[optionValue + 'Button'], 'blockly-translate-button')"
             [attr.aria-level]="level" [attr.aria-selected]="mainField.getValue() == optionValue"
             class="blocklyDropdownListItem">
           <button [id]="idMap[optionValue + 'Button']" (click)="handleDropdownChange(mainField, optionValue)"
@@ -160,7 +160,7 @@ blocklyApp.FieldSegmentComponent = ng.core.Component({
       this.mainField.setValue(optionValue);
     }
 
-    this.notificationsService.setAriaLiveReadout(
+    this.notificationsService.speak(
         'Selected option ' + this.optionText[optionValue]);
   }
 });
diff --git a/accessible/keyboard-input.service.js b/accessible/keyboard-input.service.js
index ef2d68add..3af10cca9 100644
--- a/accessible/keyboard-input.service.js
+++ b/accessible/keyboard-input.service.js
@@ -18,15 +18,15 @@
  */
 
 /**
- * @fileoverview Angular2 Service that handles keyboard input.
+ * @fileoverview Angular2 Service for handling keyboard input.
  *
  * @author sll@google.com (Sean Lip)
  */
 
 blocklyApp.KeyboardInputService = ng.core.Class({
   constructor: [function() {
-    // Default custom actions for global keystrokes. The keys are string
-    // representations of the key codes.
+    // Default custom actions for global keystrokes. The keys of this object
+    // are string representations of the key codes.
     this.keysToActions = {};
     // Override for the default keysToActions mapping (e.g. in a modal
     // context).
@@ -34,13 +34,12 @@ blocklyApp.KeyboardInputService = ng.core.Class({
 
     // Attach a keydown handler to the entire window.
     var that = this;
-
     document.addEventListener('keydown', function(evt) {
       var stringifiedKeycode = String(evt.keyCode);
       var actionsObject = that.keysToActionsOverride || that.keysToActions;
 
       if (actionsObject.hasOwnProperty(stringifiedKeycode)) {
-        that.keysToActionsOverride[stringifiedKeycode](evt);
+        actionsObject[stringifiedKeycode](evt);
       }
     });
   }],
diff --git a/accessible/notifications.service.js b/accessible/notifications.service.js
index a239ffb01..1e1b4805c 100644
--- a/accessible/notifications.service.js
+++ b/accessible/notifications.service.js
@@ -18,36 +18,41 @@
  */
 
 /**
- * @fileoverview Angular2 Service that notifies the user about actions that
- * they have taken, by updating an ARIA live region.
+ * @fileoverview Angular2 Service for updating the ARIA live region that
+ * allows screenreaders to notify the user about actions that they have taken.
  * @author sll@google.com (Sean Lip)
  */
 
 blocklyApp.NotificationsService = ng.core.Class({
   constructor: [function() {
-    this.statusMessage_ = '';
+    this.currentMessage = '';
     this.timeouts = [];
   }],
-  getAriaLiveReadout: function() {
-    return this.statusMessage_;
+  setDisplayedMessage_: function(newMessage) {
+    this.currentMessage = newMessage;
   },
-  setAriaLiveReadout: function(newMessage) {
-    // Introduce a temporary status message, so that if, e.g., two "copy"
-    // operations are done in succession, both messages will be read.
-    this.statusMessage_ = '';
-    // Clear all existing timeouts.
+  getDisplayedMessage: function() {
+    return this.currentMessage;
+  },
+  speak: function(newMessage) {
+    // Clear and reset any existing timeouts.
     this.timeouts.forEach(function(timeout) {
       clearTimeout(timeout);
     });
+    this.timeouts.length = 0;
+
+    // Clear the current message, so that if, e.g., two operations of the same
+    // type are performed, both messages will be read in succession.
+    this.setDisplayedMessage_('');
 
     // We need a non-zero timeout here, otherwise NVDA does not read the
     // notification messages properly.
     var that = this;
     this.timeouts.push(setTimeout(function() {
-      that.statusMessage_ = newMessage;
+      that.setDisplayedMessage_(newMessage);
     }, 20));
     this.timeouts.push(setTimeout(function() {
-      that.statusMessage_ = '';
+      that.setDisplayedMessage_('');
     }, 2000));
   }
 });
diff --git a/accessible/toolbox-modal.component.js b/accessible/toolbox-modal.component.js
index af0b8f176..1d4f404dd 100644
--- a/accessible/toolbox-modal.component.js
+++ b/accessible/toolbox-modal.component.js
@@ -61,16 +61,14 @@ blocklyApp.ToolboxModalComponent = ng.core.Component({
   constructor: [
     blocklyApp.ToolboxModalService, blocklyApp.KeyboardInputService,
     blocklyApp.AudioService, blocklyApp.UtilsService, blocklyApp.TreeService,
-    blocklyApp.NotificationsService,
     function(
-        toolboxModalService_, keyboardInputService_,
-        audioService_, utilsService_, treeService_, notificationsService_) {
+        toolboxModalService_, keyboardInputService_, audioService_,
+        utilsService_, treeService_) {
       this.toolboxModalService = toolboxModalService_;
       this.keyboardInputService = keyboardInputService_;
       this.audioService = audioService_;
       this.utilsService = utilsService_;
       this.treeService = treeService_;
-      this.notificationsService = notificationsService_;
 
       this.modalIsVisible = false;
       this.toolboxCategories = [];
diff --git a/accessible/toolbox-modal.service.js b/accessible/toolbox-modal.service.js
index 011fb3b1c..126c01ef7 100644
--- a/accessible/toolbox-modal.service.js
+++ b/accessible/toolbox-modal.service.js
@@ -143,7 +143,7 @@ blocklyApp.ToolboxModalService = ng.core.Class({
           that.treeService.initActiveDesc(oldDestinationTreeId);
         }
 
-        that.notificationsService.setAriaLiveReadout(
+        that.notificationsService.speak(
             'Attached. Now on, ' + blockDescription + ', block in workspace.');
       });
     }, function() {
@@ -159,7 +159,7 @@ blocklyApp.ToolboxModalService = ng.core.Class({
 
       setTimeout(function() {
         that.treeService.focusOnBlock(newBlockId);
-        that.notificationsService.setAriaLiveReadout(
+        that.notificationsService.speak(
             'Created new group in workspace. Now on, ' + blockDescription +
             ', block in workspace.');
       });
diff --git a/accessible/tree.service.js b/accessible/tree.service.js
index 3f49b12c2..ae6b2aae2 100644
--- a/accessible/tree.service.js
+++ b/accessible/tree.service.js
@@ -212,7 +212,7 @@ blocklyApp.TreeService = ng.core.Class({
     for (var i = 0; i < workspaceFocusTargets.length; i++) {
       if (workspaceFocusTargets[i].tagName == 'OL' &&
           workspaceFocusTargets[i].id == treeId) {
-        this.notificationsService.setAriaLiveReadout(
+        this.notificationsService.speak(
             'Now in workspace group ' + (i + 1) + ' of ' +
             workspaceFocusTargets.length);
       }
@@ -276,10 +276,10 @@ blocklyApp.TreeService = ng.core.Class({
 
     setTimeout(function() {
       if (that.utilsService.isWorkspaceEmpty()) {
-        that.notificationsService.setAriaLiveReadout(
+        that.notificationsService.speak(
             blockDescription + ' cut. Workspace is empty.');
       } else {
-        that.notificationsService.setAriaLiveReadout(
+        that.notificationsService.speak(
             blockDescription + ' cut. Now on workspace.');
       }
     });
@@ -287,7 +287,7 @@ blocklyApp.TreeService = ng.core.Class({
   copyBlock_: function(block) {
     var blockDescription = this.utilsService.getBlockDescription(block);
     this.clipboardService.copy(block);
-    this.notificationsService.setAriaLiveReadout(
+    this.notificationsService.speak(
         blockDescription + ' ' + Blockly.Msg.COPIED_BLOCK_MSG);
   },
   pasteToConnection: function(block, connection) {
@@ -360,7 +360,7 @@ blocklyApp.TreeService = ng.core.Class({
               that.initActiveDesc(oldDestinationTreeId);
             }
 
-            that.notificationsService.setAriaLiveReadout(
+            that.notificationsService.speak(
                 blockDescription + ' ' +
                 Blockly.Msg.ATTACHED_BLOCK_TO_LINK_MSG +
                 '. Now on attached block in workspace.');
@@ -381,10 +381,10 @@ blocklyApp.TreeService = ng.core.Class({
 
         setTimeout(function() {
           if (that.utilsService.isWorkspaceEmpty()) {
-            that.notificationsService.setAriaLiveReadout(
+            that.notificationsService.speak(
                 blockDescription + ' deleted. Workspace is empty.');
           } else {
-            that.notificationsService.setAriaLiveReadout(
+            that.notificationsService.speak(
                 blockDescription + ' deleted. Now on workspace.');
           }
         });
@@ -493,7 +493,7 @@ blocklyApp.TreeService = ng.core.Class({
           } else if (currentNode.tagName == 'INPUT') {
             currentNode.focus();
             currentNode.select();
-            this.notificationsService.setAriaLiveReadout(
+            this.notificationsService.speak(
               'Type a value, then press Escape to exit');
             found = true;
             break;
@@ -557,7 +557,7 @@ blocklyApp.TreeService = ng.core.Class({
               statusMessage += ' Press left to go to parent list.';
             }
             this.audioService.playOopsSound();
-            this.notificationsService.setAriaLiveReadout(statusMessage);
+            this.notificationsService.speak(statusMessage);
           }
         } else if (e.keyCode == 39) {
           // Right arrow key. Go down a level, if possible.
@@ -569,8 +569,7 @@ blocklyApp.TreeService = ng.core.Class({
             this.setActiveDesc(nextSibling.id, treeId);
           } else {
             this.audioService.playOopsSound();
-            this.notificationsService.setAriaLiveReadout(
-                'Reached bottom of list.');
+            this.notificationsService.speak('Reached bottom of list.');
           }
         }
 
diff --git a/accessible/workspace-tree.component.js b/accessible/workspace-tree.component.js
index 76d040281..ff99a1a17 100644
--- a/accessible/workspace-tree.component.js
+++ b/accessible/workspace-tree.component.js
@@ -28,7 +28,7 @@ blocklyApp.WorkspaceTreeComponent = ng.core.Component({
   selector: 'blockly-workspace-tree',
   template: `
   <li [id]="idMap['blockRoot']" role="treeitem" class="blocklyHasChildren"
-      [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['blockSummary'], 'blockly-workspace-block')"
+      [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['blockSummary'], 'blockly-translate-workspace-block')"
       [attr.aria-level]="level">
     <label [id]="idMap['blockSummary']">{{getBlockDescription()}}</label>
 
@@ -78,13 +78,11 @@ blocklyApp.WorkspaceTreeComponent = ng.core.Component({
 })
 .Class({
   constructor: [
-      blocklyApp.ClipboardService, blocklyApp.NotificationsService,
-      blocklyApp.TreeService, blocklyApp.UtilsService, blocklyApp.AudioService,
+      blocklyApp.ClipboardService, blocklyApp.TreeService,
+      blocklyApp.UtilsService, blocklyApp.AudioService,
       function(
-          _clipboardService, _notificationsService, _treeService,
-          _utilsService, _audioService) {
+          _clipboardService, _treeService, _utilsService, _audioService) {
     this.clipboardService = _clipboardService;
-    this.notificationsService = _notificationsService;
     this.treeService = _treeService;
     this.utilsService = _utilsService;
     this.audioService = _audioService;