diff --git a/ui/v2.5/src/components/Changelog/versions/v0120.md b/ui/v2.5/src/components/Changelog/versions/v0120.md index df2b0af2b..f9f4348cc 100644 --- a/ui/v2.5/src/components/Changelog/versions/v0120.md +++ b/ui/v2.5/src/components/Changelog/versions/v0120.md @@ -5,6 +5,7 @@ * Add forward jump 10 second button to video player. ([#1973](https://github.com/stashapp/stash/pull/1973)) ### 🎨 Improvements +* Added keyboard shortcuts to hide scene page sidebar and scene scrubber. ([#2099](https://github.com/stashapp/stash/pull/2099)) * Overhauled, restructured and added auto-save to the settings pages. ([#2086](https://github.com/stashapp/stash/pull/2086)) * Include path and hashes in destroy scene/image/gallery post hook input. ([#2102](https://github.com/stashapp/stash/pull/2102/files)) * Rollback operation if files fail to be deleted. ([#1954](https://github.com/stashapp/stash/pull/1954)) diff --git a/ui/v2.5/src/components/ScenePlayer/ScenePlayer.tsx b/ui/v2.5/src/components/ScenePlayer/ScenePlayer.tsx index bef7c429b..4259bd997 100644 --- a/ui/v2.5/src/components/ScenePlayer/ScenePlayer.tsx +++ b/ui/v2.5/src/components/ScenePlayer/ScenePlayer.tsx @@ -218,6 +218,8 @@ export class ScenePlayerImpl extends React.Component< this.props.scene.paths.funscript || "" ); } + + this.player.getContainer().focus(); } private onSeeked() { diff --git a/ui/v2.5/src/components/ScenePlayer/styles.scss b/ui/v2.5/src/components/ScenePlayer/styles.scss index 1c23171dd..8f43ca7aa 100644 --- a/ui/v2.5/src/components/ScenePlayer/styles.scss +++ b/ui/v2.5/src/components/ScenePlayer/styles.scss @@ -34,6 +34,10 @@ $sceneTabWidth: 450px; &.portrait .video-wrapper { height: 177.78vw; } + + .jwplayer { + outline: none; + } } .scene-tabs, @@ -115,6 +119,10 @@ $sceneTabWidth: 450px; position: relative; } +.hide-scrubber .scrubber-wrapper { + display: none; +} + /* hide scrubber when height is < 450px or width < 576 */ @media (max-height: 449px), (max-width: 575px) { .scrubber-wrapper { diff --git a/ui/v2.5/src/components/Scenes/SceneDetails/Scene.tsx b/ui/v2.5/src/components/Scenes/SceneDetails/Scene.tsx index be1be4d5f..e4eff96e9 100644 --- a/ui/v2.5/src/components/Scenes/SceneDetails/Scene.tsx +++ b/ui/v2.5/src/components/Scenes/SceneDetails/Scene.tsx @@ -53,6 +53,7 @@ const ScenePage: React.FC = ({ scene, refetch }) => { const [generateScreenshot] = useSceneGenerateScreenshot(); const [timestamp, setTimestamp] = useState(getInitialTimestamp()); const [collapsed, setCollapsed] = useState(false); + const [showScrubber, setShowScrubber] = useState(true); const { data: sceneStreams, @@ -549,22 +550,26 @@ const ScenePage: React.FC = ({ scene, refetch }) => { Mousetrap.bind("q", () => setActiveTabKey("scene-queue-panel")); Mousetrap.bind("e", () => setActiveTabKey("scene-edit-panel")); Mousetrap.bind("k", () => setActiveTabKey("scene-markers-panel")); - Mousetrap.bind("f", () => setActiveTabKey("scene-file-info-panel")); + Mousetrap.bind("i", () => setActiveTabKey("scene-file-info-panel")); Mousetrap.bind("o", () => onIncrementClick()); Mousetrap.bind("p n", () => onQueueNext()); Mousetrap.bind("p p", () => onQueuePrevious()); Mousetrap.bind("p r", () => onQueueRandom()); + Mousetrap.bind(",", () => setCollapsed(!collapsed)); + Mousetrap.bind(".", () => setShowScrubber(!showScrubber)); return () => { Mousetrap.unbind("a"); Mousetrap.unbind("q"); Mousetrap.unbind("e"); Mousetrap.unbind("k"); - Mousetrap.unbind("f"); + Mousetrap.unbind("i"); Mousetrap.unbind("o"); Mousetrap.unbind("p n"); Mousetrap.unbind("p p"); Mousetrap.unbind("p r"); + Mousetrap.unbind(","); + Mousetrap.unbind("."); }; }); @@ -617,7 +622,9 @@ const ScenePage: React.FC = ({ scene, refetch }) => {
{!rerenderPlayer ? (