feat(player): raise the playback speed ceiling off YouTube's limit

A single speed ladder fed both players, so the 2x cap that YouTube's
iframe API enforces also applied to Bunny and R2, which are plain <video>
elements the browser will play far faster. Pick the ladder per provider:
YouTube keeps 0.25x-2x, the native ones go up to 16x, where Chrome and
Firefox clamp playbackRate. The picker labels everything past 4x as
"no audio", since that is where the browsers stop pitch-correcting and
drop the audio track.
This commit is contained in:
2026-08-20 10:50:42 +03:00
parent 4d9d35164f
commit 7b7b1d21b2
5 changed files with 73 additions and 8 deletions
+10 -3
View File
@@ -21,6 +21,10 @@ import {
} from '@/components/ui/dropdown-menu';
import { resolvePublicBunnyCdnHostname } from '@/lib/bunny-cdn';
import { cn } from '@/lib/utils';
import {
NATIVE_SPEED_OPTIONS,
SILENT_ABOVE_SPEED,
} from '@/components/video-page/hooks/video-player-utils';
import type { BunnyPlaybackState, BunnyQualityOption } from '@/components/video-page/types';
interface BunnyPreviewPlayerProps {
@@ -35,8 +39,6 @@ export interface BunnyPreviewPlayerHandle {
toggleMute: () => void;
}
const SPEED_OPTIONS = [0.25, 0.5, 0.75, 1, 1.25, 1.5, 1.75, 2];
function formatTime(value: number): string {
if (!Number.isFinite(value) || value < 0) return '0:00';
const total = Math.floor(value);
@@ -635,9 +637,14 @@ export const BunnyPreviewPlayer = forwardRef<BunnyPreviewPlayerHandle, BunnyPrev
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent align="end">
{SPEED_OPTIONS.map((speed) => (
{NATIVE_SPEED_OPTIONS.map((speed) => (
<DropdownMenuItem key={speed} onClick={() => handleSpeedChange(speed)}>
{speed}x {speed === playbackSpeed ? '(Current)' : ''}
{speed > SILENT_ABOVE_SPEED && (
<span className="ml-auto pl-2 text-[10px] text-muted-foreground">
no audio
</span>
)}
</DropdownMenuItem>
))}
</DropdownMenuContent>