mirror of
https://github.com/google/blockly.git
synced 2026-01-23 00:30:10 +01:00
Introduce a common translation pipe; remove local stringMap attributes. Fix variable name error in paste functions. Minor linting.
This commit is contained in:
Sean Lip
@@ -28,119 +28,109 @@ blocklyApp.WorkspaceTreeView = ng.core
|
||||
.Component({
|
||||
selector: 'tree-view',
|
||||
template: `
|
||||
<li #parentList [id]="idMap['parentList']" role="treeitem" class="blocklyHasChildren"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-block-summary', idMap['blockSummary'])"
|
||||
[attr.aria-level]="level" aria-selected=false>
|
||||
{{checkParentList(parentList)}}
|
||||
<label [id]="idMap['blockSummary']">{{block.toString()}}</label>
|
||||
<ol role="group" [attr.aria-level]="level+1">
|
||||
<li [id]="idMap['listItem']" class="blocklyHasChildren" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-block-menu', idMap['blockSummary'])"
|
||||
[attr.aria-level]="level+1" aria-selected=false>
|
||||
<label [id]="idMap['label']">{{stringMap['BLOCK_ACTION_LIST']}}</label>
|
||||
<li #parentList [id]="idMap['parentList']" role="treeitem" class="blocklyHasChildren"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-block-summary', idMap['blockSummary'])"
|
||||
[attr.aria-level]="level" aria-selected=false>
|
||||
{{checkParentList(parentList)}}
|
||||
<label [id]="idMap['blockSummary']">{{block.toString()}}</label>
|
||||
<ol role="group" [attr.aria-level]="level+1">
|
||||
<li [id]="idMap['listItem']" class="blocklyHasChildren" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-block-menu', idMap['blockSummary'])"
|
||||
[attr.aria-level]="level+1" aria-selected=false>
|
||||
<label [id]="idMap['label']">{{'BLOCK_ACTION_LIST'|translate}}</label>
|
||||
<ol role="group" [attr.aria-level]="level+2">
|
||||
<li [id]="idMap['cutListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['cutButton'], 'blockly-button')"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['cutButton']" (click)="clipboardService.cut(block)">{{'CUT_BLOCK'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['copyListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['copyButton'], 'blockly-button')"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['copyButton']" (click)="clipboardService.copy(block, true)">{{'COPY_BLOCK'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['pasteBelow']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteBelowButton'], 'blockly-button', (getNoNextConnectionHTMLText(block)||clipboardService.getClipboardCompatibilityHTMLText(block.nextConnection)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['pasteBelowButton']" (click)="clipboardService.pasteFromClipboard(block.nextConnection)"
|
||||
[disabled]="getNoNextConnectionHTMLText(block)" [disabled]="clipboardService.getClipboardCompatibilityHTMLText(block.nextConnection)">{{'PASTE_BELOW'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['pasteAbove']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteAboveButton'], 'blockly-button', (getNoPreviousConnectionHTMLText(block) || clipboardService.getClipboardCompatibilityHTMLText(block.previousConnection)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['pasteAboveButton']" (click)="clipboardService.pasteFromClipboard(block.previousConnection)"
|
||||
[disabled]="getNoPreviousConnectionHTMLText(block)" [disabled]="clipboardService.getClipboardCompatibilityHTMLText(block.previousConnection)">{{'PASTE_ABOVE'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['markBelow']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markBelowButton'], 'blockly-button', getNoNextConnectionHTMLText(block))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['markBelowButton']" (click)="clipboardService.markConnection(block.nextConnection)"
|
||||
[disabled]="getNoNextConnectionHTMLText(block)">{{'MARK_SPOT_BELOW'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['markAbove']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markAboveButton'], 'blockly-button', getNoPreviousConnectionHTMLText(block))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['markAboveButton']" (click)="clipboardService.markConnection(block.previousConnection)"
|
||||
[disabled]="getNoPreviousConnectionHTMLText(block)">{{'MARK_SPOT_ABOVE'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['sendToSelectedListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['sendToSelectedButton'], 'blockly-button', utilsService.getMarkedBlockCompatibilityHTMLText(clipboardService.isBlockCompatibleWithMarkedConnection(block)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['sendToSelectedButton']" (click)="sendToSelected(block)"
|
||||
[disabled]="getMarkedBlockCompatibilityHTMLText(clipboardService.isBlockCompatibleWithMarkedConnection(block))">{{'MOVE_TO_MARKED_SPOT'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['delete']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['deleteButton'], 'blockly-button')"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['deleteButton']" (click)="deleteBlock(block)">{{'DELETE'|translate}}</button>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<div *ngFor="#inputBlock of block.inputList; #i = index">
|
||||
<field-view *ngFor="#field of inputBlock.fieldRow" [field]="field"></field-view>
|
||||
<tree-view *ngIf="inputBlock.connection && inputBlock.connection.targetBlock()" [block]="inputBlock.connection.targetBlock()" [isTopBlock]="false" [level]="level"></tree-view>
|
||||
<li #inputList [attr.aria-level]="level + 1" [id]="idMap['inputList' + i]"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-menu', idMap['inputMenuLabel' + i])"
|
||||
*ngIf="inputBlock.connection && !inputBlock.connection.targetBlock()" (keydown)="treeService.onKeypress($event, tree)">
|
||||
<!-- TODO(madeeha): i18n here will need to happen in a different way due to the way grammar changes based on language. -->
|
||||
<label [id]="idMap['inputMenuLabel' + i]"> {{utilsService.getInputTypeLabel(inputBlock.connection)}} {{utilsService.getBlockTypeLabel(inputBlock)}} needed: </label>
|
||||
<ol role="group" [attr.aria-level]="level+2">
|
||||
<li [id]="idMap['cutListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['cutButton'], 'blockly-button')"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['cutButton']" (click)="clipboardService.cut(block)">{{stringMap['CUT_BLOCK']}}</button>
|
||||
<li [id]="idMap['markSpot' + i]" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markButton' + i], 'blockly-button')"
|
||||
[attr.aria-level]="level + 2" aria-selected=false>
|
||||
<button [id]="idMap['markSpotButton + i']" (click)="clipboardService.markConnection(inputBlock.connection)">{{'MARK_THIS_SPOT'|translate}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['copyListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['copyButton'], 'blockly-button')"
|
||||
<li [id]="idMap['paste' + i]" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteButton' + i], 'blockly-button', clipboardService.getClipboardCompatibilityHTMLText(inputBlock.connection))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['copyButton']" (click)="clipboardService.copy(block, true)">{{stringMap['COPY_BLOCK']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['pasteBelow']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteBelowButton'], 'blockly-button', (getNoNextConnectionHTMLText(block)||clipboardService.getClipboardCompatibilityHTMLText(block.nextConnection)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['pasteBelowButton']" (click)="clipboardService.pasteFromClipboard(block.nextConnection)"
|
||||
[disabled]="getNoNextConnectionHTMLText(block)" [disabled]="clipboardService.getClipboardCompatibilityHTMLText(block.nextConnection)">{{stringMap['PASTE_BELOW']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['pasteAbove']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteAboveButton'], 'blockly-button', (getNoPreviousConnectionHTMLText(block) || clipboardService.getClipboardCompatibilityHTMLText(block.previousConnection)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['pasteAboveButton']" (click)="clipboardService.pasteFromClipboard(block.previousConnection)"
|
||||
[disabled]="getNoPreviousConnectionHTMLText(block)" [disabled]="clipboardService.getClipboardCompatibilityHTMLText(block.previousConnection)">{{stringMap['PASTE_ABOVE']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['markBelow']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markBelowButton'], 'blockly-button', getNoNextConnectionHTMLText(block))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['markBelowButton']" (click)="clipboardService.markConnection(block.nextConnection)"
|
||||
[disabled]="getNoNextConnectionHTMLText(block)">{{stringMap['MARK_SPOT_BELOW']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['markAbove']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markAboveButton'], 'blockly-button', getNoPreviousConnectionHTMLText(block))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['markAboveButton']" (click)="clipboardService.markConnection(block.previousConnection)"
|
||||
[disabled]="getNoPreviousConnectionHTMLText(block)">{{stringMap['MARK_SPOT_ABOVE']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['sendToSelectedListItem']" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['sendToSelectedButton'], 'blockly-button', utilsService.getMarkedBlockCompatibilityHTMLText(clipboardService.isBlockCompatibleWithMarkedConnection(block)))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['sendToSelectedButton']" (click)="sendToSelected(block)"
|
||||
[disabled]="getMarkedBlockCompatibilityHTMLText(clipboardService.isBlockCompatibleWithMarkedConnection(block))">{{stringMap['MOVE_TO_MARKED_SPOT']}}</button>
|
||||
</li>
|
||||
<li [attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['deleteButton'], 'blockly-button')" [id]="idMap['delete']" role="treeitem" aria-selected=false [attr.aria-level]="level+2">
|
||||
<button [id]="idMap['deleteButton']" (click)="deleteBlock(block)">{{stringMap['DELETE']}}</button>
|
||||
<button [id]="idMap['pasteButton' + i]" (click)="clipboardService.pasteFromClipboard(inputBlock.connection)"
|
||||
[disabled]="clipboardService.getClipboardCompatibilityHTMLText(inputBlock.connection)">{{'PASTE'|translate}}</button>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
<div *ngFor="#inputBlock of block.inputList; #i = index">
|
||||
<field-view *ngFor="#field of inputBlock.fieldRow" [field]="field"></field-view>
|
||||
<tree-view *ngIf="inputBlock.connection && inputBlock.connection.targetBlock()" [block]="inputBlock.connection.targetBlock()" [isTopBlock]="false" [level]="level"></tree-view>
|
||||
<li #inputList [attr.aria-level]="level + 1" [id]="idMap['inputList' + i]"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr('blockly-menu', idMap['inputMenuLabel' + i])"
|
||||
*ngIf="inputBlock.connection && !inputBlock.connection.targetBlock()" (keydown)="treeService.onKeypress($event, tree)">
|
||||
<!-- TODO(madeeha): i18n here will need to happen in a different way due to the way grammar changes based on language. -->
|
||||
<label [id]="idMap['inputMenuLabel' + i]"> {{utilsService.getInputTypeLabel(inputBlock.connection)}} {{utilsService.getBlockTypeLabel(inputBlock)}} needed: </label>
|
||||
<ol role="group" [attr.aria-level]="level+2">
|
||||
<li [id]="idMap['markSpot' + i]" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['markButton' + i], 'blockly-button')"
|
||||
[attr.aria-level]="level + 2" aria-selected=false>
|
||||
<button [id]="idMap['markSpotButton + i']" (click)="clipboardService.markConnection(inputBlock.connection)">{{stringMap['MARK_THIS_SPOT']}}</button>
|
||||
</li>
|
||||
<li [id]="idMap['paste' + i]" role="treeitem"
|
||||
[attr.aria-labelledBy]="generateAriaLabelledByAttr(idMap['pasteButton' + i], 'blockly-button', clipboardService.getClipboardCompatibilityHTMLText(inputBlock.connection))"
|
||||
[attr.aria-level]="level+2" aria-selected=false>
|
||||
<button [id]="idMap['pasteButton' + i]" (click)="clipboardService.pasteFromClipboard(inputBlock.connection)"
|
||||
[disabled]="clipboardService.getClipboardCompatibilityHTMLText(inputBlock.connection)">{{stringMap['PASTE']}}</button>
|
||||
</li>
|
||||
</ol>
|
||||
</li>
|
||||
</div>
|
||||
</ol>
|
||||
</li>
|
||||
<tree-view *ngIf= "block.nextConnection && block.nextConnection.targetBlock()"
|
||||
[block]="block.nextConnection.targetBlock()"
|
||||
[isTopBlock]="false"
|
||||
[level]="level">
|
||||
</tree-view>
|
||||
</div>
|
||||
</ol>
|
||||
</li>
|
||||
<tree-view *ngIf= "block.nextConnection && block.nextConnection.targetBlock()"
|
||||
[block]="block.nextConnection.targetBlock()"
|
||||
[isTopBlock]="false"
|
||||
[level]="level">
|
||||
</tree-view>
|
||||
`,
|
||||
directives: [ng.core.forwardRef(
|
||||
function() { return blocklyApp.WorkspaceTreeView; }), blocklyApp.FieldView],
|
||||
inputs: ['block', 'isTopBlock', 'topBlockIndex', 'level', 'parentId'],
|
||||
pipes: [blocklyApp.TranslatePipe],
|
||||
providers: [blocklyApp.TreeService, blocklyApp.UtilsService],
|
||||
})
|
||||
.Class({
|
||||
constructor: [blocklyApp.ClipboardService, blocklyApp.TreeService,
|
||||
blocklyApp.UtilsService,
|
||||
function(_clipboardService, _treeService, _utilsService) {
|
||||
constructor: [
|
||||
blocklyApp.ClipboardService, blocklyApp.TreeService, blocklyApp.UtilsService,
|
||||
function(_clipboardService, _treeService, _utilsService) {
|
||||
this.infoBlocks = Object.create(null);
|
||||
this.clipboardService = _clipboardService;
|
||||
this.treeService = _treeService;
|
||||
this.utilsService = _utilsService;
|
||||
this.stringMap = {
|
||||
'BLOCK_ACTION_LIST': Blockly.Msg.BLOCK_ACTION_LIST,
|
||||
'PASTE': Blockly.Msg.PASTE,
|
||||
'PASTE_ABOVE': Blockly.Msg.PASTE_ABOVE,
|
||||
'PASTE_BELOW': Blockly.Msg.PASTE_BELOW,
|
||||
'MARK_THIS_SPOT': Blockly.Msg.MARK_THIS_SPOT,
|
||||
'MARK_SPOT_ABOVE': Blockly.Msg.MARK_SPOT_ABOVE,
|
||||
'MARK_SPOT_BELOW': Blockly.Msg.MARK_SPOT_BELOW,
|
||||
'CUT_BLOCK': Blockly.Msg.CUT_BLOCK,
|
||||
'COPY_BLOCK': Blockly.Msg.COPY_BLOCK,
|
||||
'MOVE_TO_MARKED_SPOT': Blockly.Msg.MOVE_TO_MARKED_SPOT,
|
||||
'DELETE': Blockly.Msg.DELETE
|
||||
};
|
||||
}],
|
||||
deleteBlock: function(block) {
|
||||
// If this is the top block, we should shift focus to the previous tree
|
||||
@@ -151,16 +141,17 @@ blocklyApp.WorkspaceTreeView = ng.core
|
||||
break;
|
||||
}
|
||||
}
|
||||
// If this is not the top block, we should change the active descendant of the tree.
|
||||
|
||||
// If this is not the top block, we should change the active descendant
|
||||
// of the tree.
|
||||
block.dispose(true);
|
||||
},
|
||||
getMarkedBlockCompatibilityHTMLText: function(isCompatible) {
|
||||
return this.utilsService.getMarkedBlockCompatibilityHTMLText(isCompatible);
|
||||
},
|
||||
generateAriaLabelledByAttr: function() {
|
||||
return this.utilsService.generateAriaLabelledByAttr.apply(this,
|
||||
arguments);
|
||||
return this.utilsService.generateAriaLabelledByAttr.apply(
|
||||
this, arguments);
|
||||
},
|
||||
ngOnInit: function() {
|
||||
var elementsNeedingIds = ['blockSummary', 'listItem', 'label',
|
||||
|
||||
Reference in New Issue
Block a user