pixifact 0.7.0 → 0.9.0

package/dist/compiler-node/runtimeVite.js

@@ -9,8 +9,10 @@ const runtimeAnnounceEvent = 'pixifact:runtime:announce';
 const runtimeRequestEvent = 'pixifact:runtime:request';
 const runtimeResponseEvent = 'pixifact:runtime:response';
 const runtimeApiRoot = '/__pixifact_runtime__';
+const runtimeScreenshotPath = `${runtimeApiRoot}/screenshot`;
 const virtualRuntimeClientId = 'virtual:pixifact-runtime-client';
 const resolvedVirtualRuntimeClientId = `\0${virtualRuntimeClientId}`;
+const pngSignature = Buffer.from([137, 80, 78, 71, 13, 10, 26, 10]);
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }
@@ -57,6 +59,27 @@ function isRuntimeRequest(value) {
         && typeof value.key === 'string'
         && value.key.length > 0;
 }
+function runtimeScreenshotResult(value) {
+    if (!isRecord(value)
+        || typeof value.runtimeId !== 'string'
+        || !Number.isInteger(value.width)
+        || Number(value.width) <= 0
+        || !Number.isInteger(value.height)
+        || Number(value.height) <= 0
+        || typeof value.dataUrl !== 'string') {
+        return undefined;
+    }
+    const match = value.dataUrl.match(/^data:image\/png;base64,([A-Za-z0-9+/]+={0,2})$/);
+    const png = match ? Buffer.from(match[1], 'base64') : undefined;
+    if (!png || !png.subarray(0, pngSignature.length).equals(pngSignature))
+        return undefined;
+    return {
+        runtimeId: value.runtimeId,
+        width: Number(value.width),
+        height: Number(value.height),
+        png,
+    };
+}
 export function createRuntimeHostSession(options) {
     const requestTimeoutMs = options.requestTimeoutMs ?? 5_000;
     const now = options.now ?? (() => new Date());
@@ -96,6 +119,29 @@ export function createRuntimeHostSession(options) {
             }
         }
     }
+    function forwardRequest(runtime, request, responseType) {
+        const requestId = `runtime-${++requestSequence}`;
+        return new Promise((resolve) => {
+            const timeout = setTimeout(() => {
+                settle(requestId, jsonResponse({
+                    ok: false,
+                    error: 'Pixifact Runtime request timed out.',
+                }, 504));
+            }, requestTimeoutMs);
+            pending.set(requestId, {
+                resolve,
+                runtimeId: runtime.runtimeId,
+                socket: runtime.socket,
+                responseType,
+                timeout,
+            });
+            runtime.socket.send(runtimeRequestEvent, {
+                requestId,
+                runtimeId: runtime.runtimeId,
+                request,
+            });
+        });
+    }
     function message(socket, event, data) {
         if (!sockets.has(socket))
             return;
@@ -122,9 +168,38 @@ export function createRuntimeHostSession(options) {
         const current = pending.get(data.requestId);
         if (!current || current.socket !== socket || current.runtimeId !== data.runtimeId)
             return;
-        settle(data.requestId, data.ok
-            ? jsonResponse(data.result)
-            : jsonResponse({ ok: false, error: data.error }, 422));
+        if (!data.ok) {
+            settle(data.requestId, jsonResponse({ ok: false, error: data.error }, 422));
+            return;
+        }
+        if (current.responseType === 'json') {
+            settle(data.requestId, jsonResponse(data.result));
+            return;
+        }
+        const screenshot = runtimeScreenshotResult(data.result);
+        if (!screenshot) {
+            settle(data.requestId, jsonResponse({
+                ok: false,
+                error: 'Pixifact Runtime returned invalid screenshot data.',
+            }, 502));
+            return;
+        }
+        if (screenshot.runtimeId !== data.runtimeId) {
+            settle(data.requestId, jsonResponse({
+                ok: false,
+                error: 'Pixifact Runtime returned a screenshot for a different runtime.',
+            }, 502));
+            return;
+        }
+        settle(data.requestId, new Response(screenshot.png, {
+            headers: {
+                'cache-control': 'no-store',
+                'content-type': 'image/png',
+                'x-pixifact-height': String(screenshot.height),
+                'x-pixifact-runtime': screenshot.runtimeId,
+                'x-pixifact-width': String(screenshot.width),
+            },
+        }));
     }
     async function fetchRequest(request) {
         const pathname = new URL(request.url).pathname;
@@ -150,6 +225,23 @@ export function createRuntimeHostSession(options) {
                     .sort((left, right) => left.connectedAt.localeCompare(right.connectedAt)),
             });
         }
+        if (pathname === runtimeScreenshotPath) {
+            if (request.method !== 'POST') {
+                return jsonResponse({ ok: false, error: 'Pixifact Runtime screenshot requests require POST.' }, 405);
+            }
+            const body = await request.json();
+            if (!isRecord(body) || typeof body.runtimeId !== 'string') {
+                return jsonResponse({ ok: false, error: 'Pixifact Runtime screenshot request is invalid.' }, 400);
+            }
+            const runtime = runtimes.get(body.runtimeId);
+            if (!runtime) {
+                return jsonResponse({
+                    ok: false,
+                    error: `Pixifact Runtime "${body.runtimeId}" is not connected.`,
+                }, 404);
+            }
+            return forwardRequest(runtime, { type: 'screenshot' }, 'screenshot');
+        }
         if (pathname !== `${runtimeApiRoot}/request`)
             return undefined;
         if (request.method !== 'POST') {
@@ -166,26 +258,7 @@ export function createRuntimeHostSession(options) {
                 error: `Pixifact Runtime "${body.runtimeId}" is not connected.`,
             }, 404);
         }
-        const requestId = `runtime-${++requestSequence}`;
-        return new Promise((resolve) => {
-            const timeout = setTimeout(() => {
-                settle(requestId, jsonResponse({
-                    ok: false,
-                    error: 'Pixifact Runtime request timed out.',
-                }, 504));
-            }, requestTimeoutMs);
-            pending.set(requestId, {
-                resolve,
-                runtimeId: runtime.runtimeId,
-                socket: runtime.socket,
-                timeout,
-            });
-            runtime.socket.send(runtimeRequestEvent, {
-                requestId,
-                runtimeId: runtime.runtimeId,
-                request: body.request,
-            });
-        });
+        return forwardRequest(runtime, body.request, 'json');
     }
     return {
         open,

package/dist/compiler-node/vite.js

@@ -1,4 +1,5 @@
 import { access, readFile, readdir, stat } from 'node:fs/promises';
+import { realpathSync } from 'node:fs';
 import path from 'node:path';
 import { fileURLToPath } from 'node:url';
 import { loadEnv, } from 'vite';
@@ -204,7 +205,7 @@ export function loadPixifactEnv(projectRoot, mode) {
 }
 async function configureState(state, options, config, env) {
     const configuredRoot = options.projectRoot ?? config.root;
-    const projectRoot = path.resolve(projectRootPath(configuredRoot));
+    const projectRoot = realpathSync(path.resolve(projectRootPath(configuredRoot)));
     const loaded = loadPixifactEnv(projectRoot, env.mode);
     state.projectRoot = projectRoot;
     state.mode = env.mode;

package/dist/runtime-dev/index.d.ts

@@ -2,4 +2,4 @@ import type { Application } from 'pixi.js';
 import { type RegisterPixiRuntimeOptions } from './runtimeClient.js';
 export declare function registerPixiRuntime(app: Application, options?: RegisterPixiRuntimeOptions): void;
 export type { RegisterPixiRuntimeOptions } from './runtimeClient.js';
-export type { RuntimeJsonValue, RuntimeLogLevel, RuntimePageDescriptor, RuntimeRequest, } from './protocol.js';
+export type { RuntimeJsonValue, RuntimeLogLevel, RuntimePageDescriptor, RuntimeObservationRequest, RuntimeRequest, RuntimeScreenshotRequest, RuntimeScreenshotResult, } from './protocol.js';

package/dist/runtime-dev/protocol.d.ts

@@ -22,7 +22,7 @@ export type RuntimeInputRequest = {
     action: 'key' | 'keydown' | 'keyup';
     key: string;
 };
-export type RuntimeRequest = {
+export type RuntimeObservationRequest = {
     type: 'tree';
 } | {
     type: 'node';
@@ -34,6 +34,17 @@ export type RuntimeRequest = {
     after?: number;
     level?: RuntimeLogLevel;
 } | RuntimeInputRequest;
+export type RuntimeScreenshotRequest = {
+    type: 'screenshot';
+};
+export type RuntimeRequest = RuntimeObservationRequest | RuntimeScreenshotRequest;
+export interface RuntimeScreenshotResult {
+    [key: string]: RuntimeJsonValue;
+    runtimeId: string;
+    width: number;
+    height: number;
+    dataUrl: string;
+}
 export interface RuntimePageDescriptor {
     runtimeId: string;
     url: string;

package/dist/runtime-dev/runtimeClient.js

@@ -1,4 +1,4 @@
-import { BitmapText, Graphics, Sprite, Text, } from 'pixi.js';
+import { BitmapText, Graphics, Rectangle, Sprite, Text, } from 'pixi.js';
 const maxRetainedLogs = 500;
 const runtimeRequestEvent = 'pixifact:runtime:request';
 const runtimeResponseEvent = 'pixifact:runtime:response';
@@ -303,6 +303,23 @@ export function createPixifactRuntimeClient(options) {
             throw new Error('PixiJS Application has not been registered in this runtime.');
         return app;
     }
+    async function captureScreenshot(currentApp) {
+        const width = Math.max(1, Math.floor(currentApp.screen.width));
+        const height = Math.max(1, Math.floor(currentApp.screen.height));
+        const dataUrl = await currentApp.renderer.extract.base64({
+            target: currentApp.stage,
+            frame: new Rectangle(0, 0, width, height),
+            resolution: 1,
+            format: 'png',
+            clearColor: currentApp.renderer.background.colorRgba,
+        });
+        return {
+            runtimeId: options.runtimeId,
+            width,
+            height,
+            dataUrl,
+        };
+    }
     async function handleRequest(request) {
         if (request.type === 'logs') {
             return {
@@ -343,6 +360,9 @@ export function createPixifactRuntimeClient(options) {
                     state: null,
                 };
         }
+        if (request.type === 'screenshot') {
+            return captureScreenshot(currentApp);
+        }
         if (request.type === 'input') {
             dispatchRuntimeInput(options.window, currentApp, request);
             return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pixifact",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "Pixifact 2D UI 和轻量游戏 Scene 语义框架。",
   "packageManager": "bun@1.3.13",
   "main": "./dist/index.js",