feat: UI Overhaul

2025-12-09 23:49:52 +00:00
parent 68271579bf
commit 07ae21973e
21 changed files with 4546 additions and 86 deletions
--- a/extension/modules/ui/components/harvest.js
+++ b/extension/modules/ui/components/harvest.js
@@ -0,0 +1,92 @@
+import { Styles, createElement } from '../ui_styles.js';
+
+export const Harvest = {
+    init(container) {
+        const MB = window.MagicBot;
+
+        const wrapper = createElement('div', Styles.panel);
+
+        // Header
+        const header = createElement('div', Styles.flexBetween + 'margin-bottom: 5px; cursor: pointer; user-select: none;', {
+            onclick: () => {
+                const section = wrapper.querySelector('#section-hv');
+                const arrow = wrapper.querySelector('#arrow-hv');
+                if (section.style.display === 'none') {
+                    section.style.display = 'block';
+                    arrow.textContent = '▼';
+                } else {
+                    section.style.display = 'none';
+                    arrow.textContent = '▶';
+                }
+            }
+        });
+        header.innerHTML = `
+            <label style="${Styles.label} cursor: pointer;">Harvest</label>
+            <span id="arrow-hv" style="font-size: 10px; color: #aaa;">▼</span>
+        `;
+
+        const content = createElement('div', '', { id: 'section-hv' });
+
+        // Range Inputs
+        const rangeGrid = createElement('div', 'display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 8px;');
+
+        const createInput = (label, id, val) => {
+            const div = createElement('div');
+            div.appendChild(createElement('span', 'font-size: 10px; color: #888;', { textContent: label }));
+            div.appendChild(createElement('input', Styles.input, { type: 'number', id, value: val }));
+            return div;
+        };
+
+        rangeGrid.appendChild(createInput('Start Slot', 'hv-start', '140'));
+        rangeGrid.appendChild(createInput('End Slot', 'hv-end', '160'));
+        content.appendChild(rangeGrid);
+
+        // Options Inputs
+        const optGrid = createElement('div', 'display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 10px;');
+        optGrid.appendChild(createInput('Iter. (Count)', 'hv-count', '1'));
+        optGrid.appendChild(createInput('Delay (ms)', 'hv-delay', '20'));
+        content.appendChild(optGrid);
+
+        // Quick Buttons for Range
+        const quickRange = createElement('div', 'display: flex; gap: 4px; margin-bottom: 8px;');
+        const addQuickBtn = (txt, s, e) => {
+            quickRange.appendChild(createElement('button', Styles.button + 'background: #444; font-size: 9px; padding: 2px 6px; flex: 1;', {
+                textContent: txt,
+                onclick: () => {
+                    document.getElementById('hv-start').value = s;
+                    document.getElementById('hv-end').value = e;
+                }
+            }));
+        };
+        addQuickBtn('All (0-199)', 0, 199);
+        addQuickBtn('Left (0-99)', 0, 99);
+        addQuickBtn('Right (100-199)', 100, 199);
+        content.appendChild(quickRange);
+
+        // Actions
+        const btnRun = createElement('button', Styles.button + 'background: ' + Styles.colors.success + '; width: 100%;', {
+            textContent: 'Run Harvest',
+            onclick: () => {
+                const s = parseInt(document.getElementById('hv-start').value);
+                const e = parseInt(document.getElementById('hv-end').value);
+                const c = parseInt(document.getElementById('hv-count').value);
+                const d = parseInt(document.getElementById('hv-delay').value);
+                if (MB && MB.harvestLoop) MB.harvestLoop(s, e, c, d);
+            }
+        });
+        content.appendChild(btnRun);
+
+        // Sell All (moved here from root)
+        const btnSell = createElement('button', Styles.button + 'background: ' + Styles.colors.warning + '; width: 100%; margin-top: 10px;', {
+            textContent: 'Sell All Crops',
+            onclick: () => {
+                if (MB && MB.sellAll) MB.sellAll();
+            }
+        });
+        content.appendChild(btnSell);
+
+        wrapper.appendChild(header);
+        wrapper.appendChild(content);
+        container.appendChild(wrapper);
+    }
+};