57 lines
1.0 KiB
JavaScript
57 lines
1.0 KiB
JavaScript
import { DisplayValue } from './display-value.js';
|
|
import { randomID } from '../../util.js';
|
|
|
|
export class Box {
|
|
constructor(name, parentEl, elementType = 'div') {
|
|
this.name = name;
|
|
this.el = document.createElement(elementType);
|
|
this.el.id = `box_${randomID()}`;
|
|
this.el.classList.add('box');
|
|
if (name) {
|
|
this.el.setAttribute('box-name', name);
|
|
}
|
|
if (parentEl) {
|
|
parentEl.appendChild(this.el);
|
|
}
|
|
}
|
|
|
|
flex() {
|
|
this.addClass('flex');
|
|
return this;
|
|
}
|
|
|
|
monospace() {
|
|
this.addClass('monospace');
|
|
return this;
|
|
}
|
|
|
|
hidden() {
|
|
this.addClass('hidden');
|
|
return this;
|
|
}
|
|
|
|
addClass(className) {
|
|
this.el.classList.add(className);
|
|
return this;
|
|
}
|
|
|
|
addBox(name, elementType) {
|
|
const box = new Box(name, this.el, elementType);
|
|
return box;
|
|
}
|
|
|
|
addDisplayValue(value) {
|
|
const box = this.addBox(value.name).flex();
|
|
return new DisplayValue(value, box);
|
|
}
|
|
|
|
setInnerHTML(html) {
|
|
this.el.innerHTML = html;
|
|
return this;
|
|
}
|
|
|
|
getId() {
|
|
return this.el.id;
|
|
}
|
|
}
|