1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-29 16:07:40 +01:00

fix safari fullscreen

This commit is contained in:
frost768 2023-03-22 12:38:12 +03:00
parent cf2060bd32
commit d51603a382
5 changed files with 9 additions and 7 deletions

View file

@ -39,7 +39,7 @@ function VideoPlayerBaseWithState(props: VideoPlayerBaseProps) {
<div
ref={ref}
className={[
"is-video-player popout-location relative h-full w-full select-none overflow-hidden bg-black",
"is-video-player popout-location relative h-full w-full select-none bg-black",
props.includeSafeArea || videoInterface.isFullscreen
? "[border-left:env(safe-area-inset-left)_solid_transparent] [border-right:env(safe-area-inset-right)_solid_transparent]"
: "",

View file

@ -41,7 +41,7 @@ function VideoElement(props: Props) {
autoPlay={props.autoPlay}
muted={mediaPlaying.volume === 0}
playsInline
className="h-full w-full"
className="absolute inset-0 z-0 h-full w-full"
/>
);
}

View file

@ -277,7 +277,9 @@ export function createVideoStateProvider(
updateMediaPlaying(descriptor, state);
};
const fullscreenchange = () => {
state.interface.isFullscreen = !!document.fullscreenElement;
state.interface.isFullscreen =
!!document.fullscreenElement || // other browsers
!!(document as any).webkitFullscreenElement; // safari
updateInterface(descriptor, state);
};
const volumechange = async () => {

View file

@ -50,7 +50,7 @@ export function VideoTesterView() {
if (video) {
return (
<div className="fixed top-0 left-0 h-[100dvh] w-screen">
<div className="fixed top-0 left-0 h-full w-screen">
<Helmet>
<html data-full="true" />
</Helmet>
@ -64,8 +64,8 @@ export function VideoTesterView() {
/>
<SourceController
source={video.streamUrl}
type={MWStreamType.MP4}
quality={MWStreamQuality.Q720P}
type={videoType}
quality={MWStreamQuality.QUNKNOWN}
/>
</VideoPlayer>
</div>

View file

@ -132,7 +132,7 @@ export function MediaViewPlayer(props: MediaViewPlayerProps) {
}
return (
<div className="fixed top-0 left-0 h-[100dvh] w-screen">
<div className="fixed top-0 left-0 h-full w-screen">
<Helmet>
<html data-full="true" />
</Helmet>