diff --git a/accessible/app.component.js b/accessible/app.component.js
index 6d37bb9e7..c69a54ae0 100644
--- a/accessible/app.component.js
+++ b/accessible/app.component.js
@@ -29,8 +29,10 @@ blocklyApp.AppComponent = ng.core.Component({
template: `
-
+
+
{{getAriaLiveReadout()}}
diff --git a/accessible/audio.service.js b/accessible/audio.service.js
index 3ffb22c62..2f3f00f0a 100644
--- a/accessible/audio.service.js
+++ b/accessible/audio.service.js
@@ -23,27 +23,38 @@
*/
blocklyApp.AudioService = ng.core.Class({
- constructor: [function() {
- // We do not play any audio unless a media path prefix is specified.
- this.canPlayAudio = false;
+ constructor: [
+ blocklyApp.NotificationsService, function(notificationsService) {
+ this.notificationsService = notificationsService;
- if (ACCESSIBLE_GLOBALS.hasOwnProperty('mediaPathPrefix')) {
- this.canPlayAudio = true;
- var mediaPathPrefix = ACCESSIBLE_GLOBALS['mediaPathPrefix'];
- this.AUDIO_PATHS_ = {
- 'connect': mediaPathPrefix + 'click.mp3',
- 'delete': mediaPathPrefix + 'delete.mp3',
- 'oops': mediaPathPrefix + 'oops.mp3'
- };
+ // 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'];
+ this.AUDIO_PATHS_ = {
+ 'connect': mediaPathPrefix + 'click.mp3',
+ 'delete': mediaPathPrefix + 'delete.mp3',
+ 'oops': mediaPathPrefix + 'oops.mp3'
+ };
+ }
+
+ this.cachedAudioFiles_ = {};
}
-
- this.cachedAudioFiles_ = {};
- }],
- play_: function(audioId) {
+ ],
+ play_: function(audioId, onEndedCallback) {
if (this.canPlayAudio) {
if (!this.cachedAudioFiles_.hasOwnProperty(audioId)) {
this.cachedAudioFiles_[audioId] = new Audio(this.AUDIO_PATHS_[audioId]);
}
+ if (onEndedCallback) {
+ this.cachedAudioFiles_[audioId].addEventListener(
+ 'ended', onEndedCallback);
+ } else {
+ this.cachedAudioFiles_[audioId].removeEventListener('ended');
+ }
+
this.cachedAudioFiles_[audioId].play();
}
},
@@ -53,7 +64,14 @@ blocklyApp.AudioService = ng.core.Class({
playDeleteSound: function() {
this.play_('delete');
},
- playOopsSound: function() {
- this.play_('oops');
+ playOopsSound: function(optionalStatusMessage) {
+ if (optionalStatusMessage) {
+ var that = this;
+ this.play_('oops', function() {
+ that.notificationsService.speak(optionalStatusMessage);
+ });
+ } else {
+ this.play_('oops');
+ }
}
});
diff --git a/accessible/notifications.service.js b/accessible/notifications.service.js
index 1e1b4805c..d16d765f4 100644
--- a/accessible/notifications.service.js
+++ b/accessible/notifications.service.js
@@ -53,6 +53,6 @@ blocklyApp.NotificationsService = ng.core.Class({
}, 20));
this.timeouts.push(setTimeout(function() {
that.setDisplayedMessage_('');
- }, 2000));
+ }, 5000));
}
});
diff --git a/accessible/tree.service.js b/accessible/tree.service.js
index c355ee108..6aee3ca51 100644
--- a/accessible/tree.service.js
+++ b/accessible/tree.service.js
@@ -493,8 +493,7 @@ blocklyApp.TreeService = ng.core.Class({
if (this.getParentListElement_(activeDesc)) {
statusMessage += ' Press left to go to parent list.';
}
- this.audioService.playOopsSound();
- this.notificationsService.speak(statusMessage);
+ this.audioService.playOopsSound(statusMessage);
}
} else if (e.keyCode == 39) {
// Right arrow key. Go down a level, if possible.
@@ -505,8 +504,7 @@ blocklyApp.TreeService = ng.core.Class({
if (nextSibling) {
this.setActiveDesc(nextSibling.id, treeId);
} else {
- this.audioService.playOopsSound();
- this.notificationsService.speak('Reached bottom of list.');
+ this.audioService.playOopsSound('Reached bottom of list.');
}
}
diff --git a/demos/accessible/index.html b/demos/accessible/index.html
index fde57ba8c..127628d41 100644
--- a/demos/accessible/index.html
+++ b/demos/accessible/index.html
@@ -19,8 +19,8 @@
-
+