Add new fields to toolbarButtonConfig.

accessible/README

@@ -33,20 +33,23 @@ To customize the toolbar, you will need to declare an ACCESSIBLE_GLOBALS object
 in the global scope that looks like this:
 
     var ACCESSIBLE_GLOBALS = {
-      toolbarButtonConfig: [],
-      mediaPathPrefix: null
+      mediaPathPrefix: null,
+      toolbarButtonConfig: []
     };
 
-The value corresponding to 'toolbarButtonConfig' can be modified by adding
-objects representing buttons on the toolbar. Each of these objects should have
-two keys:
+The value of mediaPathPrefix should be the location of the accessible/media
+folder.
+
+The value of 'toolbarButtonConfig' should be a list of objects, each
+representing buttons on the toolbar. Each of these objects should have four
+keys:
 
   - 'text' (the text to display on the button)
+  - 'ariaDescribedBy' (the value of the button's aria-describedby attribute)
+  - 'isHidden' (a function that returns true if the button should not be
+        displayed, and false otherwise)
   - 'action' (the function that gets run when the button is clicked)
 
-In addition, if you want audio to be played, set mediaPathPrefix to the
-location of the accessible/media folder.
-
 
 Limitations
 -----------

accessible/workspace.component.js

@@ -45,7 +45,9 @@ blocklyApp.WorkspaceComponent = ng.core
     <div class="blocklyToolbarColumn">
       <div id="blockly-workspace-toolbar" (keydown)="onWorkspaceToolbarKeypress($event)">
         <span *ngFor="#buttonConfig of toolbarButtonConfig">
-          <button (click)="buttonConfig.action()"
+          <button *ngIf="!buttonConfig.isHidden()"
+                  (click)="buttonConfig.action()"
+                  [attr.aria-describedby]="buttonConfig.ariaDescribedBy"
                   class="blocklyTree blocklyWorkspaceToolbarButton">
             {{buttonConfig.text}}
           </button>

demos/accessible/index.html

@@ -71,11 +71,11 @@
 
   <script>
     var ACCESSIBLE_GLOBALS = {
+      // Prefix of path to sound files.
+      mediaPathPrefix: '../../accessible/media/',
       // Additional buttons for the workspace toolbar that
       // go before the "Clear Workspace" button.
-      toolbarButtonConfig: [],
-      // Prefix of path to sound files.
-      mediaPathPrefix: '../../accessible/media/'
+      toolbarButtonConfig: []
     };
     document.addEventListener('DOMContentLoaded', function() {
       ng.platform.browser.bootstrap(blocklyApp.AppView);