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

Do some refactoring and tidy-up. Pull some hardcoded strings out for i18n purposes; remove unused strings.

Browse Source
This commit is contained in:
Sean Lip
2016-11-28 18:57:44 -08:00
parent aa49539059
commit b75925004c
10 changed files with 71 additions and 71 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
accessible/app.component.js
View File

@@ -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: `
<div *ngIf="getStatusMessage()" aria-hidden="true" class="blocklyAriaLiveStatus">
<span aria-live="polite" role="status">{{getStatusMessage()}}</span>
</div>
<div>
<blockly-workspace></blockly-workspace>
<blockly-sidebar></blockly-sidebar>
</div>
<blockly-block-options-modal></blockly-block-options-modal>
<blockly-toolbox-modal></blockly-toolbox-modal>
<div *ngIf="getAriaLiveReadout()" aria-hidden="true"
class="blocklyAriaLiveStatus">
<span aria-live="polite" role="status">{{getAriaLiveReadout()}}</span>
</div>
<div>
<blockly-workspace></blockly-workspace>
<blockly-sidebar></blockly-sidebar>
</div>
<blockly-block-options-modal></blockly-block-options-modal>
<blockly-toolbox-modal></blockly-toolbox-modal>
<label aria-hidden="true" hidden id="blockly-button">{{'BUTTON'|translate}}</label>
<label aria-hidden="true" hidden id="blockly-more-options">{{'MORE_OPTIONS'|translate}}</label>
<label aria-hidden="true" hidden id="blockly-workspace-block">{{'WORKSPACE_BLOCK'|translate}}</label>
<label aria-hidden="true" hidden id="blockly-button">
{{'BUTTON'|translate}}
</label>
<label aria-hidden="true" hidden id="blockly-workspace-block">
{{'WORKSPACE_BLOCK'|translate}}
</label>
`,
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();
}
});

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

@@ -31,7 +31,7 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({
<!-- The $event.stopPropagation() here prevents the modal from
closing when its interior is clicked. -->
<div class="blocklyModal" (click)="$event.stopPropagation()" role="document">
<h3>Block Options</h3>
<h3>{{'BLOCK_OPTIONS'|translate}}</h3>
<div class="blocklyModalButtonContainer"
*ngFor="#buttonInfo of actionButtonsInfo; #i=index">

4
accessible/clipboard.service.js
View File

@@ -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;

2
accessible/field-segment.component.js
View File

@@ -160,7 +160,7 @@ blocklyApp.FieldSegmentComponent = ng.core.Component({
this.mainField.setValue(optionValue);
}
this.notificationsService.setStatusMessage(
this.notificationsService.setAriaLiveReadout(
'Selected option ' + this.optionText[optionValue]);
}
});

36
accessible/messages.js
View File

@@ -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. ';

4
accessible/notifications.service.js
View File

@@ -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_ = '';

8
accessible/sidebar.component.js
View File

@@ -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}}
</button>
<button id="{{ID_FOR_CREATE_NEW_GROUP_BUTTON}}"
(click)="showToolboxModalForCreateNewGroup()"
class="blocklySidebarButton">
Create new block group...
{{'CREATE_NEW_BLOCK_GROUP'|translate}}
</button>
<button id="clear-workspace" (click)="clearWorkspace()"
[attr.disabled]="isWorkspaceEmpty() ? 'disabled' : undefined"
[attr.aria-disabled]="isWorkspaceEmpty()"
class="blocklySidebarButton">
{{'CLEAR_WORKSPACE'|translate}}
{{'ERASE_WORKSPACE'|translate}}
</button>
</div>
</div>
@@ -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);
}
},

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

@@ -31,7 +31,7 @@ blocklyApp.ToolboxModalComponent = ng.core.Component({
<!-- The $event.stopPropagation() here prevents the modal from
closing when its interior is clicked. -->
<div class="blocklyModal" (click)="$event.stopPropagation()" role="document">
<h3>Select a block...</h3>
<h3>{{'SELECT_A_BLOCK'|translate}}</h3>
<div *ngFor="#toolboxCategory of toolboxCategories; #categoryIndex=index">
<h4 *ngIf="toolboxCategory.categoryName">{{toolboxCategory.categoryName}}</h4>

11
accessible/toolbox-modal.service.js
View File

@@ -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();

24
accessible/tree.service.js
View File

@@ -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.');
}
}