try fix some Safari issues

jakmeier · jakmeier · commit 3829e7a1d0ec · 2025-03-19T16:59:57.000+01:00
Safari on iPhone SE puts video and camera in full screen mode.
Very unhelpful. Let's see if this fixes it.
diff --git a/bouncy_frontend/src/lib/components/editor/VideoToPose.svelte b/bouncy_frontend/src/lib/components/editor/VideoToPose.svelte
@@ -117,6 +117,7 @@
     bind:videoWidth={videoSrcWidth}
     bind:videoHeight={videoSrcHeight}
     playsinline
+    webkit-playsinline
     controls
   ></video>
   <div>
diff --git a/bouncy_frontend/src/lib/components/record/Camera.svelte b/bouncy_frontend/src/lib/components/record/Camera.svelte
@@ -105,6 +105,8 @@
   bind:this={videoElement}
   class:hidden={!cameraOn}
   style="opacity: {opacity}"
+  playsinline
+  webkit-playsinline
 ></video>
 
 <style>
diff --git a/bouncy_frontend/src/lib/components/review/VideoReview.svelte b/bouncy_frontend/src/lib/components/review/VideoReview.svelte
@@ -255,6 +255,7 @@ once per 250ms. -->
           bind:videoHeight={videoSrcHeight}
           src={reviewVideoSrc}
           playsinline
+          webkit-playsinline
           style="max-width: 100%"
         ></video>
         {#if keypointSkeleton && displayVideoOverlay}
diff --git a/bouncy_frontend/src/lib/components/ui/Video.svelte b/bouncy_frontend/src/lib/components/ui/Video.svelte
@@ -32,6 +32,8 @@
           videoLoading = false;
         }}
         preload="auto"
+        playsinline
+        webkit-playsinline
       >
         <source
           src={path}
diff --git a/bouncy_frontend/src/routes/dev/+page.svelte b/bouncy_frontend/src/routes/dev/+page.svelte
@@ -132,6 +132,7 @@
     bind:videoWidth={videoSrcWidth}
     bind:videoHeight={videoSrcHeight}
     playsinline
+    webkit-playsinline
     controls
   ></video>
   <div>

Original file line number	Diff line number	Diff line change
`@@ -32,6 +32,8 @@`
`32`	`32`	`videoLoading = false;`
`33`	`33`	`}}`
`34`	`34`	`preload="auto"`
	`35`	`+ playsinline`
	`36`	`+ webkit-playsinline`
`35`	`37`	`>`
`36`	`38`	`<source`
`37`	`39`	`src={path}`