update component and add video

docs/.vitepress/theme/components/Downloader.vue

@@ -24,20 +24,26 @@ function onSubmit(ev: SubmitEvent) {
   ev.preventDefault();
   if (!q.value) return;
 
-  videoSrc.value = "/" + q.value;
+  const src = "/" + q.value;
+  const isSameSrc = videoSrc.value === src;
+  videoSrc.value = src;
+
+  if (isSameSrc) {
+    // Force load
+    onVideoLoad();
+  }
 }
 
 function onVideoLoad() {
   const ws = new WebSocket("ws://localhost:8080");
-
   const vid = videoEl.value!;
-
   const q_value = q.value;
 
   ws.onmessage = (ev) => {
     const { name, ts } = JSON.parse(ev.data);
     switch (name) {
-      case "seek_q_ts": (async () => {
+      case "seek_q_ts":
+        (async () => {
           for (const t of ts) {
             const b = await new Promise<Blob | null>((resolve) => {
               vid.onseeked = () => {
@@ -57,20 +63,21 @@ function onVideoLoad() {
                 );
 
                 c.toBlob((b) => resolve(b));
-            }
+              };
 
-            if (typeof t === 'string'){
+              if (typeof t === "string") {
-              const [min, sec] = t.split('_');
+                const [min, sec] = t.split("_");
                 vid.currentTime = parseInt(min) * 60 + parseInt(sec) + 1;
               } else {
                 vid.currentTime = t;
               }
-          })
+            });
             if (b) ws.send(b);
             vid.onseeked = null;
           }
-        ws.send(JSON.stringify({ name: 'done', q: q_value }));
+          ws.send(JSON.stringify({ name: "done", q: q_value }));
-      })(); break;
+        })();
+        break;
     }
   };
 
@@ -84,8 +91,7 @@ function onVideoLoad() {
     );
   };
 
-  ws.onclose = () => {
+  ws.onclose = () => {};
-  };
 }
 </script>
 

docs/.vitepress/theme/components/Video.vue

@@ -13,10 +13,8 @@ const videoURL = computed(() => frontmatter.value?.video);
 const videoEl = useTemplateRef("video");
 
 function setImgClick() {
-  const v = videoEl.value;
+  document.removeEventListener("click", imgClickListener);
-  if (!v) {
+  document.addEventListener("click", imgClickListener);
-    return;
-  }
 
   document.querySelectorAll("img").forEach((img) => {
     const [, min, sec] = /^(\d+)\:(\d+)$/.exec(img.alt) || [];
@@ -24,13 +22,23 @@ function setImgClick() {
     if (!t) return;
 
     img.title = img.title || img.alt;
-
-    img.onclick = () => {
-      v.currentTime = t;
-    };
   });
 }
 
+function imgClickListener(ev: PointerEvent) {
+  if (!(ev.target instanceof HTMLImageElement)) return;
+  const img = ev.target;
+
+  if (!videoEl.value) return;
+  const v = videoEl.value;
+
+  const [, min, sec] = /^(\d+)\:(\d+)$/.exec(img.alt) || [];
+  const t = min && sec ? parseInt(min) * 60 + parseInt(sec) : null;
+  if (!t) return;
+
+  v.currentTime = t;
+}
+
 watch(videoURL, () => {
   setImgClick();
 });

docs/index.md

@@ -9,6 +9,7 @@ hero:
 
 <Downloader />
 
+- [こんな人になりたい｜孔子が推す男](./こんな人になりたい｜孔子が推す男)
 - [泡泡瑪特真相：天才的商業模式，還是精密的「收割」遊戲？ ｜王寧｜盲盒｜LABUBU｜Molly｜拉布布｜POP MART](./泡泡瑪特真相：天才的商業模式，還是精密的「收割」遊戲？_｜王寧｜盲盒｜LABUBU｜Molly｜拉布布｜POP_MART.md)
 - [全世界流亡政治的结构性困境 ｜ 陈光诚告王志安 ｜ 俄罗斯FBK丑闻 ｜ 阿拉法特遗产](./全世界流亡政治的结构性困境_｜_陈光诚告王志安_｜_俄罗斯FBK丑闻_｜_阿拉法特遗产.md)
 - [小学校7校退学の問題児が『弟子規』で人生を変えた実話](/小学校7校退学の問題児が『弟子規』で人生を変えた実話)

docs/こんな人になりたい｜孔子が推す男.md

@@ -0,0 +1,900 @@
+---
+interval: 2
+dedup: true
+video: '/こんな人になりたい｜孔子が推す男 [TRb76-awaZg].mkv'
+---
+
+
+![0:00](./こんな人になりたい｜孔子が推す男/0_00.png)
+
+
+
+![0:02](./こんな人になりたい｜孔子が推す男/0_02.png)
+
+
+
+![0:04](./こんな人になりたい｜孔子が推す男/0_04.png)
+
+
+
+<details>
+<summary>0:04</summary>
+
+![0:06](./こんな人になりたい｜孔子が推す男/0_06.png)
+
+
+
+![0:08](./こんな人になりたい｜孔子が推す男/0_08.png)
+
+
+
+![0:10](./こんな人になりたい｜孔子が推す男/0_10.png)
+</details>
+<br/>
+
+
+
+![0:12](./こんな人になりたい｜孔子が推す男/0_12.png)
+
+
+
+<details>
+<summary>0:12</summary>
+
+![0:14](./こんな人になりたい｜孔子が推す男/0_14.png)
+
+
+
+![0:16](./こんな人になりたい｜孔子が推す男/0_16.png)
+
+
+
+![0:18](./こんな人になりたい｜孔子が推す男/0_18.png)
+
+
+
+![0:20](./こんな人になりたい｜孔子が推す男/0_20.png)
+</details>
+<br/>
+
+
+
+![0:22](./こんな人になりたい｜孔子が推す男/0_22.png)
+
+
+
+![0:24](./こんな人になりたい｜孔子が推す男/0_24.png)
+
+
+
+![0:26](./こんな人になりたい｜孔子が推す男/0_26.png)
+
+
+
+![0:28](./こんな人になりたい｜孔子が推す男/0_28.png)
+
+
+
+![0:30](./こんな人になりたい｜孔子が推す男/0_30.png)
+
+
+
+![0:32](./こんな人になりたい｜孔子が推す男/0_32.png)
+
+
+
+![0:34](./こんな人になりたい｜孔子が推す男/0_34.png)
+
+
+
+<details>
+<summary>0:34</summary>
+
+![0:36](./こんな人になりたい｜孔子が推す男/0_36.png)
+
+
+
+![0:38](./こんな人になりたい｜孔子が推す男/0_38.png)
+</details>
+<br/>
+
+
+
+![0:40](./こんな人になりたい｜孔子が推す男/0_40.png)
+
+
+
+![0:42](./こんな人になりたい｜孔子が推す男/0_42.png)
+
+
+
+![0:44](./こんな人になりたい｜孔子が推す男/0_44.png)
+
+
+
+![0:46](./こんな人になりたい｜孔子が推す男/0_46.png)
+
+
+
+![0:48](./こんな人になりたい｜孔子が推す男/0_48.png)
+
+
+
+<details>
+<summary>0:48</summary>
+
+![0:50](./こんな人になりたい｜孔子が推す男/0_50.png)
+
+
+
+![0:52](./こんな人になりたい｜孔子が推す男/0_52.png)
+
+
+
+![0:54](./こんな人になりたい｜孔子が推す男/0_54.png)
+</details>
+<br/>
+
+
+
+![0:56](./こんな人になりたい｜孔子が推す男/0_56.png)
+
+
+
+![0:58](./こんな人になりたい｜孔子が推す男/0_58.png)
+
+
+
+![1:00](./こんな人になりたい｜孔子が推す男/1_00.png)
+
+
+
+![1:02](./こんな人になりたい｜孔子が推す男/1_02.png)
+
+
+
+<details>
+<summary>1:02</summary>
+
+![1:04](./こんな人になりたい｜孔子が推す男/1_04.png)
+
+
+
+![1:06](./こんな人になりたい｜孔子が推す男/1_06.png)
+</details>
+<br/>
+
+
+
+![1:08](./こんな人になりたい｜孔子が推す男/1_08.png)
+
+
+
+<details>
+<summary>1:08</summary>
+
+![1:10](./こんな人になりたい｜孔子が推す男/1_10.png)
+
+
+
+![1:12](./こんな人になりたい｜孔子が推す男/1_12.png)
+</details>
+<br/>
+
+
+
+![1:14](./こんな人になりたい｜孔子が推す男/1_14.png)
+
+
+
+<details>
+<summary>1:14</summary>
+
+![1:16](./こんな人になりたい｜孔子が推す男/1_16.png)
+
+
+
+![1:18](./こんな人になりたい｜孔子が推す男/1_18.png)
+</details>
+<br/>
+
+
+
+![1:20](./こんな人になりたい｜孔子が推す男/1_20.png)
+
+
+
+<details>
+<summary>1:20</summary>
+
+![1:22](./こんな人になりたい｜孔子が推す男/1_22.png)
+
+
+
+![1:24](./こんな人になりたい｜孔子が推す男/1_24.png)
+
+
+
+![1:26](./こんな人になりたい｜孔子が推す男/1_26.png)
+
+
+
+![1:28](./こんな人になりたい｜孔子が推す男/1_28.png)
+
+
+
+![1:30](./こんな人になりたい｜孔子が推す男/1_30.png)
+</details>
+<br/>
+
+
+
+![1:32](./こんな人になりたい｜孔子が推す男/1_32.png)
+
+
+
+<details>
+<summary>1:32</summary>
+
+![1:34](./こんな人になりたい｜孔子が推す男/1_34.png)
+
+
+
+![1:36](./こんな人になりたい｜孔子が推す男/1_36.png)
+
+
+
+![1:38](./こんな人になりたい｜孔子が推す男/1_38.png)
+
+
+
+![1:40](./こんな人になりたい｜孔子が推す男/1_40.png)
+
+
+
+![1:42](./こんな人になりたい｜孔子が推す男/1_42.png)
+
+
+
+![1:44](./こんな人になりたい｜孔子が推す男/1_44.png)
+
+
+
+![1:46](./こんな人になりたい｜孔子が推す男/1_46.png)
+</details>
+<br/>
+
+
+
+![1:48](./こんな人になりたい｜孔子が推す男/1_48.png)
+
+
+
+<details>
+<summary>1:48</summary>
+
+![1:50](./こんな人になりたい｜孔子が推す男/1_50.png)
+</details>
+<br/>
+
+
+
+![1:52](./こんな人になりたい｜孔子が推す男/1_52.png)
+
+
+
+<details>
+<summary>1:52</summary>
+
+![1:54](./こんな人になりたい｜孔子が推す男/1_54.png)
+</details>
+<br/>
+
+
+
+![1:56](./こんな人になりたい｜孔子が推す男/1_56.png)
+
+
+
+<details>
+<summary>1:56</summary>
+
+![1:58](./こんな人になりたい｜孔子が推す男/1_58.png)
+
+
+
+![2:00](./こんな人になりたい｜孔子が推す男/2_00.png)
+
+
+
+![2:02](./こんな人になりたい｜孔子が推す男/2_02.png)
+
+
+
+![2:04](./こんな人になりたい｜孔子が推す男/2_04.png)
+
+
+
+![2:06](./こんな人になりたい｜孔子が推す男/2_06.png)
+
+
+
+![2:08](./こんな人になりたい｜孔子が推す男/2_08.png)
+
+
+
+![2:10](./こんな人になりたい｜孔子が推す男/2_10.png)
+
+
+
+![2:12](./こんな人になりたい｜孔子が推す男/2_12.png)
+
+
+
+![2:14](./こんな人になりたい｜孔子が推す男/2_14.png)
+
+
+
+![2:16](./こんな人になりたい｜孔子が推す男/2_16.png)
+
+
+
+![2:18](./こんな人になりたい｜孔子が推す男/2_18.png)
+
+
+
+![2:20](./こんな人になりたい｜孔子が推す男/2_20.png)
+
+
+
+![2:22](./こんな人になりたい｜孔子が推す男/2_22.png)
+
+
+
+![2:24](./こんな人になりたい｜孔子が推す男/2_24.png)
+
+
+
+![2:26](./こんな人になりたい｜孔子が推す男/2_26.png)
+
+
+
+![2:28](./こんな人になりたい｜孔子が推す男/2_28.png)
+
+
+
+![2:30](./こんな人になりたい｜孔子が推す男/2_30.png)
+
+
+
+![2:32](./こんな人になりたい｜孔子が推す男/2_32.png)
+
+
+
+![2:34](./こんな人になりたい｜孔子が推す男/2_34.png)
+
+
+
+![2:36](./こんな人になりたい｜孔子が推す男/2_36.png)
+
+
+
+![2:38](./こんな人になりたい｜孔子が推す男/2_38.png)
+</details>
+<br/>
+
+
+
+![2:40](./こんな人になりたい｜孔子が推す男/2_40.png)
+
+
+
+<details>
+<summary>2:40</summary>
+
+![2:42](./こんな人になりたい｜孔子が推す男/2_42.png)
+
+
+
+![2:44](./こんな人になりたい｜孔子が推す男/2_44.png)
+
+
+
+![2:46](./こんな人になりたい｜孔子が推す男/2_46.png)
+
+
+
+![2:48](./こんな人になりたい｜孔子が推す男/2_48.png)
+
+
+
+![2:50](./こんな人になりたい｜孔子が推す男/2_50.png)
+</details>
+<br/>
+
+
+
+![2:52](./こんな人になりたい｜孔子が推す男/2_52.png)
+
+
+
+<details>
+<summary>2:52</summary>
+
+![2:54](./こんな人になりたい｜孔子が推す男/2_54.png)
+</details>
+<br/>
+
+
+
+![2:56](./こんな人になりたい｜孔子が推す男/2_56.png)
+
+
+
+![2:58](./こんな人になりたい｜孔子が推す男/2_58.png)
+
+
+
+<details>
+<summary>2:58</summary>
+
+![3:00](./こんな人になりたい｜孔子が推す男/3_00.png)
+
+
+
+![3:02](./こんな人になりたい｜孔子が推す男/3_02.png)
+
+
+
+![3:04](./こんな人になりたい｜孔子が推す男/3_04.png)
+
+
+
+![3:06](./こんな人になりたい｜孔子が推す男/3_06.png)
+
+
+
+![3:08](./こんな人になりたい｜孔子が推す男/3_08.png)
+
+
+
+![3:10](./こんな人になりたい｜孔子が推す男/3_10.png)
+
+
+
+![3:12](./こんな人になりたい｜孔子が推す男/3_12.png)
+
+
+
+![3:14](./こんな人になりたい｜孔子が推す男/3_14.png)
+
+
+
+![3:16](./こんな人になりたい｜孔子が推す男/3_16.png)
+</details>
+<br/>
+
+
+
+![3:18](./こんな人になりたい｜孔子が推す男/3_18.png)
+
+
+
+![3:20](./こんな人になりたい｜孔子が推す男/3_20.png)
+
+
+
+<details>
+<summary>3:20</summary>
+
+![3:22](./こんな人になりたい｜孔子が推す男/3_22.png)
+
+
+
+![3:24](./こんな人になりたい｜孔子が推す男/3_24.png)
+
+
+
+![3:26](./こんな人になりたい｜孔子が推す男/3_26.png)
+
+
+
+![3:28](./こんな人になりたい｜孔子が推す男/3_28.png)
+
+
+
+![3:30](./こんな人になりたい｜孔子が推す男/3_30.png)
+
+
+
+![3:32](./こんな人になりたい｜孔子が推す男/3_32.png)
+
+
+
+![3:34](./こんな人になりたい｜孔子が推す男/3_34.png)
+</details>
+<br/>
+
+
+
+![3:36](./こんな人になりたい｜孔子が推す男/3_36.png)
+
+
+
+<details>
+<summary>3:36</summary>
+
+![3:38](./こんな人になりたい｜孔子が推す男/3_38.png)
+
+
+
+![3:40](./こんな人になりたい｜孔子が推す男/3_40.png)
+
+
+
+![3:42](./こんな人になりたい｜孔子が推す男/3_42.png)
+
+
+
+![3:44](./こんな人になりたい｜孔子が推す男/3_44.png)
+
+
+
+![3:46](./こんな人になりたい｜孔子が推す男/3_46.png)
+
+
+
+![3:48](./こんな人になりたい｜孔子が推す男/3_48.png)
+
+
+
+![3:50](./こんな人になりたい｜孔子が推す男/3_50.png)
+
+
+
+![3:52](./こんな人になりたい｜孔子が推す男/3_52.png)
+</details>
+<br/>
+
+
+
+![3:54](./こんな人になりたい｜孔子が推す男/3_54.png)
+
+
+
+<details>
+<summary>3:54</summary>
+
+![3:56](./こんな人になりたい｜孔子が推す男/3_56.png)
+
+
+
+![3:58](./こんな人になりたい｜孔子が推す男/3_58.png)
+
+
+
+![4:00](./こんな人になりたい｜孔子が推す男/4_00.png)
+
+
+
+![4:02](./こんな人になりたい｜孔子が推す男/4_02.png)
+
+
+
+![4:04](./こんな人になりたい｜孔子が推す男/4_04.png)
+
+
+
+![4:06](./こんな人になりたい｜孔子が推す男/4_06.png)
+
+
+
+![4:08](./こんな人になりたい｜孔子が推す男/4_08.png)
+
+
+
+![4:10](./こんな人になりたい｜孔子が推す男/4_10.png)
+
+
+
+![4:12](./こんな人になりたい｜孔子が推す男/4_12.png)
+
+
+
+![4:14](./こんな人になりたい｜孔子が推す男/4_14.png)
+
+
+
+![4:16](./こんな人になりたい｜孔子が推す男/4_16.png)
+
+
+
+![4:18](./こんな人になりたい｜孔子が推す男/4_18.png)
+
+
+
+![4:20](./こんな人になりたい｜孔子が推す男/4_20.png)
+
+
+
+![4:22](./こんな人になりたい｜孔子が推す男/4_22.png)
+
+
+
+![4:24](./こんな人になりたい｜孔子が推す男/4_24.png)
+
+
+
+![4:26](./こんな人になりたい｜孔子が推す男/4_26.png)
+
+
+
+![4:28](./こんな人になりたい｜孔子が推す男/4_28.png)
+
+
+
+![4:30](./こんな人になりたい｜孔子が推す男/4_30.png)
+
+
+
+![4:32](./こんな人になりたい｜孔子が推す男/4_32.png)
+
+
+
+![4:34](./こんな人になりたい｜孔子が推す男/4_34.png)
+
+
+
+![4:36](./こんな人になりたい｜孔子が推す男/4_36.png)
+
+
+
+![4:38](./こんな人になりたい｜孔子が推す男/4_38.png)
+</details>
+<br/>
+
+
+
+![4:40](./こんな人になりたい｜孔子が推す男/4_40.png)
+
+
+
+<details>
+<summary>4:40</summary>
+
+![4:42](./こんな人になりたい｜孔子が推す男/4_42.png)
+
+
+
+![4:44](./こんな人になりたい｜孔子が推す男/4_44.png)
+
+
+
+![4:46](./こんな人になりたい｜孔子が推す男/4_46.png)
+
+
+
+![4:48](./こんな人になりたい｜孔子が推す男/4_48.png)
+
+
+
+![4:50](./こんな人になりたい｜孔子が推す男/4_50.png)
+
+
+
+![4:52](./こんな人になりたい｜孔子が推す男/4_52.png)
+
+
+
+![4:54](./こんな人になりたい｜孔子が推す男/4_54.png)
+
+
+
+![4:56](./こんな人になりたい｜孔子が推す男/4_56.png)
+
+
+
+![4:58](./こんな人になりたい｜孔子が推す男/4_58.png)
+
+
+
+![5:00](./こんな人になりたい｜孔子が推す男/5_00.png)
+</details>
+<br/>
+
+
+
+![5:02](./こんな人になりたい｜孔子が推す男/5_02.png)
+
+
+
+<details>
+<summary>5:02</summary>
+
+![5:04](./こんな人になりたい｜孔子が推す男/5_04.png)
+
+
+
+![5:06](./こんな人になりたい｜孔子が推す男/5_06.png)
+
+
+
+![5:08](./こんな人になりたい｜孔子が推す男/5_08.png)
+
+
+
+![5:10](./こんな人になりたい｜孔子が推す男/5_10.png)
+
+
+
+![5:12](./こんな人になりたい｜孔子が推す男/5_12.png)
+
+
+
+![5:14](./こんな人になりたい｜孔子が推す男/5_14.png)
+
+
+
+![5:16](./こんな人になりたい｜孔子が推す男/5_16.png)
+
+
+
+![5:18](./こんな人になりたい｜孔子が推す男/5_18.png)
+
+
+
+![5:20](./こんな人になりたい｜孔子が推す男/5_20.png)
+
+
+
+![5:22](./こんな人になりたい｜孔子が推す男/5_22.png)
+
+
+
+![5:24](./こんな人になりたい｜孔子が推す男/5_24.png)
+
+
+
+![5:26](./こんな人になりたい｜孔子が推す男/5_26.png)
+
+
+
+![5:28](./こんな人になりたい｜孔子が推す男/5_28.png)
+
+
+
+![5:30](./こんな人になりたい｜孔子が推す男/5_30.png)
+
+
+
+![5:32](./こんな人になりたい｜孔子が推す男/5_32.png)
+
+
+
+![5:34](./こんな人になりたい｜孔子が推す男/5_34.png)
+
+
+
+![5:36](./こんな人になりたい｜孔子が推す男/5_36.png)
+
+
+
+![5:38](./こんな人になりたい｜孔子が推す男/5_38.png)
+
+
+
+![5:40](./こんな人になりたい｜孔子が推す男/5_40.png)
+
+
+
+![5:42](./こんな人になりたい｜孔子が推す男/5_42.png)
+
+
+
+![5:44](./こんな人になりたい｜孔子が推す男/5_44.png)
+
+
+
+![5:46](./こんな人になりたい｜孔子が推す男/5_46.png)
+
+
+
+![5:48](./こんな人になりたい｜孔子が推す男/5_48.png)
+
+
+
+![5:50](./こんな人になりたい｜孔子が推す男/5_50.png)
+
+
+
+![5:52](./こんな人になりたい｜孔子が推す男/5_52.png)
+
+
+
+![5:54](./こんな人になりたい｜孔子が推す男/5_54.png)
+
+
+
+![5:56](./こんな人になりたい｜孔子が推す男/5_56.png)
+
+
+
+![5:58](./こんな人になりたい｜孔子が推す男/5_58.png)
+
+
+
+![6:00](./こんな人になりたい｜孔子が推す男/6_00.png)
+
+
+
+![6:02](./こんな人になりたい｜孔子が推す男/6_02.png)
+</details>
+<br/>
+
+
+
+![6:04](./こんな人になりたい｜孔子が推す男/6_04.png)
+
+
+
+<details>
+<summary>6:04</summary>
+
+![6:06](./こんな人になりたい｜孔子が推す男/6_06.png)
+
+
+
+![6:08](./こんな人になりたい｜孔子が推す男/6_08.png)
+</details>
+<br/>
+
+
+
+![6:10](./こんな人になりたい｜孔子が推す男/6_10.png)
+
+
+
+![6:12](./こんな人になりたい｜孔子が推す男/6_12.png)
+
+
+
+<details>
+<summary>6:12</summary>
+
+![6:14](./こんな人になりたい｜孔子が推す男/6_14.png)
+
+
+
+![6:16](./こんな人になりたい｜孔子が推す男/6_16.png)
+
+
+
+![6:18](./こんな人になりたい｜孔子が推す男/6_18.png)
+
+
+
+![6:20](./こんな人になりたい｜孔子が推す男/6_20.png)
+
+
+
+![6:22](./こんな人になりたい｜孔子が推す男/6_22.png)
+
+
+
+![6:24](./こんな人になりたい｜孔子が推す男/6_24.png)
+</details>
+<br/>
+
+
+
+![6:26](./こんな人になりたい｜孔子が推す男/6_26.png)
+
+
+
+![6:28](./こんな人になりたい｜孔子が推す男/6_28.png)
+
+
+
+![6:30](./こんな人になりたい｜孔子が推す男/6_30.png)
+
+