from nicegui import ui
from gui.styles import STYLES

site = 1

@ui.refreshable
def content ():
  match site:
      case (1):
        ui.label("Startseite. Willkommen!").classes(STYLES["h2"])
      case (2):
        ui.label("Energie und Verbrauch").classes(STYLES["h2"])
      case (3):
        ui.label("Heizung").classes(STYLES["h2"])
      case (4):      
        ui.label("Homelab").classes(STYLES["h2"])
  

def create_ui():
  ui.page_title("Haus Dashboard")
  with ui.row().classes("w-full justify-between"):
    ui.label("Haus Dashboard").classes(STYLES["header"])
    ui.switch('Light Mode').bind_value(ui.dark_mode(True))
    
  with ui.card().classes("w-full"):
    ui.label("Navigation").classes(STYLES["h1"])
    with ui.row().classes('w-full justify-between'):
        ui.button('Startseite', on_click=lambda: ui_site_changer(1))
        ui.button('Energie', on_click=lambda: ui_site_changer(2))
        ui.button('Heizung', on_click=lambda: ui_site_changer(3))
        ui.button('Homelab', on_click=lambda: ui_site_changer(4))
  with ui.card().classes("w-full"):
    content()    

def run_ui():
    ui.run(host='0.0.0.0', port=8080)

#Wechsel den int von site je nach Button der gedrückt wurde.
def ui_site_changer(i: int):
    global site
    site = i
    content.refresh()      # UI-Bereich neu bauen 【1】