refactor + video in description

Author: HoangTran0410

popup/index.js

@@ -324,6 +324,28 @@ function createScriptButton(script, isFavorite = false) {
   if (script.description?.img) {
     tooltip.innerHTML += `<img src="${script.description.img}" style="width:80vw" />`;
   }
+  if (script.description?.video) {
+    let video = document.createElement("video");
+    video.src = script.description.video;
+    video.autoplay = true;
+    video.muted = true;
+    video.loop = true;
+    video.style.width = "80vw";
+    video.addEventListener("loadeddata", () => {
+      video.pause();
+      video.currentTime = 0;
+      video.play();
+    });
+    tooltip.addEventListener("mouseenter", () => {
+      video.pause();
+      video.currentTime = 0;
+      video.play();
+    });
+    tooltip.addEventListener("mouseleave", () => {
+      video.pause();
+    });
+    tooltip.appendChild(video);
+  }
   if (script.changeLogs) {
     let tx = "";
     let dates = Object.keys(script.changeLogs).sort();

scripts/magnify_image.js

@@ -12,22 +12,22 @@ export default {
     Auto find large version of image to show.
     <br/></br>
     <p style="color:yellow">3 ways to use:</p>
-    <ul>
+    <ol>
       <li>Right click any image</li>
       <li>Left click this feature and choose image</li>
       <li>Double Ctrl on any image (require autorun)</li>
-    </ul>
+    </ol>
     `,
     vi: `Xem bất kỳ hình ảnh nào trong cửa sổ phóng đại<br/>
     Nơi bạn có thể phóng to/thu nhỏ, xoay, kéo thả, ...<br/>
     Tự động tìm ảnh chất lượng cao để hiển thị.
     <br/></br>
     <p style="color:yellow">3 cách sử dụng:</p>
-    <ul>
+    <ol>
       <li>Chuột phải vào ảnh</li>
       <li>Click chức năng và click chọn ảnh</li>
       <li>Ctrl 2 lần vào ảnh (cần mở tự động chạy)</li>
-    </ul>`,
+    </ol>`,
     img: "",
   },