Remove xmlNode from MAKI objects (#829)

* Remove xmlNode from MAKI objects

* fix missed in rebase

modern/src/App.js

@@ -257,8 +257,8 @@ const NODE_NAME_TO_COMPONENT = {
 
 // Given a skin XML node, pick which component to use, and render it.
 function XmlNode({ node }) {
-  const attributes = node.xmlNode.attributes;
-  const name = node.xmlNode.name;
+  const attributes = node.attributes;
+  const name = node.name;
   if (name == null || name === "groupdef") {
     // name is null is likely a comment
     return null;
@@ -290,14 +290,14 @@ function App() {
     getSkin().then(async root => {
       // Execute scripts
       await Utils.asyncTreeFlatMap(root, async node => {
-        switch (node.xmlNode.name) {
+        switch (node.name) {
           case "groupdef": {
             // removes groupdefs from consideration (only run scripts when actually referenced by group)
             return {};
           }
           case "script": {
             // TODO: stop ignoring standardframe
-            if (node.xmlNode.attributes.file.endsWith("standardframe.maki")) {
+            if (node.attributes.file.endsWith("standardframe.maki")) {
               break;
             }
             const scriptGroup = Utils.findParentNodeOfType(node, [

modern/src/initialize.js

@@ -223,18 +223,18 @@ const parsers = {
   },
 };
 
-async function parseChildren(node, zip) {
-  if (node.xmlNode.type === "comment") {
+async function parseChildren(node, children, zip) {
+  if (node.type === "comment") {
     return;
   }
-  if (node.xmlNode.name == null) {
-    console.error(node.xmlNode);
+  if (node.name == null) {
+    console.error(node);
     throw new Error("Unknown node");
   }
 
-  const validChildren = new Set(schema[node.xmlNode.name.toLowerCase()]);
+  const validChildren = new Set(schema[node.name.toLowerCase()]);
   const resolvedChildren = await Promise.all(
-    node.xmlNode.children.map(async child => {
+    children.map(async child => {
       if (child.type === "comment") {
         return;
       }
@@ -248,14 +248,12 @@ async function parseChildren(node, zip) {
       }
       const childName = child.name.toLowerCase();
       if (childName == null) {
-        console.error(node.xmlNode);
+        console.error(node);
         throw new Error("Unknown node");
       }
 
       if (!validChildren.has(childName)) {
-        throw new Error(
-          `Invalid child of a ${node.xmlNode.name}: ${childName}`
-        );
+        throw new Error(`Invalid child of a ${node.name}: ${childName}`);
       }
 
       const childParser = parsers[childName];
@@ -264,11 +262,8 @@ async function parseChildren(node, zip) {
         return;
       }
       const parsedChild = await childParser(child, node, zip);
-      if (
-        parsedChild.xmlNode.children != null &&
-        parsedChild.xmlNode.children.length > 0
-      ) {
-        await parseChildren(parsedChild, zip);
+      if (child.children != null && child.children.length > 0) {
+        await parseChildren(parsedChild, child.children, zip);
       }
       return parsedChild;
     })
@@ -281,14 +276,14 @@ async function parseChildren(node, zip) {
 
 async function applyGroupDefs(root) {
   await asyncTreeFlatMap(root, async node => {
-    switch (node.xmlNode.name) {
+    switch (node.name) {
       case "group": {
         if (!node.children || node.children.length === 0) {
-          const groupdef = node.js_groupdefLookup(node.xmlNode.attributes.id);
+          const groupdef = node.js_groupdefLookup(node.attributes.id);
           if (!groupdef) {
             console.warn(
               "Unable to find groupdef. Rendering null",
-              node.xmlNode.attributes.id
+              node.attributes.id
             );
             return {};
           }
@@ -297,9 +292,9 @@ async function applyGroupDefs(root) {
           node.children.forEach(item => {
             item.parent = node;
           });
-          node.xmlNode.attributes = {
-            ...node.xmlNode.attributes,
-            ...groupdef.xmlNode.attributes,
+          node.attributes = {
+            ...node.attributes,
+            ...groupdef.attributes,
           };
         }
         return {};
@@ -312,8 +307,9 @@ async function applyGroupDefs(root) {
 }
 
 async function initialize(zip, skinXml) {
+  const xmlRoot = skinXml.children[0];
   const root = new WinampAbstractionLayer(skinXml.children[0], null);
-  await parseChildren(root, zip);
+  await parseChildren(root, xmlRoot.children, zip);
   await applyGroupDefs(root);
   return root;
 }

modern/src/runtime/GuiObject.js

@@ -34,12 +34,12 @@ class GuiObject extends MakiObject {
   }
 
   setxmlparam(param, value) {
-    this.xmlNode.attributes[param] = value;
+    this.attributes[param] = value;
     return value;
   }
 
   getxmlparam(param) {
-    const attributes = this.xmlNode.attributes;
+    const attributes = this.attributes;
     if (attributes !== undefined && attributes.hasOwnProperty(param)) {
       return attributes[param];
     }
@@ -79,10 +79,10 @@ class GuiObject extends MakiObject {
   }
 
   resize(x, y, w, h) {
-    this.xmlNode.attributes.x = x;
-    this.xmlNode.attributes.y = y;
-    this.xmlNode.attributes.w = w;
-    this.xmlNode.attributes.h = h;
+    this.attributes.x = x;
+    this.attributes.y = y;
+    this.attributes.w = w;
+    this.attributes.h = h;
   }
 }
 

modern/src/runtime/Layout.js

@@ -17,12 +17,12 @@ class Layout extends GuiObject {
   }
 
   resize(x, y, w, h) {
-    this.xmlNode.attributes.x = x;
-    this.xmlNode.attributes.y = y;
-    this.xmlNode.attributes.minimum_w = w;
-    this.xmlNode.attributes.maximum_w = w;
-    this.xmlNode.attributes.minimum_h = h;
-    this.xmlNode.attributes.maximum_h = h;
+    this.attributes.x = x;
+    this.attributes.y = y;
+    this.attributes.minimum_w = w;
+    this.attributes.maximum_w = w;
+    this.attributes.minimum_h = h;
+    this.attributes.maximum_h = h;
   }
 }
 

modern/src/runtime/MakiObject.js

@@ -3,25 +3,18 @@ import { findElementById, findGroupDefById } from "../utils";
 
 class MakiObject {
   constructor(node, parent, annotations = {}) {
-    this.xmlNode = node;
+    if (node) {
+      this.attributes = node.attributes;
+      this.name = node.name;
+    } else {
+      // When dynamically creating an object with `new` we have no underlying node
+      this.attributes = {};
+      this.name = this.constructor.name.toLowerCase();
+    }
     this.parent = parent;
     this.js_annotations = annotations;
     this.children = [];
     this._emitter = new Emitter();
-
-    if (!this.xmlNode) {
-      // When dynamically creating a new object with `new` we need to add an underlying "XML"
-      // node that we can edit
-      this.xmlNode = {
-        children: [],
-        attributes: {
-          id: null,
-        },
-        // ugly but works for now
-        name: this.constructor.name.toLowerCase(),
-        type: "element",
-      };
-    }
   }
 
   js_addChild(child) {

modern/src/utils.js

@@ -106,8 +106,8 @@ export function findParentNodeOfType(node, type) {
   while (n.parent) {
     n = n.parent;
     if (
-      (!Array.isArray(type) && n.xmlNode.name === type) ||
-      (Array.isArray(type) && type.includes(n.xmlNode.name))
+      (!Array.isArray(type) && n.name === type) ||
+      (Array.isArray(type) && type.includes(n.name))
     ) {
       return n;
     }
@@ -123,10 +123,10 @@ export function findDescendantByTypeAndId(node, type, id) {
   for (let i = 0; i < node.children.length; i++) {
     const child = node.children[i];
     if (
-      (!type || child.xmlNode.name === type) &&
-      (child.xmlNode.attributes !== undefined &&
-        child.xmlNode.attributes.id !== undefined &&
-        child.xmlNode.attributes.id.toLowerCase() === idLC)
+      (!type || child.name === type) &&
+      (child.attributes !== undefined &&
+        child.attributes.id !== undefined &&
+        child.attributes.id.toLowerCase() === idLC)
     ) {
       return child;
     }
@@ -144,7 +144,7 @@ export function findDescendantByTypeAndId(node, type, id) {
 }
 
 function findDirectDescendantById(node, id) {
-  return node.children.find(item => item.xmlNode.attributes.id === id);
+  return node.children.find(item => item.attributes.id === id);
 }
 
 // Search up the tree for a node that is in `node`'s lexical scope and pred returns node
@@ -189,7 +189,7 @@ export function findGroupDefById(node, id) {
     if (
       child.getclassname &&
       child.getclassname() === "GroupDef" &&
-      child.xmlNode.attributes.id === id
+      child.attributes.id === id
     ) {
       return child;
     }