From febd04dd54f58c1992c6abd5039281e2170f24ba Mon Sep 17 00:00:00 2001
From: Lim Chee Aun <cheeaun@gmail.com>
Date: Tue, 11 Jun 2024 23:43:55 +0800
Subject: [PATCH] Try use dangerouslySetInnerHTML again
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

And… fix the loop attribute value
---
 src/components/media.jsx | 36 ++++++++++++++++++++----------------
 1 file changed, 20 insertions(+), 16 deletions(-)

diff --git a/src/components/media.jsx b/src/components/media.jsx
index 370b1c5f..2baba598 100644
--- a/src/components/media.jsx
+++ b/src/components/media.jsx
@@ -426,7 +426,7 @@ function Media({
         autoplay
         muted
         playsinline
-        loop="${loopable}"
+        ${loopable ? 'loop' : ''}
         ondblclick="this.paused ? this.play() : this.pause()"
         ${
           showProgress
@@ -436,6 +436,21 @@ function Media({
       ></video>
   `;
 
+    const videoHTML = `
+      <video
+        src="${url}"
+        poster="${previewUrl}"
+        width="${width}"
+        height="${height}"
+        data-orientation="${orientation}"
+        preload="auto"
+        autoplay
+        playsinline
+        ${loopable ? 'loop' : ''}
+        controls
+      ></video>
+    `;
+
     return (
       <Figure>
         <Parent
@@ -508,21 +523,10 @@ function Media({
                 }}
               />
             ) : (
-              <div class="video-container">
-                <video
-                  slot="media"
-                  src={url}
-                  poster={previewUrl}
-                  width={width}
-                  height={height}
-                  data-orientation={orientation}
-                  preload="auto"
-                  autoPlay
-                  playsinline
-                  loop={loopable}
-                  controls
-                ></video>
-              </div>
+              <div
+                class="video-container"
+                dangerouslySetInnerHTML={{ __html: videoHTML }}
+              />
             )
           ) : isGIF ? (
             <video