Fixing modals so they're announced on focus, and changing variables t… (#1030)

* Fixing modals so they're announced on focus, and changing variables to only react to enter, not onChange.

* Adding a temp index.

* Whoops - added it in the wrong spot.

accessible/variable-remove-modal.component.js

@@ -43,10 +43,12 @@ blocklyApp.VariableRemoveModalComponent = ng.core.Component({
       <div id="varModal" class="blocklyModal" role="alertdialog"
            (click)="$event.stopPropagation()" tabindex="0"
            aria-labelledby="variableModalHeading">
+          <h3 id="variableModalHeading">
+            Delete {{getNumVariables()}} uses of the "{{currentVariableName}}"
+            variable?
+          </h3>
+
           <form id="varForm">
-            <p id="label">Remove {{count}} instances of
-              "{{currentVariableName}}" variable?
-            </p>
             <hr>
             <button id="yesButton" (click)="submit()">
               YES
@@ -83,7 +85,7 @@ blocklyApp.VariableRemoveModalComponent = ng.core.Component({
           Blockly.CommonModal.setupKeyboardOverrides(that);
 
           setTimeout(function() {
-            document.getElementById('label').focus();
+            document.getElementById('varModal').focus();
           }, 150);
         }
       );
@@ -101,6 +103,9 @@ blocklyApp.VariableRemoveModalComponent = ng.core.Component({
   getInteractiveContainer: function() {
     return document.getElementById("varForm");
   },
+  getNumVariables: function() {
+    return this.variableModalService.getNumVariables(this.currentVariableName);
+  },
   // Submits the name change for the variable.
   submit: function() {
     blocklyApp.workspace.deleteVariableInternal_(this.currentVariableName);