Some changes.

This commit is contained in:
retoor 2024-12-29 16:55:14 +01:00
parent 8b212187d1
commit 0072e6d86e

View File

@ -20,7 +20,6 @@ const allEvents = [
'dragenter', 'dragleave', 'touchstart', 'touchmove', 'touchend', 'dragenter', 'dragleave', 'touchstart', 'touchmove', 'touchend',
'touchcancel', 'pointerdown', 'pointerup', 'pointermove', 'pointerover', 'touchcancel', 'pointerdown', 'pointerup', 'pointermove', 'pointerover',
'pointerout', 'pointerenter', 'pointerleave', 'wheel'/*'scroll',*/ 'pointerout', 'pointerenter', 'pointerleave', 'wheel'/*'scroll',*/
// Add more as needed
]; ];
const props = [ const props = [
'data', 'data',
@ -104,20 +103,15 @@ const callback = (mutationList, observer) => {
} }
} }
}; };
// Create an observer instance linked to the callback function
const observer = new MutationObserver(callback); const observer = new MutationObserver(callback);
// Start observing the target node for configured mutations
observer.observe(rWebGui, config); observer.observe(rWebGui, config);
// Later, you can stop observing
//observer.disconnect();
} }
class MyCustomElement extends HTMLElement { class RWebGuiApp extends HTMLElement {
static observedAttributes = ["color", "size"];
_ready = false _ready = false
_uuid = null _uuid = null
ws = null ws = null
@ -138,7 +132,7 @@ class MyCustomElement extends HTMLElement {
// Always call super first in constructor // Always call super first in constructor
super(); super();
if(!this.parent || !this.parent.app){ if(!this.parent || !this.parent.app){
this.ws = new WebSocket(`ws://${window.location.host}/ws/${this.uuid}`) this.ws = new WebSocket(`wss://${window.location.host}/ws/${this.uuid}`)
const me = this const me = this
this.ws.onopen = ()=>{ this.ws.onopen = ()=>{
me.connected = true; me.connected = true;
@ -252,7 +246,6 @@ class MyCustomElement extends HTMLElement {
} }
connectedCallback() { connectedCallback() {
console.log("Custom element added to page.");
this.rWebGui() this.rWebGui()
@ -270,25 +263,15 @@ class MyCustomElement extends HTMLElement {
this._ready = true this._ready = true
} }
disconnectedCallback() {
console.log("Custom element removed from page.");
}
adoptedCallback() {
console.log("Custom element moved to new page.");
}
attributeChangedCallback(name, oldValue, newValue) { attributeChangedCallback(name, oldValue, newValue) {
this.emit("attributeChanged", {aa:123}) this.emit("attributeChanged", {aa:123})
console.log(`Attribute ${name} has changed.`);
} }
} }
customElements.define("rwebgui-app", MyCustomElement); customElements.define("rwebgui-app",RWebGuiApp);
/* /*
document.addEventListener("DOMContentLoaded", () => { document.addEventListener("DOMContentLoaded", () => {
console.log("DOM fully loaded and parsed");
document.querySelectorAll("*").forEach(child => { document.querySelectorAll("*").forEach(child => {
child.rWebGui() child.rWebGui()
}) })