b639bc6c4f
The old widget system (archive/dusk/ui/) depended on infrastructure this rewrite deleted -- a static X-macro element list, a 9-slice UI_FRAME, and a global gamepad/keyboard focus stack -- so everything below is rebuilt on top of the new native uielement_t pool + parent/child tree instead, gamepad/keyboard-only (no mouse support exists in the input system). New JS widgets (assets/scripts/), all pure composites of Label/Rectangle following the Button.js pattern: Checkbox, Tab, Slider, Dropdown. Slider/ Dropdown expose a directionInput(dx, dy) hook so a menu can hand them LEFT/RIGHT before falling back to cursor movement. New Menu.js replaces the old global uifocus_t stack: a small push/pop stack of Menu instances where only the topmost consumes CANCEL/ACCEPT/ direction input each tick (needed for nested modals -- a Settings sub-page menu plus a "discard changes?" Confirm can be open at once). Held-direction repeat timing matches the old 0.5s delay / 0.1s repeat. New overlay composites (added via a new UI.addOverlay()/UI.removeOverlay(), always drawn/updated after normal roots): FpsCounter, ConsoleOverlay (one Label per console history line, driven directly rather than via add() since History (16) exceeds the 8-children-per-element cap), Crop (letterbox/pillarbox bars), and Fullbox (a reusable tweened full-screen fade covering both the old fullbox and transition effects -- reuses shared instances rather than allocate-and-dispose, since disposing an element from inside its own render() callback risks the same JerryScript refcount corruption hit earlier in this rewrite). New Confirm.js (Yes/No dialog) and Settings.js (+ SettingsGeneral/ SettingsInput sub-pages) built on Menu. Display/Audio settings pages are intentionally not ported -- neither had a real backing engine system even in the old code. Frame is a flat Rectangle for now, not real 9-slice (a genuinely bigger native lift, deliberately deferred). Small native binding additions needed by the above, each with its own unit test: Time.renderDelta, Console.lineCount/getLine/visible/ consumeDirty, a new Screen module, a new Locale module, Input.deadzone, a new Save module, and Label.color (was missing entirely). Also fixes a real gap from the UI.addOverlay() work: uiElementDispose() wasn't removing disposed elements from the new overlay root array, which would have left dangling ids behind. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
97 lines
2.7 KiB
JavaScript
97 lines
2.7 KiB
JavaScript
// Copyright (c) 2026 Dominic Masters
|
|
//
|
|
// This software is released under the MIT License.
|
|
// https://opensource.org/licenses/MIT
|
|
|
|
var Menu = require('./Menu.js');
|
|
var Tab = require('./Tab.js');
|
|
var Confirm = require('./Confirm.js');
|
|
var SettingsGeneral = require('./SettingsGeneral.js');
|
|
var SettingsInput = require('./SettingsInput.js');
|
|
|
|
// Display/Audio pages are deliberately not here -- neither has any real
|
|
// engine system behind it, even in the old code (no resolution/
|
|
// fullscreen system, no audio subsystem at all).
|
|
var TABS = [
|
|
{ name: 'General', ctor: SettingsGeneral },
|
|
{ name: 'Input', ctor: SettingsInput }
|
|
];
|
|
|
|
// Owns a tabs Menu (General/Input) and swaps in the active tab's page
|
|
// widgets into a second, page-scoped Menu -- both Menus are open on the
|
|
// navigation stack simultaneously (tabsMenu below, pageMenu on top),
|
|
// matching the old settings screen's nested-menu behavior. Switching
|
|
// away from a dirty page opens a Confirm first.
|
|
class Settings extends UIElement {
|
|
init() {
|
|
this.tabsMenu = new Menu();
|
|
this.tabsMenu.cols = TABS.length;
|
|
this.add(this.tabsMenu);
|
|
|
|
this.tabs = TABS.map((def, index) => {
|
|
const tab = new Tab();
|
|
tab.text = def.name;
|
|
tab.x = index * 90;
|
|
this.tabsMenu.addItem(tab);
|
|
return tab;
|
|
});
|
|
|
|
this.tabsMenu.onSelected = (index) => this._activateTab(index);
|
|
|
|
this.page = null;
|
|
this.pageMenu = null;
|
|
this._activeTabIndex = -1;
|
|
}
|
|
|
|
open() {
|
|
UI.add(this);
|
|
this.tabsMenu.open();
|
|
this._activateTab(0);
|
|
}
|
|
|
|
close() {
|
|
this.tabsMenu.close();
|
|
if(this.pageMenu) this.pageMenu.close();
|
|
UI.remove(this);
|
|
}
|
|
|
|
_activateTab(index) {
|
|
if(index === this._activeTabIndex) return;
|
|
|
|
if(this.page && this.page.hasChanges && this.page.hasChanges()) {
|
|
Confirm.open('Discard changes?', (confirmed) => {
|
|
if(confirmed) this._swapTab(index);
|
|
});
|
|
return;
|
|
}
|
|
|
|
this._swapTab(index);
|
|
}
|
|
|
|
_swapTab(index) {
|
|
// pageMenu.dispose() cascades to every widget the outgoing page
|
|
// handed it via menuItems -- the page itself is a plain object (see
|
|
// SettingsGeneral.js), nothing else to release.
|
|
if(this.pageMenu) this.pageMenu.dispose();
|
|
|
|
for(let i = 0; i < this.tabs.length; i++) {
|
|
this.tabs[i].setHighlighted(i === index);
|
|
}
|
|
|
|
const def = TABS[index];
|
|
this.page = new def.ctor();
|
|
if(this.page.load) this.page.load();
|
|
|
|
this.pageMenu = new Menu();
|
|
this.pageMenu.y = 40;
|
|
const items = this.page.menuItems || [];
|
|
for(let i = 0; i < items.length; i++) this.pageMenu.addItem(items[i]);
|
|
this.add(this.pageMenu);
|
|
this.pageMenu.open();
|
|
|
|
this._activeTabIndex = index;
|
|
}
|
|
}
|
|
|
|
module.exports = Settings;
|