Add hotkeys

4 files changed, 265 insertions, 15 deletions

diff --git a/src/KeyCode.hx b/src/KeyCode.hx
new file mode 100644
index 0000000..c380329
--- /dev/null
+++ b/src/KeyCode.hx
@@ -0,0 +1,202 @@
+package;
+
+// https://github.com/Kode/Kha/blob/master/Sources/kha/input/KeyCode.hx
+enum abstract KeyCode(Int) to Int {
+	var Unknown = 0;
+	var Back = 1; // Android
+	var Cancel = 3;
+	var Help = 6;
+	var Backspace = 8;
+	var Tab = 9;
+	var Clear = 12;
+	var Return = 13;
+	var Shift = 16;
+	var Control = 17;
+	var Alt = 18;
+	var Pause = 19;
+	var CapsLock = 20;
+	var Kana = 21;
+	var Hangul = 21;
+	var Eisu = 22;
+	var Junja = 23;
+	var Final = 24;
+	var Hanja = 25;
+	var Kanji = 25;
+	var Escape = 27;
+	var Convert = 28;
+	var NonConvert = 29;
+	var Accept = 30;
+	var ModeChange = 31;
+	var Space = 32;
+	var PageUp = 33;
+	var PageDown = 34;
+	var End = 35;
+	var Home = 36;
+	var Left = 37;
+	var Up = 38;
+	var Right = 39;
+	var Down = 40;
+	var Select = 41;
+	var Print = 42;
+	var Execute = 43;
+	var PrintScreen = 44;
+	var Insert = 45;
+	var Delete = 46;
+	var Zero = 48;
+	var One = 49;
+	var Two = 50;
+	var Three = 51;
+	var Four = 52;
+	var Five = 53;
+	var Six = 54;
+	var Seven = 55;
+	var Eight = 56;
+	var Nine = 57;
+	var Colon = 58;
+	var Semicolon = 59;
+	var LessThan = 60;
+	var Equals = 61;
+	var GreaterThan = 62;
+	var QuestionMark = 63;
+	var At = 64;
+	var A = 65;
+	var B = 66;
+	var C = 67;
+	var D = 68;
+	var E = 69;
+	var F = 70;
+	var G = 71;
+	var H = 72;
+	var I = 73;
+	var J = 74;
+	var K = 75;
+	var L = 76;
+	var M = 77;
+	var N = 78;
+	var O = 79;
+	var P = 80;
+	var Q = 81;
+	var R = 82;
+	var S = 83;
+	var T = 84;
+	var U = 85;
+	var V = 86;
+	var W = 87;
+	var X = 88;
+	var Y = 89;
+	var Z = 90;
+	var Win = 91;
+	var ContextMenu = 93;
+	var Sleep = 95;
+	var Numpad0 = 96;
+	var Numpad1 = 97;
+	var Numpad2 = 98;
+	var Numpad3 = 99;
+	var Numpad4 = 100;
+	var Numpad5 = 101;
+	var Numpad6 = 102;
+	var Numpad7 = 103;
+	var Numpad8 = 104;
+	var Numpad9 = 105;
+	var Multiply = 106;
+	var Add = 107;
+	var Separator = 108;
+	var Subtract = 109;
+	var Decimal = 110;
+	var Divide = 111;
+	var F1 = 112;
+	var F2 = 113;
+	var F3 = 114;
+	var F4 = 115;
+	var F5 = 116;
+	var F6 = 117;
+	var F7 = 118;
+	var F8 = 119;
+	var F9 = 120;
+	var F10 = 121;
+	var F11 = 122;
+	var F12 = 123;
+	var F13 = 124;
+	var F14 = 125;
+	var F15 = 126;
+	var F16 = 127;
+	var F17 = 128;
+	var F18 = 129;
+	var F19 = 130;
+	var F20 = 131;
+	var F21 = 132;
+	var F22 = 133;
+	var F23 = 134;
+	var F24 = 135;
+	var NumLock = 144;
+	var ScrollLock = 145;
+	var WinOemFjJisho = 146;
+	var WinOemFjMasshou = 147;
+	var WinOemFjTouroku = 148;
+	var WinOemFjLoya = 149;
+	var WinOemFjRoya = 150;
+	var Circumflex = 160;
+	var Exclamation = 161;
+	var DoubleQuote = 162;
+	var Hash = 163;
+	var Dollar = 164;
+	var Percent = 165;
+	var Ampersand = 166;
+	var Underscore = 167;
+	var OpenParen = 168;
+	var CloseParen = 169;
+	var Asterisk = 170;
+	var Plus = 171;
+	var Pipe = 172;
+	var HyphenMinus = 173;
+	var OpenCurlyBracket = 174;
+	var CloseCurlyBracket = 175;
+	var Tilde = 176;
+	var VolumeMute = 181;
+	var VolumeDown = 182;
+	var VolumeUp = 183;
+	var Comma = 188;
+	var Period = 190;
+	var Slash = 191;
+	var BackQuote = 192;
+	var OpenBracket = 219;
+	var BackSlash = 220;
+	var CloseBracket = 221;
+	var Quote = 222;
+	var Meta = 224;
+	var AltGr = 225;
+	var WinIcoHelp = 227;
+	var WinIco00 = 228;
+	var WinIcoClear = 230;
+	var WinOemReset = 233;
+	var WinOemJump = 234;
+	var WinOemPA1 = 235;
+	var WinOemPA2 = 236;
+	var WinOemPA3 = 237;
+	var WinOemWSCTRL = 238;
+	var WinOemCUSEL = 239;
+	var WinOemATTN = 240;
+	var WinOemFinish = 241;
+	var WinOemCopy = 242;
+	var WinOemAuto = 243;
+	var WinOemENLW = 244;
+	var WinOemBackTab = 245;
+	var ATTN = 246;
+	var CRSEL = 247;
+	var EXSEL = 248;
+	var EREOF = 249;
+	var Play = 250;
+	var Zoom = 251;
+	var PA1 = 253;
+	var WinOemClear = 254;
+
+	function normalize():KeyCode {
+		return switch (this) {
+			case 91, 93: Meta; // left/right in Chrome
+			case 186: Semicolon;
+			case 187: Equals;
+			case 189: HyphenMinus;
+			default: cast this;
+		}
+	}
+}
diff --git a/src/client/Buttons.hx b/src/client/Buttons.hx
index a04b444..769cb25 100644
--- a/src/client/Buttons.hx
+++ b/src/client/Buttons.hx
@@ -288,13 +288,54 @@ class Buttons {
 	public static function initTextButtons(main:Main):Void {
 		final synchThresholdBtn = ge("#synchThresholdBtn");
 		synchThresholdBtn.onclick = e -> {
-			var secs = main.synchThreshold + 1;
+			var secs = settings.synchThreshold + 1;
 			if (secs > 5) secs = 1;
 			main.setSynchThreshold(secs);
-			updateSynchThresholdBtn(main);
+			updateSynchThresholdBtn();
 			synchThresholdBtn.blur();
 		}
-		updateSynchThresholdBtn(main);
+		updateSynchThresholdBtn();
+
+		final hotkeysBtn = ge("#hotkeysBtn");
+		hotkeysBtn.onclick = e -> {
+			settings.hotkeysEnabled = !settings.hotkeysEnabled;
+			Settings.write(settings);
+			updateHotkeysBtn();
+			hotkeysBtn.blur();
+		}
+		updateHotkeysBtn();
+	}
+
+	public static function initHotkeys(main:Main, player:Player):Void {
+		ge("#mediarefresh").title += " (Alt-R)";
+		ge("#voteskip").title += " (Alt-S)";
+		ge("#getplaylist").title += " (Alt-C)";
+		ge("#fullscreenbtn").title += " (Alt-F)";
+		ge("#leader_btn").title += " (Alt-L)";
+		window.onkeydown = function(e:KeyboardEvent) {
+			if (!settings.hotkeysEnabled) return;
+			final target:Element = cast e.target;
+			if (target.isContentEditable) return;
+			final tagName = target.tagName;
+			if (tagName == "INPUT" || tagName == "TEXTAREA") return;
+			final key:KeyCode = cast e.keyCode;
+			if (key == Backspace) e.preventDefault();
+			if (!e.altKey) return;
+			switch (key) {
+				case R: ge("#mediarefresh").onclick();
+				case S: ge("#voteskip").onclick();
+				case C: ge("#getplaylist").onclick();
+				case F: ge("#fullscreenbtn").onclick();
+				case L: ge("#leader_btn").onclick();
+				case P:
+					if (!main.isLeader()) {
+						Timer.delay(() -> player.pause(), 500);
+					}
+					ge("#leader_btn").onclick();
+				default: return;
+			}
+			e.preventDefault();
+		}
 	}
 
 	static function hideMenus():Void {
@@ -302,12 +343,18 @@ class Buttons {
 		for (menu in menus) menu.style.display = "";
 	}
 
-	static function updateSynchThresholdBtn(main:Main):Void {
+	static function updateSynchThresholdBtn():Void {
 		final text = Lang.get("synchThreshold");
-		final secs = main.synchThreshold;
+		final secs = settings.synchThreshold;
 		ge("#synchThresholdBtn").innerText = '$text: ${secs}s';
 	}
 
+	static function updateHotkeysBtn():Void {
+		final text = Lang.get("hotkeys");
+		final state = settings.hotkeysEnabled ? Lang.get("on") : Lang.get("off");
+		ge("#hotkeysBtn").innerText = '$text: $state';
+	}
+
 	static function initChatInput(main:Main):Void {
 		final guestName:InputElement = cast ge("#guestname");
 		guestName.onkeydown = e -> {
diff --git a/src/client/ClientSettings.hx b/src/client/ClientSettings.hx
index 4e931d3..213d463 100644
--- a/src/client/ClientSettings.hx
+++ b/src/client/ClientSettings.hx
@@ -10,5 +10,6 @@ typedef ClientSettings = {
 	synchThreshold:Int,
 	isSwapped:Bool,
 	isUserListHidden:Bool,
-	latestLinks:Array<String>
+	latestLinks:Array<String>,
+	hotkeysEnabled:Bool
 }
diff --git a/src/client/Main.hx b/src/client/Main.hx
index 9ecae82..deeb2ec 100644
--- a/src/client/Main.hx
+++ b/src/client/Main.hx
@@ -22,10 +22,9 @@ using ClientTools;
 
 class Main {
 
-	static inline var SETTINGS_VERSION = 1;
+	static inline var SETTINGS_VERSION = 2;
 	public final settings:ClientSettings;
 	public var isSyncActive = true;
-	public var synchThreshold(get, never):Int;
 	final clients:Array<Client> = [];
 	var pageTitle = document.title;
 	final host:String;
@@ -59,7 +58,8 @@ class Main {
 			synchThreshold: 2,
 			isSwapped: false,
 			isUserListHidden: false,
-			latestLinks: []
+			latestLinks: [],
+			hotkeysEnabled: true
 		}
 		Settings.init(defaults, settingsPatcher);
 		settings = Settings.read();
@@ -76,18 +76,16 @@ class Main {
 		}
 		Lang.init("langs", () -> {
 			Buttons.initTextButtons(this);
+			Buttons.initHotkeys(this, player);
 			openWebSocket(host, port);
 		});
 	}
 
-	inline function get_synchThreshold():Int {
-		return settings.synchThreshold;
-	}
-
 	function settingsPatcher(data:Any, version:Int):Any {
 		switch (version) {
-			// case 1:
-			// 	final data:ClientSettings = data;
+			case 1:
+				final data:ClientSettings = data;
+				data.hotkeysEnabled = true;
 			case SETTINGS_VERSION, _:
 				throw 'skipped version $version';
 		}
@@ -400,6 +398,7 @@ class Main {
 					player.setPlaybackRate(data.getTime.rate);
 				}
 
+				final synchThreshold = settings.synchThreshold;
 				final newTime = data.getTime.time;
 				final time = player.getTime();
 				if (isLeader()) {
@@ -416,6 +415,7 @@ class Main {
 				player.setTime(newTime);
 
 			case SetTime:
+				final synchThreshold = settings.synchThreshold;
 				final newTime = data.setTime.time;
 				final time = player.getTime();
 				if (Math.abs(time - newTime) < synchThreshold) return;