nopaque/app/static/js/resource-displays/index.js

69 lines
2.0 KiB
JavaScript
Raw Normal View History

2023-10-05 12:11:17 +00:00
var ResourceDisplays = {};
ResourceDisplays.autoInit = () => {
console.log('ResourceDisplays.autoInit');
for (let propertyName in ResourceDisplays) {
let property = ResourceDisplays[propertyName];
// Call autoInit of all properties that are subclasses of `ResourceDisplays.BaseDisplay`.
// This does not include `ResourceDisplays.BaseDisplay` itself.
if (property.prototype instanceof ResourceDisplays.BaseDisplay) {
console.log(property);
// Check if the static `htmlClass` property is defined.
if (property.htmlClass === undefined) {return;}
// Gather all HTML elements that have the `this.htmlClass` class
// and do not have the `no-autoinit` class.
let displayElements = document.querySelectorAll(`.${property.htmlClass}:not(.no-autoinit)`);
console.log(displayElements);
// Create an instance of this class for each display element.
for (let displayElement of displayElements) {new property(displayElement);}
}
}
}
2023-10-05 12:11:17 +00:00
ResourceDisplays.BaseDisplay = class BaseDisplay {
static htmlClass;
constructor(displayElement) {
this.displayElement = displayElement;
2021-11-30 15:22:16 +00:00
this.userId = this.displayElement.dataset.userId;
this.isInitialized = false;
if (this.userId) {
2022-09-02 11:07:30 +00:00
app.subscribeUser(this.userId)
.then((response) => {
app.socket.on('PATCH', (patch) => {
if (this.isInitialized) {this.onPatch(patch);}
});
});
app.getUser(this.userId)
.then((user) => {
this.init(user);
this.isInitialized = true;
});
}
}
2021-11-30 15:22:16 +00:00
init(user) {throw 'Not implemented';}
2022-09-02 11:07:30 +00:00
onPatch(patch) {throw 'Not implemented';}
setElement(element, value) {
switch (element.tagName) {
2022-09-02 11:07:30 +00:00
case 'INPUT': {
element.value = value;
M.updateTextFields();
break;
2022-09-02 11:07:30 +00:00
}
default: {
element.innerText = value;
break;
2022-09-02 11:07:30 +00:00
}
}
}
2021-12-01 13:15:20 +00:00
setElements(elements, value) {
2022-09-02 11:07:30 +00:00
for (let element of elements) {
2021-12-01 13:15:20 +00:00
this.setElement(element, value);
}
}
2023-10-05 12:11:17 +00:00
};