from dash import Dash, dcc
from werkzeug.middleware.dispatcher import DispatcherMiddleware
import flask
from werkzeug.serving import run_simple
import dash_html_components as html
from flask import request
from dash.dependencies import Output, Input, State
import plotly.express as px
import pandas as pd

server = flask.Flask(__name__)
dash_app = Dash(__name__, server = server, url_base_pathname='/dashboard/' )

data = {
    "light": dcc.Store(id="light"),
    "water": dcc.Store(id="water"),
    "temp": dcc.Store(id="temp")
}

data["light"].data = []
data["water"].data = []
data["temp"].data = []

max_len = 1000

dash_app.layout = html.Div(
    [
        data["light"],
        data["water"],
        data["temp"],
        html.Div([], id="graphs")
    ]
)

@dash_app.callback(Output("graphs", "children"), Input("light", "data"), Input("temp", "data"), Input("water", "data"))
def on_data_change(light, temp, water):
    return [
        dcc.Graph(figure=px.line(pd.DataFrame({"light":light}), y='light')),
        dcc.Graph(figure=px.line(pd.DataFrame({"water":water}), y='water')),
        dcc.Graph(figure=px.line(pd.DataFrame({"temp":temp}), y='temp'))
    ]


@server.route('/data', methods = ['POST'])
def post_data():
    if request.method == 'POST':
        print(request.data)
        post_data = request.data.decode("utf-8")
        sensor_list = post_data.split(';')
        for d in sensor_list:
            k, v = d.split('=')
            data[k].data.append(int(v))
            if len(data[k].data) > max_len:
                data[k].data = data[k].data[1:]
    return "ok"

@server.route('/')
@server.route('/dashboard/')
def render_dashboard():
    return flask.redirect('/dash')

app = DispatcherMiddleware(server, {
    '/dash': dash_app.server,
})

run_simple('0.0.0.0', 80, app, use_reloader=True, use_debugger=False)