from __future__ import annotations

from typing import *  # type: ignore

from rio import Component, event, Spacer, Card, Container, Column, Row, TextStyle, Color, Text, PageView, Button, Link

from src.ezgg_lan_manager import ConfigurationService, DatabaseService
from src.ezgg_lan_manager.components.DesktopNavigation import DesktopNavigation

class BasePage(Component):
    color = "secondary"
    corner_radius = (0, 0.5, 0, 0)
    footer_size = 53.1
    force_portrait_mode = False

    @event.periodic(60)
    async def check_db_conn(self) -> None:
        is_healthy = await self.session[DatabaseService].is_healthy()
        if not is_healthy:
            self.session.navigate_to("./db-error")

    @event.on_window_size_change
    async def on_window_size_change(self):
        self.force_refresh()

    @event.on_page_change
    def check_needed_size(self):
        # ToDo: Low-Prio: Change layout, so the footer is always as wide as needed.
        #                 This is a workaround, bc the seating page needs more width
        if "/seating" in self.session.active_page_url.__str__():
            self.footer_size = 78.2
        else:
            self.footer_size = 53.1
        self.force_refresh()

    def enforce_portrait_mode(self) -> None:
        self.force_portrait_mode = True
        self.force_refresh()

    def build(self) -> Component:
        content = Card(
            PageView(),
            color="secondary",
            min_width=38,
            corner_radius=(0, 0.5, 0, 0)
        )
        if self.session.window_width > 28 or self.force_portrait_mode:
            return Container(
                content=Column(
                    Column(
                        Row(
                            Spacer(grow_x=True, grow_y=True),
                            DesktopNavigation(),
                            content,
                            Spacer(grow_x=True, grow_y=True),
                            grow_y=True
                        ),
                        Row(
                            Spacer(grow_x=True, grow_y=False),
                            Card(
                                content=Row(
                                    Text(f"EZGG LAN Manager Version {self.session[ConfigurationService].APP_VERSION} © EZ GG e.V.", fill=self.session.theme.primary_color, style=TextStyle(font_size=0.5)),
                                    Text(f"-", fill=self.session.theme.primary_color, style=TextStyle(font_size=0.5), margin_left=0.5, margin_right=0.5),
                                    Link(content=Text(f"Impressum & DSGVO", fill=self.session.theme.primary_color, style=TextStyle(font_size=0.5)), target_url="./imprint"),
                                    Text(f"-", fill=self.session.theme.primary_color, style=TextStyle(font_size=0.5), margin_left=0.5, margin_right=0.5),
                                    Link(content=Text(f"Kontakt", fill=self.session.theme.primary_color, style=TextStyle(font_size=0.5)), target_url="./contact"),
                                    align_x=0.5,
                                    align_y=0.5
                                ),
                                color=self.session.theme.neutral_color,
                                corner_radius=(0, 0, 0.5, 0.5),
                                grow_x=False,
                                grow_y=False,
                                min_height=1.2,
                                min_width=self.footer_size,
                                margin_bottom=3
                            ),
                            Spacer(grow_x=True, grow_y=False),
                            grow_y=False
                        ),
                        margin_top=4
                    )
                ),
            grow_x=True,
            grow_y=True
            )
        else:
            return Column(
                Text(
                    "Wir empfehlen auf\nmobilen Endgeräten im\nQuerformat zu arbeiten.\n\nBitte drehe dein Gerät.",
                    fill=Color.from_hex("FFFFFF"),
                    align_x=0.5,
                    align_y=0.5,
                    style=TextStyle(font_size=0.8)
                ),
                Button(
                    content=Text("Ohne drehen fortfahren", margin=0.2),
                    style="minor",
                    shape="rounded",
                    align_x=0.5,
                    align_y=0,
                    on_press=self.enforce_portrait_mode
                )
            )

