Create app.py

app.py

@@ -0,0 +1,110 @@
+import gradio as gr
+import paho.mqtt.client as mqtt
+import json
+import pandas as pd
+from datetime import datetime
+from collections import deque
+import plotly.express as px
+import time
+
+# Storage for data points
+data_buffer = deque(maxlen=100)
+
+# MQTT client and configuration variables
+client = mqtt.Client()
+MQTT_BROKER = ""
+MQTT_PORT = 8883
+MQTT_TOPIC = "FX-120i/e6632c8593690c30"
+MQTT_USERNAME = ""
+MQTT_PASSWORD = ""
+
+def on_connect(client, userdata, flags, rc):
+    if rc == 0:
+        print("Connected to MQTT broker")
+        client.subscribe(MQTT_TOPIC)
+        return "Connected to MQTT broker"
+    else:
+        return f"Connection failed with code {rc}"
+
+def on_message(client, userdata, msg):
+    try:
+        payload = json.loads(msg.payload.decode())
+        weight = float(payload["Current Weight"].replace('g', '').strip().replace('+', ''))
+        timestamp = f"{payload['Date']} {payload['Time']}"
+        dt = datetime.strptime(timestamp, "%Y-%m-%d %H:%M:%S")
+        data_buffer.append({'timestamp': dt, 'weight': weight})
+    except Exception as e:
+        print(f"Error: {e}")
+
+def connect_mqtt(hivemq_host, username, password):
+    global MQTT_BROKER, MQTT_USERNAME, MQTT_PASSWORD
+    MQTT_BROKER = hivemq_host
+    MQTT_USERNAME = username
+    MQTT_PASSWORD = password
+
+    client.username_pw_set(MQTT_USERNAME, MQTT_PASSWORD)
+
+    # Check if SSL/TLS has already been configured before setting it
+    if not client._ssl:
+        client.tls_set()
+        
+    client.on_connect = on_connect
+    client.on_message = on_message
+    client.connect(MQTT_BROKER, MQTT_PORT, 60)
+    client.loop_start()
+
+def update_graph():
+    if not data_buffer:
+        fig = px.line(title="Waiting for Data...")
+    else:
+        df = pd.DataFrame(list(data_buffer))
+        fig = px.line(df, x='timestamp', y='weight', title="Weight Over Time")
+        fig.update_layout(
+            xaxis=dict(
+                type="date",
+                tickformat="%H:%M:%S",  
+                title="Time"
+            ),
+            yaxis=dict(title="Weight (g)")
+        )
+    return fig
+
+with gr.Blocks() as app:
+    gr.Markdown("# Weight Monitor")
+    
+    # Connect to MQTT section
+    gr.Markdown("## Connect to MQTT")
+    
+    # Input fields for HiveMQ connection
+    with gr.Row():
+        hivemq_host = gr.Textbox(
+            label="HiveMQ Host:",
+            value="f74268785e954de0970c4bd66f31b0a1.s1.eu.hivemq.cloud"
+        )
+        mqtt_username = gr.Textbox(
+            label="HiveMQ Username:",
+            value="evnesher"
+        )
+        mqtt_password = gr.Textbox(
+            label="HiveMQ Password:",
+            value="Gfx8360",
+            type="password"
+        )
+    
+    # Connect button 
+    connect_button = gr.Button("Connect")
+    
+    # Graph display with auto-refresh
+    plot = gr.Plot(
+        update_graph,
+        every= 2.5  # Updates every 2.5 second
+    )
+    
+    # Connect button action
+    connect_button.click(
+        fn=connect_mqtt,
+        inputs=[hivemq_host, mqtt_username, mqtt_password],
+    )
+
+if __name__ == "__main__":
+    app.launch()