added functionality to open edit favourites with keyboard

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

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;