dredless 0.6.0 → 0.6.2

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "dredless",
-    "version": "0.6.0",
+    "version": "0.6.2",
     "description": "A fully-featured and from-scratch headless drednot.io client implementation written in pure js.",
     "license": "MIT",
     "homepage": "https://github.com/certainhuman/dredless#readme",
@@ -152,6 +152,7 @@
         }
     },
     "dependencies": {
+        "sharp": "^0.35.4",
         "ws": "^8.18.0"
     },
     "files": [

package/src/index.d.ts

@@ -26,12 +26,16 @@ export interface ShipList {
 export interface InviteMetadata {
     shipId: string | null;
     name: string | null;
-    color: string | null;
+    /** CSS RGB color sampled from the preview image's top-left pixel, when available. */
+    color?: string | null;
     previewImageUrl: string | null;
     hostname: string;
     inviteCode: string;
 }
-export interface InviteFetchOptions { fetchImpl?: typeof fetch; }
+export interface InviteFetchOptions {
+    fetchImpl?: typeof fetch;
+    includeColor?: boolean;
+}
 export function fetchInviteMetadata(invite: string | URL, options?: InviteFetchOptions): Promise<InviteMetadata>;
 export function parseInviteMetadata(html: string): InviteMetadata;
 

package/src/network/invites.d.ts

@@ -1,11 +1,15 @@
 export interface InviteMetadata {
     shipId: string | null;
     name: string | null;
-    color: string | null;
+    /** CSS RGB color sampled from the preview image's top-left pixel, when available. */
+    color?: string | null;
     previewImageUrl: string | null;
     hostname: string;
     inviteCode: string;
 }
-export interface InviteFetchOptions { fetchImpl?: typeof fetch; }
+export interface InviteFetchOptions {
+    fetchImpl?: typeof fetch;
+    includeColor?: boolean;
+}
 export function fetchInviteMetadata(invite: string | URL, options?: InviteFetchOptions): Promise<InviteMetadata>;
 export function parseInviteMetadata(html: string): InviteMetadata;

package/src/network/invites.js

@@ -1,10 +1,48 @@
-import {getFetch} from "../runtime.js";
+import {getFetch, isBrowser} from "../runtime.js";
 
-export async function fetchInviteMetadata(invite, {fetchImpl = null} = {}) {
+export async function fetchInviteMetadata(invite, {fetchImpl = null, includeColor = false} = {}) {
     const url = normalizeInviteUrl(invite);
-    const response = await (fetchImpl || getFetch())(url.href, {headers: {accept: "text/html"}});
+    const fetcher = fetchImpl || getFetch();
+    const response = await fetcher(url.href, {headers: {accept: "text/html"}});
     if (!response.ok) throw new Error(`Invite metadata request failed: ${response.status} ${response.statusText}`);
-    return parseInviteMetadata(await response.text());
+    const metadata = parseInviteMetadata(await response.text());
+    if (!includeColor || !metadata.previewImageUrl) return metadata;
+    return Object.freeze({...metadata, color: await fetchTopLeftColor(metadata.previewImageUrl, fetcher)});
+}
+
+async function fetchTopLeftColor(imageUrl, fetcher) {
+    try {
+        let response = await fetcher(imageUrl, {headers: {range: "bytes=0-1023"}});
+        if (!response.ok) return null;
+        const buffer = await response.arrayBuffer();
+        try {
+            return await decodeImageColor(buffer);
+        } catch (error) {
+            if (response.status !== 206) throw error;
+            response = await fetcher(imageUrl);
+            if (!response.ok) return null;
+            return await decodeImageColor(await response.arrayBuffer());
+        }
+    } catch {
+        return null;
+    }
+}
+
+async function decodeImageColor(buffer) {
+        if (isBrowser()) {
+            const bitmap = await createImageBitmap(new Blob([buffer]));
+            const canvas = typeof OffscreenCanvas === "function" ? new OffscreenCanvas(1, 1) : document.createElement("canvas");
+            canvas.width = canvas.height = 1;
+            const context = canvas.getContext("2d");
+            context.drawImage(bitmap, 0, 0, 1, 1);
+            const [red, green, blue] = context.getImageData(0, 0, 1, 1).data;
+            bitmap.close();
+            return `rgb(${red},${green},${blue})`;
+        }
+        const sharpModule = await import("sharp");
+        const sharp = sharpModule.default || sharpModule;
+        const {data} = await sharp(buffer).extract({left: 0, top: 0, width: 1, height: 1}).raw().toBuffer({resolveWithObject: true});
+        return `rgb(${data[0]},${data[1]},${data[2]})`;
 }
 
 export function parseInviteMetadata(html) {
@@ -15,7 +53,6 @@ export function parseInviteMetadata(html) {
     return Object.freeze({
         shipId: parsedTitle.shipId,
         name: parsedTitle.name,
-        color: metaContent(html, "theme-color") || metaContent(html, "color") || null,
         previewImageUrl: preview ? new URL(preview, url).href : null,
         hostname: url.hostname,
         inviteCode: url.pathname.split("/").filter(Boolean).at(-1)
@@ -29,7 +66,7 @@ function normalizeInviteUrl(invite) {
 }
 
 function parseInviteTitle(title) {
-    const match = title.match(/^Invite:\s*(.*?)\s*\{([^{}]+)}(?:\s*-\s*drednot\.io)?\s*$/i);
+    const match = title.match(/^Invite:\s?(.*?)\s*\{([^{}]+)}(?:\s*-\s*drednot\.io)?\s*$/i);
     return match ? {name: decodeHtml(match[1]), shipId: decodeHtml(match[2])} : {name: null, shipId: null};
 }