@homie-rocks/studio 0.58.7 → 0.58.11

package/lib/port-check.mjs

@@ -33,7 +33,7 @@ import { mkdirSync, mkdtempSync, rmSync, writeFileSync } from 'node:fs';
 import { createRequire } from 'node:module';
 import { tmpdir } from 'node:os';
 import { join } from 'node:path';
-import { chromeArgs, findChrome, isLoopbackUrl, noChrome } from './chrome.mjs';
+import { chromeArgs, findChrome, isLoopbackUrl, noChrome, launchChrome, remoteBrowserEndpoint } from './chrome.mjs';
 import { reachSite, siteRefusal } from './net.mjs';
 
 const GPU = [
@@ -245,7 +245,7 @@ async function chrome(puppeteer, kind, exe) {
   const dir = mkdtempSync(join(tmpdir(), 'homie-port-check-'));
   const vp = kind === 'phone' ? { width: 412, height: 915 } : kind === 'tv' ? { width: 1280, height: 720 } : { width: 1280, height: 800 };
   // 150 s for Chrome to start: on a loaded computer a cold start has taken over a minute.
-  const browser = await puppeteer.launch({ executablePath: exe, headless: true, userDataDir: dir, timeout: 150_000, protocolTimeout: 120_000, args: [...GPU, `--window-size=${vp.width},${vp.height}`] });
+  const browser = await launchChrome(puppeteer, { executablePath: exe, headless: true, userDataDir: dir, timeout: 150_000, protocolTimeout: 120_000, args: [...GPU, `--window-size=${vp.width},${vp.height}`] });
   const page = (await browser.pages())[0] ?? await browser.newPage();
   if (kind === 'phone') await page.emulate({ viewport: { ...vp, deviceScaleFactor: 2.625, isMobile: true, hasTouch: true }, userAgent: `${ANDROID_UA} ${TAG}` });
   else { await page.setViewport({ ...vp, deviceScaleFactor: 1 }); await page.setUserAgent(`${await browser.userAgent()} ${TAG}`); }
@@ -501,7 +501,7 @@ export async function portCheck({ url, game, root, only = null, shots = null, lo
   const base = String(url).replace(/\/+$/, '');
   const want = new Set((only ? String(only).split(',') : ALL).map((s) => s.trim()).filter(Boolean));
   const exe = findChrome();
-  if (!exe) return { ok: false, command: 'port check', why: noChrome() };
+  if (!exe && !remoteBrowserEndpoint()) return { ok: false, command: 'port check', why: noChrome() };
   const req = createRequire(join(root ?? process.cwd(), 'package.json'));
   let puppeteer;
   try { puppeteer = (await import('puppeteer-core')).default; } catch { try { puppeteer = req('puppeteer-core'); } catch { return { ok: false, command: 'port check', why: 'puppeteer-core is missing (it comes with @homie-rocks/studio: npm install)' }; } }

package/lib/read-only.mjs

@@ -0,0 +1,69 @@
+/**
+ * homie-studio read-only on|off|status [--url <site>]
+ *
+ * Freezes the studio for a few minutes (a move to another host, maintenance) without losing anything: the Worker
+ * secret STUDIO_READ_ONLY=1, set and deleted with the studio's own Wrangler sign-in. Cloudflare applies a secret to
+ * the live Worker at once, with no build or deploy, and a deploy made while it is on keeps it on. What the Worker
+ * does while it is on is worker/read-only.mjs. After the change the command reads the live site's /api/games
+ * (`readOnly`) until it agrees, so the person is told what the site does, not only what was asked of Cloudflare.
+ */
+import {readStudio,siteUrl} from './studio.mjs';
+import {runner} from './cloudflare.mjs';
+import {redactText} from './redact.mjs';
+import {READ_ONLY_HEADER,READ_ONLY_RETRY_SECONDS} from '../worker/read-only.mjs';
+
+export const READ_ONLY_SETTING='STUDIO_READ_ONLY';
+const ACTIONS=['on','off','status'];
+
+const wranglerSaid=r=>redactText(String([r?.out,r?.stdout].filter(Boolean).join('\n')||'Wrangler failed')).text.trim().slice(-1200);
+
+/** What the live site says now: true or false from /api/games, null when it could not be read. */
+async function liveReadOnly(site,want,{fetchFn,wait,tries}) {
+  let seen=null;
+  for(let i=0;i<tries;i++) {
+    if(i&&wait)await new Promise(r=>setTimeout(r,wait));
+    try {
+      const res=await fetchFn(new URL('/api/games',site),{headers:{accept:'application/json'},signal:AbortSignal.timeout(10_000)});
+      const body=res.ok?await res.json():null;
+      seen=typeof body?.readOnly==='boolean'?body.readOnly:null;
+    } catch {seen=null;}
+    if(seen===want)return seen;
+  }
+  return seen;
+}
+
+export async function readOnlyCommand(root,action,{run=null,fetchFn=fetch,url=null,wait=2000,tries=10}={}) {
+  if(!ACTIONS.includes(action))throw new Error('Use homie-studio read-only on, off or status');
+  const command=`read-only ${action}`;
+  const studio=readStudio(root),cf=studio.cloudflare??{};
+  if(!cf.worker)return {ok:false,command,needs:'deploy',why:'This studio is not on Cloudflare yet, so there is nothing to make read-only: deploy it first (homie-studio deploy).'};
+  const w=run??runner(root,cf.accountId?{CLOUDFLARE_ACCOUNT_ID:cf.accountId}:{});
+  const listed=await w(['secret','list','--name',cf.worker]);
+  let names=null;
+  try{names=listed.code===0?JSON.parse(listed.stdout??listed.out).map(s=>s.name):null;}catch{names=null;}
+  if(!names)return {ok:false,command,needs:'cloudflare',why:`Wrangler could not read the Worker's settings (sign in with npx wrangler login, then run this again).\n${wranglerSaid(listed)}`};
+  const was=names.includes(READ_ONLY_SETTING);
+  const readOnly=action==='status'?was:action==='on';
+  const already=action!=='status'&&was===readOnly;
+  if(!already&&action!=='status') {
+    // The value travels on stdin, as every Worker secret does here; Cloudflare applies it as a new Worker version.
+    const changed=action==='on'
+      ?await w(['secret','put',READ_ONLY_SETTING,'--name',cf.worker],{input:'1\n'})
+      :await w(['secret','delete',READ_ONLY_SETTING,'--name',cf.worker],{input:'y\n'});
+    if(changed.code!==0)return {ok:false,command,needs:'cloudflare',why:`Cloudflare did not take the change, so the studio is still ${was?'read-only':'open'}.\n${wranglerSaid(changed)}`};
+  }
+  const site=url??siteUrl(root,studio);
+  const live=site?await liveReadOnly(site,readOnly,{fetchFn,wait,tries:action==='status'?1:tries}):null;
+  const state=readOnly?'read-only':'open';
+  const lines=[
+    action==='status'?`The studio is ${state} (Cloudflare's setting ${READ_ONLY_SETTING} is ${was?'set':'not set'}).`
+      :already?`The studio was already ${state}: nothing was changed.`
+      :readOnly?`The studio is read-only now. Every change answers 503 with Retry-After: ${READ_ONLY_RETRY_SECONDS} and ${READ_ONLY_HEADER}: 1 until you run homie-studio read-only off. Pages, games and live rooms keep working, and Stripe payments are still fulfilled.`
+      :'The studio is open again: changes are taken, and what waited (room records, queued work) is delivered.',
+    live===null?(site?`${site}/api/games did not answer, so what the live site does is unmeasured: run homie-studio read-only status.`:'This computer does not know the site\'s address: pass --url to check it.')
+      :live===readOnly?`${site}/api/games says readOnly: ${live}.`
+      :`${site}/api/games still says readOnly: ${live}. Cloudflare takes a few seconds: run homie-studio read-only status.`,
+  ];
+  if(!already&&action!=='status')lines.push('Cloudflare applied it as a new version of the Worker, as a deploy does: anyone in a live room reconnects once.');
+  return {ok:true,command,readOnly,already,setting:READ_ONLY_SETTING,header:READ_ONLY_HEADER,worker:cf.worker,site,live,message:lines.join('\n')};
+}

package/lib/render3d.mjs

@@ -15,7 +15,7 @@
 import { mkdtempSync, rmSync, writeFileSync } from 'node:fs';
 import { tmpdir } from 'node:os';
 import { join } from 'node:path';
-import { chromeArgs, findChrome, noChrome } from './chrome.mjs';
+import { chromeArgs, findChrome, noChrome, launchChrome, remoteBrowserEndpoint } from './chrome.mjs';
 import { PACKAGE_ROOT } from './studio.mjs';
 
 let bundled = null;
@@ -50,12 +50,12 @@ export function saveDataUrl(url, file) { const { bytes } = dataUrlBytes(url); wr
  */
 export async function withRenderer(fn, { log = () => {} } = {}) {
   const chrome = findChrome();
-  if (!chrome) throw new Error(noChrome());
+  if (!chrome && !remoteBrowserEndpoint()) throw new Error(noChrome());
   let puppeteer;
   try { puppeteer = (await import('puppeteer-core')).default; } catch { throw new Error('puppeteer-core is not installed (it comes with @homie-rocks/studio: npm install)'); }
   const script = await renderScript();
   const profile = mkdtempSync(join(tmpdir(), 'homie-render-'));
-  const browser = await puppeteer.launch({ executablePath: chrome, headless: true, userDataDir: profile, timeout: 150_000, protocolTimeout: 300_000, args: [...chromeArgs(), '--no-first-run', '--no-default-browser-check', '--hide-scrollbars'] });
+  const browser = await launchChrome(puppeteer, { executablePath: chrome, headless: true, userDataDir: profile, timeout: 150_000, protocolTimeout: 300_000, args: [...chromeArgs(), '--no-first-run', '--no-default-browser-check', '--hide-scrollbars'] });
   try {
     const page = await browser.newPage();
     const errors = [];

package/lib/rules-guard.mjs

@@ -38,12 +38,14 @@
  * code written to attack: no rules from outside the studio run on its server.
  */
 import { parse } from '@babel/parser';
+import { listOwnParts, readOrigins, vendorDir } from './parts.mjs';
+import { partsPlugin, resolvePartImport } from './parts-build.mjs';
 import babelTraverse from '@babel/traverse';
 import * as babelGenerator from '@babel/generator';
 import * as t from '@babel/types';
 import { TraceMap, originalPositionFor } from '@jridgewell/trace-mapping';
 import { existsSync, readFileSync, realpathSync, statSync } from 'node:fs';
-import { dirname, join, relative, resolve } from 'node:path';
+import { basename, dirname, join, relative, resolve } from 'node:path';
 
 const traverse = babelTraverse.default ?? babelTraverse;
 const generate = babelGenerator.generate ?? babelGenerator.default;
@@ -190,7 +192,7 @@ const isTarget = (path) => (path.parentPath.isAssignmentExpression() && path.par
  *             and nothing is rewritten
  * Returns { code, problems }.
  */
-export function guardSource(code, { file = 'rules.js', map = null, linked = false } = {}) {
+export function guardSource(code, { file = 'rules.js', map = null, linked = false, checkedImports = false } = {}) {
   const problems = [];
   const tracer = map ? new TraceMap(typeof map === 'string' ? JSON.parse(map) : map) : null;
   const lineOf = (node) => {
@@ -240,12 +242,12 @@ export function guardSource(code, { file = 'rules.js', map = null, linked = fals
     if (t.isImportDeclaration(st)) {
       const from = st.source.value;
       if (from === RULES_MODULE || (linked && from === GUARD_MODULE)) { for (const s of st.specifiers) homie.add(s.local.name); continue; }
-      if (/^\.\.?\//.test(from) && !linked) { for (const s of st.specifiers) own.add(s.local.name); continue; }
+      if ((/^\.\.?\//.test(from) || from.startsWith('@parts/')) && !linked) { for (const s of st.specifiers) own.add(s.local.name); continue; }
       bad(st, `rules import only ${RULES_MODULE} and the game's own files, not "${from}"`);
       continue;
     }
     const decl = t.isExportNamedDeclaration(st) || t.isExportDefaultDeclaration(st) ? st.declaration : st;
-    if (t.isExportAllDeclaration(st) || (t.isExportNamedDeclaration(st) && !st.declaration)) { if (st.source) bad(st, 'rules export their own declarations, not another file\'s'); continue; }
+    if (t.isExportAllDeclaration(st) || (t.isExportNamedDeclaration(st) && !st.declaration)) { if (st.source && (!checkedImports || linked || !/^\.\.?\//.test(st.source.value) && !st.source.value.startsWith('@parts/'))) bad(st, 'rules export their own declarations, or re-export checked local files or parts'); continue; }
     if (t.isFunctionDeclaration(decl)) continue;
     if (t.isVariableDeclaration(decl)) {
       // Removing types turns `export default <expression>` into a `var` that is exported as the default: that one is the module's own.
@@ -719,11 +721,22 @@ export async function guardFiles(esbuild, root, gameDir, entry) {
   const problems = [];
   const todo = [entry];
   const sites = {};
+  const canonical = p => existsSync(p) ? realpathSync(p) : resolve(p);
+  const inside = (dir, file) => { const rel = relative(canonical(dir), canonical(file)); return rel === '' || (!rel.startsWith('..') && !rel.startsWith('/')); };
+  const origins = readOrigins(root);
+  const game = basename(gameDir);
+  const vendors = Object.entries(origins.parts).filter(([, entry]) => {
+    const purchase = entry.purchases?.[game] ?? entry.purchase;
+    return purchase?.scope !== 'game' || purchase.game === game;
+  }).map(([ref]) => vendorDir(root, ref));
+  const partDirs = [...listOwnParts(root).filter(p => p.part).map(p => p.dir), ...vendors]
+    .filter(p => inside(root, p) && existsSync(join(p, 'part.json')));
+  const allowed = file => inside(gameDir, file) || partDirs.some(dir => inside(dir, file));
   while (todo.length) {
     const file = todo.pop();
     if (files.has(file)) continue;
     const shown = relative(root, file).split('\\').join('/');
-    if (relative(gameDir, file).startsWith('..')) { problems.push({ file: shown, line: 0, message: 'rules import only files of their own game' }); files.set(file, null); continue; }
+    if (!allowed(file)) { problems.push({ file: shown, line: 0, message: 'rules import only files of their own game' }); files.set(file, null); continue; }
     let stripped;
     try { stripped = await esbuild.transform(readFileSync(file, 'utf8'), { loader: /\.ts$/.test(file) ? 'ts' : 'js', format: 'esm', target: 'es2022', sourcemap: 'external', sourcefile: shown }); } catch (error) {
       const first = error.errors?.[0];
@@ -744,15 +757,20 @@ export async function guardFiles(esbuild, root, gameDir, entry) {
         }
       },
     });
-    const res = guardSource(stripped.code, { file: shown, map: stripped.map });
+    const res = guardSource(stripped.code, { file: shown, map: stripped.map, checkedImports: true });
     problems.push(...res.problems);
     files.set(file, res.code);
-    for (const m of stripped.code.matchAll(/^\s*import\s[^'"]*['"](\.\.?\/[^'"]+)['"]/gm)) {
-      const next = resolveOwn(file, m[1]);
-      const line = original.program.body.find(n => n.type === 'ImportDeclaration' && n.source.value === m[1])?.loc?.start.line ?? 1;
-      if (next && relative(gameDir,next).startsWith('..')) problems.push({file:shown,line,message:'rules import only files of their own game'});
+    const module = parse(stripped.code, { sourceType: 'module' });
+    for (const declaration of module.program.body) {
+      if (!['ImportDeclaration', 'ExportAllDeclaration', 'ExportNamedDeclaration'].includes(declaration.type) || !declaration.source) continue;
+      const spec = declaration.source.value;
+      if (!/^\.\.?\//.test(spec) && !spec.startsWith('@parts/')) continue;
+      const resolved = spec.startsWith('@parts/') ? resolvePartImport(root, spec, origins) : { path: resolveOwn(file, spec) };
+      const next = resolved.path;
+      const line = original.program.body.find(n => n.source?.value === spec)?.loc?.start.line ?? 1;
+      if (next && !allowed(next)) problems.push({file:shown,line,message:'rules import only files of their own game or registered parts'});
       else if (next) todo.push(next);
-      else problems.push({ file: shown, line, message: `"${m[1]}" is not a file of this game` });
+      else problems.push({file:shown,line,message:resolved.error ?? `"${spec}" is not a file of this game or a registered part`});
     }
   }
   return { files, problems, sites };
@@ -787,7 +805,7 @@ export async function guardRules(esbuild, root, gameDir, { entry = join(gameDir,
   if (problems.length) return { ok: false, code: null, problems, files };
   let linked;
   try {
-    linked = await esbuild.build({ entryPoints: [entry], bundle: true, format: 'esm', target: 'es2022', write: false, absWorkingDir: root, logLevel: 'silent', external: [RULES_MODULE, GUARD_MODULE], plugins: [guardedPlugin(files)], legalComments: 'none' });
+    linked = await esbuild.build({ entryPoints: [entry], bundle: true, format: 'esm', target: 'es2022', write: false, absWorkingDir: root, logLevel: 'silent', external: [RULES_MODULE, GUARD_MODULE], plugins: [partsPlugin(root, basename(gameDir)), guardedPlugin(files)], legalComments: 'none' });
   } catch (error) {
     const first = error.errors?.[0];
     return { ok: false, code: null, files, problems: [{ file: first?.location?.file ?? relative(root, entry), line: first?.location?.line ?? 0, message: `the rules did not link: ${first?.text ?? error.message}` }] };

package/lib/shoot.mjs

@@ -41,7 +41,7 @@ import { tmpdir } from 'node:os';
 import { join } from 'node:path';
 import { bundleOf, gameDigest } from './build.mjs';
 import { arrivalReadiness, LAUNCH_TIMEOUT_MS } from './check.mjs';
-import { SOFTWARE_GL, chromeArgs, findChrome, noChrome } from './chrome.mjs';
+import { SOFTWARE_GL, chromeArgs, findChrome, noChrome, launchChrome, remoteBrowserEndpoint } from './chrome.mjs';
 import { reachSite, siteRefusal } from './net.mjs';
 import { previewServer } from './preview.mjs';
 
@@ -153,7 +153,7 @@ async function open(puppeteer, chrome, device, url, profiles, browsers, { previe
   const profile = mkdtempSync(join(tmpdir(), 'homie-studio-shoot-'));
   profiles.push(profile);
   const vp = SHOOT_DEVICES[device];
-  const browser = await puppeteer.launch({
+  const browser = await launchChrome(puppeteer, {
     executablePath: chrome, headless: true, userDataDir: profile, timeout: LAUNCH_TIMEOUT_MS, protocolTimeout: 180_000,
     args: [...chromeArgs(), '--mute-audio', '--autoplay-policy=no-user-gesture-required', '--no-first-run', '--no-default-browser-check', `--window-size=${vp.width},${vp.height}`, '--hide-scrollbars', '--force-color-profile=srgb'],
   });
@@ -191,7 +191,7 @@ export async function shoot({ url, game, frames = 60, fps = 30, device = 'comput
   if (!(Number.isInteger(frames) && frames >= 1 && frames <= 1800)) return { ok: false, command: 'shoot', why: '--frames 1..1800' };
   if (!(fps >= 1 && fps <= 120)) return { ok: false, command: 'shoot', why: '--fps 1..120' };
   const chrome = findChrome();
-  if (!chrome) return { ok: false, command: 'shoot', why: noChrome() };
+  if (!chrome && !remoteBrowserEndpoint()) return { ok: false, command: 'shoot', why: noChrome() };
   let puppeteer;
   try { puppeteer = (await import('puppeteer-core')).default; } catch { return { ok: false, command: 'shoot', why: 'puppeteer-core is not installed (it comes with @homie-rocks/studio; run npm install)' }; }
   // --preview: this command serves the one built game itself (no Wrangler, no rooms) and shoots that page.

package/lib/template-history.json

@@ -4470,6 +4470,90 @@
      }
     }
    }
+  },
+  "0.58.8": {
+   "files": {
+    "CLAUDE.md": "ddf2b2a0376202f6",
+    "README.md": "684b3cca8001673c",
+    "HANDOFF.md": "29337e2ace95b2e7",
+    "games/README.md": "5ad32fe80c61f117",
+    "music/README.md": "a3dc042dadd39df8",
+    "videos/README.md": "16babc3437d5545b",
+    "posts/README.md": "37841aae476bd540",
+    "site/README.md": "1dbdf22c03a1e505",
+    "site/src/worker.mjs": "6cc5c6131eaf6fd0"
+   },
+   "sections": {
+    "AGENTS.md": {
+     "(intro)": "af7f2f732505d379",
+     "## Version-matched authoring guides": "f6261a0e5801b96b",
+     "## Layout": "f3a280b8c96cd068",
+     "## Apps: one screen, roles and parts": "c10aa0441ea89702",
+     "## Commands (all through the pinned CLI in node_modules)": "c20d90de21cde0c7",
+     "## The site": "0cb8dd9a6f8a0096",
+     "## Making games": "bb715272fd1a615b",
+     "## The Game Codex and progress": "0738ef719cef3a4c",
+     "## Art direction and models": "a48fff7bf0a5f2fc",
+     "## Running live games (the back office)": "51ebf2ab756f6e4d",
+     "## Servers and AI seats": "1ccfd549d2369a60",
+     "## Selling things (the shop)": "0df5a5fe1833c624",
+     "## Continuing a build from the Claude app": "0d68081e924ca419",
+     "## Rules": "b2234d80f6cbe71d",
+     "## Telling Homie": "80b46fdd9e578db8",
+     "## Beta": "9d02638207a26e73"
+    }
+   },
+   "named": {
+    "Homie Arcade": {
+     "sections": {
+      "AGENTS.md": {
+       "## Commands (all through the pinned CLI in node_modules)": "8364e05cebefcba4"
+      }
+     }
+    }
+   }
+  },
+  "0.58.11": {
+   "files": {
+    "CLAUDE.md": "ddf2b2a0376202f6",
+    "README.md": "684b3cca8001673c",
+    "HANDOFF.md": "29337e2ace95b2e7",
+    "games/README.md": "5ad32fe80c61f117",
+    "music/README.md": "a3dc042dadd39df8",
+    "videos/README.md": "16babc3437d5545b",
+    "posts/README.md": "37841aae476bd540",
+    "site/README.md": "1dbdf22c03a1e505",
+    "site/src/worker.mjs": "6cc5c6131eaf6fd0"
+   },
+   "sections": {
+    "AGENTS.md": {
+     "(intro)": "af7f2f732505d379",
+     "## Version-matched authoring guides": "f6261a0e5801b96b",
+     "## Layout": "f3a280b8c96cd068",
+     "## Apps: one screen, roles and parts": "c10aa0441ea89702",
+     "## Commands (all through the pinned CLI in node_modules)": "c20d90de21cde0c7",
+     "## The site": "0cb8dd9a6f8a0096",
+     "## Making games": "bb715272fd1a615b",
+     "## The Game Codex and progress": "0738ef719cef3a4c",
+     "## Art direction and models": "a48fff7bf0a5f2fc",
+     "## Running live games (the back office)": "51ebf2ab756f6e4d",
+     "## Servers and AI seats": "1ccfd549d2369a60",
+     "## Selling things (the shop)": "0df5a5fe1833c624",
+     "## Continuing a build from the Claude app": "0d68081e924ca419",
+     "## Rules": "b2234d80f6cbe71d",
+     "## Telling Homie": "80b46fdd9e578db8",
+     "## Beta": "9d02638207a26e73"
+    }
+   },
+   "named": {
+    "Homie Arcade": {
+     "sections": {
+      "AGENTS.md": {
+       "## Commands (all through the pinned CLI in node_modules)": "8364e05cebefcba4"
+      }
+     }
+    }
+   }
   }
  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@homie-rocks/studio",
-  "version": "0.58.7",
+  "version": "0.58.11",
   "description": "A studio for games, music and video on its own Cloudflare: scaffold, multiplayer starters on the netplay contract, a port toolkit that makes existing single-player web games multiplayer, the site Worker with public rooms (Table/Lobby Durable Objects and D1, all on the free Workers plan, no payment method), a site with the hub's sections (Home, Games, Music, Videos, Rooms, Posts with feeds) in the studio's own look, an epic landing page for every game, big songs and videos in the studio's own R2 once it has storage (uploaded, checked by SHA-256, served at the same addresses), deploy, and the homie.rocks directory.",
   "type": "module",
   "license": "Apache-2.0",

package/starters/block-drop/README.md

@@ -10,3 +10,5 @@ Start here for a falling-block puzzle. It already plays: preserve the working me
 Build and repair the exact diagnostic before adding more. A file write replaces its entire contents; use targeted edits for small repairs. After an interrupted edit, read the file before continuing.
 
 Exercise left/right, rotation, soft and hard drop on keyboard and with real touchscreen taps. Play two independent wells, clear a row, top out, finish/restart a round and join a bot's seat. Inspect computer, phone and sideways-phone frames. A green movement probe or compiler alone does not prove a board game plays.
+
+The room uses `rest: "quiet"`: gravity and the round clock keep running while a connected person watches. Do not use the movement starters' away-from-keyboard `idle` pause for this continuous falling-block game. Empty rooms still stop normally.

package/starters/block-drop/game.json

@@ -1,6 +1,6 @@
 {
  "id":"block-drop","name":"Block Drop","blurb":"Seven shapes. One well. Stack, rotate and clear lines before the clock runs out.",
- "players":{"min":1,"max":4},"entry":"src/view.ts","room":{"host":"server","rest":"idle"},
+ "players":{"min":1,"max":4},"entry":"src/view.ts","room":{"host":"server","rest":"quiet"},
  "playtest":{"primary":{"label":"hard drop","computer":{"key":"Space"},"phone":{"selector":"[data-action=drop]"}}},
  "screen":{"share":{"desk":"top-right","phone":"top-right"},"chat":{"lines":"sheet-only"}},
  "landing":{"pitch":"Find the gap. Make the line.","about":"A falling-block puzzle with a separate well for every player. Seven-piece bags, ghost pieces, wall kicks and line-clear scoring. Play with a friend or a bot in two-minute rounds.","howToPlay":["Move and rotate each falling shape into a gap.","Fill a horizontal row to clear it. Clear four at once for the biggest score.","Use the ghost outline to aim a hard drop. Keep your stack below the top."],"controls":{"phone":"Tap the arrows to move, ↻ to rotate and DROP to place the piece.","computer":"Left/right to move, up to rotate, down for soft drop and space for hard drop.","tv":"Watch every well; each player uses their own phone."},"credits":[{"role":"Starter","name":"Homie · Block Drop"}]}

package/starters/block-drop/index.html

@@ -1,4 +1,4 @@
 <!doctype html>
 <html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover"><title>Block Drop</title><link rel="icon" href="data:,"><style>
-*{box-sizing:border-box}html,body{margin:0;height:100%;background:#060b16;overflow:hidden;overscroll-behavior:none;font-family:system-ui;color:#edf5ff}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#controls{position:fixed;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:7px}button{width:55px;height:49px;border:1px solid #92b6e34d;border-radius:12px;background:#172741;color:#eaf4ff;font:600 19px system-ui;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 4px 0 #030713}button[data-action=drop]{width:70px;font-size:12px;background:#185950;border-color:#68e9cc66}button.pressed,button:active{transform:translateY(3px);background:#398b89;box-shadow:none}button[data-action=audio]{width:38px;font-size:16px}button:focus-visible{outline:2px solid #fff;outline-offset:3px}#hint{position:fixed;bottom:70px;left:0;right:0;text-align:center;font:10px system-ui;color:#a3b5ce;pointer-events:none}@media(max-width:600px){#hint{display:none}}@media(max-height:460px){button{height:40px}#controls{bottom:9px}#hint{display:none}}
+*{box-sizing:border-box}html,body{margin:0;height:100%;background:#060b16;overflow:hidden;overscroll-behavior:none;font-family:system-ui;color:#edf5ff}canvas{position:fixed;inset:0;width:100%;height:100%;touch-action:none}#controls{position:fixed;bottom:max(44px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:flex;gap:7px}button{width:55px;height:49px;border:1px solid #92b6e34d;border-radius:12px;background:#172741;color:#eaf4ff;font:600 19px system-ui;touch-action:none;user-select:none;-webkit-user-select:none;box-shadow:0 4px 0 #030713}button[data-action=drop]{width:70px;font-size:12px;background:#185950;border-color:#68e9cc66}button.pressed,button:active{transform:translateY(3px);background:#398b89;box-shadow:none}button[data-action=audio]{width:38px;font-size:16px}button:focus-visible{outline:2px solid #fff;outline-offset:3px}#hint{position:fixed;bottom:102px;left:0;right:0;text-align:center;font:10px system-ui;color:#a3b5ce;pointer-events:none}@media(max-width:600px){#hint{display:none}}@media(max-height:460px) and (min-width:600px){button{width:48px;height:44px}button[data-action=drop]{width:58px}#controls{left:14px;top:100px;bottom:auto;transform:none;display:grid;grid-template-columns:58px 58px;gap:9px}#hint{display:none}}
 </style></head><body><canvas></canvas><div id="hint">← → move · ↑ rotate · ↓ soft drop · SPACE hard drop</div><div id="controls" aria-label="Game controls"><button data-action="left" aria-label="Move left">←</button><button data-action="rotate" aria-label="Rotate">↻</button><button data-action="soft" aria-label="Soft drop">↓</button><button data-action="right" aria-label="Move right">→</button><button data-action="drop" aria-label="Hard drop">DROP</button><button data-action="audio" aria-label="Sound" aria-pressed="true">♪</button></div><script type="module" crossorigin src="./assets/main.js"></script></body></html>

package/starters/block-drop/src/view.ts

@@ -25,7 +25,7 @@ function tone(hz: number, seconds = 0.055, volume = 0.055): void {
   if (!audio || audio.state !== 'running' || muted) return;
   const o = audio.createOscillator(), gain = audio.createGain();
   o.type = 'triangle'; o.frequency.value = hz;
-  gain.gain.setValueAtTime(volume, audio.currentTime);
+  gain.gain.setValueAtTime(volume * 3, audio.currentTime);
   gain.gain.exponentialRampToValueAtTime(0.001, audio.currentTime + seconds);
   o.connect(gain).connect(audio.destination); o.start(); o.stop(audio.currentTime + seconds);
 }
@@ -52,7 +52,15 @@ for (const button of document.querySelectorAll<HTMLButtonElement>('[data-action]
     if (action === 'drop') drop = true;
     if (action === 'audio') { muted = !muted; button.textContent = muted ? '×♪' : '♪'; button.setAttribute('aria-pressed', String(!muted)); }
   });
-  const release = (): void => { button.classList.remove('pressed'); if (action === 'left' || action === 'right') touchDx = 0; if (action === 'soft') soft = false; };
+  button.addEventListener('pointermove', e => {
+    if (!button.hasPointerCapture(e.pointerId) || !['left','right','soft'].includes(action ?? '')) return;
+    const target = document.elementFromPoint(e.clientX, e.clientY)?.closest<HTMLButtonElement>('[data-action]');
+    const next = target?.dataset.action;
+    touchDx = next === 'left' ? -1 : next === 'right' ? 1 : 0; soft = next === 'soft';
+    for (const control of document.querySelectorAll<HTMLButtonElement>('[data-action]'))
+      control.classList.toggle('pressed', control === target && ['left','right','soft'].includes(next ?? ''));
+  });
+  const release = (): void => { for (const control of document.querySelectorAll('[data-action]')) control.classList.remove('pressed'); if (['left','right','soft'].includes(action ?? '')) { touchDx = 0; soft = false; } };
   button.addEventListener('pointerup', release); button.addEventListener('pointercancel', release);
   // Keyboard activation for focused native buttons; pointer input is handled above.
   button.addEventListener('click', e => { if (e.detail === 0) { unlock(); if (action === 'rotate') rotate = true; if (action === 'drop') drop = true; } });
@@ -91,15 +99,15 @@ function frame(): void {
   if (audio?.state === 'running' && now >= nextNote) { const hz = melody[note++ % melody.length]; if (hz) tone(hz, 0.21, 0.075); nextNote = now + 250; }
   room.input({ dx: touchDx || (keys.has('ArrowRight') || keys.has('KeyD') ? 1 : 0) - (keys.has('ArrowLeft') || keys.has('KeyA') ? 1 : 0), soft: soft || keys.has('ArrowDown') || keys.has('KeyS'), rotate, drop }); rotate = false; drop = false;
   const bg = g.createRadialGradient(w * 0.5, h * 0.3, 10, w * 0.5, h * 0.5, Math.max(w, h)); bg.addColorStop(0, '#172747'); bg.addColorStop(1, '#060b16'); g.fillStyle = bg; g.fillRect(0, 0, w, h);
-  text(document.title.toUpperCase(), 20, 31, 18, '#eef6ff');
+  text(document.title.toUpperCase(), 20, 61, 18, '#eef6ff');
   const round = room.round;
-  text(round?.phase === 'over' ? `Next round in ${Math.ceil(round.secondsLeft)}` : round ? `${Math.ceil(round.secondsLeft)}s` : 'Joining…', 20, 51, 12);
+  text(round?.phase === 'over' ? `Next round in ${Math.ceil(round.secondsLeft)}` : round ? `${Math.ceil(round.secondsLeft)}s` : 'Joining…', 20, 80, 12);
   const boards: Board[] = []; room.each('board', b => boards.push(b));
   const me = room.me; const focus = me ?? boards[0];
   if (focus) {
-    const compact = w < 640, top = 82, bottom = 94;
+    const compact = w < 640, landscape = w >= 640 && h <= 460, top = landscape ? 58 : 108, bottom = compact ? 174 : landscape ? 18 : 110;
     const s = Math.max(5, Math.min(32, (h - top - bottom) / 20, (w - (compact ? 116 : 330)) / 10));
-    const total = 10 * s + 98 + (!compact && boards.length > 1 ? 150 : 0);
+    const total = 10 * s + 98 + (!compact && !landscape && boards.length > 1 ? 150 : 0);
     const x = Math.max(12, (w - total) / 2), y = top;
     const roster = room.roster.find(r => r.seat === focus.seat);
     text(me ? 'YOUR WELL' : (roster?.name ?? 'WATCHING'), x, y - 13, 11, '#7aeee1');
@@ -111,7 +119,7 @@ function frame(): void {
     text('SCORE', side, y + 110, 10); text(String(focus.score), side, y + 136, 21, '#f5f8ff');
     if (h >= 350) { text('LINES', side, y + 170, 10); text(String(focus.lines), side, y + 194, 19, '#f5f8ff'); }
     if (20 * s > 260) { text('LEVEL', side, y + 230, 10); text(String(1 + Math.floor(focus.lines / 10)), side, y + 254, 19, '#f5f8ff'); }
-    if (!compact) {
+    if (!compact && !landscape) {
       let ry = y;
       for (const rival of boards.filter(b => b.id !== focus.id).slice(0, 3)) {
         const mini = Math.min(6, s * 0.25), rx = side + 112;
@@ -120,7 +128,25 @@ function frame(): void {
         well(rival, rx, ry, mini, false); text(String(rival.score), rx + 10 * mini + 9, ry + 14, 12, '#eef6ff'); ry += 20 * mini + 38;
       }
     }
-    if (round?.phase === 'over') text('ROUND COMPLETE', x, y + 20 * s + 24, 12, '#ffd75b');
+    const ranked = boards.slice().sort((a, b) => b.score - a.score || a.seat - b.seat);
+    const nameOf = (b: Board): string => { const r = room.roster.find(r => r.seat === b.seat); return b.id === me?.id ? 'YOU' : `${r?.driver === 'bot' ? 'BOT ' : ''}${r?.name ?? 'Player'}`; };
+    const rank = ranked.findIndex(b => b.id === focus.id) + 1;
+    if (compact) {
+      text(`RANK ${rank}/${ranked.length} · LEADER ${ranked[0]?.score ?? 0}`, 16, h - 155, 12, '#7aeee1');
+      ranked.slice(0, 4).forEach((b, i) => text(`${i + 1}. ${nameOf(b).slice(0, 12)}  ${b.score}`, 16 + (i % 2) * (w / 2), h - 132 + Math.floor(i / 2) * 19, 11, b.id === me?.id ? '#f5f8ff' : '#a7b8d5'));
+    } else if (landscape) {
+      text(`RANK ${rank}/${ranked.length}`, side + 112, y + 142, 12, '#7aeee1');
+      ranked.slice(0, 4).forEach((b, i) => text(`${i + 1}. ${nameOf(b).slice(0, 10)} ${b.score}`, side + 112, y + 15 + i * 24, 12, b.id === me?.id ? '#f5f8ff' : '#a7b8d5'));
+    }
+    if (round?.phase === 'over') {
+      const results = round.results?.length ? round.results : ranked.map((b, i) => ({ name: nameOf(b), score: b.score, seat: b.seat, place: i + 1 }));
+      const pw = Math.min(340, w - 32), ph = 110 + results.length * 27, px = (w - pw) / 2, py = Math.max(42, (h - ph) / 2);
+      g.fillStyle = '#081329f5'; g.fillRect(px, py, pw, ph); g.strokeStyle = '#71e9e0'; g.strokeRect(px, py, pw, ph);
+      text(`${results[0]?.name ?? 'Player'} WINS`, px + 16, py + 30, 18, '#ffd75b');
+      text('FINAL SCORES', px + 16, py + 55, 11);
+      results.forEach((r, i) => text(`${r.place}. ${r.name.slice(0, 18)}${r.seat === me?.seat ? ' (YOU)' : ''}  ${r.score}`, px + 16, py + 82 + i * 27, 13, '#f5f8ff'));
+      text(`Next round in ${Math.ceil(round.secondsLeft)}s`, px + 16, py + ph - 15, 11);
+    }
   } else text('Finding your seat…', Math.max(20, w / 2 - 70), h / 2, 15);
   requestAnimationFrame(frame);
 }

package/worker/build-id.mjs

@@ -1,2 +1,2 @@
 // Generated by lib/build-identity.mjs; identifies the bundled runtime sources.
-export const STUDIO_BUILD = Object.freeze({"version":"0.58.7","sha256":"7e854e93223f03753673b43a0ede92d8834ec6c4d22dbf65c42d402327d7088f"});
+export const STUDIO_BUILD = Object.freeze({"version":"0.58.11","sha256":"4b6a276c704c1647234dfdbef1628bff5ade43b918653552b493965a2db72f9b"});

package/worker/index.mjs

@@ -1,3 +1,5 @@
+import {drainSince,isAdmission,drainResponse} from './move-drain.mjs';
+import {managedMedia} from './managed-media.mjs';
 /** Studio Worker event boundaries and public toolkit exports. */
 import { catalogue } from './catalogue.mjs';
 import {trackBackground,requestDatabase,MUTATION_VERSION} from './request-db.mjs';
@@ -11,6 +13,7 @@ import { appCors, isAppOrigin } from './standalone.mjs';
 
 
 import {json,finish} from './responses.mjs';
+import {isReadOnly,readOnlyAccess,readOnlyDatabase,readOnlyResponse,markReadOnly,heldBatch,ReadOnlyError} from './read-only.mjs';
 
 export {useRoutes} from './custom-routes.mjs';
 export {isOwner,hasRole,requireSameOrigin} from './route-auth.mjs';
@@ -30,10 +33,17 @@ export {AppRecordHub, EventHub} from './stream-objects.mjs';
 export {directoryOf,useTools,getStudioTools} from './tool-registry.mjs';
 const route = async (...args) => (await import('./routes.mjs')).default(...args);
 export default {
-  async queue(batch,env) {return (await import('./background-queue.mjs')).consumeBackground(batch,await loadShopLinks(env));},
+  async queue(batch,env) {
+    // Read-only (worker/read-only.mjs): Stripe events are fulfilled now, the rest is retried after the window.
+    if(isReadOnly(env))batch=heldBatch(batch);
+    if(!batch.messages.length)return;
+    return (await import('./background-queue.mjs')).consumeBackground(batch,await loadShopLinks(env));
+  },
   async scheduled(event, env, ctx) {
     env=await loadShopLinks(env);
-    const analytics=event.cron === '17 * * * *' ? (await import('./analytics.mjs')).rollupAnalytics(env) : Promise.resolve();
+    const readOnly=isReadOnly(env);
+    if(readOnly)console.log(JSON.stringify({at:new Date().toISOString(),ev:'scheduled-read-only',cron:event.cron,why:'the studio is read-only: this tick only recovers Stripe events'}));
+    const analytics=event.cron === '17 * * * *' && !readOnly ? (await import('./analytics.mjs')).rollupAnalytics(env) : Promise.resolve();
     ctx.waitUntil(analytics);
     const maintenance=(async () => {
       const [{notifyTools},{reconcileOrders,shopOf}]=await Promise.all([import('./runtime-support.mjs'),import('./shop.mjs')]);
@@ -49,17 +59,27 @@ export default {
         ['Stripe recovery',async()=>{if(env.BACKGROUND && event.cron==='17 * * * *')await (await import('./stripe-intake.mjs')).sweepStripeEvents(env,cat);}],
         ['owner functions',async()=> (await import('./functions.mjs')).scheduleFunctions(event,env,cat,cat.studio?.url??'https://studio.invalid')],
       ];
-      await Promise.all(tasks.map(async([name,run])=>{try{await run();}catch(error){console.error('Scheduled '+name+' failed:',error.message);}}));
+      // Read-only: only payment fulfilment runs; every other task does its work on its next tick.
+      await Promise.all(tasks.filter(([name])=>!readOnly||name==='Stripe recovery').map(async([name,run])=>{try{await run();}catch(error){console.error('Scheduled '+name+' failed:',error.message);}}));
     })();
     ctx.waitUntil(maintenance);
     await Promise.all([maintenance,analytics]);
   },
   async fetch(request, env, ctx) {
+    env=managedMedia(env);
+    if(isAdmission(request)&&await drainSince(env))return drainResponse();
     const staticPath=new URL(request.url).pathname;
     if(['GET','HEAD'].includes(request.method)&&staticPath==='/_homie/site.js')return finish(await route(request,env,ctx),staticPath);
     env=await loadShopLinks(env,new URL(request.url).origin);
-    env={...env,DB:requestDatabase(env.DB,request,{mutated:false,summaries:Boolean(env.BACKGROUND)})};
     const url = new URL(request.url);
+    const appRecords = isAppOrigin(request) && /^\/[^/]+\/api\/app\/records\//.test(url.pathname);
+
+    // Read-only (worker/read-only.mjs): a change is refused before anything runs; a read gets a D1 that refuses writes.
+    const readOnly=isReadOnly(env),access=readOnly?readOnlyAccess(request,url.pathname):'write';
+    if(access==='refuse')return appRecords?appCors(request,readOnlyResponse()):readOnlyResponse();
+    let refusedWrite=false;
+    env={...env,DB:requestDatabase(env.DB,request,{mutated:false,summaries:Boolean(env.BACKGROUND)})};
+    if(access==='read')env={...env,DB:readOnlyDatabase(env.DB,()=>{refusedWrite=true;})};
     if(env.HOMIE_CONCEPT==='1' && url.pathname==='/robots.txt')return new Response('User-agent: *\nDisallow: /\n',{headers:{'content-type':'text/plain','x-robots-tag':'noindex, nofollow'}});
     if(env.HOMIE_CONCEPT==='1' && url.pathname==='/.well-known/homie-studio.json')return json({ok:false,error:'concept-unlisted'},404,{'x-robots-tag':'noindex, nofollow'});
     const dispatch=()=>import('./background-queue.mjs').then(m=>m.enqueueChanges(env,url.origin));
@@ -81,14 +101,16 @@ export default {
     const requestCtx=background.context;
     // A standalone copy's Lobby call (worker/standalone.mjs): every answer to it can be read by the app's page, an
     // unknown game's 404 and a failure included, so the app can say why it plays offline. No other address is opened.
-    const appRecords = isAppOrigin(request) && /^\/[^/]+\/api\/app\/records\//.test(url.pathname);
     if (appRecords && request.method === 'OPTIONS') return appCors(request, new Response(null, { status: 204, headers: { 'access-control-allow-methods': 'GET, POST, PUT, DELETE', 'access-control-allow-headers': 'content-type' } }));
     const appLobby = isAppOrigin(request) && /^\/[^/]+\/api\/lobby\/?$/.test(url.pathname);
     let res;
     try { res = finish(await route(request, env, requestCtx), url.pathname); } catch (error) {
-      if (!appLobby) throw error;
-      try { console.error(JSON.stringify({ at: new Date().toISOString(), ev: 'lobby-route-failed', path: url.pathname, error: errorLine(error) })); } catch { /* no console */ }
-      res = json({ ok: false, error: 'failed' }, 500);
+      if (error instanceof ReadOnlyError) res = readOnlyResponse();
+      else if (!appLobby) throw error;
+      else {
+        try { console.error(JSON.stringify({ at: new Date().toISOString(), ev: 'lobby-route-failed', path: url.pathname, error: errorLine(error) })); } catch { /* no console */ }
+        res = json({ ok: false, error: 'failed' }, 500);
+      }
     } finally {
       // A route can commit a write and then fail. Its outbox still needs delivery.
       if(env.DB) {
@@ -99,13 +121,18 @@ export default {
     if(env.HOMIE_CONCEPT==='1' && res.status!==101) {
       const headers=new Headers(res.headers);headers.set('x-robots-tag','noindex, nofollow');
       let body=res.body;
-      if(/text\/html/i.test(headers.get('content-type')??'')) {
+      // The outer page labels the whole preview. Repeating that overlay in an
+      // embedded game/app obscures its HUD and counts as the game's own UI.
+      if(request.headers.get('sec-fetch-dest')!=='iframe' && /text\/html/i.test(headers.get('content-type')??'')) {
         const html=await res.text(),banner='<aside role="status" style="position:fixed;z-index:2147483647;top:0;left:0;right:0;text-align:center;background:#ffda44;color:#171717;padding:6px;font:bold 14px system-ui;pointer-events:none">TEST / CONCEPT</aside>';
         body=/<body[^>]*>/i.test(html)?html.replace(/<body[^>]*>/i,m=>m+banner):banner+html;
         headers.delete('content-length');
       }
       res=new Response(body,{status:res.status,headers});
     }
+    // A read that needed its write, and failed for want of it, says why.
+    if(readOnly&&refusedWrite&&res.status>=500)res=readOnlyResponse();
+    if(readOnly)res=await markReadOnly(res);
     const bookmark=env.DB?.getBookmark?.();
     if(bookmark&&res.status!==101){const headers=new Headers(res.headers);headers.set('x-studio-bookmark',bookmark);res=new Response(res.body,{status:res.status,statusText:res.statusText,headers});}
     if (appLobby || appRecords) return appCors(request, res);

package/worker/lobby.mjs

@@ -2,6 +2,7 @@ import {LobbyPeak} from './lobby-peak.mjs';
 import {MatchRouter} from './match-router.mjs';
 import {LOBBY_SHARDS,SHARDED_ROOM_BASE} from './lobby-shards.mjs';
 import {json} from './responses.mjs';
+import {readOnlyEnv} from './read-only.mjs';
 import {lobbyStore} from './lobby-store.mjs';
 import { errorLine, versionOf } from './room-protocol.mjs';
 import { ROOM_ID } from './page-policy.mjs';
@@ -16,7 +17,7 @@ export {LOBBY_APP_VERSIONS, LOBBY_ROOMS_MAX} from './lobby-limits.mjs';
 export class Lobby {
   constructor(ctx, env) {
     this.ctx = ctx;
-    this.env = env;
+    this.env = readOnlyEnv(env); // read-only: matchmaking goes on, its D1 counters wait (worker/read-only.mjs)
     this.store = lobbyStore(ctx.storage);
     this.rooms = new Map();
     this.reservations=new Map();

package/worker/managed-media.mjs

@@ -0,0 +1,16 @@
+/** Hydrate the R2-compatible metadata returned by the studio-scoped managed binding.
+ * Streams cross RPC without buffering songs, videos or saves in the Worker heap. */
+function object(value) {
+ if(!value)return null;
+ return {...value,
+  writeHttpMetadata(headers){for(const [key,name] of Object.entries({contentType:'content-type',contentLanguage:'content-language',contentDisposition:'content-disposition',contentEncoding:'content-encoding',cacheControl:'cache-control',cacheExpiry:'expires'})){if(value.httpMetadata?.[key])headers.set(name,String(value.httpMetadata[key]));}},
+  arrayBuffer:()=>new Response(value.body).arrayBuffer(),
+  text:()=>new Response(value.body).text(),
+  json:()=>new Response(value.body).json(),
+ };
+}
+export function managedMedia(env) {
+ if(!env.HOMIE_MEDIA)return env;
+ const binding=env.HOMIE_MEDIA;
+ return {...env,MEDIA:{get:async(key,options)=>object(await binding.get(key,options)),head:async key=>object(await binding.head(key)),put:async(key,body,options)=>object(await binding.put(key,body,options)),delete:keys=>binding.delete(keys)}};
+}