Skip to content

fix: respect autoplay trailers setting and stop preloading trailers#2397

Open
Moyasee wants to merge 2 commits into
mainfrom
fix/LBX-806
Open

fix: respect autoplay trailers setting and stop preloading trailers#2397
Moyasee wants to merge 2 commits into
mainfrom
fix/LBX-806

Conversation

@Moyasee

@Moyasee Moyasee commented Jun 23, 2026

Copy link
Copy Markdown
Contributor

When submitting this pull request, I confirm the following (please check the boxes):

  • I have read the Hydra documentation.
  • I have checked that there are no duplicate pull requests related to this request.
  • I have considered, and confirm that this submission is valuable to others.
  • I accept that this submission may not be used and the pull request may be closed at the discretion of the maintainers.

Fill in the PR content:

Closes LBX-806.

With "Automatically start playing trailers on the game page" disabled, Hydra was still loading every trailer at once on page open (paused). They now stay on the poster and only load once the user starts them.

What changed:

  • useHlsVideo gets a load flag, so HLS only attaches and fetches segments when a trailer is actually started.
  • Desktop gallery: trailers show a poster with a play overlay when autoplay is off; clicking it attaches and plays.
  • Big Picture: the carousel now reads the user preference (it was ignoring it before), defers loading, shows a play overlay, and the A button toggles play/pause. Native controls only appear once the trailer is loaded so the control bar is no longer stunted.
  • Big Picture: the overlay state is driven by the video's own play/pause events, and we let the native controls handle mouse clicks on the video itself, so clicking the trailer with the mouse no longer pauses and immediately resumes.

Tested on the desktop game page and in Big Picture with the setting both on and off, using mouse and gamepad.

When "Automatically start playing trailers" is disabled, trailers no longer
preload on the game page. They stay paused on the poster until the user starts
them, both in the desktop gallery and in Big Picture.

- gate HLS attach/load behind a load flag in useHlsVideo so segments are only
  fetched when a trailer is actually started
- desktop: add a play overlay that lazily attaches and plays the trailer on click
- big picture: read the user preference, defer load, add a play overlay, and let
  the A button toggle play/pause
- big picture: drive the overlay from the video play/pause events and skip our
  toggle when the click lands on the video so mouse clicks no longer double-toggle
- big picture: only show native controls once the trailer is loaded to avoid the
  stunted control bar
@Moyasee Moyasee added the bug Something isn't working label Jun 23, 2026
@greptile-apps

greptile-apps Bot commented Jun 23, 2026

Copy link
Copy Markdown
Contributor

Greptile Summary

This PR fixes the "autoplay trailers" setting being ignored in both the desktop gallery slider and the Big Picture carousel — trailers were preloading on page open regardless of the preference. The fix defers HLS attachment and segment fetching behind a load flag, shows a poster + play overlay when autoplay is off, and wires up proper onPlay/onPause event tracking so the overlay correctly reflects live playback state.

  • useHlsVideo gains a load flag; HLS only initialises and fetches when load=true, preventing any network activity until the user deliberately starts a trailer.
  • Desktop VideoPlayer wraps in a new gallery-slider__video-wrapper div that hosts the manual-start overlay, and a useEffect keeps started in sync with the loadOnDemand prop so settings changes are honoured without unmounting.
  • Big Picture ScreenshotCarousel reads useUserPreferences, derives autoplayEnabled (defaulting to false while preferences load), tracks startedIndices / playingIndex per-slide, and delegates A-button toggle and mouse-click handling through the reworked handleSelectItem.

Confidence Score: 5/5

Safe to merge — the change is narrowly scoped to deferring HLS attachment and segment fetching behind a user-preference flag, with no modifications to download, launch, or settings persistence paths.

The core load flag in useHlsVideo is simple and correctly guarded. Both the desktop and Big Picture VideoPlayer components handle HLS and native-video paths consistently. The useEffect that syncs started with loadOnDemand closes the settings-change edge case. Translation key "play" already exists in the game_details namespace. The one P2 note (overlay + native controls simultaneously visible after a manual start/pause) is purely cosmetic and does not affect functionality or data.

No files require special attention.

Important Files Changed

Filename Overview
src/shared/use-hls-video.ts Adds a load flag that guards the entire HLS-setup effect; correctly included in the dependency array so the effect re-runs when load flips to true.
src/renderer/src/pages/game-details/gallery-slider/video-player.tsx Adds loadOnDemand prop, started state, a useEffect to sync started with loadOnDemand changes, and a manual-start overlay. Non-HLS play() is called directly; HLS is auto-played via useHlsVideo on manifest parse. The "play" i18n key already exists in the game_details namespace.
src/big-picture/src/components/pages/game/screenshot-carousel/index.tsx Reads user preferences, derives autoplayEnabled, tracks startedIndices and playingIndex per slide, wires onPlay/onPause events, and reworks handleSelectItem to support the A-button play/pause toggle. The PLAY_ICON_SIZE constant correctly extracts the 28px literal per the project rule.
src/big-picture/src/components/pages/game/screenshot-carousel/video-player.tsx Adds load, onPlay, and onPause props; passes preload attribute correctly; delegates to useHlsVideo with the load flag. Both HLS and non-HLS paths updated consistently.
src/renderer/src/pages/game-details/gallery-slider/gallery-slider.tsx Adds loadOnDemand={!autoplayEnabled} to all VideoPlayer instances; the onSelect handler already re-registers when autoplayEnabled changes, so no stale-closure issue.
src/big-picture/src/pages/game/game.scss Adds position: relative to the surface and new overlay/icon classes; pointer-events: none on the overlay prevents blocking native controls.
src/renderer/src/pages/game-details/gallery-slider/gallery-slider.scss Adds wrapper, play-button, and play-icon classes for the new demand-load overlay with hover animation. CSS is self-contained and doesn't break existing layout.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[Game Page Opens] --> B{autoplayEnabled?}
    B -- Yes --> C[load=true\nautoplay=true for first video]
    B -- No --> D[load=false\nshowOverlay=true\npreload=none]
    C --> E[useHlsVideo attaches HLS\nfetches segments]
    D --> F[Poster shown\nPlay overlay visible]
    F --> G[User clicks Play]
    G --> H{HLS video?}
    H -- Yes --> I[setStarted=true\nRe-render: load=true, autoplay=true]
    I --> J[useHlsVideo creates HLS\nMANIFEST_PARSED plays]
    H -- No --> K[setStarted=true\nvideoRef.play called directly]
    J --> L[onPlay fires\nplayingIndex=index\noverlay hidden]
    K --> L
    L --> M{User pauses?}
    M -- Yes --> N[onPause fires\nplayingIndex=null\noverlay reappears + native controls visible]
    M -- No --> O[Video continues playing]
Loading
%%{init: {'theme': 'base', 'themeVariables': {"darkMode": true, "background": "#0d1117", "primaryColor": "#21262d", "primaryTextColor": "#e6edf3", "primaryBorderColor": "#8b949e", "lineColor": "#8b949e", "textColor": "#e6edf3", "edgeLabelBackground": "#161b22", "actorBkg": "#21262d", "actorBorder": "#8b949e", "actorTextColor": "#e6edf3", "actorLineColor": "#8b949e", "signalColor": "#8b949e", "signalTextColor": "#e6edf3", "noteBkgColor": "#373320", "noteBorderColor": "#d4a72c", "noteTextColor": "#f0e6c0", "labelBoxBkgColor": "#21262d", "labelBoxBorderColor": "#8b949e", "labelTextColor": "#e6edf3", "loopTextColor": "#e6edf3", "activationBkgColor": "#30363d", "activationBorderColor": "#8b949e"}}}%%
flowchart TD
    A[Game Page Opens] --> B{autoplayEnabled?}
    B -- Yes --> C[load=true\nautoplay=true for first video]
    B -- No --> D[load=false\nshowOverlay=true\npreload=none]
    C --> E[useHlsVideo attaches HLS\nfetches segments]
    D --> F[Poster shown\nPlay overlay visible]
    F --> G[User clicks Play]
    G --> H{HLS video?}
    H -- Yes --> I[setStarted=true\nRe-render: load=true, autoplay=true]
    I --> J[useHlsVideo creates HLS\nMANIFEST_PARSED plays]
    H -- No --> K[setStarted=true\nvideoRef.play called directly]
    J --> L[onPlay fires\nplayingIndex=index\noverlay hidden]
    K --> L
    L --> M{User pauses?}
    M -- Yes --> N[onPause fires\nplayingIndex=null\noverlay reappears + native controls visible]
    M -- No --> O[Video continues playing]
Loading

Reviews (2): Last reviewed commit: "fix: address greptile review on trailer ..." | Re-trigger Greptile

Comment thread src/big-picture/src/components/pages/game/screenshot-carousel/index.tsx Outdated
Comment thread src/renderer/src/pages/game-details/gallery-slider/video-player.tsx
Comment thread src/renderer/src/pages/game-details/gallery-slider/video-player.tsx
- reset desktop VideoPlayer started state when loadOnDemand changes so toggling
  the setting while the game page stays mounted does not leave the video empty
- only show the big picture play overlay once preferences have loaded to avoid a
  brief overlay flash for users who have autoplay enabled
- extract the play icon sizes into named constants
@Moyasee

Moyasee commented Jun 23, 2026

Copy link
Copy Markdown
Contributor Author

@greptile review

@sonarqubecloud

Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant