CodingPirates/blockly
1
0
Fork 0
mirror of https://github.com/google/blockly.git synced 2026-01-07 00:50:27 +01:00
Code Issues Packages Projects Releases Wiki Activity

Remove premature focus on buttons in modal dialogs, since this prevents readout of the dialog text.

Browse Source
This commit is contained in:
Sean Lip
2016-12-05 18:12:48 -08:00
parent 2a172c761c
commit 09980308ec
2 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
accessible/block-options-modal.component.js
View File

@@ -26,22 +26,26 @@
blocklyApp.BlockOptionsModalComponent = ng.core.Component({
selector: 'blockly-block-options-modal',
template: `
<div *ngIf="modalIsVisible" id="blockOptionsModal" role="dialog" tabindex="-1">
<div (click)="hideModal()" class="blocklyModalCurtain">
<!-- The $event.stopPropagation() here prevents the modal from
closing when its interior is clicked. -->
<div class="blocklyModal" (click)="$event.stopPropagation()" role="document">
<div *ngIf="modalIsVisible" class="blocklyModalCurtain"
(click)="hideModal()">
<!-- $event.stopPropagation() prevents the modal from closing when its
interior is clicked. -->
<div id="blockOptionsModal" class="blocklyModal" role="dialog"
(click)="$event.stopPropagation()" tabindex="-1">
<div role="document">
<h3>{{'BLOCK_OPTIONS'|translate}}</h3>
<div class="blocklyModalButtonContainer"
*ngFor="#buttonInfo of actionButtonsInfo; #i=index">
<button [id]="getOptionId(i)" (click)="buttonInfo.action(); hideModal();"
<button [id]="getOptionId(i)"
(click)="buttonInfo.action(); hideModal();"
[ngClass]="{activeButton: activeActionButtonIndex == i}">
{{buttonInfo.translationIdForText|translate}}
</button>
</div>
<div class="blocklyModalButtonContainer">
<button [id]="getCancelOptionId()" (click)="hideModal()"
<button [id]="getCancelOptionId()"
(click)="hideModal()"
[ngClass]="{activeButton: activeActionButtonIndex == actionButtonsInfo.length}">
{{'CANCEL'|translate}}
</button>
@@ -129,7 +133,6 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({
setTimeout(function() {
document.getElementById('blockOptionsModal').focus();
that.focusOnOption(that.activeActionButtonIndex);
}, 150);
}
);

13
accessible/toolbox-modal.component.js
View File

@@ -26,11 +26,13 @@
blocklyApp.ToolboxModalComponent = ng.core.Component({
selector: 'blockly-toolbox-modal',
template: `
<div *ngIf="modalIsVisible" id="toolboxModal" role="dialog" tabindex="-1">
<div (click)="dismissModal()" class="blocklyModalCurtain">
<!-- The $event.stopPropagation() here prevents the modal from
closing when its interior is clicked. -->
<div class="blocklyModal" (click)="$event.stopPropagation()" role="document">
<div *ngIf="modalIsVisible" class="blocklyModalCurtain"
(click)="dismissModal()">
<!-- $event.stopPropagation() prevents the modal from closing when its
interior is clicked. -->
<div id="toolboxModal" class="blocklyModal" role="dialog"
(click)="$event.stopPropagation()" tabindex="-1">
<div role="document">
<h3>{{'SELECT_A_BLOCK'|translate}}</h3>
<div *ngFor="#toolboxCategory of toolboxCategories; #categoryIndex=index">
@@ -157,7 +159,6 @@ blocklyApp.ToolboxModalComponent = ng.core.Component({
setTimeout(function() {
document.getElementById('toolboxModal').focus();
that.focusOnOption(that.activeButtonIndex);
}, 150);
}
);