initial commit

UIClasses/Base.js

@@ -0,0 +1,37 @@
+class Base  {
+    constructor(id, mm) {
+        this.id = id;
+        this.type = id.split('.')[0]
+        this.name = id;
+        this.mm = mm;
+      }
+    
+      updateState(state) {
+        this.name = (state.attributes || {}).friendly_name || this.id;
+        this.state = state.state;
+        this.render();
+      }
+    
+      getContainer() {
+        const entity = document.createElement("div");
+        entity.classList.add("ha-entity");
+        entity.classList.add(`ha-${this.type}`)
+        entity.id = this.id;
+        entity.innerHTML = "Loading...";
+        return entity;
+      }
+    
+      render() {
+        const container = document.getElementById(this.id);
+        container.className = ""
+        container.classList.add("ha-entity");
+        container.classList.add(`ha-${this.type}`)
+
+        const title = document.createElement("span");
+        title.className = "title";
+        title.innerHTML = this.name;
+
+        container.innerHTML = "";
+        container.appendChild(title);
+      }
+}

UIClasses/Light.js

@@ -0,0 +1,21 @@
+class Light extends Base {
+  getContainer() {
+    const entity = super.getContainer();
+    entity.onclick = () => {
+      this.mm.sendSocketNotification("TOGGLE_STATE", { entity: this.id });
+    };
+    entity.ontouchend = () => {
+      this.mm.sendSocketNotification("TOGGLE_STATE", { entity: this.id });
+    };
+
+    return entity;
+  }
+
+  render() {
+    super.render();
+    const container = document.getElementById(this.id);
+    container.classList.add(this.state);
+
+    container.appendChild(statusCheckbox);
+  }
+}

UIClasses/Switch.js

@@ -0,0 +1,21 @@
+class Switch extends Base {
+  getContainer() {
+    const entity = super.getContainer();
+    entity.onclick = () => {
+      this.mm.sendSocketNotification("TOGGLE_STATE", { entity: this.id });
+    };
+    entity.ontouchend = () => {
+      this.mm.sendSocketNotification("TOGGLE_STATE", { entity: this.id });
+    }
+
+    return entity;
+  }
+
+  render() {
+    super.render();
+    const container = document.getElementById(this.id);
+    container.classList.add(this.state)
+
+    container.appendChild(statusCheckbox);
+  }
+}

UIClasses/Unsupported.js

@@ -0,0 +1,17 @@
+class Unsupported extends Base {
+  render() {
+    const container = document.getElementById(this.id);
+
+    const title = document.createElement("span");
+    title.className = "title";
+    title.innerHTML = `${this.name} (Unsupported)`;
+
+    const status = document.createElement("span");
+    status.className = "status";
+    status.innerHTML = this.state;
+
+    container.innerHTML = "";
+    container.appendChild(title);
+    container.appendChild(status);
+  }
+}