diff --git a/accessible/block-options-modal.component.js b/accessible/block-options-modal.component.js index f13bc466e..0a81f6029 100644 --- a/accessible/block-options-modal.component.js +++ b/accessible/block-options-modal.component.js @@ -36,7 +36,6 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({
@@ -86,12 +85,6 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({ '13': function(evt) { var button = document.getElementById( that.getOptionId(that.activeActionButtonIndex)); - if (button.disabled) { - evt.preventDefault(); - evt.stopPropagation(); - return; - } - if (that.activeActionButtonIndex < that.actionButtonsInfo.length) { that.actionButtonsInfo[that.activeActionButtonIndex].action(); @@ -108,24 +101,26 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({ }, // Up key: navigates to the previous item in the list. '38': function(evt) { + // Prevent the page from scrolling. evt.preventDefault(); if (that.activeActionButtonIndex == 0) { that.audioService.playOopsSound(); } else { that.activeActionButtonIndex--; + that.focusOnOption(that.activeActionButtonIndex); } - that.focusOnOptionIfPossible(that.activeActionButtonIndex); }, // Down key: navigates to the next item in the list. '40': function(evt) { + // Prevent the page from scrolling. evt.preventDefault(); if (that.activeActionButtonIndex == that.actionButtonsInfo.length) { that.audioService.playOopsSound(); } else { that.activeActionButtonIndex++; + that.focusOnOption(that.activeActionButtonIndex); } - that.focusOnOptionIfPossible(that.activeActionButtonIndex); } }); @@ -136,14 +131,10 @@ blocklyApp.BlockOptionsModalComponent = ng.core.Component({ ); } ], - // Focuses on the button represented by the given index, if the button - // is not disabled. Otherwise, removes any existing focus. - focusOnOptionIfPossible: function(index) { + focusOnOption: function(index) { var button = document.getElementById(this.getOptionId(index)); - if (!button.disabled) { + if (button) { button.focus(); - } else { - document.activeElement.blur(); } }, // Returns the ID for the corresponding option button. diff --git a/accessible/tree.service.js b/accessible/tree.service.js index 601e06dbf..f300ceb8e 100644 --- a/accessible/tree.service.js +++ b/accessible/tree.service.js @@ -308,65 +308,69 @@ blocklyApp.TreeService = ng.core.Class({ }, showBlockOptionsModal: function(block, blockRootNode) { var that = this; - var actionButtonsInfo = [{ - translationIdForText: 'MARK_SPOT_BEFORE', - action: function() { - that.clipboardService.markConnection(block.previousConnection); - that.focusOnBlock(block.id); - }, - isDisabled: function() { - return !block.previousConnection; - } - }, { - action: function() { - that.clipboardService.markConnection(block.nextConnection); - that.focusOnBlock(block.id); - }, - translationIdForText: 'MARK_SPOT_AFTER', - isDisabled: function() { - return !block.nextConnection; - } - }, { - action: function() { - var blockDescription = that.utilsService.getBlockDescription( - block); - var oldDestinationTreeId = that.getTreeIdForBlock( - that.clipboardService.getMarkedConnectionBlock().id); - that.clearActiveDesc(oldDestinationTreeId); + var actionButtonsInfo = []; - var newBlockId = that.clipboardService.pasteToMarkedConnection( + if (block.previousConnection) { + actionButtonsInfo.push({ + action: function() { + that.clipboardService.markConnection(block.previousConnection); + that.focusOnBlock(block.id); + }, + translationIdForText: 'MARK_SPOT_BEFORE' + }); + } + + if (block.nextConnection) { + actionButtonsInfo.push({ + action: function() { + that.clipboardService.markConnection(block.nextConnection); + that.focusOnBlock(block.id); + }, + translationIdForText: 'MARK_SPOT_AFTER' + }); + } + + if (this.clipboardService.isMovableToMarkedConnection(block)) { + actionButtonsInfo.push({ + action: function() { + var blockDescription = that.utilsService.getBlockDescription( block); + var oldDestinationTreeId = that.getTreeIdForBlock( + that.clipboardService.getMarkedConnectionBlock().id); + that.clearActiveDesc(oldDestinationTreeId); - that.removeBlockAndSetFocus(block, blockRootNode, function() { - block.dispose(true); - }); + var newBlockId = that.clipboardService.pasteToMarkedConnection( + block); - // Invoke a digest cycle, so that the DOM settles. - setTimeout(function() { - that.focusOnBlock(newBlockId); + that.removeBlockAndSetFocus(block, blockRootNode, function() { + block.dispose(true); + }); - var newDestinationTreeId = that.getTreeIdForBlock(newBlockId); - if (newDestinationTreeId != oldDestinationTreeId) { - // It is possible for the tree ID for the pasted block to - // change after the paste operation, e.g. when inserting a - // block between two existing blocks that are joined - // together. In this case, we need to also reset the active - // desc for the old destination tree. - that.initActiveDesc(oldDestinationTreeId); - } + // Invoke a digest cycle, so that the DOM settles. + setTimeout(function() { + that.focusOnBlock(newBlockId); - that.notificationsService.setStatusMessage( - blockDescription + ' ' + - Blockly.Msg.PASTED_BLOCK_TO_MARKED_SPOT_MSG + - '. Now on moved block in workspace.'); - }); - }, - translationIdForText: 'MOVE_TO_MARKED_SPOT', - isDisabled: function() { - return !that.clipboardService.isMovableToMarkedConnection( - block); - } - }, { + var newDestinationTreeId = that.getTreeIdForBlock(newBlockId); + if (newDestinationTreeId != oldDestinationTreeId) { + // It is possible for the tree ID for the pasted block to + // change after the paste operation, e.g. when inserting a + // block between two existing blocks that are joined + // together. In this case, we need to also reset the active + // desc for the old destination tree. + that.initActiveDesc(oldDestinationTreeId); + } + + that.notificationsService.setStatusMessage( + blockDescription + ' ' + + Blockly.Msg.PASTED_BLOCK_TO_MARKED_SPOT_MSG + + '. Now on moved block in workspace.'); + }); + }, + translationIdForText: 'MOVE_TO_MARKED_SPOT' + }); + } + + actionButtonsInfo.push({ action: function() { var blockDescription = that.utilsService.getBlockDescription(block); @@ -385,11 +389,8 @@ blocklyApp.TreeService = ng.core.Class({ } }); }, - translationIdForText: 'DELETE', - isDisabled: function() { - return false; - } - }]; + translationIdForText: 'DELETE' + }); this.blockOptionsModalService.showModal(actionButtonsInfo, function() { that.focusOnBlock(block.id);