chaos/VaultUI
1
0
Fork 0
Code Issues Activity

makeElement is now so much cleaner.

Browse source
This commit is contained in:
Kitteh 2021-05-07 12:36:47 +01:00
parent 53e4edaf66
commit 234f735870
1 changed files with 31 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

53
src/htmlUtils.js
View file

@ -1,30 +1,39 @@
import {getObjectKeys} from "./utils.js";
const optionsFunctions = {
class: (e, arg) => {
if (Array.isArray(arg)) {
e.classList.add(...arg);
} else {
e.classList.add(arg);
}
},
id: (e, arg) => e.id = arg,
html: (e, arg) => e.innerHTML = arg,
onclick: (e, arg) => e.onclick = arg,
attributes: setElementAttributes,
text: (e, arg) => e.innerText = arg,
children: (e, arg) => {
if (Array.isArray(arg)) {
arg.forEach(child => {
if (child != null) e.appendChild(child);
});
} else {
if (arg != null) e.appendChild(arg);
}
},
thenRun: (e, arg) => arg(e),
}
export function makeElement(elementInfo) { export function makeElement(elementInfo) {
if ("condition" in elementInfo) { if (!elementInfo.condition) { return null; } } if ("condition" in elementInfo) { if (!elementInfo.condition) { return null; } }
let element = document.createElement(elementInfo.tag); let element = document.createElement(elementInfo.tag);
if ("class" in elementInfo) {
if (Array.isArray(elementInfo.class)) { for (let key of Object.getOwnPropertyNames(elementInfo)) {
element.classList.add(...elementInfo.class); if (getObjectKeys(optionsFunctions).includes(key)) {
} else { optionsFunctions[key](element, elementInfo[key]);
element.classList.add(elementInfo.class);
} }
} }
if ("id" in elementInfo) element.id = elementInfo.id;
if ("html" in elementInfo) element.innerHTML = elementInfo.html;
if ("onclick" in elementInfo) element.onclick = elementInfo.onclick;
if ("attributes" in elementInfo) setElementAttributes(element, elementInfo.attributes);
if ("text" in elementInfo) element.innerText = elementInfo.text;
if ("children" in elementInfo) {
if (Array.isArray(elementInfo.children)) {
elementInfo.children.forEach(child => {
if (child != null) element.appendChild(child);
});
} else {
if (elementInfo.children != null) element.appendChild(elementInfo.children);
}
}
if ("thenRun" in elementInfo) {
elementInfo.thenRun(element);
}
return element; return element;
} }