Files
Magic-Garden-Bot/extension/modules/ui/components/diet.js
2025-12-09 23:49:52 +00:00

120 lines
4.8 KiB
JavaScript

import { Styles, createElement } from '../ui_styles.js';
export const Diet = {
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-diet');
const arrow = wrapper.querySelector('#arrow-diet');
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;">Pet Diet</label>
<span id="arrow-diet" style="font-size: 10px; color: #aaa;">▼</span>
`;
const content = createElement('div', '', { id: 'section-diet' }); // Default open? or closed? Display logic handles it.
// Controls
const controls = createElement('div', 'display: flex; gap: 5px; margin-bottom: 5px;');
const createCtrl = (txt, fn) => {
return createElement('button', Styles.button + 'background: #444; font-size: 10px; padding: 2px 6px; flex: 1;', {
textContent: txt,
onclick: fn
});
};
controls.appendChild(createCtrl('All', () => {
const list = document.getElementById('diet-list');
if (!list) return;
list.querySelectorAll('input').forEach(cb => { if (!cb.checked) cb.click(); });
}));
controls.appendChild(createCtrl('None', () => {
const list = document.getElementById('diet-list');
if (!list) return;
list.querySelectorAll('input').forEach(cb => { if (cb.checked) cb.click(); });
}));
content.appendChild(controls);
// List Container
const listContainer = createElement('div', 'max-height: 150px; overflow-y: auto; background: rgba(0,0,0,0.2); padding: 5px; border-radius: 4px;', {
id: 'diet-list'
});
content.appendChild(listContainer);
wrapper.appendChild(header);
wrapper.appendChild(content);
container.appendChild(wrapper);
// Initial Populate
this.populate(listContainer);
// Subscribe to state updates to refresh list
if (MB.on) {
MB.on('state_updated', () => {
if (listContainer.children.length === 0) this.populate(listContainer);
});
}
},
populate(list) {
const MB = window.MagicBot;
if (!list) return;
// Preserve checks if re-populating not fully implemented but okay for now to clear
list.innerHTML = '';
let crops = ["Carrot", "Tomato", "Potato", "Corn", "Wheat", "Strawberry", "Blueberry", "Pumpkin", "Watermelon", "Radish", "Cabbage", "Lettuce", "Pepper", "Apple", "Orange", "Banana", "Coconut", "Grape", "Lemon", "Lime", "Peach", "Pear", "Plum", "Cherry", "Mango", "Pineapple", "Aloe", "Daffodil", "OrangeTulip"];
// Try to merge with shop data if present
if (MB && MB.state && MB.state.shops && MB.state.shops.seed && MB.state.shops.seed.inventory) {
const shopCrops = MB.state.shops.seed.inventory.map(i => i.species);
crops = [...new Set([...crops, ...shopCrops])];
} else if (MB.state && MB.state.inventory && MB.state.inventory.items) {
// Also scan inventory for seeds
MB.state.inventory.items.forEach(i => {
if (i.itemType === 'Seed' && i.species) crops.push(i.species);
});
crops = [...new Set(crops)];
}
crops.sort();
crops.forEach(crop => {
const label = createElement('label', 'display: flex; align-items: center; gap: 4px; font-size: 10px; cursor: pointer; user-select: none; padding: 2px 0;');
const checkbox = createElement('input', 'cursor: pointer;', { type: 'checkbox' });
if (MB.automation && MB.automation.petDiet && MB.automation.petDiet.has(crop)) {
checkbox.checked = true;
}
checkbox.onchange = (e) => {
if (!MB.automation) return;
if (!MB.automation.petDiet) MB.automation.petDiet = new Set();
if (e.target.checked) MB.automation.petDiet.add(crop);
else MB.automation.petDiet.delete(crop);
};
label.appendChild(checkbox);
label.appendChild(document.createTextNode(crop));
list.appendChild(label);
});
}
};