diff --git a/src/web/Manager.mjs b/src/web/Manager.mjs index c3d981c4..f8d84170 100755 --- a/src/web/Manager.mjs +++ b/src/web/Manager.mjs @@ -147,6 +147,7 @@ class Manager { this.addDynamicListener(".op-list li.operation", "dblclick", this.ops.operationDblclick, this.ops); document.getElementById("edit-favourites").addEventListener("click", this.ops.editFavouritesClick.bind(this.ops)); document.getElementById("save-favourites").addEventListener("click", this.ops.saveFavouritesClick.bind(this.ops)); + document.getElementById("edit-favourites").addEventListener("keydown", this.ops.editFavouritesKeyPress.bind(this.ops)); document.getElementById("categories").addEventListener("keydown", this.ops.onKeyPress.bind(this.ops)); this.addDynamicListener(".op-list li.operation", "keydown", this.ops.keyboardPopulateRecipe.bind(this.ops)); document.getElementById("reset-favourites").addEventListener("click", this.ops.resetFavouritesClick.bind(this.ops)); diff --git a/src/web/waiters/OperationsWaiter.mjs b/src/web/waiters/OperationsWaiter.mjs index cc76ec7d..aec7043c 100755 --- a/src/web/waiters/OperationsWaiter.mjs +++ b/src/web/waiters/OperationsWaiter.mjs @@ -283,6 +283,61 @@ class OperationsWaiter { this.manager.recipe.initialiseOperationDragNDrop(); } + /** + * Handler for reset favourites click events. + * Resets favourites to their defaults. + */ + resetFavouritesClick() { + this.app.resetFavourites(); + } + + /** + * Handler that allows users to open favourite modal by "Enter/Space". + * This codes mimics editFavouritesClick event handler. + * @param {Event} ev + */ + editFavouritesKeyPress(ev) { + if (ev.key === "Enter" || ev.key === "Space" || ev.key === " ") { + ev.preventDefault(); + ev.stopPropagation(); + const favCat = this.app.categories.filter(function (c) { + return c.name === "Favourites"; + })[0]; + + let html = ""; + for (let i = 0; i < favCat.ops.length; i++) { + const opName = favCat.ops[i]; + const operation = new HTMLOperation(opName, this.app.operations[opName], this.app, this.manager); + html += operation.toStubHtml(true); + } + + const editFavouritesList = document.getElementById("edit-favourites-list"); + editFavouritesList.innerHTML = html; + this.removeIntent = false; + + const editableList = Sortable.create(editFavouritesList, { + filter: ".remove-icon", + onFilter: function (evt) { + const el = editableList.closest(evt.item); + if (el && el.parentNode) { + $(el).popover("dispose"); + el.parentNode.removeChild(el); + } + }, + onEnd: function (evt) { + if (this.removeIntent) { + $(evt.item).popover("dispose"); + evt.item.remove(); + } + }.bind(this), + }); + + $("#edit-favourites-list [data-toggle=popover]").popover(); + $("#favourites-modal").modal(); + + } + } + /** * Handler for on key press events. * Get the children of categories and add event listener to them. @@ -342,14 +397,6 @@ class OperationsWaiter { } } - /** - * Handler for reset favourites click events. - * Resets favourites to their defaults. - */ - resetFavouritesClick() { - this.app.resetFavourites(); - } - } export default OperationsWaiter;