Conceptually parser creates the UIRoot

This commit is contained in:
Jordan Eldredge 2021-07-01 23:29:27 -07:00
parent f26cf98683
commit ca16dbe3a2
3 changed files with 24 additions and 24 deletions

View file

@ -9,7 +9,7 @@ import GammaGroup from "./skin/GammaGroup";
import Container from "./skin/Container";
import Vm from "./skin/VM";
class UIRoot {
export class UIRoot {
// Just a temporary place to stash things
_bitmaps: Bitmap[] = [];
_fonts: (TrueTypeFont | BitmapFont)[] = [];
@ -86,8 +86,8 @@ class UIRoot {
return found ?? null;
}
setContainers(containers: Container[]) {
this._containers = containers;
addContainers(container: Container) {
this._containers.push(container);
}
getContainers(): Container[] {

View file

@ -2,7 +2,6 @@ import JSZip from "jszip";
// This module is imported early here in order to avoid a circular dependency.
import { classResolver } from "./skin/resolver";
import SkinParser from "./skin/parse";
import UI_ROOT from "./UIRoot";
function hack() {
// Without this Snowpack will try to treeshake out resolver causing a circular
@ -23,17 +22,15 @@ async function main() {
status.innerText = "Parsing XML and initializing images...";
const parser = new SkinParser(zip);
await parser.parse();
UI_ROOT.setContainers(parser._containers);
const uiRoot = await parser.parse();
let node = document.createElement("div");
status.innerText = "Enabling Colors...";
UI_ROOT.enableDefaultGammaSet();
uiRoot.enableDefaultGammaSet();
status.innerText = "Rendering skin for the first time...";
for (const container of parser._containers) {
for (const container of uiRoot.getContainers()) {
container.draw();
node.appendChild(container.getDiv());
}
@ -43,9 +40,9 @@ async function main() {
select.style.bottom = "0px";
select.style.left = "0px";
select.addEventListener("change", (e) => {
UI_ROOT.enableGammaSet((e.target as HTMLInputElement).value);
uiRoot.enableGammaSet((e.target as HTMLInputElement).value);
});
for (const set of UI_ROOT._gammaSets.keys()) {
for (const set of uiRoot._gammaSets.keys()) {
const option = document.createElement("option");
option.innerText = set;
option.value = set;
@ -60,7 +57,7 @@ async function main() {
document.body.appendChild(node);
status.innerText = "Initializing Maki...";
for (const container of parser._containers) {
for (const container of uiRoot.getContainers()) {
container.init();
}
status.innerText = "";

View file

@ -1,6 +1,5 @@
import parseXml, { XmlDocument, XmlElement } from "@rgrove/parse-xml";
import { assert, getCaseInsensitiveFile, assume } from "../utils";
import UI_ROOT from "../UIRoot";
import JSZip, { JSZipObject } from "jszip";
import Bitmap from "./Bitmap";
import ImageManager from "./ImageManager";
@ -23,6 +22,7 @@ import BitmapFont from "./BitmapFont";
import Color from "./Color";
import GammaGroup from "./GammaGroup";
import ColorThemesList from "./ColorThemesList";
import UI_ROOT, { UIRoot } from "../UIRoot";
class ParserContext {
container: Container | null = null;
@ -34,14 +34,15 @@ export default class SkinParser {
_imageManager: ImageManager;
_path: string[] = [];
_context: ParserContext = new ParserContext();
_containers: Container[] = [];
_gammaSet: GammaGroup[] = [];
_uiRoot: UIRoot;
constructor(zip: JSZip) {
this._zip = zip;
this._imageManager = new ImageManager(zip);
this._uiRoot = UI_ROOT;
}
async parse(): Promise<void> {
async parse(): Promise<UIRoot> {
// Load built-in xui elements
// await this.parseFromUrl("assets/xml/xui/standardframe.xml");
const includedXml = await this.getCaseInsensitiveFile("skin.xml").async(
@ -53,6 +54,8 @@ export default class SkinParser {
const parsed = parseXml(includedXml);
await this.traverseChildren(parsed);
return this._uiRoot;
}
// Some XML files are built-in, so we want to be able to
@ -196,7 +199,7 @@ export default class SkinParser {
bitmap.setXmlAttributes(node.attributes);
await bitmap.ensureImageLoaded(this._imageManager);
UI_ROOT.addBitmap(bitmap);
this._uiRoot.addBitmap(bitmap);
}
async bitmapFont(node: XmlElement) {
@ -208,7 +211,7 @@ export default class SkinParser {
font.setXmlAttributes(node.attributes);
await font.ensureFontLoaded(this._imageManager);
UI_ROOT.addFont(font);
this._uiRoot.addFont(font);
}
async text(node: XmlElement) {
@ -325,7 +328,7 @@ export default class SkinParser {
const color = new Color();
color.setXmlAttributes(node.attributes);
UI_ROOT.addColor(color);
this._uiRoot.addColor(color);
}
async slider(node: XmlElement) {
@ -347,7 +350,7 @@ export default class SkinParser {
}
async groupdef(node: XmlElement) {
UI_ROOT.addGroupDef(node);
this._uiRoot.addGroupDef(node);
}
async layer(node: XmlElement) {
@ -388,7 +391,7 @@ export default class SkinParser {
async maybeApplyGroupDef(group: Group, node: XmlElement) {
const id = node.attributes.id;
const groupDef = UI_ROOT.getGroupDef(id);
const groupDef = this._uiRoot.getGroupDef(id);
if (groupDef != null) {
group.setXmlAttributes(groupDef.attributes);
const previousParentGroup = this._context.parentGroup;
@ -415,7 +418,7 @@ export default class SkinParser {
async gammaset(node: XmlElement) {
this._gammaSet = [];
await this.traverseChildren(node);
UI_ROOT.addGammaSet(node.attributes.id, this._gammaSet);
this._uiRoot.addGammaSet(node.attributes.id, this._gammaSet);
}
async gammagroup(node: XmlElement) {
@ -436,7 +439,7 @@ export default class SkinParser {
const container = new Container();
container.setXmlAttributes(node.attributes);
this._context.container = container;
this._containers.push(container);
this._uiRoot.addContainers(container);
await this.traverseChildren(node);
}
@ -467,7 +470,7 @@ export default class SkinParser {
async xuiElement(node: XmlElement) {
assume(node.children.length === 0, "Unexpected children in XUI XML node.");
const xuiElement = UI_ROOT.getXuiElement(node.name);
const xuiElement = this._uiRoot.getXuiElement(node.name);
assume(
xuiElement != null,
`Expected to find xui element with name "${node.name}".`
@ -552,7 +555,7 @@ export default class SkinParser {
font.setXmlAttributes(node.attributes);
await font.ensureFontLoaded(this._imageManager);
UI_ROOT.addFont(font);
this._uiRoot.addFont(font);
}
async include(node: XmlElement) {