diff --git a/package-lock.json b/package-lock.json index 28f9c8f..0435f2d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1310,6 +1310,17 @@ "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "dev": true }, + "string_decoder": { + "version": "1.0.3", + "resolved": + "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz", + "integrity": + "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==", + "dev": true, + "requires": { + "safe-buffer": "5.1.1" + } + }, "string-width": { "version": "2.1.1", "resolved": @@ -1341,17 +1352,6 @@ } } }, - "string_decoder": { - "version": "1.0.3", - "resolved": - "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz", - "integrity": - "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==", - "dev": true, - "requires": { - "safe-buffer": "5.1.1" - } - }, "strip-ansi": { "version": "3.0.1", "resolved": diff --git a/src/script.js b/src/script.js index 50797c9..ac827ab 100644 --- a/src/script.js +++ b/src/script.js @@ -1501,7 +1501,10 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal var byteString = atob(dataURI.split(',')[1]); // separate out the mime component - var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]; + var mimeString = dataURI + .split(',')[0] + .split(':')[1] + .split(';')[0]; // write the bytes of the string to an ArrayBuffer var ab = new ArrayBuffer(byteString.length); @@ -2132,7 +2135,6 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal // Editor keyboard shortucuts window.addEventListener('keydown', function(event) { - var selectedItemElement; // TODO: refactor common listener code // Ctrl/⌘ + S if ((event.ctrlKey || event.metaKey) && event.keyCode === 83) { @@ -2166,40 +2168,37 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal } else if (event.keyCode === 27) { closeAllOverlays(); } - if (event.keyCode === 40 && isSavedItemsPaneOpen) { - // Return if no items present. - if (!$all('.js-saved-item-tile').length) { - return; - } - selectedItemElement = $('.js-saved-item-tile.selected'); + }); + + savedItemsPane.addEventListener('keydown', function(event) { + if (!isSavedItemsPaneOpen) { + return; + } + + const isCtrlOrMetaPressed = event.ctrlKey || event.metaKey; + const isForkKeyPressed = isCtrlOrMetaPressed && event.keyCode === 70; + const isDownKeyPressed = event.keyCode === 40; + const isUpKeyPressed = event.keyCode === 38; + const isEnterKeyPressed = event.keyCode === 13; + + const selectedItemElement = $('.js-saved-item-tile.selected'); + const havePaneItems = $all('.js-saved-item-tile').length !== 0; + + if ((isDownKeyPressed || isUpKeyPressed) && havePaneItems) { + const method = isDownKeyPressed ? 'nextUntil' : 'previousUntil'; + if (selectedItemElement) { selectedItemElement.classList.remove('selected'); - selectedItemElement - .nextUntil('.js-saved-item-tile:not(.hide)') - .classList.add('selected'); + selectedItemElement[method]( + '.js-saved-item-tile:not(.hide)' + ).classList.add('selected'); } else { $('.js-saved-item-tile:not(.hide)').classList.add('selected'); } $('.js-saved-item-tile.selected').scrollIntoView(false); - } else if (event.keyCode === 38 && isSavedItemsPaneOpen) { - if (!$all('.js-saved-item-tile').length) { - return; - } - selectedItemElement = $('.js-saved-item-tile.selected'); - if (selectedItemElement) { - selectedItemElement.classList.remove('selected'); - selectedItemElement - .previousUntil('.js-saved-item-tile:not(.hide)') - .classList.add('selected'); - } else { - $('.js-saved-item-tile:not(.hide)').classList.add('selected'); - } - $('.js-saved-item-tile.selected').scrollIntoView(false); - } else if (event.keyCode === 13 && isSavedItemsPaneOpen) { - selectedItemElement = $('.js-saved-item-tile.selected'); - if (!selectedItemElement) { - return; - } + } + + if (isEnterKeyPressed && selectedItemElement) { setTimeout(function() { openItem(selectedItemElement.dataset.itemId); }, 350); @@ -2207,13 +2206,8 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal } // Fork shortcut inside saved creations panel with Ctrl/⌘ + F - if ( - isSavedItemsPaneOpen && - (event.ctrlKey || event.metaKey) && - event.keyCode === 70 - ) { + if (isForkKeyPressed) { event.preventDefault(); - selectedItemElement = $('.js-saved-item-tile.selected'); setTimeout(function() { forkItem(savedItems[selectedItemElement.dataset.itemId]); }, 350); @@ -2247,14 +2241,18 @@ globalConsoleContainerEl, externalLibrarySearchInput, keyboardShortcutsModal var libOptions = window.jsLibs.reduce( (html, lib) => html + - ``, + ``, '' ); addLibrarySelect.children[1].innerHTML = libOptions; libOptions = window.cssLibs.reduce( (html, lib) => html + - ``, + ``, '' ); addLibrarySelect.children[2].innerHTML = libOptions;