Gear
{{if .Detail.Gear}}
@@ -133,6 +136,7 @@
Traveling light — nothing equipped.
{{end}}
+ {{end}}
{{if .MapView}}
@@ -290,6 +294,46 @@
Home
@@ -417,12 +461,22 @@
// item actually moves on the game box's next poll. So the UI never claims a change
// landed — it shows "queued" and lets the order's own status be the truth.
(function () {
- var panel = document.getElementById('gear-panel');
- if (!panel) return; // only the owner gets this panel at all
- var token = panel.getAttribute('data-token');
+ // Two owner panels can carry equip controls: the magic Worn/Backpack panel
+ // (#gear-panel) and the standard-slot management panel (#equip-panel). Either
+ // may be absent, so wire whichever exist and share one handler.
+ var gearPanel = document.getElementById('gear-panel');
+ var equipPanel = document.getElementById('equip-panel');
+ var panels = [gearPanel, equipPanel].filter(Boolean);
+ if (!panels.length) return; // only the owner gets these panels at all
+ var token = (equipPanel || gearPanel).getAttribute('data-token');
+ var balance = equipPanel ? parseFloat(equipPanel.getAttribute('data-balance') || '0') : 0;
var box = document.getElementById('equip-orders');
var list = document.getElementById('equip-orders-list');
+ function euroFmt(n) {
+ return (Math.round(n * 100) / 100).toLocaleString('en-US', { maximumFractionDigits: 2 });
+ }
+
// How each terminal status reads to the owner. gogobee only rejects when the
// item slipped out from under the order or can't be worn — a bond-cap "inert"
// is still an applied change, and its detail line says so.
@@ -431,9 +485,14 @@
applied: 'done',
rejected_not_owned: "couldn't — that item had already moved",
rejected_not_worn: "couldn't — that slot was already empty",
- rejected_not_equippable: "couldn't — that item can't be worn"
+ rejected_not_equippable: "couldn't — that item can't be worn",
+ rejected_downgrade: "couldn't — that wouldn't be an upgrade",
+ rejected_insufficient_funds: "couldn't — not enough euros",
+ rejected_max_tier: "couldn't — already at the top tier"
};
+ var VERB = { equip: 'Equip', unequip: 'Take off', upgrade: 'Upgrade', repair: 'Repair' };
+
var pollTimer = null;
function render(orders) {
@@ -445,7 +504,7 @@
if (o.status === 'pending') anyPending = true;
var li = document.createElement('li');
li.className = 'flex items-baseline justify-between gap-3';
- var verb = o.action === 'equip' ? 'Equip' : 'Take off';
+ var verb = VERB[o.action] || o.action;
var left = document.createElement('span');
left.className = 'flex-1';
left.textContent = verb + ' ' + (o.item_name || o.slot || 'item');
@@ -473,9 +532,9 @@
.catch(function () { /* transient — a later tick will do */ });
}
- panel.addEventListener('click', function (e) {
- var btn = e.target.closest('.equip-btn');
- if (!btn || btn.disabled) return;
+ // placeOrder records the intent. equip / unequip / take-off go straight here;
+ // upgrade / repair pass through askConfirm first (they spend euros).
+ function placeOrder(btn) {
btn.disabled = true;
btn.classList.add('opacity-50');
btn.textContent = 'queuing…';
@@ -486,7 +545,8 @@
token: token,
action: btn.getAttribute('data-action'),
item_id: parseInt(btn.getAttribute('data-item-id') || '0', 10),
- slot: btn.getAttribute('data-slot') || ''
+ slot: btn.getAttribute('data-slot') || '',
+ tier: parseInt(btn.getAttribute('data-tier') || '0', 10)
})
})
.then(function (r) { return r.json().then(function (j) { return { ok: r.ok, body: j }; }); })
@@ -505,7 +565,57 @@
btn.classList.remove('opacity-50');
btn.textContent = 'try again';
});
- });
+ }
+
+ // askConfirm is the money gate: an upgrade or repair debits euros on the game
+ // box, so show the cost and the resulting balance before anything is queued.
+ // Placing it here in the DOM (rather than a native dialog) keeps the page's look
+ // and never blocks the browser event loop.
+ function askConfirm(btn) {
+ var card = btn.closest('.slot-card') || btn.parentElement;
+ var existing = card.querySelector('.equip-confirm');
+ if (existing) existing.remove();
+ var cost = parseFloat(btn.getAttribute('data-cost') || '0');
+ var action = btn.getAttribute('data-action');
+ var name = btn.getAttribute('data-item-name') || 'this slot';
+ var head = action === 'upgrade' ? ('Upgrade to ' + name) : ('Repair ' + name);
+
+ var boxEl = document.createElement('div');
+ boxEl.className = 'equip-confirm mt-2 rounded-xl bg-[color:var(--ink)]/5 p-2.5 text-xs';
+ var p = document.createElement('p');
+ p.className = 'text-[color:var(--ink)]/70';
+ p.textContent = head + ' for €' + euroFmt(cost) + '? Balance €' + euroFmt(balance) + ' → €' + euroFmt(balance - cost) + '.';
+ var row = document.createElement('div');
+ row.className = 'mt-2 flex gap-1.5';
+ var yes = document.createElement('button');
+ yes.type = 'button';
+ yes.className = 'rounded-full bg-theme-adventure text-white px-2.5 py-0.5 font-semibold';
+ yes.textContent = 'Confirm · €' + euroFmt(cost);
+ yes.addEventListener('click', function () { boxEl.remove(); placeOrder(btn); });
+ var no = document.createElement('button');
+ no.type = 'button';
+ no.className = 'rounded-full border border-[color:var(--ink)]/20 text-[color:var(--ink)]/60 px-2.5 py-0.5';
+ no.textContent = 'Cancel';
+ no.addEventListener('click', function () { boxEl.remove(); });
+ row.appendChild(yes);
+ row.appendChild(no);
+ boxEl.appendChild(p);
+ boxEl.appendChild(row);
+ card.appendChild(boxEl);
+ }
+
+ function onClick(e) {
+ var btn = e.target.closest('.equip-btn');
+ if (!btn || btn.disabled) return;
+ var action = btn.getAttribute('data-action');
+ if (action === 'upgrade' || action === 'repair') {
+ askConfirm(btn); // money moves — confirm cost + balance first
+ return;
+ }
+ placeOrder(btn);
+ }
+
+ panels.forEach(function (p) { p.addEventListener('click', onClick); });
loadOrders();
})();