diff --git a/frontends/etiquette_flask/static/js/common.js b/frontends/etiquette_flask/static/js/common.js
index 9bbdcf4..c520048 100644
--- a/frontends/etiquette_flask/static/js/common.js
+++ b/frontends/etiquette_flask/static/js/common.js
@@ -121,15 +121,3 @@ function html_to_element(html)
template.innerHTML = html;
return template.content.firstChild;
}
-
-function should_prevent_hotkey(event)
-{
- if (event.target.tagName == "INPUT" && event.target.type == "checkbox")
- {
- return false;
- }
- else
- {
- return INPUT_TYPES.has(event.target.tagName);
- }
-}
diff --git a/frontends/etiquette_flask/static/js/hotkeys.js b/frontends/etiquette_flask/static/js/hotkeys.js
new file mode 100644
index 0000000..003fab4
--- /dev/null
+++ b/frontends/etiquette_flask/static/js/hotkeys.js
@@ -0,0 +1,69 @@
+HOTKEYS = {};
+
+function hotkey_identifier(key, ctrlKey, shiftKey, altKey)
+{
+ // Return the string that will represent this hotkey in the dictionary.
+ return key.toLowerCase() + "." + (ctrlKey & 1) + "." + (shiftKey & 1) + "." + (altKey & 1);
+}
+
+function hotkey_human(key, ctrlKey, shiftKey, altKey)
+{
+ // Return the string that will be displayed to the user to represent this hotkey.
+ mods = [];
+ if (ctrlKey) { mods.push("Ctrl"); }
+ if (shiftKey) { mods.push("Shift"); }
+ if (altKey) { mods.push("Alt"); }
+ mods = mods.join("+");
+ if (mods) { mods = mods + "+"; }
+ return mods + key.toUpperCase();
+}
+
+function register_hotkey(key, ctrlKey, shiftKey, altKey, action, description)
+{
+ identifier = hotkey_identifier(key, ctrlKey, shiftKey, altKey);
+ human = hotkey_human(key, ctrlKey, shiftKey, altKey);
+ HOTKEYS[identifier] = {"action": action, "human": human, "description": description}
+}
+
+function should_prevent_hotkey(event)
+{
+ if (event.target.tagName == "INPUT" && event.target.type == "checkbox")
+ {
+ return false;
+ }
+ else
+ {
+ return INPUT_TYPES.has(event.target.tagName);
+ }
+}
+
+function show_all_keybinds()
+{
+ // Display an Alert with a list of all the keybinds.
+ var lines = [];
+ for (var identifier in HOTKEYS)
+ {
+ var line = HOTKEYS[identifier]["human"] + " : " + HOTKEYS[identifier]["description"];
+ lines.push(line);
+ }
+ lines = lines.join("\n");
+ alert(lines);
+}
+
+
+window.addEventListener(
+ "keydown",
+ function(event)
+ {
+ if (should_prevent_hotkey(event)) { return; }
+ identifier = hotkey_identifier(event.key, event.ctrlKey, event.shiftKey, event.altKey);
+ console.log(identifier);
+ if (identifier in HOTKEYS)
+ {
+ HOTKEYS[identifier]["action"]();
+ event.preventDefault();
+ }
+ }
+);
+
+register_hotkey("/", 0, 0, 0, show_all_keybinds, "Show keybinds.");
diff --git a/frontends/etiquette_flask/static/js/photoclipboard.js b/frontends/etiquette_flask/static/js/photoclipboard.js
index 2974ffb..042e538 100644
--- a/frontends/etiquette_flask/static/js/photoclipboard.js
+++ b/frontends/etiquette_flask/static/js/photoclipboard.js
@@ -260,65 +260,6 @@ function open_full_clipboard_tab()
window.open(url, "full_clipboard");
}
-function set_keybinds()
-{
- // HOTKEY: Photoclipboard select all
- window.addEventListener(
- "keydown",
- function(event)
- {
- if (should_prevent_hotkey(event)) { return; }
- if (event.key == "a" && event.ctrlKey && !event.shiftKey && !event.altKey)
- {
- select_all_photos();
- event.preventDefault();
- }
- }
- );
-
- // HOTKEY: Photoclipboard deselect all
- window.addEventListener(
- "keydown",
- function(event)
- {
- if (should_prevent_hotkey(event)) { return; }
- if (event.key == "d" && event.ctrlKey && !event.shiftKey && !event.altKey)
- {
- unselect_all_photos();
- event.preventDefault();
- }
- }
- );
-
- // HOTKEY: Photoclipboard toggle
- window.addEventListener(
- "keydown",
- function(event)
- {
- if (should_prevent_hotkey(event)) { return; }
- if (event.key == "c" && !event.ctrlKey && !event.shiftKey && !event.altKey)
- {
- clipboard_tray_collapse_toggle();
- event.preventDefault();
- }
- }
- );
-
- // HOTKEY: Photoclipboard open full clipboard tab
- window.addEventListener(
- "keydown",
- function(event)
- {
- if (should_prevent_hotkey(event)) { return; }
- if (event.key == "x" && event.altKey && !event.ctrlKey && !event.shiftKey)
- {
- open_full_clipboard_tab();
- event.preventDefault();
- }
- }
- );
-}
-
function update_clipboard_count()
{
var elements = document.getElementsByClassName("clipboard_count");
@@ -327,7 +268,7 @@ function update_clipboard_count()
elements[index].innerText = photo_clipboard.size;
}
}
-function on_storage()
+function on_storage_event()
{
/*
Receive storage events from other tabs and update our state to match.
@@ -335,16 +276,21 @@ function on_storage()
load_photo_clipboard();
update_pagestate();
}
+
function update_pagestate()
{
update_clipboard_count();
update_clipboard_tray();
apply_check_all();
}
+
function on_pageload()
{
- window.addEventListener("storage", on_storage, false);
- set_keybinds();
+ window.addEventListener("storage", on_storage_event, false);
+ register_hotkey("a", 1, 0, 0, select_all_photos, "Select all photos.");
+ register_hotkey("d", 1, 0, 0, unselect_all_photos, "Deselect all photos.");
+ register_hotkey("c", 0, 0, 0, clipboard_tray_collapse_toggle, "Toggle clipboard tray.");
+ register_hotkey("c", 0, 1, 0, open_full_clipboard_tab, "Open full clipboard page.");
load_photo_clipboard();
update_pagestate();
}
diff --git a/frontends/etiquette_flask/templates/album.html b/frontends/etiquette_flask/templates/album.html
index 1b3e5dd..d146b8c 100644
--- a/frontends/etiquette_flask/templates/album.html
+++ b/frontends/etiquette_flask/templates/album.html
@@ -13,6 +13,7 @@
+