create-pixi-vn 2.1.4 → 2.1.6

package/template-react-vite-muijoy-ink/src/lib/utils/device-diagnostics-utility.ts

@@ -0,0 +1,382 @@
+import packageJson from "@/../package.json";
+import { canvas, PIXIVN_VERSION } from "@drincs/pixi-vn";
+import motionPackageJson from "motion/package.json";
+import { VERSION as PIXIJS_VERSION } from "pixi.js";
+import tonePackageJson from "tone/package.json";
+
+export interface WebglExtensionCheck {
+    name: string;
+    supported: boolean;
+}
+
+export interface WebglDiagnostics {
+    webgl1Supported: boolean;
+    webgl2Supported: boolean;
+    vendor: string | null;
+    renderer: string | null;
+    unmaskedVendor: string | null;
+    unmaskedRenderer: string | null;
+    /** null when it cannot be determined (e.g. WEBGL_debug_renderer_info is blocked). */
+    hardwareAccelerated: boolean | null;
+    maxTextureSize: number | null;
+    floatTexturesSupported: boolean;
+    msaaSupported: boolean;
+    shadersCompile: boolean;
+    keyExtensions: WebglExtensionCheck[];
+    allExtensions: string[];
+}
+
+export interface BrowserCapabilities {
+    audio: boolean;
+    gamepad: boolean;
+    clipboard: boolean;
+    fullscreen: boolean;
+    localStorage: boolean;
+    indexedDb: boolean;
+    /** Best-effort heuristic only: Steam's overlay is compositor-level and generally invisible to page JS. */
+    steamOverlayDetected: boolean;
+}
+
+export interface ResolutionInfo {
+    innerWidth: number;
+    innerHeight: number;
+    screenWidth: number;
+    screenHeight: number;
+    devicePixelRatio: number;
+}
+
+export interface JsMemoryInfo {
+    usedJSHeapSize: number;
+    totalJSHeapSize: number;
+    jsHeapSizeLimit: number;
+}
+
+const KEY_WEBGL_EXTENSIONS = [
+    "WEBGL_debug_renderer_info",
+    "WEBGL_lose_context",
+    "WEBGL_compressed_texture_s3tc",
+    "WEBGL_compressed_texture_astc",
+    "WEBGL_compressed_texture_etc",
+    "OES_texture_float",
+    "OES_texture_float_linear",
+    "OES_texture_half_float",
+    "OES_element_index_uint",
+    "OES_standard_derivatives",
+    "ANGLE_instanced_arrays",
+    "EXT_texture_filter_anisotropic",
+    "EXT_color_buffer_float",
+];
+
+const SOFTWARE_RENDERER_PATTERN =
+    /swiftshader|llvmpipe|software|microsoft basic render|d3d11 warp|apple software renderer/i;
+
+function testShaderCompilation(gl: WebGLRenderingContext | WebGL2RenderingContext): boolean {
+    try {
+        const vertexShader = gl.createShader(gl.VERTEX_SHADER);
+        const fragmentShader = gl.createShader(gl.FRAGMENT_SHADER);
+        if (!vertexShader || !fragmentShader) {
+            return false;
+        }
+
+        gl.shaderSource(
+            vertexShader,
+            "attribute vec2 p; void main() { gl_Position = vec4(p, 0.0, 1.0); }",
+        );
+        gl.compileShader(vertexShader);
+        gl.shaderSource(
+            fragmentShader,
+            "precision mediump float; void main() { gl_FragColor = vec4(1.0); }",
+        );
+        gl.compileShader(fragmentShader);
+        if (
+            !gl.getShaderParameter(vertexShader, gl.COMPILE_STATUS) ||
+            !gl.getShaderParameter(fragmentShader, gl.COMPILE_STATUS)
+        ) {
+            return false;
+        }
+
+        const program = gl.createProgram();
+        if (!program) {
+            return false;
+        }
+        gl.attachShader(program, vertexShader);
+        gl.attachShader(program, fragmentShader);
+        gl.linkProgram(program);
+        return !!gl.getProgramParameter(program, gl.LINK_STATUS);
+    } catch {
+        return false;
+    }
+}
+
+/**
+ * Probes a throwaway canvas instead of the live Pixi-VN canvas so this works
+ * regardless of which renderer Pixi actually picked (or before Pixi has initialized).
+ */
+export function getWebglDiagnostics(): WebglDiagnostics {
+    const probeCanvas = document.createElement("canvas");
+    const gl2 = probeCanvas.getContext("webgl2") as WebGL2RenderingContext | null;
+    const gl1 = (probeCanvas.getContext("webgl") ??
+        probeCanvas.getContext("experimental-webgl")) as WebGLRenderingContext | null;
+    const gl = gl2 ?? gl1;
+
+    if (!gl) {
+        return {
+            webgl1Supported: false,
+            webgl2Supported: false,
+            vendor: null,
+            renderer: null,
+            unmaskedVendor: null,
+            unmaskedRenderer: null,
+            hardwareAccelerated: null,
+            maxTextureSize: null,
+            floatTexturesSupported: false,
+            msaaSupported: false,
+            shadersCompile: false,
+            keyExtensions: KEY_WEBGL_EXTENSIONS.map((name) => ({ name, supported: false })),
+            allExtensions: [],
+        };
+    }
+
+    const debugInfo = gl.getExtension("WEBGL_debug_renderer_info");
+    const vendor = (gl.getParameter(gl.VENDOR) as string) ?? null;
+    const renderer = (gl.getParameter(gl.RENDERER) as string) ?? null;
+    const unmaskedVendor = debugInfo
+        ? ((gl.getParameter(debugInfo.UNMASKED_VENDOR_WEBGL) as string) ?? null)
+        : null;
+    const unmaskedRenderer = debugInfo
+        ? ((gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL) as string) ?? null)
+        : null;
+    const rendererForHeuristic = unmaskedRenderer ?? renderer;
+    const hardwareAccelerated = rendererForHeuristic
+        ? !SOFTWARE_RENDERER_PATTERN.test(rendererForHeuristic)
+        : null;
+
+    const allExtensions = gl.getSupportedExtensions() ?? [];
+    const keyExtensions = KEY_WEBGL_EXTENSIONS.map((name) => ({
+        name,
+        supported: allExtensions.includes(name),
+    }));
+
+    const maxTextureSize = (gl.getParameter(gl.MAX_TEXTURE_SIZE) as number) ?? null;
+    const floatTexturesSupported = gl2 ? true : allExtensions.includes("OES_texture_float");
+    const msaaSupported = gl2
+        ? ((gl2.getParameter(gl2.MAX_SAMPLES) as number) ?? 0) > 1
+        : (gl.getContextAttributes()?.antialias ?? false);
+    const shadersCompile = testShaderCompilation(gl);
+
+    // This is a throwaway probe context; release it instead of leaving it around.
+    gl.getExtension("WEBGL_lose_context")?.loseContext();
+
+    return {
+        webgl1Supported: !!gl1 || !!gl2,
+        webgl2Supported: !!gl2,
+        vendor,
+        renderer,
+        unmaskedVendor,
+        unmaskedRenderer,
+        hardwareAccelerated,
+        maxTextureSize,
+        floatTexturesSupported,
+        msaaSupported,
+        shadersCompile,
+        keyExtensions,
+        allExtensions,
+    };
+}
+
+export function detectPlatform(): string {
+    const ua = navigator.userAgent;
+    const uaData = (navigator as Navigator & { userAgentData?: { platform?: string } })
+        .userAgentData;
+    const platformHint = uaData?.platform ?? navigator.platform ?? "";
+
+    if (/android/i.test(ua)) return "Android";
+    if (/iphone|ipod/i.test(ua)) return "iOS";
+    // iPadOS reports as "MacIntel" but exposes multi-touch, unlike a real Mac.
+    if (/ipad/i.test(ua) || (/mac/i.test(platformHint) && navigator.maxTouchPoints > 1))
+        return "iOS";
+    if (/mac/i.test(platformHint)) return "macOS";
+    if (/win/i.test(platformHint)) return "Windows";
+    if (/linux/i.test(platformHint)) return "Linux";
+    return "Unknown";
+}
+
+export function detectBrowserEngine(): string {
+    const ua = navigator.userAgent;
+    if (/edg\//i.test(ua)) return "Chromium (Edge)";
+    if (/firefox|fxios/i.test(ua)) return "Gecko (Firefox)";
+    if (/crios/i.test(ua)) return "Chromium (Chrome iOS)";
+    if (/chrome|chromium/i.test(ua)) return "Chromium";
+    if (/safari/i.test(ua)) return "WebKit (Safari)";
+    return "Unknown";
+}
+
+export function getBrowserCapabilities(): BrowserCapabilities {
+    const win = window as Window & {
+        webkitAudioContext?: typeof AudioContext;
+        cefQuery?: unknown;
+    };
+
+    let localStorageAvailable = false;
+    try {
+        const testKey = "__diagnostics_test__";
+        window.localStorage.setItem(testKey, "1");
+        window.localStorage.removeItem(testKey);
+        localStorageAvailable = true;
+    } catch {
+        localStorageAvailable = false;
+    }
+
+    return {
+        audio: typeof AudioContext !== "undefined" || typeof win.webkitAudioContext !== "undefined",
+        gamepad: typeof navigator.getGamepads === "function",
+        clipboard: typeof navigator.clipboard?.writeText === "function",
+        fullscreen: document.fullscreenEnabled === true,
+        localStorage: localStorageAvailable,
+        indexedDb: typeof window.indexedDB !== "undefined",
+        steamOverlayDetected:
+            typeof win.cefQuery === "function" ||
+            /Valve Steam|SteamOverlay/i.test(navigator.userAgent),
+    };
+}
+
+export function getResolutionInfo(): ResolutionInfo {
+    return {
+        innerWidth: window.innerWidth,
+        innerHeight: window.innerHeight,
+        screenWidth: window.screen?.width ?? 0,
+        screenHeight: window.screen?.height ?? 0,
+        devicePixelRatio: window.devicePixelRatio || 1,
+    };
+}
+
+export function getJsMemoryInfo(): JsMemoryInfo | null {
+    const memory = (performance as Performance & { memory?: JsMemoryInfo }).memory;
+    if (!memory) {
+        return null;
+    }
+    return {
+        usedJSHeapSize: memory.usedJSHeapSize,
+        totalJSHeapSize: memory.totalJSHeapSize,
+        jsHeapSizeLimit: memory.jsHeapSizeLimit,
+    };
+}
+
+export function getCurrentFps(): number | null {
+    try {
+        return Math.round(canvas.app.ticker.FPS);
+    } catch {
+        return null;
+    }
+}
+
+export function getGameVersion(): string {
+    return packageJson.version;
+}
+
+export function getPixiJsVersion(): string {
+    return PIXIJS_VERSION;
+}
+
+export function getPixiVnVersion(): string {
+    return PIXIVN_VERSION;
+}
+
+export function getToneJsVersion(): string {
+    return tonePackageJson.version;
+}
+
+export function getMotionVersion(): string {
+    return motionPackageJson.version;
+}
+
+function formatBytes(bytes: number): string {
+    return `${(bytes / (1024 * 1024)).toFixed(1)} MB`;
+}
+
+export interface DeviceDiagnosticsSnapshot {
+    webgl: WebglDiagnostics;
+    capabilities: BrowserCapabilities;
+    resolution: ResolutionInfo;
+    memory: JsMemoryInfo | null;
+    fps: number | null;
+    userAgent: string;
+    platform: string;
+    browserEngine: string;
+    gameVersion: string;
+    pixiJsVersion: string;
+    pixiVnVersion: string;
+    toneJsVersion: string;
+    motionVersion: string;
+}
+
+export function buildDiagnosticsReportText(snapshot: DeviceDiagnosticsSnapshot): string {
+    const { webgl, capabilities, resolution, memory, fps } = snapshot;
+    const yn = (value: boolean | null) => (value === null ? "Unknown" : value ? "Yes" : "No");
+
+    const lines = [
+        "=== Device Diagnostics Report ===",
+        `Game version: ${snapshot.gameVersion}`,
+        `PixiJS version: ${snapshot.pixiJsVersion}`,
+        `Pixi'VN version: ${snapshot.pixiVnVersion}`,
+        `Tone.js version: ${snapshot.toneJsVersion}`,
+        `Motion version: ${snapshot.motionVersion}`,
+        `User Agent: ${snapshot.userAgent}`,
+        `Platform: ${snapshot.platform}`,
+        `Browser/WebView: ${snapshot.browserEngine}`,
+        "",
+        "-- Graphics --",
+        `WebGL1 available: ${yn(webgl.webgl1Supported)}`,
+        `WebGL2 available: ${yn(webgl.webgl2Supported)}`,
+        `Hardware acceleration: ${yn(webgl.hardwareAccelerated)}`,
+        `GPU vendor: ${webgl.unmaskedVendor ?? webgl.vendor ?? "Unknown"}`,
+        `GPU renderer: ${webgl.unmaskedRenderer ?? webgl.renderer ?? "Unknown"}`,
+        `Max texture size: ${webgl.maxTextureSize ?? "Unknown"}`,
+        `Float textures: ${yn(webgl.floatTexturesSupported)}`,
+        `MSAA: ${yn(webgl.msaaSupported)}`,
+        `Shaders compile: ${yn(webgl.shadersCompile)}`,
+        `WebGL extensions: ${webgl.keyExtensions
+            .filter((extension) => extension.supported)
+            .map((extension) => extension.name)
+            .join(", ")}`,
+        "",
+        "-- Display --",
+        `Resolution: ${resolution.innerWidth}x${resolution.innerHeight} (screen ${resolution.screenWidth}x${resolution.screenHeight})`,
+        `Device pixel ratio: ${resolution.devicePixelRatio}`,
+        `FPS: ${fps ?? "Unknown"}`,
+        "",
+        "-- Memory --",
+        memory
+            ? `JS heap: ${formatBytes(memory.usedJSHeapSize)} / ${formatBytes(memory.totalJSHeapSize)} (limit ${formatBytes(memory.jsHeapSizeLimit)})`
+            : "JS heap: Not available in this browser",
+        "",
+        "-- Browser capabilities --",
+        `Audio (Web Audio API): ${yn(capabilities.audio)}`,
+        `Gamepad API: ${yn(capabilities.gamepad)}`,
+        `Clipboard API: ${yn(capabilities.clipboard)}`,
+        `Fullscreen API: ${yn(capabilities.fullscreen)}`,
+        `LocalStorage: ${yn(capabilities.localStorage)}`,
+        `IndexedDB: ${yn(capabilities.indexedDb)}`,
+        `Steam Overlay detected (best-effort): ${yn(capabilities.steamOverlayDetected)}`,
+    ];
+
+    return lines.join("\n");
+}
+
+export function buildDiagnosticsReportJson(snapshot: DeviceDiagnosticsSnapshot): object {
+    return {
+        generatedAt: new Date().toISOString(),
+        ...snapshot,
+    };
+}
+
+export function downloadDiagnosticsReportJson(snapshot: DeviceDiagnosticsSnapshot) {
+    const jsonString = JSON.stringify(buildDiagnosticsReportJson(snapshot), null, 2);
+    const blob = new Blob([jsonString], { type: "application/json" });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    a.href = url;
+    a.download = `${__APP_NAME__}-${__APP_VERSION__}-diagnostics-${Date.now()}.json`;
+    a.click();
+    URL.revokeObjectURL(url);
+}

package/template-react-vite-muijoy-ink/src/locales/en.json

@@ -63,6 +63,56 @@
     "name": "Name",
     "version": "Version",
     "engine": "Engine",
+    "diagnostics": "Diagnostics",
+    "diagnostics_yes": "Yes",
+    "diagnostics_no": "No",
+    "diagnostics_unknown": "Unknown",
+    "diagnostics_webgl2_missing_message": "This game requires WebGL2. Please update your browser, operating system, or GPU drivers.",
+    "diagnostics_section_engine": "Engine",
+    "diagnostics_section_device": "Device",
+    "diagnostics_section_graphics": "Graphics",
+    "diagnostics_section_display": "Display",
+    "diagnostics_section_memory": "Memory",
+    "diagnostics_section_capabilities": "Browser Capabilities",
+    "diagnostics_section_extensions": "WebGL Extensions",
+    "diagnostics_game_version": "Game version",
+    "diagnostics_pixijs_version": "PixiJS version",
+    "diagnostics_pixivn_version": "Pixi'VN version",
+    "diagnostics_tonejs_version": "Tone.js version",
+    "diagnostics_motion_version": "Motion version",
+    "diagnostics_platform": "Platform",
+    "diagnostics_browser_engine": "Browser/WebView",
+    "diagnostics_user_agent": "User Agent",
+    "diagnostics_webgl1": "WebGL1 available",
+    "diagnostics_webgl2": "WebGL2 available",
+    "diagnostics_hardware_acceleration": "Hardware acceleration",
+    "diagnostics_gpu_vendor": "GPU vendor",
+    "diagnostics_gpu_renderer": "GPU renderer",
+    "diagnostics_max_texture_size": "Max texture size",
+    "diagnostics_max_texture_size_check": "Max texture size >= 8192",
+    "diagnostics_gpu_supported": "GPU supported",
+    "diagnostics_float_textures": "Float textures",
+    "diagnostics_msaa": "MSAA",
+    "diagnostics_shaders_compile": "Shaders compile",
+    "diagnostics_resolution": "Resolution",
+    "diagnostics_device_pixel_ratio": "Device pixel ratio",
+    "diagnostics_fps": "FPS",
+    "diagnostics_js_heap": "JS heap used / total",
+    "diagnostics_js_heap_unavailable": "Not available in this browser.",
+    "diagnostics_audio": "Audio (Web Audio API)",
+    "diagnostics_gamepad": "Gamepad API",
+    "diagnostics_clipboard": "Clipboard API",
+    "diagnostics_fullscreen": "Fullscreen API",
+    "diagnostics_local_storage": "LocalStorage",
+    "diagnostics_indexed_db": "IndexedDB",
+    "diagnostics_steam_overlay": "Steam Overlay",
+    "diagnostics_steam_overlay_hint": "Best-effort detection only; not reliable in a standard browser.",
+    "diagnostics_copy_report": "Copy report",
+    "diagnostics_report_copied": "Report copied to clipboard",
+    "diagnostics_report_copy_failed": "Could not copy the report",
+    "diagnostics_download_report": "Download JSON",
+    "diagnostics_report_downloaded": "Report downloaded",
+    "diagnostics_hotkey_description": "Open settings directly on the diagnostics page.",
     "quick_actions": "Quick Actions",
     "quick_actions_open_description": "Press Tab to open or close the quick actions wheel.",
     "quick_actions_click_hint": "Click an action to execute",

package/template-react-vite-muijoy-ink/src/pixi-vn.keys.gen.ts

@@ -20,7 +20,6 @@ declare module "@drincs/pixi-vn/narration" {
 }
 declare module "@drincs/pixi-vn/canvas" {
     interface PixivnBundleIds {
-        "default": never;
         "audio": never;
         "/": never;
         "start": never;
@@ -91,7 +90,7 @@ export const characterIds = ["mc","james","steph","sly"] as const;
 export const characterIdsEnum = {"mc":"mc","james":"james","steph":"steph","sly":"sly"} as const;
 export const labelIds = ["animation_01","second_part","start","start_|_c-0","start_|_c-1"] as const;
 export const labelIdsEnum = {"animation_01":"animation_01","second_part":"second_part","start":"start","start_|_c-0":"start_|_c-0","start_|_c-1":"start_|_c-1"} as const;
-export const bundleIds = ["default","audio","/","start","second_part","fm01","fm02","m01"] as const;
-export const bundleIdsEnum = {"default":"default","audio":"audio","/":"/","start":"start","second_part":"second_part","fm01":"fm01","fm02":"fm02","m01":"m01"} as const;
+export const bundleIds = ["audio","/","start","second_part","fm01","fm02","m01"] as const;
+export const bundleIdsEnum = {"audio":"audio","/":"/","start":"start","second_part":"second_part","fm01":"fm01","fm02":"fm02","m01":"m01"} as const;
 export const assetAliasIds = ["bgm_cheerful","sfx_whoosh","background_main_menu","bg01-hallway","bg02-dorm","fm01-body","fm01-eyes-grin","fm01-eyes-smile","fm01-eyes-soft","fm01-eyes-upset","fm01-eyes-wow","fm01-mouth-grin00","fm01-mouth-serious00","fm01-mouth-serious01","fm01-mouth-smile00","fm01-mouth-smile01","fm01-mouth-soft00","fm01-mouth-soft01","fm01-mouth-upset00","fm01-mouth-upset01","fm01-mouth-wow01","fm02-body","fm02-eyes-bawl","fm02-eyes-joy","fm02-eyes-nervous","fm02-eyes-smile","fm02-eyes-upset","fm02-eyes-wow","fm02-mouth-cry01","fm02-mouth-nervous00","fm02-mouth-nervous01","fm02-mouth-smile00","fm02-mouth-smile01","fm02-mouth-upset00","fm02-mouth-upset01","fm02-mouth-wow01","m01-body","m01-eyes-annoy","m01-eyes-concern","m01-eyes-cry","m01-eyes-grin","m01-eyes-smile","m01-eyes-wow","m01-mouth-annoy00","m01-mouth-annoy01","m01-mouth-concern00","m01-mouth-concern01","m01-mouth-cry00","m01-mouth-cry01","m01-mouth-grin00","m01-mouth-neutral00","m01-mouth-neutral01","m01-mouth-smile00","m01-mouth-smile01","m01-mouth-wow01"] as const;
 export const assetAliasIdsEnum = {"bgm_cheerful":"bgm_cheerful","sfx_whoosh":"sfx_whoosh","background_main_menu":"background_main_menu","bg01-hallway":"bg01-hallway","bg02-dorm":"bg02-dorm","fm01-body":"fm01-body","fm01-eyes-grin":"fm01-eyes-grin","fm01-eyes-smile":"fm01-eyes-smile","fm01-eyes-soft":"fm01-eyes-soft","fm01-eyes-upset":"fm01-eyes-upset","fm01-eyes-wow":"fm01-eyes-wow","fm01-mouth-grin00":"fm01-mouth-grin00","fm01-mouth-serious00":"fm01-mouth-serious00","fm01-mouth-serious01":"fm01-mouth-serious01","fm01-mouth-smile00":"fm01-mouth-smile00","fm01-mouth-smile01":"fm01-mouth-smile01","fm01-mouth-soft00":"fm01-mouth-soft00","fm01-mouth-soft01":"fm01-mouth-soft01","fm01-mouth-upset00":"fm01-mouth-upset00","fm01-mouth-upset01":"fm01-mouth-upset01","fm01-mouth-wow01":"fm01-mouth-wow01","fm02-body":"fm02-body","fm02-eyes-bawl":"fm02-eyes-bawl","fm02-eyes-joy":"fm02-eyes-joy","fm02-eyes-nervous":"fm02-eyes-nervous","fm02-eyes-smile":"fm02-eyes-smile","fm02-eyes-upset":"fm02-eyes-upset","fm02-eyes-wow":"fm02-eyes-wow","fm02-mouth-cry01":"fm02-mouth-cry01","fm02-mouth-nervous00":"fm02-mouth-nervous00","fm02-mouth-nervous01":"fm02-mouth-nervous01","fm02-mouth-smile00":"fm02-mouth-smile00","fm02-mouth-smile01":"fm02-mouth-smile01","fm02-mouth-upset00":"fm02-mouth-upset00","fm02-mouth-upset01":"fm02-mouth-upset01","fm02-mouth-wow01":"fm02-mouth-wow01","m01-body":"m01-body","m01-eyes-annoy":"m01-eyes-annoy","m01-eyes-concern":"m01-eyes-concern","m01-eyes-cry":"m01-eyes-cry","m01-eyes-grin":"m01-eyes-grin","m01-eyes-smile":"m01-eyes-smile","m01-eyes-wow":"m01-eyes-wow","m01-mouth-annoy00":"m01-mouth-annoy00","m01-mouth-annoy01":"m01-mouth-annoy01","m01-mouth-concern00":"m01-mouth-concern00","m01-mouth-concern01":"m01-mouth-concern01","m01-mouth-cry00":"m01-mouth-cry00","m01-mouth-cry01":"m01-mouth-cry01","m01-mouth-grin00":"m01-mouth-grin00","m01-mouth-neutral00":"m01-mouth-neutral00","m01-mouth-neutral01":"m01-mouth-neutral01","m01-mouth-smile00":"m01-mouth-smile00","m01-mouth-smile01":"m01-mouth-smile01","m01-mouth-wow01":"m01-mouth-wow01"} as const;

package/template-react-vite-muijoy-ink-tauri/.vscode/launch.json

@@ -26,7 +26,7 @@
       "cwd": "${workspaceFolder}",
       "terminal": "console",
       "preLaunchTask": "Cargo Build (Desktop Dev)",
-      "postDebugTask": "Stop Vite Desktop Server"
+      "postDebugTask": "Stop Vite Dev Server"
     },
     {
       "name": "Debug Game Preview",

package/template-react-vite-muijoy-ink-tauri/.vscode/tasks.json

@@ -106,7 +106,7 @@
       "label": "Cargo Build (Desktop Dev)",
       "type": "shell",
       "command": "cargo build --manifest-path=./src-tauri/Cargo.toml --no-default-features",
-      "dependsOn": ["Start Vite Desktop Server"],
+      "dependsOn": ["Restart Vite Dev Server"],
       "presentation": {
         "reveal": "always",
         "panel": "dedicated",
@@ -114,40 +114,6 @@
         "close": true
       },
       "problemMatcher": ["$rustc"]
-    },
-    {
-      "label": "Start Vite Desktop Server",
-      "type": "shell",
-      "command": "npm run dev",
-      "isBackground": true,
-      "dependsOn": ["Install Dependencies"],
-      "problemMatcher": {
-        "owner": "vite",
-        "pattern": {
-          "regexp": "^(?!x)x"
-        },
-        "background": {
-          "activeOnStart": true,
-          "beginsPattern": ".",
-          "endsPattern": "localhost:5173"
-        }
-      },
-      "presentation": {
-        "reveal": "always",
-        "panel": "dedicated",
-        "clear": false,
-        "close": true
-      }
-    },
-    {
-      "label": "Stop Vite Desktop Server",
-      "type": "shell",
-      "command": "pkill -f 'vite' 2>/dev/null; pkill -f 'npm run dev' 2>/dev/null; exit 0",
-      "presentation": {
-        "reveal": "never",
-        "panel": "dedicated",
-        "close": true
-      }
     }
   ]
 }

package/template-react-vite-muijoy-ink-tauri/_github/workflows/mobile.yml

@@ -100,26 +100,89 @@ jobs:
           with open(manifest, 'w') as f:
               f.write(content)
 
-          # Tauri may generate styles.xml or themes.xml depending on the version
+          # Tauri may generate styles.xml or themes.xml, and both a light (values/)
+          # and dark (values-night/) variant — patch every variant we find so the
+          # fullscreen flag doesn't silently no-op when the device is in dark mode.
           styles_candidates = (
-              glob.glob('src-tauri/gen/android/app/src/main/res/values/styles.xml') +
-              glob.glob('src-tauri/gen/android/app/src/main/res/values/themes.xml')
+              glob.glob('src-tauri/gen/android/app/src/main/res/values*/styles.xml') +
+              glob.glob('src-tauri/gen/android/app/src/main/res/values*/themes.xml')
           )
           if not styles_candidates:
               print('Warning: no styles.xml/themes.xml found, skipping fullscreen patch')
           else:
-              styles = styles_candidates[0]
-              with open(styles) as f:
+              for styles in styles_candidates:
+                  with open(styles) as f:
+                      content = f.read()
+                  # Hide status bar (fullscreen) — kept as a best-effort theme hint,
+                  # but on targetSdk 35+ (edge-to-edge is enforced by the OS) this
+                  # alone has no effect; the real fix is the MainActivity.kt patch below.
+                  content = content.replace(
+                      '</style>',
+                      '    <item name="android:windowFullscreen">true</item>\n    </style>',
+                      1
+                  )
+                  with open(styles, 'w') as f:
+                      f.write(content)
+                  print(f'Patched {styles}')
+
+          # Since this project's Android template targets SDK 35+, edge-to-edge display
+          # is enforced by the OS and the theme-based windowFullscreen flag above no
+          # longer hides the status bar (it's always drawn, transparent, over the
+          # content). The only reliable way to hide it is to hide the system bars at
+          # runtime via WindowInsetsControllerCompat in MainActivity.kt.
+          activity_candidates = glob.glob(
+              'src-tauri/gen/android/app/src/main/**/MainActivity.kt', recursive=True
+          )
+          if not activity_candidates:
+              print('WARNING: MainActivity.kt not found — status bar hiding NOT patched')
+          else:
+              activity = activity_candidates[0]
+              with open(activity) as f:
                   content = f.read()
-              # Hide status bar (fullscreen)
-              content = content.replace(
-                  '</style>',
-                  '    <item name="android:windowFullscreen">true</item>\n    </style>',
-                  1
-              )
-              with open(styles, 'w') as f:
+
+              new_imports = [
+                  'androidx.core.view.WindowCompat',
+                  'androidx.core.view.WindowInsetsCompat',
+                  'androidx.core.view.WindowInsetsControllerCompat',
+              ]
+              import_lines = list(re.finditer(r'^import .+$', content, re.MULTILINE))
+              if import_lines:
+                  insert_at = import_lines[-1].end()
+                  addition = ''.join(
+                      f'\nimport {imp}' for imp in new_imports if imp not in content
+                  )
+                  content = content[:insert_at] + addition + content[insert_at:]
+
+              if 'hideSystemBars' not in content:
+                  content = content.replace(
+                      'super.onCreate(savedInstanceState)',
+                      'super.onCreate(savedInstanceState)\n    hideSystemBars()',
+                      1
+                  )
+                  content = re.sub(
+                      r'\n}\s*$',
+                      '\n\n'
+                      '  override fun onWindowFocusChanged(hasFocus: Boolean) {\n'
+                      '    super.onWindowFocusChanged(hasFocus)\n'
+                      '    if (hasFocus) {\n'
+                      '      hideSystemBars()\n'
+                      '    }\n'
+                      '  }\n'
+                      '\n'
+                      '  private fun hideSystemBars() {\n'
+                      '    WindowCompat.setDecorFitsSystemWindows(window, false)\n'
+                      '    val controller = WindowInsetsControllerCompat(window, window.decorView)\n'
+                      '    controller.hide(WindowInsetsCompat.Type.systemBars())\n'
+                      '    controller.systemBarsBehavior =\n'
+                      '      WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE\n'
+                      '  }\n'
+                      '}\n',
+                      content,
+                      count=1
+                  )
+              with open(activity, 'w') as f:
                   f.write(content)
-              print(f'Patched {styles}')
+              print(f'Patched {activity} (hide system bars at runtime)')
           PYEOF
 
       - name: build Android app

package/template-react-vite-muijoy-ink-tauri/ink/second_part.ink

@@ -1,4 +1,3 @@
--> second_part
 === second_part ===
 
 # show text bg "(A few minutes later...)" style \{ fontFamily: "Arial", dropShadow: \{ alpha: 0.8, angle: 2.1, blur: 4, color: "0x111111", distance: 10, \}, fill: "\#ffffff", stroke: \{ color: "\#004620", width: 12, join: "round" \}, fontSize: 60, fontWeight: "lighter" \} with fade

package/template-react-vite-muijoy-ink-tauri/ink/start.ink

@@ -1,6 +1,4 @@
 -> start
-INCLUDE second_part.ink
-
 === start ===
 # lazyload bundle m01 fm01 fm02
 
@@ -46,7 +44,7 @@ james: I know you're both watching, come on out already!
 # show imagecontainer steph [fm02-body fm02-eyes-nervous fm02-mouth-nervous00] xAlign 0.8 yAlign 1 with movein direction left ease easeInOut
 sly: I just wanted to see what the new guy was like.
 # show imagecontainer sly [fm01-body fm01-eyes-upset fm01-mouth-smile01]
-<><span className="inline-block motion-translate-y-loop-25">Hey</span>, you, [mc]- be nice to our little brother,
+<><span class="inline-block animate-bounce animate-duration-700">Hey</span>, you, [mc]- be nice to our little brother,
 # show imagecontainer sly [fm01-body fm01-eyes-smile fm01-mouth-grin00]
 <>or you'll have to deal with *us*.
 # show imagecontainer james [m01-body m01-eyes-smile m01-mouth-neutral00]
@@ -103,7 +101,7 @@ sly: It's just a handshake...
 # show imagecontainer james [m01-body m01-eyes-smile m01-mouth-grin00]
 # show imagecontainer sly [fm01-body fm01-eyes-upset fm01-mouth-serious00]
 # show imagecontainer steph [fm02-body fm02-eyes-upset fm02-mouth-upset01]
-steph: <span className="inline-block animate-wave">Then just give it to him!</span>
+steph: <span class="inline-block animate-wave">Then just give it to him!</span>
 # show imagecontainer james [m01-body m01-eyes-concern m01-mouth-smile01]
 # show imagecontainer sly [fm01-body fm01-eyes-smile fm01-mouth-serious00]
 # show imagecontainer steph [fm02-body fm02-eyes-upset fm02-mouth-upset00]
@@ -208,7 +206,7 @@ steph: Oh! You gotta take in your luggage!
 # remove image steph with moveout direction left ease easeInOut duration 0.5 delay 0.1
 
 You want continue to the next part?<># continue
-* Yes, I want to continue
+* [Yes, I want to continue]
 -> second_part
-* No, I want to stop here
+* [No, I want to stop here]
 -> END