ux: Add click feedback (+1) and stabilize side-by-side layout

dashboard/app.js

@@ -51,7 +51,7 @@ async function updateState() {
         if (!response.ok) throw new Error('API Unreachable');
         const data = await response.json();
         
-        currentDay = data.step; // Track current step for arrival calculation
+        currentDay = data.step; 
         
         const status = document.getElementById('connection-status');
         status.textContent = 'ONLINE';
@@ -62,7 +62,7 @@ async function updateState() {
         document.getElementById('chips-count').textContent = data.inventory.chips;
         document.getElementById('sensors-count').textContent = data.inventory.sensors;
 
-        // Update Cart (Active Shipments)
+        // Update Cart
         const cartContainer = document.getElementById('cart-container');
         if (data.active_shipments && data.active_shipments.length > 0) {
             cartContainer.innerHTML = data.active_shipments.map(ship => `
@@ -110,8 +110,8 @@ const modeSelect = document.getElementById('mode-select');
 function updatePreview() {
     const mode = modeSelect.value;
     const s = SPECS[mode];
-    const cost = 10 * 5 * s.cost;
-    const carbon = 5 * s.carbon;
+    const cost = 10 * 1 * s.cost; // Qty 1 now
+    const carbon = 1 * s.carbon;
 
     document.getElementById('preview-cost').textContent = `$${cost.toFixed(0)}`;
     document.getElementById('preview-carbon').textContent = `+${carbon.toFixed(1)}kg CO2`;
@@ -119,6 +119,16 @@ function updatePreview() {
 
 modeSelect.addEventListener('change', updatePreview);
 
+function spawnFeedback(text, x, y) {
+    const el = document.createElement('div');
+    el.className = 'floating-feedback';
+    el.textContent = text;
+    el.style.left = `${x}px`;
+    el.style.top = `${y}px`;
+    document.body.appendChild(el);
+    setTimeout(() => el.remove(), 1000);
+}
+
 function log(message, type = 'system') {
     const box = document.getElementById('activity-log');
     const entry = document.createElement('p');
@@ -128,14 +138,16 @@ function log(message, type = 'system') {
 }
 
 // Global Execute Function
-window.execute = async function(type) {
+window.execute = async function(type, event) {
     document.querySelector('main').classList.add('transitioning');
     
     let actionObj = { action_type: type };
     if (type === 'order_parts') {
-        actionObj.part_type = document.getElementById('part-select').value;
+        const part = document.getElementById('part-select').value;
+        spawnFeedback(`+1 ${part} added to order`, event.clientX, event.clientY);
+        actionObj.part_type = part;
         actionObj.mode = document.getElementById('mode-select').value;
-        actionObj.quantity = 5; 
+        actionObj.quantity = 1; // Change to 1 as requested
     } else if (type === 'produce') {
         actionObj.product = document.getElementById('product-select').value;
     } else if (type === 'offset') {
@@ -238,7 +250,7 @@ async function triggerSuezJam() {
     }
 }
 
-document.getElementById('skip-btn').addEventListener('click', () => window.execute('skip'));
+document.getElementById('skip-btn').addEventListener('click', (e) => window.execute('skip', e));
 document.getElementById('trigger-btn').addEventListener('click', triggerSuezJam);
 document.getElementById('reset-btn').addEventListener('click', manualReset);