@bongos/core 1.19.407 → 1.19.409

package/tests/projects_hub.mjs

@@ -1399,3 +1399,112 @@ test('the joinability in-flight line shares the visibility section’s push pred
   assert.match(SCRIPT, /\$\('mJoin'\)\.addEventListener\('click'[\s\S]{0,200}data-join-save[\s\S]{0,40}doJoinSave\(\)/,
     'the Save control is wired to ITS save — a copy that left the listener on #mVis ships a dead button');
 });
+
+/* ── the planets and the field (task 1003319) — the map's orbs as the landing's
+   chrome objects in the project's accent, a per-project template with a
+   deterministic default walk, and the field brought to the world. ── */
+test('the planet templates: nine names, the walk changes shape and style each step, the catalog and the migration agree', () => {
+  const list = (SCRIPT.match(/var ORB_TEMPLATES = \[([^\]]*)\]/) || [, ''])[1];
+  const names = [...list.matchAll(/'([a-z-]+)'/g)].map((m) => m[1]);
+  assert.equal(names.length, 9);
+  assert.equal(new Set(names).size, 9, 'nine distinct templates');
+  for (const t of names) assert.match(t, /^(blob|pair|bead)-(tint|wash|chrome)$/);
+  for (let i = 1; i < names.length; i++) {
+    const [s0, y0] = names[i - 1].split('-');
+    const [s1, y1] = names[i].split('-');
+    assert.ok(s0 !== s1 && y0 !== y1, `walk step ${i} changes both shape and style`);
+  }
+  const pi = fs.readFileSync(path.join(ROOT, 'modules', 'platform-identity', 'platform-identity.js'), 'utf8');
+  const server = [...((pi.match(/const PROJECT_TEMPLATES = \[([\s\S]*?)\];/) || [, ''])[1]).matchAll(/'([a-z-]+)'/g)].map((m) => m[1]);
+  assert.deepEqual(server, names, 'the hub and the catalog walk the same list in the same order');
+  const mig = fs.readFileSync(path.join(ROOT, 'modules', 'platform-identity', 'migrations', 'platform_identity_012_project_template.sql'), 'utf8');
+  for (const t of names) assert.ok(mig.includes(`'${t}'`), `migration 012 names ${t}`);
+});
+
+test('the walk assigns the template by canonical position beside the accent; a curated template wins; the platform is the pair in chrome', () => {
+  assert.match(SCRIPT, /function assignAccents[\s\S]*?p\._acc = ORB_ACCENTS\[i % ORB_ACCENTS\.length\];\s*p\._tpl = ORB_TEMPLATES\[i % ORB_TEMPLATES\.length\];/,
+    'one walk, two assignments');
+  assert.match(SCRIPT, /function templateOf\(p\) \{\s*return ORB_TEMPLATES\.indexOf\(p\.template\) !== -1 \? p\.template : \(p\._tpl \|\| ORB_TEMPLATES\[0\]\);/,
+    'a curated name wins; an unknown name is not a choice');
+  assert.match(SCRIPT, /_acc: ORB_ACCENTS\[slugAccent\(inst\.slug\)\], _tpl: slugTemplate\(inst\.slug\)/, 'an owned-only entry walks by its slug');
+  assert.match(SCRIPT, /var tpl = templateOf\(p\), tplParts = tpl\.split\('-'\);\s*a\.setAttribute\('data-template', tpl\);\s*a\.setAttribute\('data-shape', tplParts\[0\]\);\s*a\.setAttribute\('data-style', tplParts\[1\]\);/,
+    'the orb carries its template as data attributes; the sheet does the rest');
+  assert.match(HUB, /<a class="worldOrb" id="selfOrb" href="\/" data-shape="pair" data-style="chrome" data-template="pair-chrome"/, 'the platform is its own mark');
+});
+
+test("the planet is the landing's object on the landing's crop maths: the three rectangles are byte-equal across the two sheets", () => {
+  const LANDING = fs.readFileSync(path.join(ROOT, 'public-landing', 'index.html'), 'utf8');
+  const landingCrop = (cls) => {
+    const m = LANDING.match(new RegExp(`\\.${cls}\\{[^}]*--bead-ar:([^;]+);--bead-zoom:([^;]+);--bead-px:([^;]+);--bead-py:([^;}]+)`));
+    assert.ok(m, `the landing declares .${cls}`);
+    return m.slice(1, 5).map((s) => s.trim());
+  };
+  const hubCrop = (shape) => {
+    const m = COSMOS.match(new RegExp(`\\.worldOrb\\[data-shape="${shape}"\\]\\{--tpl-src:var\\((--plate-[a-z-]+)\\);--tpl-ar:([^;]+);--tpl-zoom:([^;]+);--tpl-px:([^;]+);--tpl-py:([^;}]+)`));
+    assert.ok(m, `the hub declares the ${shape}`);
+    return { src: m[1], crop: m.slice(2, 6).map((s) => s.trim()) };
+  };
+  assert.deepEqual(hubCrop('blob').crop, landingCrop('o1'));
+  assert.equal(hubCrop('blob').src, '--plate-bead-cut');
+  assert.deepEqual(hubCrop('pair').crop, landingCrop('o2'));
+  assert.equal(hubCrop('pair').src, '--plate-bongos-cut');
+  assert.deepEqual(hubCrop('bead').crop, landingCrop('o3'));
+  assert.equal(hubCrop('bead').src, '--plate-set-cut');
+  // the plates by root-absolute token in the hub's own sheet (a url() in a custom property resolves against the document)
+  assert.match(COSMOS, /--plate-bead-cut:url\(\/assets\/world\/r2-chrome-blob-one-cut\.webp\);/);
+  assert.match(COSMOS, /--plate-bongos-cut:url\(\/assets\/world\/r2-bongos-chrome-a-cut\.webp\);/);
+});
+
+test('the style is a blend on a masked colour layer; the accent never paints the box; the ring and the spotlight follow the silhouette', () => {
+  assert.match(COSMOS, /\.worldOrb \.disc::before\{content:"";position:absolute;inset:0;\s*background-image:linear-gradient\(var\(--tpl-ink\),var\(--tpl-ink\)\),var\(--tpl-src\);/);
+  assert.match(COSMOS, /background-blend-mode:var\(--tpl-blend\),normal;\s*-webkit-mask-image:var\(--tpl-src\);mask-image:var\(--tpl-src\);/, 'the mask is the plate itself');
+  assert.match(COSMOS, /\.worldOrb\[data-style="tint"\]\{--tpl-ink:var\(--acc\);--tpl-blend:color;\}/);
+  assert.match(COSMOS, /\.worldOrb\[data-style="wash"\]\{--tpl-ink:var\(--acc\);--tpl-blend:overlay;\}/);
+  assert.match(COSMOS, /\.worldOrb\[data-style="chrome"\]\{--tpl-ink:transparent;--tpl-blend:normal;\}/);
+  assert.match(COSMOS, /\.worldOrb \.disc\{--dd:calc\(var\(--d,96px\) \* var\(--orb-scale,1\)\);width:var\(--dd\);aspect-ratio:var\(--tpl-ar,1\);position:relative;isolation:isolate;\s*filter:var\(--orb-shadow\);/,
+    "the box is --d (scaled) by the object's own aspect");
+  assert.doesNotMatch(COSMOS, /var\(--d,96px\) \* var\(--tpl-/, 'every crop calc reads the scaled width');
+  assert.match(COSMOS, /@media \(max-width:900px\)\{\s*\.field\{--orb-scale:\.8;\}/, 'narrow: the object is four fifths of its box; the physics keeps the box');
+  assert.doesNotMatch(COSMOS, /\.worldOrb \.disc\{[^}]*radial-gradient/, 'no painted ball');
+  assert.doesNotMatch(COSMOS, /\.worldOrb\[data-rel="owner"\] \.disc\{box-shadow/, 'a mask clips a box-shadow away');
+  assert.match(COSMOS, /\.worldOrb\[data-rel="owner"\] \.disc::after\{border:1\.5px solid var\(--accent\);\}/, 'the ring is a circle behind the object');
+  assert.match(COSMOS, /\.worldOrb\.match \.disc\{filter:var\(--orb-shadow\) drop-shadow\(/, 'the spotlight composes after the contact shadow');
+  assert.doesNotMatch(COSMOS, /\.worldOrb\.match \.disc\{outline/);
+  assert.match(COSMOS, /--orb-shadow:drop-shadow\(0 12px 14px color-mix\(in srgb,var\(--ink\) 22%,transparent\)\);/);
+  assert.equal((COSMOS.match(/--orb-shadow:opacity\(1\);/g) || []).length, 2, 'dark states the no-op filter in both twins');
+  assert.match(COSMOS, /\.worldOrb:hover \.disc\{translate:0 -6px;\}/, "the landing's hover rise");
+  assert.match(SCRIPT, /var discOff = disc \? \(disc\.offsetTop \+ disc\.offsetHeight \/ 2\) - el\.offsetHeight \/ 2 : 0;/,
+    "the physics measures the disc's own height: a planet's box is not square");
+});
+
+test("the field is the void: no drawn grid, no stars, no twinkle; the labels, the badge and the hint in the world's type", () => {
+  assert.doesNotMatch(COSMOS, /--grid-ink/);
+  assert.doesNotMatch(COSMOS, /\.field \.ground::after/);
+  assert.doesNotMatch(COSMOS, /--star-display/);
+  assert.doesNotMatch(COSMOS, /@keyframes twinkle/);
+  assert.doesNotMatch(HUB, /class="star"/);
+  assert.doesNotMatch(HUB, /id="mapStars"/);
+  assert.doesNotMatch(SCRIPT, /function stars\(\)/);
+  assert.match(HUB, /<div class="sky" aria-hidden="true"><\/div>/, 'the ground layer stays, empty');
+  assert.match(COSMOS, /\.worldOrb \.nm\{font-family:var\(--font-body\);font-weight:500;font-size:15px;letter-spacing:-\.015em;color:var\(--ink\);\s*text-shadow:var\(--type-halo\);/,
+    "the name in the ledger's title voice, the world's black halo");
+  assert.match(COSMOS, /\.worldOrb \.sub\{font-family:var\(--label-face\);/);
+  assert.match(COSMOS, /\.worldOrb \.badge\{[^}]*background:var\(--bg\);color:var\(--ink-faint\);border:1px solid var\(--rule\);\}/, 'a hairline pill');
+  assert.doesNotMatch(COSMOS, /\.worldOrb \.badge\{[^}]*--gold-soft/);
+  assert.doesNotMatch(COSMOS, /\.worldOrb\[data-rel="owner"\] \.badge\{background:var\(--accent\)/, 'a fact is not an accent fill (the One Warm Thing Rule)');
+  assert.match(COSMOS, /\.hintbar\{[^}]*font-family:var\(--label-face\);/);
+  assert.doesNotMatch(COSMOS, /\.hintbar\{[^}]*border-radius:999px/, 'no pill');
+  assert.doesNotMatch(COSMOS, /\.hintbar kbd\{[^}]*--accent/, 'no accent on a hint');
+  assert.doesNotMatch(COSMOS, /\.field \.hoverCard\{[^}]*box-shadow/, 'no shadow vocabulary for UI');
+});
+
+test('the kit proves the field path: the fixture carries a curated template and the states file reads it back', () => {
+  const fixture = JSON.parse(fs.readFileSync(path.join(ROOT, 'modules', 'ui-design', 'kit', 'fixtures', 'featured.json'), 'utf8'));
+  const otb = fixture.projects.find((p) => p.origin === 'https://amazonprimea.com');
+  assert.equal(otb.template, 'bead-wash');
+  assert.ok(fixture.projects.every((p) => 'template' in p), 'the wire never drops the key');
+  const states = JSON.parse(fs.readFileSync(path.join(ROOT, 'public-landing', 'projects.states.json'), 'utf8'));
+  const attrs = states.states['in-map'].expect.attr.map((a) => a.join(' '));
+  assert.ok(attrs.includes('#selfOrb data-template pair-chrome'));
+  assert.ok(attrs.some((a) => a.includes('amazonprimea.com') && a.endsWith('data-template bead-wash')), 'the curated template reaches the orb');
+});