@oddessentials/agent-guild 1.29.0 → 1.30.0

package/web/app.js

@@ -202,7 +202,7 @@ function holdToast(held) {
 const firstClick = (run) => (e) => { if (e.detail < 2) run(); };
 
 /** Buttons that act through the session manager. While it cannot be reached they are unavailable rather than left to fail. */
-const MANAGER_ACTIONS = '.provider :is(.new, .existing, .install, .update), .session-card :is(.resume, .rename, .stop, .remove), .history-resume, #panel-stop, #yard-install, #yard-world button, .break-install';
+const MANAGER_ACTIONS = '.provider :is(.new, .existing, .install, .update), .session-card :is(.resume, .rename, .stop, .remove), .history-resume, #panel-stop, #yard-install, #yard-customize-open, .break-install';
 
 function paintManagerActions(root = document) {
   for (const button of root.querySelectorAll(MANAGER_ACTIONS)) button.disabled = !state.connected;
@@ -1435,15 +1435,19 @@ const FOLDER_FIELDS = {
   cwd: { title: 'Choose working folder', input: 'cwd' },
   clone: { title: 'Choose clone folder', input: 'github-parent' },
   world: { title: 'Choose a world file', input: null },
+  character: { title: 'Choose a character', input: null },
+  companion: { title: 'Choose a companion', input: null },
 };
 const WORLD_FOLDER_KEY = 'agentGuild.worldFolder';
+const PIECE_FOLDER_KEY = 'agentGuild.pieceFolder';
+const PIECE_FIELDS = ['character', 'companion'];
 const folderView = { field: null, listing: null, loading: false, error: null, request: 0, opener: null };
 
-function chooseFolder(field, skin = null) {
+function chooseFolder(field, skin = null, slot = null) {
   if (!state.connected) return;
   const dialog = $('folder-browser');
-  Object.assign(folderView, { field, skin, listing: null, loading: false, error: null });
-  $('folder-use').hidden = $('folder-new-open').hidden = field === 'world';
+  Object.assign(folderView, { field, skin, slot, listing: null, loading: false, error: null, toWorkshop: PIECE_FIELDS.includes(field) && !load(PIECE_FOLDER_KEY) });
+  $('folder-use').hidden = $('folder-new-open').hidden = field === 'world' || PIECE_FIELDS.includes(field);
   $('folder-title').textContent = FOLDER_FIELDS[field].title;
   $('folder-filter').value = '';
   $('folder-hidden').checked = load(HIDDEN_FOLDERS_KEY) === '1';
@@ -1451,7 +1455,7 @@ function chooseFolder(field, skin = null) {
     folderView.opener = document.activeElement;
     dialog.showModal();
   }
-  browseTo(field === 'world' ? load(WORLD_FOLDER_KEY) ?? '' : $(FOLDER_FIELDS[field].input).value.trim());
+  browseTo(field === 'world' ? load(WORLD_FOLDER_KEY) ?? '' : PIECE_FIELDS.includes(field) ? load(PIECE_FOLDER_KEY) ?? '' : $(FOLDER_FIELDS[field].input).value.trim());
 }
 
 function showNewFolder(open) {
@@ -1505,8 +1509,13 @@ async function browseTo(dir) {
   folderView.error = null;
   renderFolderBrowser();
   try {
-    const listing = await api('GET', `/folders?path=${encodeURIComponent(dir)}${folderView.field === 'world' ? '&files=agworld' : ''}`);
+    const listing = await api('GET', `/folders?path=${encodeURIComponent(dir)}${folderView.field === 'world' ? '&files=agworld' : PIECE_FIELDS.includes(folderView.field) ? `&pieces=${folderView.field}` : ''}`);
     if (request !== folderView.request) return;
+    if (folderView.toWorkshop && listing.workshop && listing.path !== listing.workshop) {
+      folderView.toWorkshop = false;
+      return browseTo(listing.workshop);
+    }
+    folderView.toWorkshop = false;
     folderView.listing = listing;
     $('folder-filter').value = '';
   } catch (err) {
@@ -1534,6 +1543,8 @@ function renderFolderBrowser() {
   $('folder-roots').replaceChildren(...(listing?.roots ?? []).map((root) => button(root.name, () => browseTo(root.path), 'btn folder-chip')));
   $('folder-up').disabled = loading || !listing?.parent;
   $('folder-home').disabled = loading;
+  $('folder-workshop').hidden = !listing?.workshop;
+  $('folder-workshop').disabled = loading;
   const note = $('folder-note');
   note.hidden = !listing?.note;
   note.textContent = listing?.note ? `${listing.note} was not found, so this shows the nearest folder that exists.` : '';
@@ -1547,12 +1558,20 @@ function renderFolderBrowser() {
     const row = button(file.name, () => useWorldFile(file.path), 'folder-row folder-file');
     row.title = file.path;
     return row;
+  }), ...(listing?.pieces ?? []).filter((piece) => !query || piece.title.toLowerCase().includes(query) || piece.folder.toLowerCase().includes(query)).map((piece) => {
+    const row = button('', () => { if (!piece.problem) usePiece(piece.path); }, 'folder-row folder-piece');
+    if (piece.problem) row.setAttribute('aria-disabled', 'true');
+    row.append(Object.assign(document.createElement('span'), { className: 'folder-piece-title', textContent: piece.title }),
+      Object.assign(document.createElement('span'), { className: 'folder-piece-sub', textContent: piece.problem ? `${piece.folder} · ${piece.problem}` : `${folderView.field === 'character' ? 'Character' : 'Companion'} · ${piece.folder}` }));
+    row.title = piece.path;
+    return row;
   }));
   const status = $('folder-status');
   status.textContent = loading ? 'Loading folders…'
     : error ? error
       : !listing ? ''
-        : listing.files?.length ? ''
+        : listing.files?.length || listing.pieces?.length ? ''
+        : PIECE_FIELDS.includes(folderView.field) ? `No ${folderView.field === 'character' ? 'characters' : 'companions'} here or in the folders inside it. Steam keeps Workshop items in its library under steamapps › workshop › content › 5462970.`
         : !entries.length ? (folderView.field === 'world' ? 'No world files here.' : listing.entries.length ? 'No folders match.' : 'No folders here.')
           : listing.truncated ? `Showing the first ${listing.entries.length.toLocaleString()} folders.` : '';
   status.classList.toggle('error', Boolean(error));
@@ -1562,17 +1581,19 @@ function renderFolderBrowser() {
   $('folder-new-create').disabled = loading || !listing || !$('folder-new-name').value.trim();
 }
 
-async function yardWorldChange(request) {
-  const buttons = document.querySelectorAll('#yard-world button');
-  for (const item of buttons) item.disabled = true;
+async function yardChange(request, row = true) {
+  state.yardBusy = row;
+  notifyViews();
   try {
-    // The new state arrives as yard-worlds.updated.
     await request();
+    return true;
   } catch (err) {
-    if (err instanceof AuthError) return showAuth(err.message);
-    toast(err.message, 8000);
+    if (err instanceof AuthError) showAuth(err.message);
+    else toast(err.message, 8000);
+    return false;
   } finally {
-    for (const item of buttons) item.disabled = !state.connected;
+    state.yardBusy = false;
+    notifyViews();
   }
 }
 
@@ -1580,7 +1601,13 @@ function useWorldFile(file) {
   const { skin, listing } = folderView;
   $('folder-browser').close();
   save(WORLD_FOLDER_KEY, listing.path);
-  return yardWorldChange(() => api('PUT', `/yard-worlds/${skin}`, { path: file }));
+  return yardChange(() => api('PUT', `/yard-worlds/${skin}`, { path: file }), `${skin}/world`);
+}
+
+async function usePiece(folder) {
+  const { skin, slot, listing } = folderView;
+  $('folder-browser').close();
+  if (await yardChange(() => api('PUT', `/yard-pieces/${skin}/${slot}`, { path: folder }), `${skin}/${slot}`)) save(PIECE_FOLDER_KEY, listing.path);
 }
 
 function folderBrowserClosed() {
@@ -7909,6 +7936,7 @@ function closeDialogs() {
   closeFlags();
   closeMemory();
   if ($('folder-browser').open) $('folder-browser').close();
+  if ($('yard-customize').open) $('yard-customize').close();
   yardUi?.closePhoto();
   // An open question is answered as cancelled.
   if ($('ask').open) $('ask').close();
@@ -8058,6 +8086,7 @@ function connectEvents() {
       $('yard-install').hidden = !['win32', 'darwin'].includes(state.platform);
       $('yard-world-get').hidden = state.platform !== 'win32';
       state.yardWorlds = msg.yardWorlds ?? null;
+      state.yardPieces = msg.yardPieces ?? null;
       state.remoteAccessUI?.setAvailable(msg.remoteAccess);
       state.remoteAccessUI?.signInsUpdated();
       state.glassesLinkUI?.setAvailable(msg.remoteAccess);
@@ -8102,6 +8131,9 @@ function connectEvents() {
     } else if (msg.type === 'yard-worlds.updated') {
       state.yardWorlds = msg.yardWorlds;
       notifyViews();
+    } else if (msg.type === 'yard-pieces.updated') {
+      state.yardPieces = msg.yardPieces;
+      notifyViews();
     } else if (msg.type === 'yard.fireworks') {
       yardUi?.celebrate();
     } else if (msg.type === 'news.updated') {
@@ -8845,6 +8877,7 @@ $('folder-browser').addEventListener('keydown', folderBrowserKeys);
 $('folder-list').addEventListener('keydown', moveInFolders);
 $('folder-up').addEventListener('click', () => browseTo(folderView.listing.parent));
 $('folder-home').addEventListener('click', () => browseTo('~'));
+$('folder-workshop').addEventListener('click', () => browseTo(folderView.listing.workshop));
 $('folder-filter').addEventListener('input', renderFolderBrowser);
 $('folder-hidden').addEventListener('change', (e) => {
   save(HIDDEN_FOLDERS_KEY, e.target.checked ? '1' : null);
@@ -8937,7 +8970,12 @@ yardUi = initYard({
   yardWorld: (skin) => state.yardWorlds?.[skin] ?? null,
   canReplaceYard: () => Boolean(state.yardWorlds),
   replaceYard: (skin) => chooseFolder('world', skin),
-  restoreYard: (skin) => yardWorldChange(() => api('DELETE', `/yard-worlds/${skin}`)),
+  restoreYard: (skin) => yardChange(() => api('DELETE', `/yard-worlds/${skin}`)),
+  yardPieces: (skin) => state.yardPieces?.[skin] ?? {},
+  yardBusy: () => Boolean(state.yardBusy),
+  yardChecking: () => (typeof state.yardBusy === 'string' ? state.yardBusy : null),
+  replacePiece: (skin, slot) => chooseFolder(slot === 'companion' ? 'companion' : 'character', skin, slot),
+  restorePiece: (skin, slot) => yardChange(() => api('DELETE', `/yard-pieces/${skin}/${slot}`)),
   // The new state arrives as yard-art.updated, ordered with the progress events.
   yardArtAction: (action) => api('POST', `/yard-art/${action}`),
   mountInspector(host, selection) {

package/web/index.html

@@ -151,7 +151,7 @@
           <div class="yard-overlay">
             <div id="yard-loading" class="yard-loading" role="status" data-mode="scene"><span id="yard-loading-text">Preparing your yard…</span><span id="yard-loading-size" class="yard-loading-size" aria-hidden="true"></span><span class="yard-loading-bar" aria-hidden="true"></span></div>
             <div id="yard-swap-failure" class="yard-swap-failure" hidden role="status"><span id="yard-swap-failure-text"></span><button id="yard-swap-retry" class="btn" type="button">Retry</button></div>
-            <div class="yard-bar"><div id="yard-world" class="yard-world" role="group" aria-label="This Yard's world"><p id="yard-world-note" class="yard-world-note" role="status" hidden></p><div class="yard-world-actions"><button id="yard-world-restore" type="button" class="btn" hidden>Restore original</button><button id="yard-world-replace" type="button" class="btn">Replace this Yard</button><a id="yard-world-get" class="btn" href="https://github.com/oddessentials/agent-guild-builders/releases/latest" target="_blank" rel="noopener noreferrer" hidden>Build a world</a></div></div><div class="yard-camera" role="group" aria-label="Yard controls"><button id="yard-zoom-in" type="button" class="btn" aria-label="Zoom in">+</button><button id="yard-zoom-out" type="button" class="btn" aria-label="Zoom out">−</button><button id="yard-fit" type="button" class="btn">Overview</button><button id="yard-focus" type="button" class="btn" disabled>Focus selected</button><button id="yard-photo" type="button" class="btn" aria-haspopup="dialog" aria-label="Save a picture of the Yard" title="Save a picture of the Yard" disabled hidden><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M4 8.5A1.5 1.5 0 0 1 5.5 7h2.3l1.4-2h5.6l1.4 2h2.3A1.5 1.5 0 0 1 20 8.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 17.5z"/><circle cx="12" cy="12.75" r="3.25"/></svg></button><button id="yard-fireworks" type="button" class="btn" aria-label="Fireworks in this Yard only" title="Fireworks in this Yard only" disabled><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" aria-hidden="true" focusable="false"><path d="M12 3v3m0 9v6M3 10h3m12 0h3M5.6 3.6l2.2 2.2m8.4 8.4 2.2 2.2M18.4 3.6l-2.2 2.2m-8.4 8.4-2.2 2.2"/><circle cx="12" cy="10" r="1"/></svg></button></div></div>
+            <div class="yard-bar"><div id="yard-world" class="yard-world" role="group" aria-label="This Yard's world"><p id="yard-world-note" class="yard-world-note" role="status" hidden></p><div class="yard-world-actions"><button id="yard-customize-open" type="button" class="btn" aria-haspopup="dialog">Customize this Yard</button><a id="yard-world-get" class="btn" href="https://github.com/oddessentials/agent-guild-builders/releases/latest" target="_blank" rel="noopener noreferrer" hidden>Build a Yard</a></div></div><div class="yard-camera" role="group" aria-label="Yard controls"><button id="yard-zoom-in" type="button" class="btn" aria-label="Zoom in">+</button><button id="yard-zoom-out" type="button" class="btn" aria-label="Zoom out">−</button><button id="yard-fit" type="button" class="btn">Overview</button><button id="yard-focus" type="button" class="btn" disabled>Focus selected</button><button id="yard-photo" type="button" class="btn" aria-haspopup="dialog" aria-label="Save a picture of the Yard" title="Save a picture of the Yard" disabled hidden><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M4 8.5A1.5 1.5 0 0 1 5.5 7h2.3l1.4-2h5.6l1.4 2h2.3A1.5 1.5 0 0 1 20 8.5v9a1.5 1.5 0 0 1-1.5 1.5h-13A1.5 1.5 0 0 1 4 17.5z"/><circle cx="12" cy="12.75" r="3.25"/></svg></button><button id="yard-fireworks" type="button" class="btn" aria-label="Fireworks in this Yard only" title="Fireworks in this Yard only" disabled><svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" aria-hidden="true" focusable="false"><path d="M12 3v3m0 9v6M3 10h3m12 0h3M5.6 3.6l2.2 2.2m8.4 8.4 2.2 2.2M18.4 3.6l-2.2 2.2m-8.4 8.4-2.2 2.2"/><circle cx="12" cy="10" r="1"/></svg></button></div></div>
             <p id="yard-help"><span class="yard-help-pointer">Drag to explore · Scroll to zoom · Select to inspect · Double-click a session to open</span><span class="yard-help-touch">Drag to explore · Pinch to zoom · Tap to inspect · Open from the Inspector</span></p>
           </div>
         </div>
@@ -742,6 +742,18 @@
     </div>
   </dialog>
 
+  <dialog id="yard-customize" class="models yard-customize" aria-labelledby="yard-customize-title">
+    <div class="models-bar">
+      <div class="models-heading">
+        <h2 id="yard-customize-title">Customize this Yard</h2>
+        <p id="yard-customize-sub" class="sub"></p>
+      </div>
+      <button id="yard-customize-close" class="btn" type="button">Close</button>
+    </div>
+    <div class="models-body">
+      <ul id="yard-customize-list" class="flags-list" aria-label="This Yard's world, characters and companion"></ul>
+    </div>
+  </dialog>
   <dialog id="folder-browser" class="models folder-browser" aria-labelledby="folder-title">
     <div class="models-bar">
       <div class="models-heading">
@@ -754,6 +766,7 @@
     <div class="history-tools folder-places">
       <button id="folder-up" class="btn" type="button">Up</button>
       <button id="folder-home" class="btn folder-chip" type="button">Home</button>
+      <button id="folder-workshop" class="btn folder-chip" type="button" hidden>Steam Workshop</button>
       <div id="folder-roots" class="folder-roots"></div>
       <button id="folder-new-open" class="btn folder-new-open" type="button" aria-expanded="false" aria-controls="folder-new">New folder</button>
     </div>

package/web/skins/guild/skin.css

@@ -235,13 +235,7 @@
     content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none;
     border: 54px solid transparent; border-image: url("ui/frame-ornate.png") 232;
   }
-  .models-bar { padding: 30px 36px 12px; }
-  .models-body { margin: 0 24px; padding: 0 12px 14px; }
-  .models-source { padding: 10px 36px 30px; }
-  .history-tools { padding: 10px 36px 0; }
-  .history-form { padding: 10px 36px 30px; }
-  .memory-body { margin: 0 24px 28px; }
-  .github-accounts { padding: 10px 36px; }
+  .models { padding: 32px; }
   .model-group h4, .news-day, .changelog-type { font-family: var(--font-display); letter-spacing: 0.08em; color: var(--gold-ink); }
   .news-bar { padding: 16px 18px 12px; }
   .news-filters, .news-status { padding-left: 18px; padding-right: 18px; }
@@ -259,12 +253,7 @@
 
   @media (max-width: 640px) {
     .models::after, .auth::after { border-width: 40px; }
-    .models-bar { padding: 24px 26px 10px; }
-    .models-body { margin: 0 16px; padding: 0 10px 12px; }
-    .models-source { padding: 10px 26px 24px; }
-    .history-tools { padding: 10px 26px 0; }
-    .history-form { padding: 10px 26px 24px; }
-    .github-accounts { padding: 10px 26px; }
+    .models { padding: 26px; }
     .auth { padding: 32px 30px; }
   }
 

package/web/styles.css

@@ -1408,6 +1408,20 @@ body:has(#terminal-panel:not([hidden]) .terminal-controls:not([hidden])) .toast
 .folder-row::before { content: ""; flex: none; width: 18px; height: 14px; border: 1.6px solid var(--muted); border-radius: 2px 4px 3px 3px; }
 .folder-row:hover { background: color-mix(in srgb, var(--accent) 10%, transparent); }
 .folder-row.hidden-folder { color: var(--muted); }
+.folder-row.folder-piece { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 10px; }
+.folder-row.folder-piece::before { grid-row: span 2; width: 14px; height: 14px; border-radius: 50%; border-color: var(--accent); background: color-mix(in srgb, var(--accent) 25%, transparent); }
+.folder-row.folder-piece[aria-disabled="true"] { cursor: default; background: none; color: var(--muted); }
+.folder-piece-title { font-weight: 600; }
+.folder-piece-sub { color: var(--muted); font-size: 0.8rem; }
+.yard-customize { width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); }
+.yard-customize-heading { padding: 14px 0 4px; color: var(--muted); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; }
+.yard-customize-copy { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow-wrap: anywhere; }
+.yard-customize-status, .yard-customize-note { color: var(--muted); font-size: 0.82rem; }
+.yard-customize-row[data-state="custom"] .yard-customize-status { color: var(--text); }
+.yard-customize-row[data-state="failed"] .yard-customize-status { color: var(--danger); }
+.yard-customize-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
+.yard-customize-actions .btn { min-height: 36px; }
+@media (max-width: 480px) { .flag-row.yard-customize-row { grid-template-columns: minmax(0, 1fr); } .yard-customize-actions { justify-content: flex-start; } }
 #folder-status.error { color: var(--danger); }
 .accounts-dialog { width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); }
 .accounts-list { margin: 0; padding: 0; list-style: none; }