fix(client): stop video when slides are changed

hiroppy · hiroppy · commit b17172f8b876 · 2021-03-14T20:50:00.000+09:00
diff --git a/packages/client/assets/style/tags.css b/packages/client/assets/style/tags.css
@@ -180,3 +180,7 @@ tbody {
     }
   }
 }
+
+video {
+  outline: none;
+}
diff --git a/packages/client/src/components/SlideCore.js b/packages/client/src/components/SlideCore.js
@@ -87,6 +87,13 @@ export const SlideCore = (props) => {
             }
           : {}),
       }}
+      onSlideChange={(e) => {
+        const videos = e.slides[e.previousIndex].querySelectorAll('video');
+
+        if (videos.length) {
+          videos.forEach((el) => el.pause());
+        }
+      }}
       {...props}
     >
       {slides.map(({ slide: Slide, fusumaProps: { classes, sectionTitle, background } }, i) => (

Original file line number	Diff line number	Diff line change
`@@ -87,6 +87,13 @@ export const SlideCore = (props) => {`
`87`	`87`	`}`
`88`	`88`	`: {}),`
`89`	`89`	`}}`
	`90`	`+ onSlideChange={(e) => {`
	`91`	`+ const videos = e.slides[e.previousIndex].querySelectorAll('video');`
	`92`	`+`
	`93`	`+ if (videos.length) {`
	`94`	`+ videos.forEach((el) => el.pause());`
	`95`	`+ }`
	`96`	`+ }}`
`90`	`97`	`{...props}`
`91`	`98`	`>`
`92`	`99`	`{slides.map(({ slide: Slide, fusumaProps: { classes, sectionTitle, background } }, i) => (`