Unconsolidate generating of states

src/assets/HestiaClasses.js

@@ -1,25 +1,40 @@
 export class State {
     constructor() {
-        this.publisher = 'front';
+        this.igniter = {
-        return this;
+            on: false,
-    };
+            topic: 'hestia/status/igniter',
+            publisher: 'front',
+            power: (communicator) => {
+                // This *should* toggle the state, asks if state is true, if it is set it false, otherwise set it true
+                this.igniter.on ? this.igniter.on = false : this.igniter.on = true;
+                communicator.send('hestia/status/igniter', JSON.stringify(this));
+            }
+        };
 
-    init(config) {
+        this.exhaust = {
-        config.mqtt.subscriptions.forEach(sub => {
+            on: false,
-            this[sub.name] = {
+            topic: 'hestia/status/exhaust',
-                on: false,
+            publisher: 'front',
-                topic: sub.topic,
+            power: (communicator) => {
-                publisher: 'front',
+                // This *should* toggle the state, asks if state is true, if it is set it false, otherwise set it true
-                power: (communicator) => {
+                this.exhaust.on ? this.exhaust.on = false : this.exhaust.on = true;
-                    // This *should* toggle the state, asks if state is true, if it is set it false, otherwise set it true
+                communicator.send('hestia/status/exhaust', JSON.stringify(this));
-                    this[sub.name].on ? this[sub.name].on = false : this[sub.name].on = true;
+            }
-                    communicator.send(sub.topic, JSON.stringify(this));
+        };
-                }
+
-            };
+        this.auger = {
-            console.log(`${sub.name} initialized.`)
+            on: false,
-        });
+            feedRate: 500,
+            topic: 'hestia/status/auger',
+            publisher: 'front',
+            power: (communicator) => {
+                // This *should* toggle the state, asks if state is true, if it is set it false, otherwise set it true
+                this.auger.on ? this.auger.on = false : this.auger.on = true;
+                communicator.send('hestia/status/auger', JSON.stringify(this));
+            }
+        };
         console.log(`State initialized.`)
-    }
+    };
 };
 
 export class Communicator {
@@ -40,11 +55,10 @@ export class Communicator {
         client.on('connect', () => {
             console.log('Connected to MQTT broker');
             // Subscribe to status topics
-            config.mqtt.subscriptions.forEach(sub => {
+            state.forEach(element => {
-                client.subscribe(sub.topic, (err) => {
+                client.subscribe(element.topic, (err) => {
                     if (!err) {
-                        console.log(`Subscribed to ${sub.topic}`);
+                        console.log(`Subscribed to ${element.topic}`);
-                        state[sub.name].topic = sub.topic;
                     }
                 });
             });

src/assets/hestia.js

@@ -5,21 +5,7 @@ const config = {
     "mqtt": {
         "address": "wss://mqtt.3411.one",
         "username": "hestia",
-        "password": "hestia",
+        "password": "hestia"
-        "subscriptions": [
-            {
-                "name": "igniter",
-                "topic": "hestia/status/igniter"
-            },
-            {
-                "name": "exhaust",
-                "topic": "hestia/status/exhaust"
-            },
-            {
-                "name": "auger",
-                "topic": "hestia/status/auger"
-            }
-        ]
     }
 };
 

src/index.html

@@ -76,10 +76,9 @@
             <img src="./assets/dancing_jesus.gif" class="img-fluid mx-auto rounded-lg shadow-lg" alt="Dancing Jesus">
         </div>
 
-        <div class="controls-container bg-gray-800 p-6 rounded-lg shadow-lg hidden" id="quitContainer">
+        <div class="controls-container bg-gray-800 p-6 rounded-lg shadow-lg" id="quitContainer">
-            <form action="/" method="POST">
+            <input class="btn bg-green-200 hover:bg-green-400 text-black font-bold py-2 px-4 rounded w-full" type="submit" id="reload" value="Refresh State" name="refresh">
-                <input class="btn bg-red-600 hover:bg-red-700 text-white py-2 px-4 rounded w-full" type="submit" id="quit" value="Quit!!" name="quit">
+            <input class="btn bg-red-600 hover:bg-red-700 text-white py-2 font-bold rounded w-full mt-4" type="submit" id="quit" value="Quit!!" name="quit">
-            </form>
         </div>
     </div>
 </body>