Add keybind for previewing a segment

9 files changed, 39 insertions, 6 deletions

diff --git a/public/_locales b/public/_locales
-Subproject 7f2d4e63dc53facfeed96aae1086c2bc3329b51
+Subproject baf39106e0471e89dd85c17871017dc38b99134
diff --git a/public/options/options.html b/public/options/options.html
index 01a3b345..146b7956 100644
--- a/public/options/options.html
+++ b/public/options/options.html
@@ -448,6 +448,11 @@
 					<div class="inline"></div>
 				</div>
 
+				<div data-type="keybind-change" data-sync="previewKeybind">	
+					<label class="optionLabel">__MSG_setPreviewKeybind__:</label>
+					<div class="inline"></div>
+				</div>
+
 				<div data-type="keybind-change" data-sync="actuallySubmitKeybind">	
 					<label class="optionLabel">__MSG_setSubmitKeybind__:</label>
 					<div class="inline"></div>
diff --git a/src/components/SponsorTimeEditComponent.tsx b/src/components/SponsorTimeEditComponent.tsx
index 81f43753..c6369e2e 100644
--- a/src/components/SponsorTimeEditComponent.tsx
+++ b/src/components/SponsorTimeEditComponent.tsx
@@ -8,6 +8,7 @@ import SelectorComponent, { SelectorOption } from "./SelectorComponent";
 import { DEFAULT_CATEGORY } from "../utils/categoryUtils";
 import { getFormattedTime, getFormattedTimeToSeconds } from "../../maze-utils/src/formating";
 import { asyncRequestToServer } from "../utils/requests";
+import { defaultPreviewTime } from "../utils/constants";
 
 export interface SponsorTimeEditProps {
     index: number;
@@ -671,7 +672,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
     previewTime(ctrlPressed = false, shiftPressed = false, skipToEndTime = false): void {
         const sponsorTimes = this.props.contentContainer().sponsorTimesSubmitting;
         const index = this.props.index;
-        let seekTime = 2;
+        let seekTime = defaultPreviewTime;
         if (ctrlPressed) seekTime = 0.5;
         if (shiftPressed) seekTime = 0.25;
 
diff --git a/src/components/SubmissionNoticeComponent.tsx b/src/components/SubmissionNoticeComponent.tsx
index 9aa52670..a49e3dda 100644
--- a/src/components/SubmissionNoticeComponent.tsx
+++ b/src/components/SubmissionNoticeComponent.tsx
@@ -82,13 +82,17 @@ class SubmissionNoticeComponent extends React.Component<SubmissionNoticeProps, S
         if (currentSegmentCount > this.lastSegmentCount) {
             this.lastSegmentCount = currentSegmentCount;
 
-            const scrollElement = this.noticeRef.current.getElement().current.querySelector("#sponsorSkipNoticeMiddleRowSubmissionNotice");
-            scrollElement.scrollTo({
-                top: scrollElement.scrollHeight + 1000
-            });
+            this.scrollToBottom();
         }
     }
 
+    scrollToBottom() {
+        const scrollElement = this.noticeRef.current.getElement().current.querySelector("#sponsorSkipNoticeMiddleRowSubmissionNotice");
+        scrollElement.scrollTo({
+            top: scrollElement.scrollHeight + 1000
+        });
+    }
+
     render(): React.ReactElement {
         const sortButton = 
             <img id={"sponsorSkipSortButton" + this.state.idSuffix} 
diff --git a/src/components/options/KeybindDialogComponent.tsx b/src/components/options/KeybindDialogComponent.tsx
index 2fdd728d..b034d7eb 100644
--- a/src/components/options/KeybindDialogComponent.tsx
+++ b/src/components/options/KeybindDialogComponent.tsx
@@ -144,6 +144,7 @@ class KeybindDialogComponent extends React.Component<KeybindDialogProps, Keybind
         if (this.props.option !== "skipKeybind" && this.equals(Config.config['skipKeybind']) ||
                 this.props.option !== "submitKeybind" && this.equals(Config.config['submitKeybind']) ||
                 this.props.option !== "actuallySubmitKeybind" && this.equals(Config.config['actuallySubmitKeybind']) ||
+                this.props.option !== "previewKeybind" && this.equals(Config.config['previewKeybind']) ||
                 this.props.option !== "closeSkipNoticeKeybind" && this.equals(Config.config['closeSkipNoticeKeybind']) ||
                 this.props.option !== "startSponsorKeybind" && this.equals(Config.config['startSponsorKeybind']))
             return {message: chrome.i18n.getMessage("keyAlreadyUsed"), blocking: true};
diff --git a/src/config.ts b/src/config.ts
index a8a8a682..81f41997 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -91,6 +91,7 @@ interface SBConfig {
     startSponsorKeybind: Keybind;
     submitKeybind: Keybind;
     actuallySubmitKeybind: Keybind;
+    previewKeybind: Keybind;
     nextChapterKeybind: Keybind;
     previousChapterKeybind: Keybind;
     closeSkipNoticeKeybind: Keybind;
@@ -347,6 +348,7 @@ const syncDefaults = {
     startSponsorKeybind: { key: ";" },
     submitKeybind: { key: "'" },
     actuallySubmitKeybind: { key: "'", ctrl: true },
+    previewKeybind: { key: ";", ctrl: true },
     nextChapterKeybind: { key: "ArrowRight", ctrl: true },
     previousChapterKeybind: { key: "ArrowLeft", ctrl: true },
     closeSkipNoticeKeybind: { key: "Backspace" },
diff --git a/src/content.ts b/src/content.ts
index d04aba00..bf4b252c 100644
--- a/src/content.ts
+++ b/src/content.ts
@@ -48,6 +48,7 @@ import { addCleanupListener } from "../maze-utils/src/cleanup";
 import { hideDeArrowPromotion, tryShowingDeArrowPromotion } from "./dearrowPromotion";
 import { asyncRequestToServer } from "./utils/requests";
 import { isMobileControlsOpen } from "./utils/mobileUtils";
+import { defaultPreviewTime } from "./utils/constants";
 
 cleanPage();
 
@@ -2230,7 +2231,16 @@ function openSubmissionMenu() {
     if (sponsorTimesSubmitting !== undefined && sponsorTimesSubmitting.length > 0) {
         submissionNotice = new SubmissionNotice(skipNoticeContentContainer, sendSubmitMessage);
     }
+}
 
+function previewRecentSegment() {
+    if (sponsorTimesSubmitting !== undefined && sponsorTimesSubmitting.length > 0) {
+        previewTime(sponsorTimesSubmitting[sponsorTimesSubmitting.length - 1].segment[0] - defaultPreviewTime);
+        
+        if (submissionNotice) {
+            submissionNotice.scrollToBottom();
+        }
+    }
 }
 
 function submitSegments() {
@@ -2444,6 +2454,7 @@ function hotkeyListener(e: KeyboardEvent): void {
     const closeSkipNoticeKey = Config.config.closeSkipNoticeKeybind;
     const startSponsorKey = Config.config.startSponsorKeybind;
     const submitKey = Config.config.actuallySubmitKeybind;
+    const previewKey = Config.config.previewKeybind;
     const openSubmissionMenuKey = Config.config.submitKeybind;
     const nextChapterKey = Config.config.nextChapterKeybind;
     const previousChapterKey = Config.config.previousChapterKeybind;
@@ -2475,6 +2486,9 @@ function hotkeyListener(e: KeyboardEvent): void {
     } else if (keybindEquals(key, openSubmissionMenuKey)) {
         openSubmissionMenu();
         return;
+    } else if (keybindEquals(key, previewKey)) {
+        previewRecentSegment();
+        return;
     } else if (keybindEquals(key, nextChapterKey)) {
         if (sponsorTimes.length > 0) e.stopPropagation();
         nextChapter();
diff --git a/src/render/SubmissionNotice.tsx b/src/render/SubmissionNotice.tsx
index 671dde6b..5e9fbfbd 100644
--- a/src/render/SubmissionNotice.tsx
+++ b/src/render/SubmissionNotice.tsx
@@ -56,6 +56,10 @@ class SubmissionNotice {
     submit(): void {
         this.noticeRef.current?.submit?.();
     }
+
+    scrollToBottom(): void {
+        this.noticeRef.current?.scrollToBottom?.();
+    }
 }
 
 export default SubmissionNotice;
\ No newline at end of file
diff --git a/src/utils/constants.ts b/src/utils/constants.ts
index dd44676a..afceb710 100644
--- a/src/utils/constants.ts
+++ b/src/utils/constants.ts
@@ -157,4 +157,6 @@ export function getGuidelineInfo(category: Category): TextBox[] {
                 text: chrome.i18n.getMessage(`generic_guideline2`)
             }];
     }
-}
\ No newline at end of file
+}
+
+export const defaultPreviewTime = 2;
\ No newline at end of file