revert

docs/.vitepress/config.ts

@@ -4,7 +4,6 @@ import { l10n, md, vite } from "./ext";
 // https://vitepress.dev/reference/site-config
 export default defineConfig({
     title: "Naninovel",
-    titleTemplate: ":title • Naninovel",
     cleanUrls: true,
     lastUpdated: true,
     head: [
@@ -17,7 +16,7 @@ export default defineConfig({
     ],
     themeConfig: {
         logo: { src: "/favicon.svg" },
-        logoLink: "naninovel.com",
+        logoLink: "https://naninovel.com",
         search: {
             provider: "algolia",
             options: {

docs/.vitepress/ext/lang/index.ts

@@ -1,17 +1,11 @@
-import { LanguageRegistration } from "shikiji";
-import { ThemeOptions } from "vitepress";
-import grammar from "./textmate.json";
-import themeLight from "./theme-light.json";
-import themeDark from "./theme-dark.json";
+import { resolve } from "path";
+import { ILanguageRegistration } from "shiki";
 
-export const lang: LanguageRegistration = {
+// https://github.com/shikijs/shiki/blob/main/docs/languages.md#supporting-your-own-languages-with-shiki
+
+export default {
     id: "naniscript",
     aliases: ["nani"],
     scopeName: "source.naniscript",
-    ...grammar as any
-};
-
-export const theme: ThemeOptions = {
-    light: themeLight as any,
-    dark: themeDark as any
-};
+    path: resolve("./docs/.vitepress/ext/lang/textmate.json")
+} as ILanguageRegistration;

docs/.vitepress/ext/md/md-replacer.ts

@@ -1,3 +1,4 @@
+// noinspection TypeScriptUnresolvedReference
 // Based on https://github.com/rlidwka/markdown-it-regexp.
 
 import { inherits } from "node:util";
@@ -6,7 +7,7 @@ import { MarkdownEnv, MarkdownRenderer } from "vitepress";
 let instanceId = 0;
 
 export function Replacer(regexp: RegExp, replace: (match: string[], env: MarkdownEnv) => string) {
-    let self: any = (md: any) => self.init(md);
+    let self = md => self.init(md);
     self.__proto__ = Replacer.prototype;
     self.regexp = new RegExp("^" + regexp.source, regexp.flags);
     self.replace = replace;
@@ -22,7 +23,7 @@ Replacer.prototype.init = function (md: MarkdownRenderer) {
     md.renderer.rules[this.id] = this.render.bind(this);
 };
 
-Replacer.prototype.parse = function (state: any, silent: any) {
+Replacer.prototype.parse = function (state, silent) {
     let match = this.regexp.exec(state.src.slice(state.pos));
     if (!match) return false;
 
@@ -34,6 +35,6 @@ Replacer.prototype.parse = function (state: any, silent: any) {
     return true;
 };
 
-Replacer.prototype.render = function (tokens: any, id: any, options: any, env: MarkdownEnv) {
+Replacer.prototype.render = function (tokens, id, options, env: MarkdownEnv) {
     return this.replace(tokens[id].meta.match, env);
 };

docs/.vitepress/ext/md/md.ts

@@ -1,12 +1,15 @@
 import { MarkdownOptions, MarkdownRenderer, MarkdownEnv } from "vitepress";
 import { AppendIconToExternalLinks } from "./md-link";
 import { Replacer } from "./md-replacer";
-import { lang, theme } from "../lang";
+import naniscript from "../lang";
 
 export const md: MarkdownOptions = {
     config: installPlugins,
-    languages: [lang],
-    theme: theme,
+    languages: [naniscript],
+    theme: {
+        light: "../../../docs/.vitepress/ext/lang/theme-light",
+        dark: "../../../docs/.vitepress/ext/lang/theme-dark"
+    },
     attrs: { disable: true } // https://github.com/vuejs/vitepress/issues/2440
 };
 

docs/.vitepress/ext/vite.ts

@@ -1,22 +1,28 @@
 import { fileURLToPath } from "url";
 import { UserConfig, Alias } from "vite";
-// import imgit from "../imgit/plugin/vite";
+import { defaults } from "../imgit/server";
+import imgit from "../imgit/plugin/vite";
 
 export const vite: UserConfig = {
-    // plugins: [imgit({
-    //     enforce: "pre",
-    //     skip: (_, id) => !id.endsWith(".md"),
-    //     root: "./docs/public/assets",
-    //     fetch: { root: "./docs/public/assets/remote" },
-    //     cache: { root: "./docs/public/assets/remote/.cache" },
-    //     width: 720
-    // })],
-    resolve: {
-        alias: [
-            override("NotFound", "not-found"),
-            { find: /\.(:?tif|tiff|bmp|tga|psd)$/, replacement: ".jpg" }
-        ]
-    }
+    plugins: [imgit({
+        enforce: "pre",
+        skip: (_, id) => !id.endsWith(".md"),
+        local: "./docs/public/assets",
+        cache: "./docs/public/assets/remote/.cache",
+        width: 720,
+        // poster: "/assets/img/video-poster.svg",
+        build: { // Hack for chrome. TODO: Remove after implementing posters w/o video.poster attribute.
+            ...defaults.build,
+            video: async asset => {
+                const base = await defaults.build.video(asset);
+                const mod = asset.sourceInfo!.width > 720 ? 720 / asset.sourceInfo!.width : 1;
+                const width = Math.floor(asset.sourceInfo!.width * mod);
+                const height = Math.floor(asset.sourceInfo!.height * mod);
+                return base.replace("width=", `style="width: ${width}px; height: ${height}px;" width=`);
+            }
+        }
+    })],
+    resolve: { alias: [override("NotFound", "not-found")] }
 };
 
 // https://vitepress.dev/guide/extending-default-theme#overriding-internal-components

docs/.vitepress/imgit/client/index.ts

@@ -1,4 +1,3 @@
 import { observeMutations } from "./mutation";
-import "./styles.css";
 
 observeMutations();

docs/.vitepress/imgit/client/intersection.ts

@@ -1,12 +1,11 @@
 const observer = canObserve() ? new IntersectionObserver(handleIntersections) : undefined;
-const edge = observer && isEdge();
 
-export function observeVideo(video: HTMLVideoElement) {
-    observer?.observe(video);
+export function observeIntersections(element: HTMLElement) {
+    observer?.observe(element);
 }
 
-export function unobserveVideo(video: HTMLVideoElement) {
-    observer?.unobserve(video);
+export function unobserveIntersections(element: HTMLElement) {
+    observer?.unobserve(element);
 }
 
 function canObserve() {
@@ -21,24 +20,12 @@ function handleIntersections(entries: IntersectionObserverEntry[], observer: Int
 
 function handleIntersection(entry: IntersectionObserverEntry, observer: IntersectionObserver) {
     for (const child of entry.target.children)
-        if (isSource(child) && child.dataset.src && !av1OnEdge(child))
+        if (isSourceElement(child) && child.dataset.src)
             child.src = child.dataset.src;
-    (<HTMLVideoElement>entry.target).load();
+    (entry.target as HTMLVideoElement).load();
     observer.unobserve(entry.target);
 }
 
-function isSource(element: Element): element is HTMLSourceElement {
-    return "src" in element;
-}
-
-function av1OnEdge(source: HTMLSourceElement) {
-    // Edge has bug where it thinks it can play av01, while actually can't.
-    // https://stackoverflow.com/questions/64212993 TODO: Find if there is a tracking issue for this.
-    return edge && source.type.includes("codecs=av01");
-}
-
-function isEdge() {
-    // https://learn.microsoft.com/en-us/microsoft-edge/web-platform/user-agent-guidance
-    const agent = window.navigator.userAgent;
-    return agent.includes("Edg/") || agent.includes("EdgiOS/") || agent.includes("EdgA/");
+function isSourceElement(element: Element): element is HTMLSourceElement {
+    return element.tagName === "SOURCE";
 }

docs/.vitepress/imgit/client/mutation.ts

@@ -1,10 +1,10 @@
-import { observeVideo, unobserveVideo } from "./intersection";
+import { observeIntersections, unobserveIntersections } from "./intersection";
 
 const observer = canObserve() ? new MutationObserver(handleMutations) : undefined;
 
 export function observeMutations() {
     observer?.observe(document.body, { childList: true, subtree: true });
-    if (canObserve()) handleAdded(document.body);
+    if (canObserve()) handleAddedNode(document.body);
 }
 
 function canObserve() {
@@ -17,26 +17,23 @@ function handleMutations(mutations: MutationRecord[]) {
 }
 
 function handleMutation(mutation: MutationRecord) {
+    if (mutation.type !== "childList") return;
     for (const node of mutation.addedNodes)
-        if (isElement(node)) handleAdded(node);
+        if (node instanceof HTMLElement)
+            handleAddedNode(node);
     for (const node of mutation.removedNodes)
-        if (isElement(node)) handleRemoved(node);
+        if (node instanceof HTMLElement)
+            handleRemovedNode(node);
 }
 
-function handleAdded(added: Element) {
-    for (const element of added.querySelectorAll("[data-imgit]"))
-        if (isVideo(element)) observeVideo(element);
+function handleAddedNode(added: HTMLElement) {
+    for (const element of added.querySelectorAll("video.imgit-video"))
+        if (element instanceof HTMLElement)
+            observeIntersections(element);
 }
 
-function handleRemoved(removed: Element) {
-    for (const element of removed.querySelectorAll("[data-imgit]"))
-        if (isVideo(element)) unobserveVideo(element);
-}
-
-function isElement(node: Node): node is Element {
-    return "querySelector" in node;
-}
-
-function isVideo(element: Element): element is HTMLVideoElement {
-    return "getVideoPlaybackQuality" in element;
+function handleRemovedNode(removed: HTMLElement) {
+    for (const element of removed.querySelectorAll("video.imgit-video"))
+        if (element instanceof HTMLElement)
+            unobserveIntersections(element);
 }

docs/.vitepress/imgit/plugin/vite.ts

@@ -1,7 +1,7 @@
-import { Platform, Prefs, boot, exit, transform } from "../server";
+import { boot, exit, transform, Options, Platform } from "../server";
 
 /** Configures vite plugin behaviour. */
-export type VitePrefs = Prefs & {
+export type ViteOptions = Options & {
     /** Force the plugin to run either before are after other plugins. */
     enforce?: "pre" | "post";
     /** Specify condition when document shouldn't be transformed by the plugin. */
@@ -13,18 +13,18 @@ declare type VitePlugin = {
     enforce?: "pre" | "post";
     buildStart?: (options: unknown) => Promise<void> | void;
     transform?: (code: string, id: string, options?: { ssr?: boolean; }) => Promise<string> | string;
-    buildEnd?: (error?: Error) => Promise<void> | void;
+    buildEnd?: (error?: Error) => void;
 }
 
 /** Creates imgit plugin instance for vite.
- *  @param prefs Plugin preferences; will use pre-defined defaults when not assigned.
+ *  @param options Plugin preferences; will use pre-defined defaults when not assigned.
  *  @param platform Runtime APIs to use; will attempt to detect automatically when not assigned. */
-export default function (prefs?: VitePrefs, platform?: Platform): VitePlugin {
+export default function (options?: ViteOptions, platform?: Platform): VitePlugin {
     return {
         name: "imgit",
-        enforce: prefs?.enforce,
-        buildStart: _ => boot(prefs, platform),
-        transform: (code, id, opt) => prefs?.skip?.(code, id, opt) ? code : transform(code),
+        enforce: options?.enforce,
+        buildStart: _ => boot(options, platform),
+        transform: (code, id, opt) => options?.skip?.(code, id, opt) ? code : transform(code),
         buildEnd: exit
     };
 };