convert all images to webp

docs/.vitepress/.temp/.gitignore

@@ -0,0 +1,3 @@
+*
+!.gitignore
+!README.md

docs/.vitepress/theme/plugins/yt-parse.ts

@@ -1,5 +1,6 @@
 import { type Plugin, type ViteDevServer } from "vite";
 import { readFileSync, mkdirSync, writeFileSync } from "fs";
+import sharp from "sharp";
 
 export default function ytParsePlugin(): Plugin {
   return {
@@ -8,19 +9,22 @@ export default function ytParsePlugin(): Plugin {
       server.ws.on("download-q", ({ q }) => {
         try {
           mkdirSync(`docs/${q}`);
+          mkdirSync(`docs/public/images/${q}`);
         } catch (e) {}
 
         let outMd = "";
 
         const re = /^(?<min>\d{1,2}):(?<sec>\d{2})\s*$/;
 
-        for (const line of readFileSync(`docs/${q}.md`, "utf-8").trimEnd().split("\n")) {
+        for (const line of readFileSync(`docs/${q}.md`, "utf-8")
+          .trimEnd()
+          .split("\n")) {
           const m = re.exec(line);
           if (m) {
             const { min, sec } = m.groups!;
             const t = parseInt(min) * 60 + parseInt(sec);
             server.ws.send("seek-q", { t });
-            outMd += `[${line}](./${q}/${t}.png)`;
+            outMd += `[${line}](/images/${q}/${t}.webp)`;
           } else {
             outMd += line + "\n";
           }
@@ -30,12 +34,19 @@ export default function ytParsePlugin(): Plugin {
       });
 
       server.ws.on("timed-q", ({ q, t, data }) => {
-        writeFileSync(
-          `docs/${q}/${t}.png`,
-          data.replace(/^data:image\/png;base64,/, ""),
-          "base64",
-        );
+        sharp(
+          Buffer.from(data.replace(/^data:image\/png;base64,/, ""), "base64"),
+        )
+          .rotate()
+          .resize({
+            width: 800,
+            height: 600,
+            fit: "inside",
+            withoutEnlargement: true,
+          })
+          .webp({ quality: 75 })
+          .toFile(`docs/public/images/${q}/${t}.png`);
       });
     },
   };
-}
+}