website-xp-phone 1.5.0

package/src/lib/audioOverlap.ts

@@ -0,0 +1,99 @@
+type ArenaBucket = {
+    idle: HTMLAudioElement[];
+    active: Set<HTMLAudioElement>;
+};
+
+const MAX_ALLOCATIONS_PER_SECOND = 90;
+const ALLOCATION_WINDOW_MS = 1000;
+
+const audioArena = {
+    buckets: new Map<string, ArenaBucket>(),
+    allocationTimestamps: [] as number[],
+};
+
+const getOrCreateBucket = (src: string): ArenaBucket => {
+    let bucket = audioArena.buckets.get(src);
+    if (!bucket) {
+        bucket = { idle: [], active: new Set<HTMLAudioElement>() };
+        audioArena.buckets.set(src, bucket);
+    }
+    return bucket;
+};
+
+const trimAllocationWindow = (now: number) => {
+    audioArena.allocationTimestamps = audioArena.allocationTimestamps.filter(
+        (timestamp) => now - timestamp < ALLOCATION_WINDOW_MS,
+    );
+};
+
+const canAllocateAudio = () => {
+    const now = Date.now();
+    trimAllocationWindow(now);
+    return audioArena.allocationTimestamps.length < MAX_ALLOCATIONS_PER_SECOND;
+};
+
+const markAllocation = () => {
+    audioArena.allocationTimestamps.push(Date.now());
+};
+
+const releaseToPool = (src: string, audio: HTMLAudioElement) => {
+    const bucket = getOrCreateBucket(src);
+    if (!bucket.active.has(audio)) {
+        return;
+    }
+
+    bucket.active.delete(audio);
+    audio.pause();
+    audio.currentTime = 0;
+    bucket.idle.push(audio);
+};
+
+const allocateAudio = (src: string): HTMLAudioElement | null => {
+    if (!canAllocateAudio()) {
+        return null;
+    }
+
+    const audio = new Audio(src);
+    audio.preload = "auto";
+
+    audio.addEventListener("ended", () => {
+        releaseToPool(src, audio);
+    });
+
+    audio.addEventListener("error", () => {
+        releaseToPool(src, audio);
+    });
+
+    markAllocation();
+    return audio;
+};
+
+const acquireFromArena = (src: string): HTMLAudioElement | null => {
+    const bucket = getOrCreateBucket(src);
+
+    const reusable = bucket.idle.pop();
+    if (reusable) {
+        bucket.active.add(reusable);
+        return reusable;
+    }
+
+    const allocated = allocateAudio(src);
+    if (!allocated) {
+        return null;
+    }
+
+    bucket.active.add(allocated);
+    return allocated;
+};
+
+export const playLayeredAudio = (src: string) => {
+    const audio = acquireFromArena(src);
+    if (!audio) {
+        return;
+    }
+
+    audio.currentTime = 0;
+    void audio.play().catch(() => {
+        releaseToPool(src, audio);
+    });
+};

package/src/lib/keyboardInputUtils.ts

@@ -0,0 +1,182 @@
+import { playLayeredAudio } from './audioOverlap';
+
+const CLIPPY_SEQUENCE = 'fuckingclippy';
+const CLIPPY_SEQUENCE_LENGTH = CLIPPY_SEQUENCE.length;
+
+const CLIPPY_SESSION_KEY = 'kroflmao_ui_var';
+
+let sequenceProgress = 0;
+let allowFullVolumeTail = false;
+let listenerAttached = false;
+
+const audio = new Audio('/yooh.mp3');
+
+const visibilitySubscribers = new Set<(visible: boolean) => void>();
+const bubbleSubscribers = new Set<(visible: boolean) => void>();
+
+let bubbleVisible = false;
+let clippyClickTimestamps: number[] = [];
+let bubbleTimeout: ReturnType<typeof setTimeout> | null = null;
+
+const CLIPPY_CLICK_THRESHOLD = 7;
+const CLIPPY_CLICK_WINDOW_MS = 10_000;
+const BUBBLE_DISMISS_MS = 8_000;
+
+const setBubbleVisible = (visible: boolean) => {
+    bubbleVisible = visible;
+    bubbleSubscribers.forEach((cb) => cb(visible));
+};
+
+export const subscribeClippyBubble = (
+    callback: (visible: boolean) => void,
+): (() => void) => {
+    bubbleSubscribers.add(callback);
+    callback(bubbleVisible);
+    return () => bubbleSubscribers.delete(callback);
+};
+
+export const showClippyHint = () => {
+    if (bubbleTimeout !== null) {
+        clearTimeout(bubbleTimeout);
+    }
+
+    setBubbleVisible(true);
+    bubbleTimeout = setTimeout(() => {
+        setBubbleVisible(false);
+        bubbleTimeout = null;
+    }, BUBBLE_DISMISS_MS);
+};
+
+export const onClippyClick = () => {
+    allowFullVolumeTail = false;
+    audio.pause();
+    audio.currentTime = 0;
+    audio.volume = 0;
+    playLayeredAudio('/tada.wav');
+
+    const now = Date.now();
+    clippyClickTimestamps = clippyClickTimestamps.filter(
+        (t) => now - t < CLIPPY_CLICK_WINDOW_MS,
+    );
+    clippyClickTimestamps.push(now);
+
+    if (clippyClickTimestamps.length >= CLIPPY_CLICK_THRESHOLD) {
+        clippyClickTimestamps = [];
+        if (bubbleTimeout !== null) {
+            clearTimeout(bubbleTimeout);
+        }
+        setBubbleVisible(true);
+        bubbleTimeout = setTimeout(() => {
+            setBubbleVisible(false);
+            bubbleTimeout = null;
+        }, BUBBLE_DISMISS_MS);
+    }
+};
+
+let currentVisibility = sessionStorage.getItem(CLIPPY_SESSION_KEY) === '1';
+
+export const subscribeClippyVisibility = (
+    callback: (visible: boolean) => void,
+): (() => void) => {
+    visibilitySubscribers.add(callback);
+    callback(currentVisibility);
+    return () => visibilitySubscribers.delete(callback);
+};
+
+const setVisible = (visible: boolean) => {
+    currentVisibility = visible;
+    sessionStorage.setItem(CLIPPY_SESSION_KEY, visible ? '1' : '0');
+    visibilitySubscribers.forEach((cb) => cb(visible));
+};
+
+const resetAudio = () => {
+    if (allowFullVolumeTail) {
+        return;
+    }
+    audio.pause();
+    audio.currentTime = 0;
+    audio.volume = 0;
+};
+
+const startOrUpdateAudio = (matched: number) => {
+    if (audio.paused) {
+        audio.currentTime = 0;
+    }
+    audio.volume = Math.min(1, Math.max(0, matched / CLIPPY_SEQUENCE_LENGTH));
+    void audio.play().catch(() => {
+        // Autoplay may be blocked before the first user gesture.
+    });
+};
+
+const onAudioEnded = () => {
+    allowFullVolumeTail = false;
+    audio.currentTime = 0;
+    audio.volume = 0;
+};
+
+const isTypingTarget = (target: EventTarget | null) => {
+    if (!(target instanceof HTMLElement)) {
+        return false;
+    }
+
+    if (target.isContentEditable) {
+        return true;
+    }
+
+    const tag = target.tagName.toLowerCase();
+    return tag === 'input' || tag === 'textarea' || tag === 'select';
+};
+
+const handleKeyDown = (event: KeyboardEvent) => {
+    if (event.ctrlKey || event.metaKey || event.altKey) {
+        return;
+    }
+
+    if (isTypingTarget(event.target)) {
+        return;
+    }
+
+    const key = event.key.toLowerCase();
+    if (key.length !== 1 || key < 'a' || key > 'z') {
+        return;
+    }
+
+    if (key === CLIPPY_SEQUENCE[sequenceProgress]) {
+        sequenceProgress += 1;
+        startOrUpdateAudio(sequenceProgress);
+
+        if (sequenceProgress === CLIPPY_SEQUENCE_LENGTH) {
+            setVisible(true);
+            audio.volume = 1;
+            allowFullVolumeTail = true;
+            sequenceProgress = 0;
+        }
+
+        return;
+    }
+
+    sequenceProgress = key === CLIPPY_SEQUENCE[0] ? 1 : 0;
+    if (sequenceProgress > 0) {
+        startOrUpdateAudio(sequenceProgress);
+        return;
+    }
+
+    resetAudio();
+};
+
+export const attachClippyListener = () => {
+    if (listenerAttached) {
+        return;
+    }
+    window.addEventListener('keydown', handleKeyDown);
+    audio.addEventListener('ended', onAudioEnded);
+    listenerAttached = true;
+};
+
+export const detachClippyListener = () => {
+    window.removeEventListener('keydown', handleKeyDown);
+    audio.removeEventListener('ended', onAudioEnded);
+    listenerAttached = false;
+    allowFullVolumeTail = false;
+    resetAudio();
+};

package/src/lib/musicSchema.ts

@@ -0,0 +1,85 @@
+const MUSIC_GROUP_NAME = "akinevz";
+const MUSIC_GROUP_URL = "https://akinevz.com";
+const MUSIC_GROUP_DESCRIPTION =
+    "Independent sound designer, music creator, and electronic music artist.";
+const MUSIC_GROUP_ALTERNATE_NAMES = [
+    "KINE",
+    "KALE",
+    "I lied my name isn't actually KINE",
+    "I lied my name isn't actually KALE",
+];
+const MUSIC_GROUP_GENRES = [
+    "Electronic",
+    "Experimental",
+    "Industrial",
+    "Drone",
+    "Glitch",
+];
+const MUSIC_GROUP_SAME_AS = [
+    "https://soundcloud.com/akinevz",
+    "https://youtube.com/@akinevz",
+    "https://x.com/akinevz",
+    "https://github.com/akinevz2",
+];
+const MUSIC_GROUP_PRIMARY_ALIAS = MUSIC_GROUP_ALTERNATE_NAMES[0] ?? MUSIC_GROUP_NAME;
+
+export type MusicSchemaTrack = {
+    title: string;
+    url: string;
+};
+
+export type MusicRecordingSchema = {
+    "@type": "MusicRecording";
+    name: string;
+    url: string;
+    byArtist: {
+        "@type": "MusicGroup";
+        name: string;
+    };
+};
+
+export type MusicGroupSchema = {
+    "@context": "https://schema.org";
+    "@type": "MusicGroup";
+    name: string;
+    alternateName: string[];
+    url: string;
+    genre: string[];
+    description: string;
+    sameAs: string[];
+    track: MusicRecordingSchema[];
+};
+
+export const serializeJsonLd = (value: unknown): string =>
+    JSON.stringify(value).replace(/</g, "\\u003c");
+
+export const buildMusicGroupSchema = (
+    tracks: MusicSchemaTrack[] = [],
+): MusicGroupSchema => ({
+    "@context": "https://schema.org",
+    "@type": "MusicGroup",
+    name: MUSIC_GROUP_NAME,
+    alternateName: MUSIC_GROUP_ALTERNATE_NAMES,
+    url: MUSIC_GROUP_URL,
+    genre: MUSIC_GROUP_GENRES,
+    description: MUSIC_GROUP_DESCRIPTION,
+    sameAs: MUSIC_GROUP_SAME_AS,
+    track: Array.isArray(tracks)
+        ? tracks
+            .filter(
+                (track): track is MusicSchemaTrack =>
+                    Boolean(track) &&
+                    typeof track.title === "string" &&
+                    typeof track.url === "string",
+            )
+            .map((track) => ({
+                "@type": "MusicRecording",
+                name: track.title,
+                url: track.url,
+                byArtist: {
+                    "@type": "MusicGroup",
+                    name: MUSIC_GROUP_PRIMARY_ALIAS,
+                },
+            }))
+        : [],
+});

package/src/lib/naggingAssistantClient.ts

@@ -0,0 +1,241 @@
+export type AssistantConfig = {
+    endpoint: string;
+    model: string;
+    apiKey: string;
+};
+
+type ModelOption = {
+    id: string;
+};
+
+type OpenAiModelsResponse = {
+    data?: Array<{ id?: string }>;
+    models?: Array<{ id?: string } | string>;
+};
+
+type OpenAiChatResponse = {
+    choices?: Array<{
+        message?: {
+            content?: string;
+        };
+        text?: string;
+    }>;
+};
+
+const STORAGE_KEY = "ok_go_v1";
+const MAX_ASSISTANT_RESPONSE_CHARS = 512;
+
+const normalizeEndpoint = (endpoint: string) => endpoint.trim().replace(/\/+$/, "");
+
+const constrainAssistantText = (text: string) =>
+    text.trim().slice(0, MAX_ASSISTANT_RESPONSE_CHARS);
+
+const buildHeaders = (apiKey: string): HeadersInit => {
+    const headers: HeadersInit = {
+        "Content-Type": "application/json",
+    };
+
+    if (apiKey.trim()) {
+        headers.Authorization = `Bearer ${apiKey.trim()}`;
+    }
+
+    return headers;
+};
+
+const parseModelOptions = (payload: unknown): ModelOption[] => {
+    if (!payload || typeof payload !== "object") {
+        return [];
+    }
+
+    const candidate = payload as OpenAiModelsResponse;
+    const options = new Set<string>();
+
+    if (Array.isArray(candidate.data)) {
+        candidate.data.forEach((item) => {
+            if (item?.id && typeof item.id === "string") {
+                options.add(item.id);
+            }
+        });
+    }
+
+    if (Array.isArray(candidate.models)) {
+        candidate.models.forEach((item) => {
+            if (typeof item === "string") {
+                options.add(item);
+                return;
+            }
+
+            if (item?.id && typeof item.id === "string") {
+                options.add(item.id);
+            }
+        });
+    }
+
+    return Array.from(options)
+        .sort((a, b) => a.localeCompare(b))
+        .map((id) => ({ id }));
+};
+
+const fetchModelsFrom = async (url: string, apiKey: string): Promise<ModelOption[]> => {
+    const response = await fetch(url, {
+        method: "GET",
+        headers: buildHeaders(apiKey),
+    });
+
+    if (!response.ok) {
+        throw new Error(`HTTP ${response.status}`);
+    }
+
+    const payload: unknown = await response.json();
+    return parseModelOptions(payload);
+};
+
+export const loadAssistantConfig = (): AssistantConfig => {
+    try {
+        const raw = window.localStorage.getItem(STORAGE_KEY);
+        if (!raw) {
+            return { endpoint: "", model: "", apiKey: "" };
+        }
+
+        const parsed = JSON.parse(raw) as Partial<AssistantConfig>;
+        return {
+            endpoint: typeof parsed.endpoint === "string" ? parsed.endpoint : "",
+            model: typeof parsed.model === "string" ? parsed.model : "",
+            apiKey: typeof parsed.apiKey === "string" ? parsed.apiKey : "",
+        };
+    } catch {
+        return { endpoint: "", model: "", apiKey: "" };
+    }
+};
+
+export const saveAssistantConfig = (config: AssistantConfig) => {
+    window.localStorage.setItem(
+        STORAGE_KEY,
+        JSON.stringify({
+            endpoint: normalizeEndpoint(config.endpoint),
+            model: config.model.trim(),
+            apiKey: config.apiKey,
+        }),
+    );
+};
+
+export const discoverAssistantModels = async (
+    endpoint: string,
+    apiKey: string,
+): Promise<ModelOption[]> => {
+    const base = normalizeEndpoint(endpoint);
+    if (!base) {
+        throw new Error("Endpoint is required.");
+    }
+
+    const candidates = [
+        `${base}/v1/models`,
+        `${base}/models`,
+        `${base}/api/models`,
+        `${base}/openai/models`,
+    ];
+
+    for (const candidateUrl of candidates) {
+        try {
+            const options = await fetchModelsFrom(candidateUrl, apiKey);
+            if (options.length > 0) {
+                return options;
+            }
+        } catch {
+            // Try next compatible endpoint.
+        }
+    }
+
+    throw new Error("No models found from the provided endpoint.");
+};
+
+const chatCompletionCandidates = (endpoint: string) => {
+    const base = normalizeEndpoint(endpoint);
+    return [
+        `${base}/v1/chat/completions`,
+        `${base}/chat/completions`,
+        `${base}/api/chat/completions`,
+    ];
+};
+
+const extractChatText = (payload: unknown): string => {
+    if (!payload || typeof payload !== "object") {
+        return "";
+    }
+
+    const candidate = payload as OpenAiChatResponse;
+    const first = candidate.choices?.[0];
+    const content = first?.message?.content ?? first?.text ?? "";
+
+    return typeof content === "string" ? constrainAssistantText(content) : "";
+};
+
+export const requestAssistantCompletion = async (
+    config: AssistantConfig,
+    prompt: string,
+    options?: { conversationPrompt?: boolean },
+): Promise<string> => {
+    const endpoint = normalizeEndpoint(config.endpoint);
+    const model = config.model.trim();
+
+    if (!endpoint) {
+        throw new Error("Missing endpoint configuration.");
+    }
+
+    if (!model) {
+        throw new Error("Missing model configuration.");
+    }
+
+    const systemInstructionBase =
+        "Operate in lowest reasoning mode. Keep the response at or below 512 characters. Markdown is forbidden except optional inline code delimited by single backticks, and that inline code form must be used exclusively to indicate emphasis. Reply in 1-3 concise, practical sentences.";
+    // Wisdom framing is disabled in production while CORS-related wisdom flow is paused.
+    // const conversationExtension =
+    //     "Accept conversation about any topic with no specialization or assumed input format, and ensure the response still resembles practical wisdom.";
+
+    const body = {
+        model,
+        messages: [
+            {
+                role: "system",
+                content: options?.conversationPrompt
+                    // ? `${systemInstructionBase} ${conversationExtension}`
+                    ? systemInstructionBase
+                    : systemInstructionBase,
+            },
+            {
+                role: "user",
+                content: prompt,
+            },
+        ],
+        temperature: 1.1,
+    };
+
+    let lastError = "Request failed.";
+
+    for (const url of chatCompletionCandidates(endpoint)) {
+        try {
+            const response = await fetch(url, {
+                method: "POST",
+                headers: buildHeaders(config.apiKey),
+                body: JSON.stringify(body),
+            });
+
+            if (!response.ok) {
+                lastError = `HTTP ${response.status}`;
+                continue;
+            }
+
+            const payload: unknown = await response.json();
+            const text = extractChatText(payload);
+            if (text) {
+                return text;
+            }
+
+            lastError = "Response did not include text.";
+        } catch (error) {
+            lastError = error instanceof Error ? error.message : "Network error";
+        }
+    }
+
+    throw new Error(lastError);
+};