@homie-rocks/studio 0.48.3 → 0.49.0

package/worker/index.mjs

@@ -1,3 +1,4 @@
+import { RULES_WIRING_MESSAGE } from './rules-wiring.mjs';
 import { characterStore, characterRequest } from './characters.mjs';
 export { useFunctions } from './functions.mjs';
 import { appAccess, appRecordsRoute } from './app-records.mjs';
@@ -530,7 +531,8 @@ async function gameDocument(request, env, url, game, meta, cat, { agent = null }
     ...(!agent && !watching && await availableShellShop(env, cat, game) ? { shop: true } : {}),
   };
   let html = await res.text();
-  const head = `${embedded ? `<script>${EMBED_GAME_JS}</script>` : ''}<script>window.HOMIE_NET=${JSON.stringify(cfg).replace(/</g, '\\u003c')}</script>`;
+  const fallback = meta?.kind === 'app' ? `<script>addEventListener('DOMContentLoaded',function(){if(!document.querySelector('canvas')||document.querySelector('[data-webgl-fallback]'))return;try{var c=document.createElement('canvas');if(c.getContext('webgl2'))return;}catch(e){}var p=document.createElement('p');p.dataset.webglFallback='';p.setAttribute('role','status');p.textContent=${JSON.stringify(meta.words?.fallback ?? 'This device cannot display the 3D scene. Try a browser with WebGL enabled; use any available controls below.').replace(/</g, '\u003c')};p.style.cssText='position:fixed;z-index:2147483647;left:16px;right:16px;top:80px;padding:16px;background:#fff;color:#222;font:16px system-ui;border-radius:12px';document.body.append(p);});</script>` : '';
+  const head = fallback + `${embedded ? `<script>${EMBED_GAME_JS}</script>` : ''}<script>window.HOMIE_NET=${JSON.stringify(cfg).replace(/</g, '\\u003c')}</script>`;
   html = /<head[^>]*>/i.test(html) ? html.replace(/<head([^>]*)>/i, `<head$1>${head}`) : head + html;
   return new Response(html, {
     headers: {
@@ -763,7 +765,7 @@ async function route(request, env, ctx) {
   }
   if (path === '/api/games') {
     const cat = await getCat();
-    return json({ studio: cat.studio, games: cat.games, live: await liveCounts(env, cat.games ?? []) });
+    return json({ studio: cat.studio, games: (cat.games ?? []).map(g => g.room?.host === 'server' && !hostedGame(g.id) ? { ...g, rulesError: RULES_WIRING_MESSAGE } : g), live: await liveCounts(env, cat.games ?? []) });
   }
   if (path === '/api/rooms') {
     const cat = await getCat();
@@ -1051,7 +1053,7 @@ async function route(request, env, ctx) {
         // The big screen picks its room now, so the QR it shows puts every phone in that same room.
         let room = asked;
         if (!room) {
-          try { room = (await (await lobby().fetch(`https://lobby/join?max=${humanSeats(pol)}&server=${srv.id}&rooms=${srv.roomsMax}${versionOf(meta?.netplay?.version) ? `&ver=${encodeURIComponent(versionOf(meta.netplay.version))}` : ''}`, { method: 'POST' })).json()).room ?? null; } catch { room = null; }
+          try { room = (await (await lobby().fetch(`https://lobby/join?host=${meta?.room?.host === 'server' ? 'server' : 'browser'}&max=${humanSeats(pol)}&server=${srv.id}&rooms=${srv.roomsMax}${versionOf(meta?.netplay?.version) ? `&ver=${encodeURIComponent(versionOf(meta.netplay.version))}` : ''}`, { method: 'POST' })).json()).room ?? null; } catch { room = null; }
         }
         const joinUrl = `${url.origin}${openPath(meta)}${room ? `?room=${encodeURIComponent(room)}` : ''}`;
         // Local development: no phone can open this computer's own address, so no code for it; the card says to deploy.
@@ -1124,7 +1126,7 @@ async function route(request, env, ctx) {
         if (not.split(',').includes(room)) return json({ ok: false, error: 'world-unavailable', message: 'This world is unavailable. Choose another named world.' }, 409);
         return json({ room, players: 0, max: humanSeats(pol), server: srv.id });
       }
-      return lobby().fetch(`https://lobby/join?max=${humanSeats(pol)}&server=${srv.id}&rooms=${srv.roomsMax}${not ? `&not=${encodeURIComponent(not)}` : ''}${ver ? `&ver=${encodeURIComponent(ver)}` : ''}${app ? '&app=1' : ''}`, { method: 'POST' });
+      return lobby().fetch(`https://lobby/join?host=${meta?.room?.host === 'server' ? 'server' : 'browser'}&max=${humanSeats(pol)}&server=${srv.id}&rooms=${srv.roomsMax}${not ? `&not=${encodeURIComponent(not)}` : ''}${ver ? `&ver=${encodeURIComponent(ver)}` : ''}${app ? '&app=1' : ''}`, { method: 'POST' });
     }
     if (sub === 'api/agent') {
       // An AI's seat (worker/agents.mjs): its pass, the server's policy, a room with people in it, a ticket.
@@ -1136,7 +1138,7 @@ async function route(request, env, ctx) {
         join: async (srv, pol) => {
           try {
             const reserve = pol.aiSeats + pol.guides;
-            const r = await (await lobby().fetch(`https://lobby/join?max=${max}&server=${srv.id}&agent=1&ai=${reserve}${versionOf(meta?.netplay?.version) ? `&ver=${encodeURIComponent(versionOf(meta.netplay.version))}` : ''}`, { method: 'POST' })).json();
+            const r = await (await lobby().fetch(`https://lobby/join?host=${meta?.room?.host === 'server' ? 'server' : 'browser'}&max=${max}&server=${srv.id}&agent=1&ai=${reserve}${versionOf(meta?.netplay?.version) ? `&ver=${encodeURIComponent(versionOf(meta.netplay.version))}` : ''}`, { method: 'POST' })).json();
             return r.room ?? null;
           } catch { return null; }
         },
@@ -1429,7 +1431,7 @@ export class Table {
   ensureHost(room, hosted) {
     if (this.hostRt || !this.game) return;
     if (!hostedGame(this.game)) {
-      if (hosted) room.failServerHost('This game runs its rules on the server, and this build of the site does not hold them. Build and deploy it again.');
+      if (hosted) room.failServerHost(RULES_WIRING_MESSAGE);
       return;
     }
     let restoring = false;
@@ -1461,7 +1463,7 @@ export class Table {
         this.finishRoom(why);
         room.forget(); room.ended = null;
         // Only a holder returning to the old match is rematched. A new visitor uses this name immediately.
-        if (!expired) room.endedMatch = { why, ver: build.build, tokens, until: Date.now() + ROOM_PAUSE_MS };
+        if (!expired && pooledRoom(this.code)) room.endedMatch = { why, ver: build.build, tokens, until: Date.now() + ROOM_PAUSE_MS };
         this.room = room; saved = null; restoring = false; boot = { epoch: 0, count: 0 };
       }
       this.roomSave = saved;
@@ -2469,7 +2471,7 @@ export class Table {
     const lobby = this.env.LOBBY.get(this.env.LOBBY.idFromName(this.game));
     // The build this room runs (section 23): the Lobby sends a visitor only to a room of the live build.
     const ver = room.gameVer === undefined ? undefined : room.gameVer ?? '';
-    this.ctx.waitUntil(lobby.fetch(`https://lobby/report?game=${encodeURIComponent(this.game)}`, { method: 'POST', body: JSON.stringify({ room: this.code, players, people, agents, ai, ...(ver !== undefined ? { ver } : {}) }) }).catch(() => {}));
+    this.ctx.waitUntil(lobby.fetch(`https://lobby/report?game=${encodeURIComponent(this.game)}`, { method: 'POST', body: JSON.stringify({ room: this.code, players, people, agents, ai, host: room.server ? 'server' : 'browser', ...(ver !== undefined ? { ver } : {}) }) }).catch(() => {}));
   }
 
   /** A round the host called over becomes one D1 row (once per round number). */
@@ -2523,6 +2525,7 @@ export class Lobby {
     ctx.blockConcurrencyWhile(async () => {
       const saved = await ctx.storage.get('lobby');
       if (saved) {
+        this.current = saved.current ?? null;
         this.next = typeof saved.next === 'number' ? { public: saved.next } : saved.next && typeof saved.next === 'object' ? { public: 1, ...saved.next } : { public: 1 };
         for (const r of saved.rooms ?? []) this.rooms.set(r.name, { ...r, server: r.server ?? roomServer(r.name), agents: r.agents ?? 0, ai: r.ai ?? 0, ver: typeof r.ver === 'string' ? r.ver : '', pending: [], agentPending: [] });
         for (const [name, until] of saved.closed ?? []) if (until > Date.now()) this.closed.set(name, until);
@@ -2550,7 +2553,7 @@ export class Lobby {
     if (list.length) this.ctx.waitUntil(this.env.DB.batch(list).catch(() => {}));
   }
 
-  save() { this.ctx.storage.put('lobby', { next: this.next, rooms: [...this.rooms.values()].map(({ name, players, agents, ai, server, at, ver }) => ({ name, players, agents, ai, server, at, ...(ver ? { ver } : {}) })), closed: [...this.closed] }).catch(() => {}); }
+  save() { this.ctx.storage.put('lobby', { current: this.current ?? null, next: this.next, rooms: [...this.rooms.values()].map(({ name, players, agents, ai, server, at, ver, host }) => ({ name, players, agents, ai, server, at, ...(host ? { host } : {}), ...(ver ? { ver } : {}) })), closed: [...this.closed] }).catch(() => {}); }
 
   prune(now) {
     for (const [name, r] of this.rooms) {
@@ -2578,6 +2581,17 @@ export class Lobby {
     // the build of a game that names none ('').
     const ver = versionOf(url.searchParams.get('ver')) ?? '';
     if (url.pathname === '/join') {
+      // A server build can run only its current rules. Persisted browser rooms
+      // (including pre-kind records) and old server revisions must not consume
+      // the pool or become the fallback of a server with roomsMax=1.
+      const host = url.searchParams.get('host');
+      if ((host === 'server' || host === 'browser') && (this.current?.host !== host || this.current?.ver !== ver)) {
+        this.current = { host, ver };
+        for (const [name, r] of this.rooms) if (
+          host === 'server' ? (r.host ?? 'browser') !== host || (r.ver ?? '') !== ver : r.host === 'server'
+        ) { this.rooms.delete(name); this.seen.delete(name); this.live.delete(name); }
+        this.save();
+      }
       const max = seatCount(url.searchParams.get('max'));
       const sid = url.searchParams.get('server') ?? 'public';
       const server = sid === 'public' || SERVER_ID.test(sid) ? sid : 'public';
@@ -2640,7 +2654,7 @@ export class Lobby {
       if (!room) {
         let n = this.next[server] ?? 1;
         while (not.has(roomCode(server, n)) || this.closed.has(roomCode(server, n)) || this.rooms.has(roomCode(server, n))) n += 1;
-        room = { name: roomCode(server, n), server, players: 0, agents: 0, ai: 0, at: now, ver, pending: [], agentPending: [] };
+        room = { name: roomCode(server, n), server, players: 0, agents: 0, ai: 0, at: now, ver, ...(host ? { host } : {}), pending: [], agentPending: [] };
         this.next[server] = n + 1;
         this.rooms.set(room.name, room);
       }
@@ -2659,6 +2673,11 @@ export class Lobby {
         this.save();
         return json({ ok: true, closed: body.closed > now });
       }
+      // A retiring isolate may send its last report after the new pool was
+      // selected. It cannot resurrect an incompatible public room.
+      if (pooledRoom(body.room) && this.current && (this.current.host === 'server'
+        ? (body.host ?? 'browser') !== 'server' || (body.ver ?? '') !== this.current.ver
+        : body.host === 'server')) return json({ ok: true, retired: true });
       const seated = Math.max(0, Math.floor(Number(body.players) || 0));
       const agents = Math.max(0, Math.floor(Number(body.agents) || 0));
       const ai = Math.max(agents, Math.floor(Number(body.ai) || 0));
@@ -2674,6 +2693,7 @@ export class Lobby {
       const rver = typeof body.ver === 'string' ? versionOf(body.ver) ?? '' : r.ver ?? '';
       const changed = !this.rooms.has(r.name) || r.players !== seated || (r.agents ?? 0) !== agents || (r.ai ?? 0) !== ai || (r.ver ?? '') !== rver;
       r.ver = rver;
+      if (body.host === 'server' || body.host === 'browser') r.host = body.host;
       r.pending.splice(0, grew);
       if ((r.agents ?? 0) < agents) (r.agentPending ?? []).splice(0, agents - (r.agents ?? 0));
       r.players = seated;

package/worker/pages.mjs

@@ -597,7 +597,8 @@ const SHELL_JS = String.raw`${BUILD_RETRY_JS}(function () {
       // playing in its own room: it loads again at the round's break, or at once on a big screen (nothing to lose).
       if (m.what === 'rematch' && m.room === room) {
         var fresh = new URL(location.href);
-        fresh.searchParams.delete('room'); fresh.searchParams.set('not', room);
+        if (/^(?:pub-[1-9][0-9]*|s-[a-z0-9][a-z0-9-]*-[1-9][0-9]*)$/.test(room)) { fresh.searchParams.delete('room'); fresh.searchParams.set('not', room); }
+        else { fresh.searchParams.set('room', room); fresh.searchParams.delete('not'); }
         location.replace(fresh.href);
         return;
       }
@@ -1357,7 +1358,8 @@ const WATCH_JS = String.raw`${BUILD_RETRY_JS}(function () {
       var m = ev.data;
       if (!m || typeof m !== 'object' || m.t !== 'homie-net') return;
       if (m.what === 'rematch' && m.room === room) {
-        var fresh = new URL(location.href); fresh.searchParams.delete('room'); fresh.searchParams.set('not', room);
+        var fresh = new URL(location.href); if (/^(?:pub-[1-9][0-9]*|s-[a-z0-9][a-z0-9-]*-[1-9][0-9]*)$/.test(room)) { fresh.searchParams.delete('room'); fresh.searchParams.set('not', room); }
+        else { fresh.searchParams.set('room', room); fresh.searchParams.delete('not'); }
         location.replace(fresh.href); return;
       }
       if (m.what === 'wait') updating.stop();

package/worker/parts.mjs

@@ -263,13 +263,13 @@ ${sayRow('Say', sayAdd(p))}
  * build something new from them. Empty when the game shared none. It stands by itself: its own markup and styles.
  */
 export function partsBand(g, parts, host) {
-  const mine = parts.filter((p) => (p.from?.game ?? p.from?.app) === g.id);
+  const mine = parts.filter((p) => (p.from?.game ?? p.from?.app ?? (p.from?.kind === 'app' ? p.from.id : null)) === g.id);
   if (!mine.length) return '';
-  const say = mine.length === 1 ? sayAdd({ ...mine[0], add: `${host}/${mine[0].id}` }) : `Make a new game in my Homie studio with these parts of ${g.name}: ${mine.slice(0, 4).map((p) => `${host}/${p.id}`).join(', ')}`;
+  const say = mine.length === 1 ? sayAdd({ ...mine[0], add: `${host}/${mine[0].id}` }) : `Make a new ${g.kind === 'app' ? 'app' : 'game'} in my Homie studio with these parts of ${g.name}: ${mine.slice(0, 4).map((p) => `${host}/${p.id}`).join(', ')}`;
   return `${CSS}<section class="pband" aria-labelledby="parts-title" data-parts-band>
   <p class="ptag">Take a piece</p>
-  <h2 id="parts-title">Parts from this game</h2>
-  <p class="plead">Pieces of ${esc(g.name)} you can put in a game of your own, each with its licence. Mix them with parts from other games: a creature from here, a level from there.</p>
+  <h2 id="parts-title">Parts from this ${g.kind === 'app' ? 'app' : 'game'}</h2>
+  <p class="plead">Pieces of ${esc(g.name)} you can put in ${g.kind === 'app' ? 'an app' : 'a game'} of your own, each with its licence.</p>
   <ul class="pgrid">${mine.map(card).join('')}</ul>
   ${sayRow('In a chat with your Homie studio open, say', say)}
   <div class="keys"><a class="btn" href="/parts/#from-${esc(g.id)}">${icon('spark')}<span>See the parts</span></a></div>

package/worker/rules-wiring.mjs

@@ -0,0 +1,2 @@
+/** Shared build/live diagnosis: the studio's Worker must register its generated rules. */
+export const RULES_WIRING_MESSAGE = "site/src/worker.mjs does not register this studio's server rules. Add hostRules to its import from '@homie-rocks/studio/worker', then add these two lines at module scope:\nimport rules from './rules/index.mjs';\nhostRules(rules);\nBuild and deploy again.";

package/worker/shop-page.mjs

@@ -61,17 +61,21 @@ export const WAY_LINES = Object.freeze({
 export function shopPage(cat, shop, { origin = '', game = null, item = null, open = false, mode = null } = {}) {
   const studio = cat.studio?.name ?? 'Studio';
   const g = game ? (cat.games ?? []).find((x) => x.id === game) : null;
-  const boot = { game: g ? g.id : null, item: ITEM_ID.test(String(item ?? '')) ? item : null, studio };
+  const preview = !open && /^https?:\/\/(localhost|127\.0\.0\.1|\[::1\])(?::|\/|$)/.test(origin);
+  const giving = Boolean(shop.giving);
+  const previewItems = preview ? shop.items.map(i => `<article class="item"><h2>${esc(i.name)}</h2><span class="price">${esc(money(i.price === 'choose' ? i.min : i.price, shop.currency))}${i.interval ? ' / month' : ''}</span><p>${esc(i.blurb ?? '')}</p><button disabled>Preview only</button></article>`).join('') : '';
+  const boot = { giving, preview, game: g ? g.id : null, item: ITEM_ID.test(String(item ?? '')) ? item : null, studio };
   const main = `<section class="shop" data-shop>
 <p class="kicker">${esc(studio)}</p>
-<h1>${g ? `${esc(g.name)}: shop` : 'Shop'}</h1>
+<h1>${giving ? 'Give' : g ? `${esc(g.name)}: shop` : 'Shop'}</h1>
 ${mode === 'test' ? '<p class="test">TEST MODE: no real money moves (Stripe test cards only)</p>' : ''}
-<p class="lead">Things you can buy here, in real money, from ${esc(studio)} itself. Paid purchases open Stripe's checkout page. Guest purchases stay in this browser; keep its cookies or sign in to keep access. ${g ? `<a href="/${esc(g.id)}/">Back to ${esc(g.name)}</a>` : ''}</p>
+<p class="lead">${giving ? `Support ${esc(studio)} with a one-time or monthly gift. Gifts go directly to the organisation through its own Stripe account.` : `Things you can buy here, in real money, from ${esc(studio)} itself. Paid purchases open Stripe's checkout page. Guest purchases stay in this browser; keep its cookies or sign in to keep access.`} ${g ? `<a href="/${esc(g.id)}/">Back to ${esc(g.name)}</a>` : ''}</p>
 <noscript><p class="lead">This page needs JavaScript.</p></noscript>
 <div data-shop-age hidden></div>
-<div class="items" data-shop-items><p>${open ? 'Reading the shop…' : 'The shop is not open yet.'}</p></div>
+<div class="items" data-shop-items><p>${open ? 'Reading the shop…' : preview ? 'PREVIEW — checkout is disabled. Connect Stripe to open.' : 'Connect the organisation’s Stripe account to open giving or sales.'}</p>${previewItems}</div>
+${giving && shop.giving.receiptText ? `<p class="note">${esc(shop.giving.receiptText)}</p>` : ''}
 <p class="msg" data-shop-msg role="status" aria-live="polite"></p>
-<p class="note">${esc(studio)} is the seller: it sets these prices, answers for refunds and receives the money through its own Stripe account. Homie takes nothing. ${refundWords(shop)} <a href="/shop/refunds/">refunds</a>. Stripe keeps your card and email and sends your receipt; ${esc(studio)} never sees them.</p>
+<p class="note">${giving ? `${esc(studio)} receives your gift through its own Stripe account. Stripe emails the payment receipt.` : `${esc(studio)} is the seller: it sets these prices, answers for refunds and receives the money through its own Stripe account. Homie takes nothing. ${refundWords(shop)} <a href="/shop/refunds/">refunds</a>. Stripe keeps your card and email and sends your receipt; ${esc(studio)} never sees them.`}</p>
 </section>
 <script type="application/json" id="shop-boot">${JSON.stringify(boot).replace(/</g, '\\u003c')}</script>
 <script src="/_homie/shop.js" defer></script>`;
@@ -81,13 +85,13 @@ ${mode === 'test' ? '<p class="test">TEST MODE: no real money moves (Stripe test
 export function thanksPage(cat, shop, { session = null, game = null } = {}) {
   const studio = cat.studio?.name ?? 'Studio';
   const g = game ? (cat.games ?? []).find((x) => x.id === game) : null;
-  const boot = { thanks: session, game: g ? g.id : null, studio };
+  const boot = { giving: Boolean(shop.giving), thanks: session, game: g ? g.id : null, studio };
   const main = `<section class="shop" data-shop-thanks>
 <p class="kicker">${esc(studio)}</p>
 <h1 data-thanks-title>Thank you</h1>
-<p class="lead" data-thanks-line>Stripe is confirming the payment. This page says when it is yours (a few seconds).</p>
+<p class="lead" data-thanks-line>Stripe is confirming the payment. ${shop.giving ? 'Thank you for supporting our work.' : 'This page says when it is yours (a few seconds).'}</p>
 <p>${g ? `<a class="btn" href="/${esc(g.id)}/play">Back to ${esc(g.name)}</a>` : '<a class="btn" href="/">Back to the studio</a>'} <a href="/account/">Your account</a></p>
-<p class="note">Your receipt comes from Stripe by email. ${refundWords(shop)}</p>
+<p class="note">Your receipt comes from Stripe by email. ${shop.giving ? esc(shop.giving.receiptText ?? '') : refundWords(shop)}</p>
 </section>
 <script type="application/json" id="shop-boot">${JSON.stringify(boot).replace(/</g, '\\u003c')}</script>
 <script src="/_homie/shop.js" defer></script>`;
@@ -97,6 +101,7 @@ export function thanksPage(cat, shop, { session = null, game = null } = {}) {
 /** The refund policy (Stripe asks every seller for one; the kit's is generous by default). */
 export function refundsPage(cat, shop) {
   const studio = cat.studio?.name ?? 'Studio';
+  if (shop.giving) return layout(cat, { title: `Giving · ${studio}`, page: 'shop', main: `<section class="shop"><h1>Giving</h1><p>For questions about your gift, contact ${esc(studio)}.</p><p>${esc(shop.giving.receiptText ?? '')}</p></section>` });
   const main = `<section class="shop">
 <p class="kicker">${esc(studio)}</p>
 <h1>Refunds</h1>
@@ -182,9 +187,10 @@ export const SHOP_JS = String.raw`(function () {
     cartBox.appendChild(checkout);
   }
   function draw(s) {
+    if (boot.preview && !s.open) return;
     list.textContent = '';
     if (!s.ok) { list.appendChild(el('p', null, s.message || 'The shop did not answer.')); return; }
-    if (!s.open) { list.appendChild(el('p', null, s.kids ? 'Nothing is sold here.' : 'The shop is not open yet.')); return; }
+    if (!s.open) { list.appendChild(el('p', null, s.kids ? 'Nothing is sold here.' : 'Connect the organisation’s Stripe account to open giving or sales.')); return; }
     var age = $('[data-shop-age]');
     var needsAge = s.items.some(function (i) { return i.way === 'age-question'; });
     if (age) {
@@ -217,7 +223,7 @@ export const SHOP_JS = String.raw`(function () {
           if (i.max !== null) amount.setAttribute('max', String(i.max / s.currencyScale));
           act.appendChild(amount);
         }
-        var b = el('button', { type: 'button', class: 'buy' }, i.price === 'choose' ? 'Give on Stripe' : 'Buy on Stripe');
+        var b = el('button', { type: 'button', class: 'buy' }, boot.giving || i.kind === 'donation' || i.price === 'choose' ? 'Give on Stripe' : 'Buy on Stripe');
         b.addEventListener('click', function () {
           b.disabled = true; say('Opening Stripe…');
           api('POST', '/api/shop/buy', { item: i.id, game: boot.game || undefined, amount: amount ? units(amount.value, s.currencyScale) : undefined }).then(function (r) {
@@ -230,7 +236,7 @@ export const SHOP_JS = String.raw`(function () {
         var add = el('button', { type: 'button', class: 'plain' }, 'Add to cart');
         add.onclick = function () { cart.push({ item: i.id, name: i.name, quantity: Number(quantity.value), amount: amount ? units(amount.value, s.currencyScale) : undefined }); drawCart(); };
         if (!s.keyless) { act.appendChild(quantity); act.appendChild(add); }
-        else if (i.price !== 0) act.appendChild(el('p', { class: 'note' }, i.price === 'choose' ? 'Choose your amount on Stripe.' : 'Confirm quantity on Stripe. Buy different items separately.'));
+        else if (i.price !== 0) act.appendChild(el('p', { class: 'note' }, i.price === 'choose' ? 'Choose your amount on Stripe.' : boot.giving ? 'Confirm your gift on Stripe.' : 'Confirm quantity on Stripe. Buy different items separately.'));
       } else if (i.way === 'owned') {
         act.appendChild(el('span', { class: 'owned' }, 'Yours ✓'));
       } else if (i.way === 'make-an-account') {
@@ -255,7 +261,7 @@ export const SHOP_JS = String.raw`(function () {
       list.appendChild(card);
     });
     if (s.nextCursor) { var next = el('button', { type: 'button' }, 'Next items'); next.onclick = function () { load(s.nextCursor); }; list.appendChild(next); }
-    if (!s.items.length) list.appendChild(el('p', null, 'Nothing for sale here right now.'));
+    if (!s.items.length) list.appendChild(el('p', null, boot.giving ? 'No gift options are available right now.' : 'Nothing for sale here right now.'));
     if (boot.item) { var at = document.getElementById('item-' + boot.item); if (at && at.scrollIntoView) at.scrollIntoView({ block: 'center' }); }
   }
   function load(cursor) { api('GET', '/api/shop' + q + (q ? '&' : '?') + 'cursor=' + encodeURIComponent(cursor || '')).then(draw).catch(function () { draw({ ok: false }); }); }
@@ -276,9 +282,9 @@ export const SHOP_JS = String.raw`(function () {
     (function poll() {
       tries += 1;
       api('GET', '/api/shop/order?session=' + encodeURIComponent(boot.thanks)).then(function (r) {
-        if (r.status === 'paid') { returnToPage(false); $('[data-thanks-title]').textContent = 'It\'s yours'; $('[data-thanks-line]').textContent = 'Paid. It is on your account now, in every game of ' + boot.studio + ' that uses it.'; return; }
+        if (r.status === 'paid') { returnToPage(false); $('[data-thanks-title]').textContent = boot.giving ? 'Thank you for your gift' : 'It\'s yours'; $('[data-thanks-line]').textContent = boot.giving ? 'Your gift is confirmed. Your receipt comes from Stripe by email.' : 'Paid. It is on your account now, in every game of ' + boot.studio + ' that uses it.'; return; }
         if (tries < 40) setTimeout(poll, 1500);
-        else $('[data-thanks-line]').textContent = 'Stripe has not confirmed it yet. It will be on your account as soon as it does; your receipt comes by email.';
+        else $('[data-thanks-line]').textContent = boot.giving ? 'Stripe has not confirmed your gift yet. Check your email for its receipt.' : 'Stripe has not confirmed it yet. It will be on your account as soon as it does; your receipt comes by email.';
       }).catch(function () { if (tries < 40) setTimeout(poll, 3000); });
     })();
   }
@@ -459,7 +465,7 @@ export const SHOP_SHELL_JS = String.raw`(function () {
         listBox.appendChild(row);
       });
       if (s.nextCursor) { var next = el('button', { type: 'button' }, 'Next items'); next.onclick = function () { loadItems(s.nextCursor); }; listBox.appendChild(next); }
-      if (!s.items.length) listBox.appendChild(el('p', { class: 'sub' }, 'Nothing for sale here right now.'));
+      if (!s.items.length) listBox.appendChild(el('p', { class: 'sub' }, boot.giving ? 'No gift options are available right now.' : 'Nothing for sale here right now.'));
     }).catch(function () { listBox.appendChild(el('p', { class: 'sub' }, 'The shop did not answer.')); });
     }
     loadItems('');

package/worker/shop-rules.mjs

@@ -169,6 +169,7 @@ export function checkShop(raw, { games = null, audience = 'general', studioName
       if (why) err(`${at}.price`, why);
       else price = numeric(it.price);
     }
+    if (it.interval !== undefined && (it.interval !== 'month' || chosen)) err(`${at}.interval`, 'monthly gifts need a fixed suggested amount');
     const charge = chosen ? min : price;
     if (currencyScale(currency) === 1000 && charge % 10) warnings.push({ at: `${at}.price`, message: 'This three-decimal amount uses the smallest minor unit. Confirm support with your Stripe payment method; Stripe decides acceptance (https://docs.stripe.com/currencies).' });
     if (charge > 0 && charge < minimumCharge(currency)) warnings.push({ at: `${at}.price`, message: `Stripe's minimum for settlement in ${currency.toUpperCase()} is ${money(minimumCharge(currency), currency)}. Your settlement currency and payment method determine the actual minimum at checkout.` });
@@ -196,10 +197,10 @@ export function checkShop(raw, { games = null, audience = 'general', studioName
     const advantage = it.advantage === true;
     const badge = gives.find((g) => g.startsWith('badge:'));
     for (const key of Object.keys(it)) {
-      if (!['id', 'kind', 'name', 'blurb', 'description', 'price', 'min', 'max', 'gives', 'badge', 'days', 'starts', 'ends', 'game', 'taxCode', 'advantage'].includes(key)) warnings.push({ at: `${at}.${key}`, message: 'This field is not published by the shop. Describe any buyer-facing meaning in blurb so buyers can read it.' });
+      if (!['id', 'kind', 'name', 'blurb', 'description', 'interval', 'price', 'min', 'max', 'gives', 'badge', 'days', 'starts', 'ends', 'game', 'taxCode', 'advantage'].includes(key)) warnings.push({ at: `${at}.${key}`, message: 'This field is not published by the shop. Describe any buyer-facing meaning in blurb so buyers can read it.' });
     }
     items.push({
-      id, kind, name, ...(blurb ? { blurb } : {}),
+      id, kind, name, ...(it.interval === 'month' ? { interval: 'month' } : {}), ...(blurb ? { blurb } : {}),
       ...(chosen ? { price: 'choose', min, max } : { price }),
       gives, ...(badge ? { badge: badgeWord(badge, it) } : {}),
       ...(days !== null ? { days } : {}), ...(Number.isFinite(starts) ? { starts: new Date(starts).toISOString() } : {}), ...(Number.isFinite(ends) ? { ends: new Date(ends).toISOString() } : {}),
@@ -236,7 +237,7 @@ export function checkShop(raw, { games = null, audience = 'general', studioName
   const finalTill = kids ? 'off' : TILLS.includes(till) ? till : 'off';
   if (kids && till !== 'off') warnings.push({ at: 'till', message: 'studio.json says "audience": "kids": the studio sells nothing in its games (the till is off under policy.kidsStudio).' });
   const shop = {
-    v: 1, policy, purchasesTill: TILLS.includes(raw.purchasesTill ?? till) ? (raw.purchasesTill ?? till) : 'off', ...(/^https:\/\/billing\.stripe\.com\/p\/login\/[A-Za-z0-9_]+$/.test(raw.purchasesPortalLogin ?? '') ? { purchasesPortalLogin: raw.purchasesPortalLogin } : {}), checkoutMinutes, requestBytes, automaticTax: raw.automaticTax === true, referralNewPlayersOnly: raw.referralNewPlayersOnly === true, guestBuyersPerAddressPerHour, purchaseAttemptsPerMinute, purchaseAttemptsPerAddressPerMinute, till: finalTill, currency: CURRENCY.test(currency) ? currency : 'usd', refundDays, capPerPlayerMonth: cap, items, referrals,
+    v: 1, ...(isObj(raw.giving) ? { giving: { receiptText: String(raw.giving.receiptText ?? '') } } : {}), policy, purchasesTill: TILLS.includes(raw.purchasesTill ?? till) ? (raw.purchasesTill ?? till) : 'off', ...(/^https:\/\/billing\.stripe\.com\/p\/login\/[A-Za-z0-9_]+$/.test(raw.purchasesPortalLogin ?? '') ? { purchasesPortalLogin: raw.purchasesPortalLogin } : {}), checkoutMinutes, requestBytes, automaticTax: raw.automaticTax === true, referralNewPlayersOnly: raw.referralNewPlayersOnly === true, guestBuyersPerAddressPerHour, purchaseAttemptsPerMinute, purchaseAttemptsPerAddressPerMinute, till: finalTill, currency: CURRENCY.test(currency) ? currency : 'usd', refundDays, capPerPlayerMonth: cap, items, referrals,
     open: finalTill !== 'off' && items.length > 0, ...(kids ? { audience: 'kids' } : {}), ...(catalog.length ? { catalog } : {}),
   };
   // https://docs.stripe.com/api/checkout/sessions/create#create_checkout_session-custom_text-submit-message

package/worker/site.mjs

@@ -555,6 +555,8 @@ export function sectionsOf(cat) {
   const games = (cat.games ?? []).some((g) => g.kind !== 'app');
   const apps = (cat.games ?? []).some((g) => g.kind === 'app');
   return [
+    ...(cat.site?.pages ?? []).filter(p => /^\/[a-z0-9][a-z0-9._-]*\/$/.test(p) && !['/shop/', '/apps/', '/games/', '/rooms/', '/posts/', '/music/', '/videos/', '/lounge/'].includes(p)).map(p => ({ key: p, href: p, label: p.slice(1, -1).replaceAll('-', ' ').replace(/^./, c => c.toUpperCase()) })),
+    cat.shop && { key: 'shop', href: '/shop/', label: cat.shop.giving ? 'Give' : 'Shop' },
     apps && { key: 'apps', href: '/apps/', label: 'Apps' },
     games && { key: 'games', href: '/games/', label: 'Games' },
     (cat.songs ?? []).length > 0 && { key: 'music', href: '/music/', label: 'Music' },
@@ -859,11 +861,11 @@ export function homePage(cat, { origin = '', rooms = [], live = {} } = {}) {
   <div class="hero-copy">
     <p class="kicker">${esc(tagline || 'A Homie studio')}</p>
     <h1 class="title ${titleClass(name)}" id="hero-title">${esc(name)}</h1>
-    <p class="line">First game coming soon.</p>
+    <p class="line">${['business', 'cause', 'app'].includes(cat.studio?.kind) ? 'Your app is coming soon.' : 'First game coming soon.'}</p>
     <p class="live"><span class="live-dot" aria-hidden="true"></span><span>${posts.length ? 'In the making · the latest news is below' : 'In the making'}</span></p>
   </div>
 </section>`;
-    const next = [
+    const next = ['business', 'cause', 'app'].includes(cat.studio?.kind) ? [['Apps', 'Your live app', 'Open it on a phone, wall or staff tablet.'], ['Pages', 'Your own pages', 'Services, events and information for your community.']] : [
       ['Games', 'The first game', 'It opens here with a Play button: a live public room on a phone, a computer or a TV, with bots in the empty seats.'],
       ['Posts', 'News and drops', 'The studio\'s posts land on this page, with feeds to follow.'],
       ['Music and videos', 'Songs and trailers', 'Scores, songs and trailers get pages of their own.'],

package/worker/version.mjs

@@ -1,2 +1,2 @@
 /** The @homie-rocks/studio version this Worker code is (package.json's; a test keeps them equal). Cache-busts /_homie/site.js. */
-export const STUDIO_VERSION_TAG = '0.48.3';
+export const STUDIO_VERSION_TAG = '0.49.0';