Add multisensory accessible place details
Build and publish frontend / publish (push) Successful in 41s

This commit is contained in:
Ein Anderssono
2026-10-14 22:49:18 +02:00
parent 92741baec7
commit 4502e2406d
3 changed files with 32 additions and 1 deletions
+2
View File
@@ -4,6 +4,8 @@ This repository contains the static Swedish web client for the AI-driven life si
Players provide a character biography, not a world description. The client asks the backend to create a biography-based starting place. It does not preview a person the player may meet; encounters belong to later world exploration.
Place descriptions are available as text with separate visual, sound, smell, air/temperature, touch/surface, and spatial-orientation cues so important scene information does not depend on sight. The current product has no image input or image interpretation flow; these cues are generated as part of the place proposal.
The browser and API stay on the same public origin, `https://ai-spel.k3s.k0.nu`. The ingress routes `/` to this frontend service and routes `/api`, `/version`, and `/health` to the Rust service. That keeps the current server-side session cookie same-origin and avoids browser CORS configuration.
## Release flow
+25 -1
View File
@@ -16,6 +16,9 @@
button { justify-self: start; cursor: pointer; }
#status { min-height: 1.5em; }
.card { border: 1px solid; border-radius: .5rem; padding: 1rem; margin-block: 1rem; }
dl { display: grid; grid-template-columns: minmax(8rem, 12rem) 1fr; gap: .35rem 1rem; }
dt { font-weight: 700; }
dd { margin: 0; }
.row { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }
.row button { margin-block: .4rem; }
#transcript { min-height: 5rem; max-height: 28rem; overflow: auto; }
@@ -52,9 +55,18 @@
<button id="start-world-button" type="button">Börja spela</button>
</section>
<section id="game" hidden>
<div class="row"><h2 id="world-heading"></h2><button id="logout" type="button">Logga ut</button></div>
<div class="row"><h2 id="world-heading" tabindex="-1"></h2><button id="logout" type="button">Logga ut</button></div>
<section class="card" aria-labelledby="place-heading">
<h3 id="place-heading"></h3><p id="place-description"></p>
<h4>Platsens sinnesintryck</h4>
<dl>
<dt>Synintryck</dt><dd id="sense-visual"></dd>
<dt>Ljud</dt><dd id="sense-sound"></dd>
<dt>Dofter</dt><dd id="sense-smell"></dd>
<dt>Luft och temperatur</dt><dd id="sense-air"></dd>
<dt>Beröring och ytor</dt><dd id="sense-touch"></dd>
<dt>Orientering i rummet</dt><dd id="sense-orientation"></dd>
</dl>
<p id="place-status" role="status"></p>
<h3 id="npc-heading"></h3><p id="npc-description"></p>
<h3 id="player-heading"></h3><p id="player-biography"></p>
@@ -126,8 +138,20 @@
auth.hidden = true; characterSection.hidden = true; game.hidden = false;
worldSetup.hidden = true;
document.querySelector('#world-heading').textContent = world.name;
document.querySelector('#world-heading').focus();
document.querySelector('#place-heading').textContent = world.location.name;
document.querySelector('#place-description').textContent = world.location.description;
const senses = world.location.senses ?? {};
for (const [id, key] of [
['sense-visual', 'visual'],
['sense-sound', 'sound'],
['sense-smell', 'smell'],
['sense-air', 'air_and_temperature'],
['sense-touch', 'touch_and_surfaces'],
['sense-orientation', 'spatial_orientation'],
]) {
document.querySelector(`#${id}`).textContent = senses[key] || 'Inget särskilt intryck beskrivet.';
}
const conversation = document.querySelector('#conversation-card');
if (world.npc) {
document.querySelector('#npc-heading').textContent = world.npc.name;
+5
View File
@@ -9,6 +9,11 @@ grep -q "request('/version')" index.html
grep -q 'id="api-version"' index.html
grep -Fq "credentials: 'same-origin'" index.html
grep -q 'Köp på platsen' index.html
grep -q 'Platsens sinnesintryck' index.html
grep -q 'Orientering i rummet' index.html
grep -q "'sense-sound', 'sound'" index.html
grep -q 'id="world-heading" tabindex="-1"' index.html
grep -q "document.querySelector('#world-heading').focus()" index.html
grep -q "request('/api/purchases'" index.html
grep -q "request('/api/world/start'" index.html
if grep -Eq 'world/draft|npc_name|Person du kan möta|Beskriv vad du vill börja med' index.html; then