diff --git a/backend/src/api/schemas/config-schema.ts b/backend/src/api/schemas/config-schema.ts index d72064365..98db9a2f3 100644 --- a/backend/src/api/schemas/config-schema.ts +++ b/backend/src/api/schemas/config-schema.ts @@ -27,7 +27,7 @@ const CONFIG_SCHEMA = joi.object({ showLiveWpm: joi.boolean(), showTimerProgress: joi.boolean(), smoothCaret: joi.boolean(), - quickTab: joi.boolean(), + quickRestart: joi.string().valid("off", "tab", "esc"), punctuation: joi.boolean(), numbers: joi.boolean(), words: joi.number().min(0), @@ -74,7 +74,6 @@ const CONFIG_SCHEMA = joi.object({ playSoundOnClick: joi.string().valid("off", ..._.range(1, 8).map(_.toString)), soundVolume: joi.string().valid("0.1", "0.5", "1.0"), startGraphsAtZero: joi.boolean(), - swapEscAndTab: joi.boolean(), showOutOfFocusWarning: joi.boolean(), paceCaret: joi.string().valid("off", "average", "pb", "last", "custom"), paceCaretCustomSpeed: joi.number().min(0), diff --git a/frontend/src/ts/config.ts b/frontend/src/ts/config.ts index e3cc4df0d..53a67fcb2 100644 --- a/frontend/src/ts/config.ts +++ b/frontend/src/ts/config.ts @@ -339,16 +339,6 @@ export function setShowOutOfFocusWarning( return true; } -export function setSwapEscAndTab(val: boolean, nosave?: boolean): boolean { - if (!isConfigValueValid("swap esc and tab", val, ["boolean"])) return false; - - config.swapEscAndTab = val; - saveToLocalStorage("swapEscAndTab", nosave); - ConfigEvent.dispatch("swapEscAndTab", config.swapEscAndTab); - - return true; -} - //pace caret export function setPaceCaret( val: MonkeyTypes.PaceCaret, @@ -1118,24 +1108,25 @@ export function setSmoothLineScroll(mode: boolean, nosave?: boolean): boolean { return true; } -//quick tab -export function setQuickTabMode(mode: boolean, nosave?: boolean): boolean { - if (!isConfigValueValid("quick tab mode", mode, ["boolean"])) return false; - - config.quickTab = mode; - if (!config.quickTab) { - $("#restartTestButton").removeClass("hidden"); - $("#restartTestButton").css("opacity", 1); - $("#bottom .keyTips") - .html(`tab and enter / space - restart test
- ctrl/cmd+shift+p or esc - command line`); - } else { - $("#restartTestButton").addClass("hidden"); - $("#bottom .keyTips").html(`tab - restart test
- ctrl/cmd+shift+p or esc - command line`); +//quick restart +export function setQuickRestartMode( + mode: "off" | "esc" | "tab", + nosave?: boolean +): boolean { + if ( + !isConfigValueValid("quick restart mode", mode, [["off", "esc", "tab"]]) + ) { + return false; } - saveToLocalStorage("quickTab", nosave); - ConfigEvent.dispatch("quickTab", config.quickTab); + + if (mode === "off") { + $(".pageTest #restartTestButton").removeClass("hidden"); + } else { + $(".pageTest #restartTestButton").addClass("hidden"); + } + config.quickRestart = mode; + saveToLocalStorage("quickRestart", nosave); + ConfigEvent.dispatch("quickRestart", config.quickRestart); return true; } @@ -1751,7 +1742,7 @@ export function apply( setCustomBackground(configObj.customBackground, true); setCustomBackgroundSize(configObj.customBackgroundSize, true); setCustomBackgroundFilter(configObj.customBackgroundFilter, true); - setQuickTabMode(configObj.quickTab, true); + setQuickRestartMode(configObj.quickRestart, true); setKeyTips(configObj.showKeyTips, true); setTimeConfig(configObj.time, true); setQuoteLength(configObj.quoteLength, true); @@ -1795,7 +1786,6 @@ export function apply( setFunbox(configObj.funbox, true); setRandomTheme(configObj.randomTheme, true); setShowAllLines(configObj.showAllLines, true); - setSwapEscAndTab(configObj.swapEscAndTab, true); setShowOutOfFocusWarning(configObj.showOutOfFocusWarning, true); setPaceCaret(configObj.paceCaret, true); setPaceCaretCustomSpeed(configObj.paceCaretCustomSpeed, true); diff --git a/frontend/src/ts/constants/default-config.ts b/frontend/src/ts/constants/default-config.ts index e354efdc4..b7220d515 100644 --- a/frontend/src/ts/constants/default-config.ts +++ b/frontend/src/ts/constants/default-config.ts @@ -21,7 +21,7 @@ export default { showLiveWpm: false, showTimerProgress: true, smoothCaret: true, - quickTab: false, + quickRestart: "off", punctuation: false, numbers: false, words: 50, @@ -63,7 +63,6 @@ export default { playSoundOnClick: "off", soundVolume: "0.5", startGraphsAtZero: true, - swapEscAndTab: false, showOutOfFocusWarning: true, paceCaret: "off", paceCaretCustomSpeed: 100, diff --git a/frontend/src/ts/controllers/input-controller.ts b/frontend/src/ts/controllers/input-controller.ts index 62ae41e6c..8bd83dde7 100644 --- a/frontend/src/ts/controllers/input-controller.ts +++ b/frontend/src/ts/controllers/input-controller.ts @@ -611,11 +611,11 @@ function handleTab(event: JQuery.KeyDownEvent, popupVisible: boolean): void { const modalVisible = !$("#commandLineWrapper").hasClass("hidden") || popupVisible; - if (Config.quickTab) { + if (Config.quickRestart === "tab") { // dont do anything special if (modalVisible) return; - // dont do anything on login so we can tab betweeen inputs + // dont do anything on login so we can tab/esc betweeen inputs if (ActivePage.get() === "login") return; // change page if not on test page @@ -689,13 +689,34 @@ $(document).keydown(async (event) => { } //tab - if ( - (event.key == "Tab" && !Config.swapEscAndTab) || - (event.key == "Escape" && Config.swapEscAndTab) - ) { + if (event.key == "Tab") { handleTab(event, popupVisible); } + //esc + if (event.key === "Escape" && Config.quickRestart === "esc") { + const modalVisible = + !$("#commandLineWrapper").hasClass("hidden") || popupVisible; + + if (modalVisible) return; + + // change page if not on test page + if (ActivePage.get() !== "test") { + PageController.change("test"); + return; + } + + // in case we are in a long test, setting manual restart + if (event.shiftKey) { + ManualRestart.set(); + } else { + ManualRestart.reset(); + } + + //otherwise restart + TestLogic.restart(false, false, event); + } + if (!allowTyping) return; if (!event.originalEvent?.isTrusted || TestUI.testRestarting) { diff --git a/frontend/src/ts/db.ts b/frontend/src/ts/db.ts index d764ab632..8b0f68090 100644 --- a/frontend/src/ts/db.ts +++ b/frontend/src/ts/db.ts @@ -107,6 +107,15 @@ export async function initSnapshot(): Promise< // } // LoadingPage.updateText("Downloading config..."); if (configData) { + //swap legacy values to new ones + if (configData.quickTab === true) { + configData.quickRestart = "tab"; + } + + if (configData.swapEscAndTab === true) { + configData.quickRestart = "esc"; + } + const newConfig = { ...DefaultConfig, }; diff --git a/frontend/src/ts/elements/commandline-lists.ts b/frontend/src/ts/elements/commandline-lists.ts index 3d3e387a6..169cde5c5 100644 --- a/frontend/src/ts/elements/commandline-lists.ts +++ b/frontend/src/ts/elements/commandline-lists.ts @@ -908,29 +908,6 @@ const commandsLazyMode: MonkeyTypes.CommandsGroup = { ], }; -const commandsSwapEscAndTab: MonkeyTypes.CommandsGroup = { - title: "Swap esc and tab...", - configKey: "swapEscAndTab", - list: [ - { - id: "setSwapEscAndTabOff", - display: "off", - configValue: false, - exec: (): void => { - UpdateConfig.setSwapEscAndTab(false); - }, - }, - { - id: "setSwapEscAndTabOn", - display: "on", - configValue: true, - exec: (): void => { - UpdateConfig.setSwapEscAndTab(true); - }, - }, - ], -}; - const commandsShowAllLines: MonkeyTypes.CommandsGroup = { title: "Show all lines...", configKey: "showAllLines", @@ -2158,24 +2135,32 @@ const commandsSmoothCaret: MonkeyTypes.CommandsGroup = { ], }; -const commandsQuickTab: MonkeyTypes.CommandsGroup = { - title: "Quick tab...", - configKey: "quickTab", +const commandsQuickRestart: MonkeyTypes.CommandsGroup = { + title: "Quick restart...", + configKey: "quickRestart", list: [ { - id: "changeQuickTabOn", - display: "on", - configValue: true, + id: "changeQuickRestartTab", + display: "tab", + configValue: "tab", exec: (): void => { - UpdateConfig.setQuickTabMode(true); + UpdateConfig.setQuickRestartMode("tab"); }, }, { - id: "changeQuickTabOff", - display: "off", - configValue: false, + id: "changeQuickRestartEsc", + display: "esc", + configValue: "esc", exec: (): void => { - UpdateConfig.setQuickTabMode(false); + UpdateConfig.setQuickRestartMode("esc"); + }, + }, + { + id: "changeQuickRestartOff", + display: "off", + configValue: "off", + exec: (): void => { + UpdateConfig.setQuickRestartMode("off"); }, }, ], @@ -2734,10 +2719,10 @@ export const defaultCommands: MonkeyTypes.CommandsGroup = { subgroup: commandsSmoothCaret, }, { - id: "changeQuickTab", - display: "Quick tab...", + id: "changeQuickRestart", + display: "Quick restart...", icon: "fa-redo-alt", - subgroup: commandsQuickTab, + subgroup: commandsQuickRestart, }, { id: "changeRepeatQuotes", @@ -2903,12 +2888,6 @@ export const defaultCommands: MonkeyTypes.CommandsGroup = { icon: "fa-chart-line", subgroup: commandsStartGraphsAtZero, }, - { - id: "changeSwapEscAndTab", - display: "Swap esc and tab...", - icon: "fa-exchange-alt", - subgroup: commandsSwapEscAndTab, - }, { id: "changeLazyMode", display: "Lazy mode...", diff --git a/frontend/src/ts/elements/commandline.ts b/frontend/src/ts/elements/commandline.ts index 149f0d54b..fc3e6bc00 100644 --- a/frontend/src/ts/elements/commandline.ts +++ b/frontend/src/ts/elements/commandline.ts @@ -387,14 +387,27 @@ $("#commandLine input").keyup((e) => { $(document).ready(() => { $(document).on("keydown", (event) => { if (PageTransition.get()) return event.preventDefault(); - // opens command line if escape, ctrl/cmd + shift + p, or tab is pressed if the setting swapEscAndTab is enabled + // opens command line if escape or ctrl/cmd + shift + p if ( - event.key === "Escape" || + event.key === "Escape" && + !$("#commandLineWrapper").hasClass("hidden") + ) { + if (CommandlineLists.current.length > 1) { + CommandlineLists.current.pop(); + $("#commandLine").removeClass("allCommands"); + show(); + } else { + hide(); + } + UpdateConfig.setFontFamily(Config.fontFamily, true); + return; + } + if ( + (event.key === "Escape" && Config.quickRestart !== "esc") || (event.key && event.key.toLowerCase() === "p" && (event.metaKey || event.ctrlKey) && - event.shiftKey) || - (event.key === "Tab" && Config.swapEscAndTab) + event.shiftKey) ) { event.preventDefault(); @@ -402,23 +415,12 @@ $(document).ready(() => { if (popupVisible) return; - if (!$("#commandLineWrapper").hasClass("hidden")) { - if (CommandlineLists.current.length > 1) { - CommandlineLists.current.pop(); - $("#commandLine").removeClass("allCommands"); - show(); - } else { - hide(); - } - UpdateConfig.setFontFamily(Config.fontFamily, true); - } else if (event.key === "Tab" || !Config.swapEscAndTab) { - if (Config.singleListCommandLine == "on") { - useSingleListCommandLine(false); - } else { - CommandlineLists.setCurrent([CommandlineLists.defaultCommands]); - } - show(); + if (Config.singleListCommandLine == "on") { + useSingleListCommandLine(false); + } else { + CommandlineLists.setCurrent([CommandlineLists.defaultCommands]); } + show(); } }); }); diff --git a/frontend/src/ts/index.ts b/frontend/src/ts/index.ts index 65ddacd9e..c0e905579 100644 --- a/frontend/src/ts/index.ts +++ b/frontend/src/ts/index.ts @@ -4,6 +4,7 @@ import "../styles/index.scss"; import "./firebase"; import * as DB from "./db"; +import "./ui"; import Config from "./config"; import * as TestStats from "./test/test-stats"; import * as Replay from "./test/replay"; @@ -20,7 +21,6 @@ import "./popups/edit-preset-popup"; import "./popups/simple-popups"; import "./controllers/input-controller"; import "./ready"; -import "./ui"; import "./pages/about"; import "./popups/pb-tables-popup"; import "./elements/scroll-to-top"; diff --git a/frontend/src/ts/pages/settings.ts b/frontend/src/ts/pages/settings.ts index df1fff6be..ad0da6875 100644 --- a/frontend/src/ts/pages/settings.ts +++ b/frontend/src/ts/pages/settings.ts @@ -34,9 +34,9 @@ async function initGroups(): Promise { UpdateConfig.setDifficulty, "button" ); - groups["quickTab"] = new SettingsGroup( - "quickTab", - UpdateConfig.setQuickTabMode, + groups["quickRestart"] = new SettingsGroup( + "quickRestart", + UpdateConfig.setQuickRestartMode, "button" ); groups["showLiveWpm"] = new SettingsGroup( @@ -196,11 +196,6 @@ async function initGroups(): Promise { UpdateConfig.setFlipTestColors, "button" ); - groups["swapEscAndTab"] = new SettingsGroup( - "swapEscAndTab", - UpdateConfig.setSwapEscAndTab, - "button" - ); groups["showOutOfFocusWarning"] = new SettingsGroup( "showOutOfFocusWarning", UpdateConfig.setShowOutOfFocusWarning, diff --git a/frontend/src/ts/ready.ts b/frontend/src/ts/ready.ts index 54be61072..da0afbeff 100644 --- a/frontend/src/ts/ready.ts +++ b/frontend/src/ts/ready.ts @@ -48,7 +48,7 @@ $(document).ready(() => { } CookiePopup.check(); $("body").css("transition", "all .25s, transform .05s"); - if (Config.quickTab) { + if (Config.quickRestart === "tab" || Config.quickRestart === "esc") { $("#restartTestButton").addClass("hidden"); } if (!window.localStorage.getItem("merchbannerclosed")) { diff --git a/frontend/src/ts/test/test-logic.ts b/frontend/src/ts/test/test-logic.ts index cc6016f4f..9bf6d2081 100644 --- a/frontend/src/ts/test/test-logic.ts +++ b/frontend/src/ts/test/test-logic.ts @@ -335,8 +335,10 @@ export function restart( ) ) { let message = "Use your mouse to confirm."; - if (Config.quickTab) { + if (Config.quickRestart === "tab") { message = "Press shift + tab or use your mouse to confirm."; + } else if (Config.quickRestart === "esc") { + message = "Press shift + escape or use your mouse to confirm."; } Notifications.add("Quick restart disabled. " + message, 0, 3); return; diff --git a/frontend/src/ts/types/types.d.ts b/frontend/src/ts/types/types.d.ts index 2bc461e38..d9bdab101 100644 --- a/frontend/src/ts/types/types.d.ts +++ b/frontend/src/ts/types/types.d.ts @@ -309,7 +309,7 @@ declare namespace MonkeyTypes { showLiveWpm: boolean; showTimerProgress: boolean; smoothCaret: boolean; - quickTab: boolean; + quickRestart: "off" | "esc" | "tab"; punctuation: boolean; numbers: boolean; words: WordsModes; @@ -351,7 +351,6 @@ declare namespace MonkeyTypes { playSoundOnClick: PlaySoundOnClick; soundVolume: SoundVolume; startGraphsAtZero: boolean; - swapEscAndTab: boolean; showOutOfFocusWarning: boolean; paceCaret: PaceCaret; paceCaretCustomSpeed: number; diff --git a/frontend/src/ts/ui.ts b/frontend/src/ts/ui.ts index 0977039a9..561bf3887 100644 --- a/frontend/src/ts/ui.ts +++ b/frontend/src/ts/ui.ts @@ -9,24 +9,28 @@ import * as TestUI from "./test/test-ui"; import { get as getActivePage } from "./states/active-page"; export function updateKeytips(): void { - if (Config.swapEscAndTab) { + if (Config.quickRestart === "esc") { $(".pageSettings .tip").html(` tip: You can also change all these settings quickly using the - command line ( - tab - )`); - $("#bottom .keyTips").html(` - esc - restart test
- tab - command line`); + command line (ctrl/cmd+shift+p)`); } else { $(".pageSettings .tip").html(` tip: You can also change all these settings quickly using the - command line ( - esc - )`); + command line (esc or ctrl/cmd+shift+p)`); + } + + if (Config.quickRestart === "esc") { + $("#bottom .keyTips").html(` + esc - restart test
+ ctrl/cmd+shift+p - command line`); + } else if (Config.quickRestart === "tab") { $("#bottom .keyTips").html(` tab - restart test
esc or ctrl/cmd+shift+p - command line`); + } else { + $("#bottom .keyTips").html(` + tab + enter - restart test
+ esc or ctrl/cmd+shift+p - command line`); } } @@ -108,5 +112,5 @@ $(window).on("resize", () => { }); ConfigEvent.subscribe((eventKey) => { - if (eventKey === "swapEscAndTab") updateKeytips(); + if (eventKey === "quickRestart") updateKeytips(); }); diff --git a/frontend/static/html/pages/settings.html b/frontend/static/html/pages/settings.html index c52cb3400..3ea41d8f6 100644 --- a/frontend/static/html/pages/settings.html +++ b/frontend/static/html/pages/settings.html @@ -161,25 +161,43 @@ -
-

quick tab mode

+
+

quick restart

Press tab - to quickly restart the test, or to quickly jump to the test page. This - function disables tab navigation on the website. + or + esc + to quickly restart the test, or to quickly jump to the test page. The + "tab" setting disables tab navigation on the website, while the "esc" + disables opening the command line with + esc + .
off
-
- on +
+ tab +
+
+ esc
@@ -722,28 +740,6 @@
-
-

swap esc and tab

-
Swap the behavior of tab and escape keys.
-
-
- off -
-
- on -
-
-

lazy mode