54 lines
1.8 KiB
JavaScript
54 lines
1.8 KiB
JavaScript
export function createButtonHelper(ui, text, onClick, style) {
|
|
return ui.createButton(text, onClick, style);
|
|
}
|
|
|
|
export function createCheckboxSetting(id, label, tooltip, checked, onChange) {
|
|
const group = document.createElement("div");
|
|
group.style.cssText = "grid-column: 1 / span 2; display: flex; align-items: center; gap: 8px;";
|
|
|
|
const checkbox = document.createElement("input");
|
|
checkbox.type = "checkbox";
|
|
checkbox.id = id;
|
|
checkbox.checked = checked;
|
|
checkbox.onchange = onChange;
|
|
|
|
const lbl = document.createElement("label");
|
|
lbl.htmlFor = id;
|
|
lbl.textContent = label;
|
|
lbl.style.cssText = "font-size: 12px; color: var(--dist-label-text, #ccc); cursor: pointer;";
|
|
if (tooltip) {
|
|
lbl.title = tooltip;
|
|
}
|
|
|
|
group.appendChild(checkbox);
|
|
group.appendChild(lbl);
|
|
return group;
|
|
}
|
|
|
|
export function createNumberSetting(id, label, tooltip, value, min, step, onChange) {
|
|
const group = document.createElement("div");
|
|
group.style.cssText = "grid-column: 1 / span 2; display: flex; align-items: center; gap: 6px;";
|
|
|
|
const lbl = document.createElement("label");
|
|
lbl.htmlFor = id;
|
|
lbl.textContent = label;
|
|
lbl.style.cssText = "font-size: 12px; color: var(--dist-label-text, #ccc);";
|
|
if (tooltip) {
|
|
lbl.title = tooltip;
|
|
}
|
|
|
|
const input = document.createElement("input");
|
|
input.type = "number";
|
|
input.id = id;
|
|
input.min = String(min);
|
|
input.step = String(step);
|
|
input.style.cssText =
|
|
"width: 80px; padding: 2px 6px; background: var(--dist-input-bg, #222); color: var(--dist-input-text, #ddd); border: 1px solid var(--dist-input-border, #333); border-radius: 3px;";
|
|
input.value = value;
|
|
input.onchange = onChange;
|
|
|
|
group.appendChild(lbl);
|
|
group.appendChild(input);
|
|
return group;
|
|
}
|