diff --git a/accessible/app.component.js b/accessible/app.component.js
index 9b453bfa4..fd25c5d8f 100644
--- a/accessible/app.component.js
+++ b/accessible/app.component.js
@@ -18,8 +18,7 @@
*/
/**
- * @fileoverview Angular2 Component that details how the AccessibleBlockly
- * app is rendered on the page.
+ * @fileoverview Top-level component for the Accessible Blockly application.
* @author madeeha@google.com (Madeeha Ghori)
*/
@@ -28,42 +27,46 @@ blocklyApp.workspace = new Blockly.Workspace();
blocklyApp.AppView = ng.core.Component({
selector: 'blockly-app',
template: `
-
- {{getStatusMessage()}}
-
+
+
+
+
-
-
+
+ {{getAriaLiveReadout()}}
+
-
-
-
-
+
+
-
-
-
+
+
`,
directives: [
- blocklyApp.WorkspaceComponent, blocklyApp.BlockOptionsModalComponent,
- blocklyApp.SidebarComponent, blocklyApp.ToolboxModalComponent],
+ 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.
// https://www.sitepoint.com/angular-2-components-providers-classes-factories-values/
providers: [
- blocklyApp.ClipboardService, blocklyApp.NotificationsService,
- blocklyApp.TreeService, blocklyApp.UtilsService,
blocklyApp.AudioService, blocklyApp.BlockOptionsModalService,
- blocklyApp.KeyboardInputService, blocklyApp.ToolboxModalService]
+ blocklyApp.ClipboardService, blocklyApp.KeyboardInputService,
+ blocklyApp.NotificationsService, blocklyApp.ToolboxModalService,
+ blocklyApp.TreeService, blocklyApp.UtilsService]
})
.Class({
constructor: [
- blocklyApp.NotificationsService, function(_notificationsService) {
- this.notificationsService = _notificationsService;
+ blocklyApp.NotificationsService, function(notificationsService) {
+ this.notificationsService = notificationsService;
}
],
- getStatusMessage: function() {
- return this.notificationsService.getStatusMessage();
+ getAriaLiveReadout: function() {
+ return this.notificationsService.getAriaLiveReadout();
}
});
diff --git a/accessible/block-options-modal.component.js b/accessible/block-options-modal.component.js
index 6867844da..265c748a3 100644
--- a/accessible/block-options-modal.component.js
+++ b/accessible/block-options-modal.component.js
@@ -31,7 +31,7 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({
-
Block Options
+
{{'BLOCK_OPTIONS'|translate}}
diff --git a/accessible/clipboard.service.js b/accessible/clipboard.service.js
index da3281cd8..822b9e465 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.setStatusMessage(Blockly.Msg.MARKED_SPOT_MSG);
+ this.notificationsService.setAriaLiveReadout(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.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
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 1fcd3b0a8..a6fc80ae0 100644
--- a/accessible/field-segment.component.js
+++ b/accessible/field-segment.component.js
@@ -160,7 +160,7 @@ blocklyApp.FieldSegmentComponent = ng.core.Component({
this.mainField.setValue(optionValue);
}
- this.notificationsService.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
'Selected option ' + this.optionText[optionValue]);
}
});
diff --git a/accessible/messages.js b/accessible/messages.js
index 4fe8e6b8a..a9db4a423 100644
--- a/accessible/messages.js
+++ b/accessible/messages.js
@@ -28,21 +28,23 @@ Blockly.Msg.WORKSPACE = 'Workspace';
Blockly.Msg.WORKSPACE_BLOCK =
'workspace block. Move right to edit. Press Enter for more options.';
-Blockly.Msg.CLEAR_WORKSPACE = 'Erase Workspace';
+Blockly.Msg.ATTACH_NEW_BLOCK_TO_LINK = 'Attach new block to link...';
+Blockly.Msg.CREATE_NEW_BLOCK_GROUP = 'Create new block group...';
+Blockly.Msg.ERASE_WORKSPACE = 'Erase Workspace';
-Blockly.Msg.COPY_TO_CLIPBOARD = 'Copy to clipboard.';
-Blockly.Msg.COPY_TO_MARKED_SPOT = 'Attach to link.';
-Blockly.Msg.COPY_TO_WORKSPACE = 'Add to workspace.';
+Blockly.Msg.COPY_BLOCK = 'Copy block';
+Blockly.Msg.DELETE = 'Delete block';
+Blockly.Msg.MARK_SPOT_BEFORE = 'Add link before';
+Blockly.Msg.MARK_SPOT_AFTER = 'Add link after';
+Blockly.Msg.MARK_THIS_SPOT = 'Add link inside';
+Blockly.Msg.MOVE_TO_MARKED_SPOT = 'Attach to existing link';
+Blockly.Msg.PASTE_AFTER = 'Paste after';
+Blockly.Msg.PASTE_BEFORE = 'Paste before';
+Blockly.Msg.PASTE_INSIDE = 'Paste inside';
-Blockly.Msg.COPY_BLOCK = 'Copy block.';
-Blockly.Msg.DELETE = 'Delete block.';
-Blockly.Msg.MARK_SPOT_BEFORE = 'Add link before.';
-Blockly.Msg.MARK_SPOT_AFTER = 'Add link after.';
-Blockly.Msg.MARK_THIS_SPOT = 'Add link inside.';
-Blockly.Msg.MOVE_TO_MARKED_SPOT = 'Attach to link.';
-Blockly.Msg.PASTE_AFTER = 'Paste after.';
-Blockly.Msg.PASTE_BEFORE = 'Paste before.';
-Blockly.Msg.PASTE_INSIDE = 'Paste inside.';
+Blockly.Msg.BLOCK_OPTIONS = 'Block Options';
+Blockly.Msg.SELECT_A_BLOCK = 'Select a block...';
+Blockly.Msg.CANCEL = 'Cancel';
Blockly.Msg.ANY = 'any';
Blockly.Msg.BLOCK = 'block';
@@ -50,11 +52,7 @@ Blockly.Msg.BUTTON = 'Button.';
Blockly.Msg.FOR = 'for';
Blockly.Msg.VALUE = 'value';
-Blockly.Msg.BLOCK_OPTIONS = 'Block options: ';
-Blockly.Msg.CANCEL = 'Cancel.';
-
-Blockly.Msg.BLOCK_MOVED_TO_MARKED_SPOT_MSB = 'Block moved to marked spot: ';
+Blockly.Msg.ADDED_LINK_MSG = 'Added link.';
+Blockly.Msg.ATTACHED_BLOCK_TO_LINK_MSG = 'attached to link. ';
Blockly.Msg.COPIED_BLOCK_MSG = 'copied. ';
-Blockly.Msg.MARKED_SPOT_MSG = 'Marked spot. ';
Blockly.Msg.PASTED_BLOCK_FROM_CLIPBOARD_MSG = 'pasted. ';
-Blockly.Msg.PASTED_BLOCK_TO_MARKED_SPOT_MSG = 'moved to marked spot. ';
diff --git a/accessible/notifications.service.js b/accessible/notifications.service.js
index 9e2b1d709..a239ffb01 100644
--- a/accessible/notifications.service.js
+++ b/accessible/notifications.service.js
@@ -28,10 +28,10 @@ blocklyApp.NotificationsService = ng.core.Class({
this.statusMessage_ = '';
this.timeouts = [];
}],
- getStatusMessage: function() {
+ getAriaLiveReadout: function() {
return this.statusMessage_;
},
- setStatusMessage: function(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_ = '';
diff --git a/accessible/sidebar.component.js b/accessible/sidebar.component.js
index 3df591fdd..55137acad 100644
--- a/accessible/sidebar.component.js
+++ b/accessible/sidebar.component.js
@@ -42,18 +42,18 @@ blocklyApp.SidebarComponent = ng.core.Component({
[attr.disabled]="isAnyConnectionMarked() ? undefined : 'disabled'"
[attr.aria-disabled]="!isAnyConnectionMarked()"
class="blocklySidebarButton">
- Attach new block to link...
+ {{'ATTACH_NEW_BLOCK_TO_LINK'|translate}}
@@ -92,7 +92,7 @@ blocklyApp.SidebarComponent = ng.core.Component({
handleButtonClick: function(buttonConfig) {
buttonConfig.action();
if (buttonConfig.onClickNotification) {
- this.notificationsService.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
buttonConfig.onClickNotification);
}
},
diff --git a/accessible/toolbox-modal.component.js b/accessible/toolbox-modal.component.js
index 9100eb946..af0b8f176 100644
--- a/accessible/toolbox-modal.component.js
+++ b/accessible/toolbox-modal.component.js
@@ -31,7 +31,7 @@ blocklyApp.ToolboxModalComponent = ng.core.Component({
-
Select a block...
+
{{'SELECT_A_BLOCK'|translate}}
{{toolboxCategory.categoryName}}
diff --git a/accessible/toolbox-modal.service.js b/accessible/toolbox-modal.service.js
index 8256985f7..011fb3b1c 100644
--- a/accessible/toolbox-modal.service.js
+++ b/accessible/toolbox-modal.service.js
@@ -143,9 +143,8 @@ blocklyApp.ToolboxModalService = ng.core.Class({
that.treeService.initActiveDesc(oldDestinationTreeId);
}
- that.notificationsService.setStatusMessage(
- blockDescription + ' connected. ' +
- 'Now on copied block in workspace.');
+ that.notificationsService.setAriaLiveReadout(
+ 'Attached. Now on, ' + blockDescription + ', block in workspace.');
});
}, function() {
document.getElementById(sourceButtonId).focus();
@@ -160,9 +159,9 @@ blocklyApp.ToolboxModalService = ng.core.Class({
setTimeout(function() {
that.treeService.focusOnBlock(newBlockId);
- that.notificationsService.setStatusMessage(
- blockDescription + ' added to workspace. ' +
- 'Now on added block in workspace.');
+ that.notificationsService.setAriaLiveReadout(
+ 'Created new group in workspace. Now on, ' + blockDescription +
+ ', block in workspace.');
});
}, function() {
document.getElementById(sourceButtonId).focus();
diff --git a/accessible/tree.service.js b/accessible/tree.service.js
index f300ceb8e..3f49b12c2 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.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
'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.setStatusMessage(
+ that.notificationsService.setAriaLiveReadout(
blockDescription + ' cut. Workspace is empty.');
} else {
- that.notificationsService.setStatusMessage(
+ that.notificationsService.setAriaLiveReadout(
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.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
blockDescription + ' ' + Blockly.Msg.COPIED_BLOCK_MSG);
},
pasteToConnection: function(block, connection) {
@@ -360,10 +360,10 @@ blocklyApp.TreeService = ng.core.Class({
that.initActiveDesc(oldDestinationTreeId);
}
- that.notificationsService.setStatusMessage(
+ that.notificationsService.setAriaLiveReadout(
blockDescription + ' ' +
- Blockly.Msg.PASTED_BLOCK_TO_MARKED_SPOT_MSG +
- '. Now on moved block in workspace.');
+ Blockly.Msg.ATTACHED_BLOCK_TO_LINK_MSG +
+ '. Now on attached block in workspace.');
});
},
translationIdForText: 'MOVE_TO_MARKED_SPOT'
@@ -381,10 +381,10 @@ blocklyApp.TreeService = ng.core.Class({
setTimeout(function() {
if (that.utilsService.isWorkspaceEmpty()) {
- that.notificationsService.setStatusMessage(
+ that.notificationsService.setAriaLiveReadout(
blockDescription + ' deleted. Workspace is empty.');
} else {
- that.notificationsService.setStatusMessage(
+ that.notificationsService.setAriaLiveReadout(
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.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
'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.setStatusMessage(statusMessage);
+ this.notificationsService.setAriaLiveReadout(statusMessage);
}
} else if (e.keyCode == 39) {
// Right arrow key. Go down a level, if possible.
@@ -569,7 +569,7 @@ blocklyApp.TreeService = ng.core.Class({
this.setActiveDesc(nextSibling.id, treeId);
} else {
this.audioService.playOopsSound();
- this.notificationsService.setStatusMessage(
+ this.notificationsService.setAriaLiveReadout(
'Reached bottom of list.');
}
}