initial (#5)

.github/workflows/codeql.yml

@@ -0,0 +1,36 @@
+name: codeql
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  analyze:
+    name: analyze
+    runs-on: ubuntu-latest
+    permissions:
+      actions: read
+      contents: read
+      security-events: write
+    strategy:
+      fail-fast: false
+      matrix:
+        language: [ 'javascript' ]
+    steps:
+      - name: checkout
+        uses: actions/checkout@v4
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+      - name: initialize codeql
+        uses: github/codeql-action/init@v2
+        with:
+          languages: ${{ matrix.language }}
+      - name: build
+        run: |
+          npm install
+          bash scripts/build.sh
+      - name: analyze
+        uses: github/codeql-action/analyze@v2

.github/workflows/cover.yml

@@ -0,0 +1,26 @@
+name: cover
+
+on:
+  push:
+    branches: [ main ]
+  pull_request:
+    branches: [ main ]
+
+jobs:
+  cover:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+      - name: cover
+        run: |
+          npm install
+          npm run cover
+      - name: upload report
+        uses: codecov/codecov-action@v3
+        with:
+          fail_ci_if_error: true
+        env:
+          CODECOV_TOKEN: ${{ secrets.CODECOV_TOKEN }}

.github/workflows/deploy.yml

@@ -0,0 +1,27 @@
+name: publish
+on:
+  workflow_dispatch: { }
+  push:
+    branches:
+      - main
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    permissions:
+      pages: write
+      id-token: write
+    environment:
+      name: github-pages
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v3
+      - name: build
+        run: |
+          cd docs
+          npm install
+          npm run build
+      - uses: actions/configure-pages@v3
+      - uses: actions/upload-pages-artifact@v2
+        with:
+          path: .vitepress/dist
+      - uses: actions/deploy-pages@v2

.github/workflows/lint.yml

@@ -13,4 +13,4 @@ jobs:
       - uses: actions/checkout@v2
       - name: editorconfig
         run: |
-          docker run --rm --volume=$PWD:/check mstruebing/editorconfig-checker ec --exclude .git
+          docker run --rm --volume=$PWD:/check mstruebing/editorconfig-checker ec --exclude "\.git|*\.blend"

.github/workflows/publish.yml

@@ -0,0 +1,24 @@
+name: publish
+
+on:
+  release:
+    types: [ published ]
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - name: checkout
+        uses: actions/checkout@v4
+      - name: setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 20
+          registry-url: "https://npm.pkg.github.com"
+      - name: build
+        run: |
+          npm install
+          bash scripts/build.sh
+      - run: npm publish
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.GH_KEY }}

README.md

@@ -6,12 +6,30 @@
 <br/>
 <p align="center">
   <a href="https://www.npmjs.com/package/imgit"><img src="https://img.shields.io/npm/v/imgit" alt="npm"></a>
-  <a href="https://codefactor.io/repository/github/elringus/Bootsharp/overview/main"><img src="https://codefactor.io/repository/github/elringus/bootsharp/badge/main" alt="codefactor"></a>
-  <a href="https://codecov.io/gh/Elringus/Bootsharp"><img src="https://codecov.io/gh/Elringus/Bootsharp/branch/main/graph/badge.svg?token=AAhei51ETt" alt="codecov"></a>
-  <a href="https://github.com/Elringus/Bootsharp/actions/workflows/codeql.yml"><img src="https://github.com/Elringus/Bootsharp/actions/workflows/codeql.yml/badge.svg" alt="codeql"></a>
+  <a href="https://codefactor.io/repository/github/elringus/imgit/overview/main"><img src="https://codefactor.io/repository/github/elringus/imgit/badge/main" alt="codefactor"></a>
+  <a href="https://codecov.io/gh/elringus/imgit"><img src="https://codecov.io/gh/elringus/imgit/graph/badge.svg?token=3JvjXxyfag" alt="codecov"/></a>
+  <a href="https://github.com/elringus/imgit/actions/workflows/codeql.yml"><img src="https://github.com/elringus/imgit/actions/workflows/codeql.yml/badge.svg" alt="codeql"></a>
 </p>
 <br/>
 
-# imgit
+# Convert media links to optimized HTML
 
-Optimize images and video generated from markdown.
+Images, video and YouTube: fetch, encode, scale, lazyload – for best UX and [Web Vitals](https://web.dev/vitals).
+
+✨ Builds optimized HTML for arbitrary image, video and YouTube syntax, such as URLs, markdown or JSX tags.
+
+⚡ Encodes to the modern AV1/AVIF format compressing by up to 90% without noticeable quality loss. Supports GPU acceleration.
+
+♻️ Works with most known media formats: JPEG, PNG, APNG, SVG, GIF, WEBP, WEBM, MP4, AVI, MOV, MKV, BMP, TIFF, TGA and even PSD.
+
+🌊 Generates tiny blurred covers from the source content to be beautifully crossfaded into HD originals once lazy-loaded.
+
+📐 Optionally scales down the content to specified threshold while preserving high-resolution variants for high-DPI displays.
+
+🌐 Fetches from remote sources, such as image hostings. Uploads optimized content to designated endpoint, such as CDN.
+
+🗺️ Built-in plugins for Astro, SvelteKit, SolidStart, VitePress, Nuxt and Remix. Adapters for Node, Deno and Bun runtimes.
+
+### 🎬 Get Started
+
+http://imgit.dev/guide

docs/.gitignore

@@ -0,0 +1 @@
+cache

docs/.vitepress/config.ts

@@ -0,0 +1,76 @@
+import { defineConfig } from "vitepress";
+import md from "./md";
+import escapeCode from "./escape-code";
+import imgit from "imgit/vite";
+import svg from "imgit/svg";
+import youtube from "imgit/youtube";
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+    title: "imgit",
+    titleTemplate: ":title • imgit",
+    appearance: "dark",
+    cleanUrls: true,
+    lastUpdated: true,
+    markdown: md,
+    vite: { plugins: [imgit({ width: 688, plugins: [svg(), youtube(), escapeCode] })] },
+    head: [
+        ["link", { rel: "icon", href: "/favicon.svg" }],
+        ["link", { rel: "preload", href: "/fonts/inter.woff2", as: "font", type: "font/woff2", crossorigin: "" }],
+        ["link", { rel: "preload", href: "/fonts/jb.woff2", as: "font", type: "font/woff2", crossorigin: "" }],
+        ["meta", { name: "theme-color", content: "#ee3248" }],
+        ["meta", { name: "og:image", content: "/img/og.jpg" }],
+        ["meta", { name: "twitter:card", content: "summary_large_image" }]
+    ],
+    themeConfig: {
+        logo: { src: "/favicon.svg" },
+        logoLink: "/",
+        socialLinks: [{ icon: "github", link: "https://github.com/elringus/imgit" }],
+        search: { provider: "local" },
+        lastUpdated: { text: "Updated", formatOptions: { dateStyle: "medium" } },
+        sidebarMenuLabel: "Menu",
+        darkModeSwitchLabel: "Appearance",
+        returnToTopLabel: "Return to top",
+        outline: { label: "On this page", level: "deep" },
+        docFooter: { prev: "Previous page", next: "Next page" },
+        nav: [
+            { text: "Guide", link: "/guide/", activeMatch: "/guide/" },
+            {
+                text: `v${(await import("./../../package.json")).version}`, items: [
+                    { text: "Changes", link: "https://github.com/elringus/imgit/releases/latest" },
+                    { text: "Contribute", link: "https://github.com/elringus/imgit/labels/help%20wanted" }
+                ]
+            }
+        ],
+        editLink: {
+            pattern: "https://github.com/elringus/imgit/edit/main/docs/:path",
+            text: "Edit this page on GitHub"
+        },
+        sidebar: {
+            "/guide/": [
+                {
+                    text: "Guide",
+                    items: [
+                        { text: "Introduction", link: "/guide/" },
+                        { text: "Getting Started", link: "/guide/getting-started" },
+                        { text: "GPU Acceleration", link: "/guide/gpu-acceleration" },
+                        { text: "Plugins", link: "/guide/plugins" }
+                    ]
+                },
+                {
+                    text: "Integrations",
+                    items: [
+                        { text: "Vite", link: "/guide/integrations/vite" },
+                        { text: "Astro", link: "/guide/integrations/astro" },
+                        { text: "Nuxt", link: "/guide/integrations/nuxt" },
+                        { text: "Remix", link: "/guide/integrations/remix" },
+                        { text: "SolidStart", link: "/guide/integrations/solid" },
+                        { text: "SvelteKit", link: "/guide/integrations/svelte" },
+                        { text: "VitePress", link: "/guide/integrations/vitepress" }
+                    ]
+                }
+            ]
+        }
+    },
+    sitemap: { hostname: "https://imgit.dev" }
+});

docs/.vitepress/escape-code.ts

@@ -0,0 +1,50 @@
+import { Plugin, CapturedAsset, stages } from "imgit/server";
+
+type Range = { start: number; end: number; };
+
+export default { capture } satisfies Plugin;
+
+// Remove captures inside Markdown code blocks (```code```).
+function capture(content: string, assets: CapturedAsset[]): boolean {
+    stages.capture.capture(content, assets);
+    if (assets.length === 0) return true;
+    const ranges = findCodeRanges(content);
+    if (ranges.length > 0)
+        assets.splice(0, assets.length, ...assets.filter(a => !isInCodeBlock(a, ranges)));
+    return true;
+}
+
+function findCodeRanges(content: string): Range[] {
+    const ranges = new Array<Range>();
+    let tickCount = 0;
+    let openIndex = -1;
+    for (let i = 0; i < content.length; i++)
+        if (content[i] === "`") handleTick(i);
+        else tickCount = 0;
+    return ranges;
+
+    function handleTick(index: number): void {
+        if (++tickCount < 3) return;
+        if (openIndex === -1) openRange(index);
+        else closeRange(index);
+    }
+
+    function openRange(index: number): void {
+        openIndex = index;
+        tickCount = 0;
+    }
+
+    function closeRange(index: number): void {
+        ranges.push({ start: openIndex, end: index });
+        openIndex = -1;
+        tickCount = 0;
+    }
+}
+
+function isInCodeBlock(asset: CapturedAsset, ranges: Range[]): boolean {
+    for (const range of ranges)
+        if (asset.syntax.index >= range.start &&
+            (asset.syntax.index + asset.syntax.text.length) <= range.end)
+            return true;
+    return false;
+}

docs/.vitepress/md/index.ts

@@ -0,0 +1,11 @@
+import { MarkdownOptions, MarkdownRenderer } from "vitepress";
+import { AppendIconToExternalLinks } from "./md-link";
+
+export default {
+    config: installPlugins,
+    attrs: { disable: true } // https://github.com/vuejs/vitepress/issues/2440
+} satisfies MarkdownOptions;
+
+function installPlugins(md: MarkdownRenderer) {
+    md.use(AppendIconToExternalLinks);
+}

docs/.vitepress/md/md-link.ts

@@ -0,0 +1,30 @@
+import type { MarkdownRenderer } from "vitepress";
+import type { RenderRule } from "markdown-it/lib/renderer";
+
+export function AppendIconToExternalLinks(md: MarkdownRenderer) {
+    const renderToken: RenderRule = (tokens, idx, options, env, self) => self.renderToken(tokens, idx, options);
+    const defaultLinkOpenRenderer = md.renderer.rules.link_open || renderToken;
+    const defaultLinkCloseRenderer = md.renderer.rules.link_close || renderToken;
+    let externalLinkOpen = false;
+
+    md.renderer.rules.link_open = (tokens, idx, options, env, self) => {
+        const token = tokens[idx];
+        const href = token.attrGet("href");
+
+        if (href) {
+            token.attrJoin("class", "vp-link");
+            if (/^((ht|f)tps?):\/\/?/.test(href))
+                externalLinkOpen = true;
+        }
+
+        return defaultLinkOpenRenderer(tokens, idx, options, env, self);
+    };
+
+    md.renderer.rules.link_close = (tokens, idx, options, env, self) => {
+        if (externalLinkOpen) {
+            externalLinkOpen = false;
+            return `<span class="external-link-icon">&nbsp;↗</span>${self.renderToken(tokens, idx, options)}`;
+        }
+        return defaultLinkCloseRenderer(tokens, idx, options, env, self);
+    };
+}

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

@@ -0,0 +1,39 @@
+// Based on https://github.com/rlidwka/markdown-it-regexp.
+
+import { inherits } from "node:util";
+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);
+    self.__proto__ = Replacer.prototype;
+    self.regexp = new RegExp("^" + regexp.source, regexp.flags);
+    self.replace = replace;
+    self.id = `md-replacer-${instanceId}`;
+    instanceId++;
+    return self;
+}
+
+inherits(Replacer, Function);
+
+Replacer.prototype.init = function (md: MarkdownRenderer) {
+    md.inline.ruler.push(this.id, this.parse.bind(this));
+    md.renderer.rules[this.id] = this.render.bind(this);
+};
+
+Replacer.prototype.parse = function (state: any, silent: any) {
+    let match = this.regexp.exec(state.src.slice(state.pos));
+    if (!match) return false;
+
+    state.pos += match[0].length;
+    if (silent) return true;
+
+    let token = state.push(this.id, "", 0);
+    token.meta = { match: match };
+    return true;
+};
+
+Replacer.prototype.render = function (tokens: any, id: any, options: any, env: MarkdownEnv) {
+    return this.replace(tokens[id].meta.match, env);
+};

docs/.vitepress/theme/index.ts

@@ -0,0 +1,12 @@
+import DefaultTheme from "vitepress/theme-without-fonts";
+import "./style.css";
+
+// Have to import client assets manually due to vitepress
+// bug: https://github.com/vuejs/vitepress/issues/3314
+import "imgit/styles";
+import "imgit/styles/youtube";
+import "imgit/client";
+import "imgit/client/youtube";
+
+// https://vitepress.dev/guide/extending-default-theme
+export default { extends: { Layout: DefaultTheme.Layout } };