add WIP frontend

src/EzLanManager.py

@@ -1,33 +1,43 @@
+from __future__ import annotations
 import logging
 
+from pathlib import Path
+from typing import *  # type: ignore
+
+import rio
 from from_root import from_root
 
-from src.ez_lan_manager.services.AccountingService import AccountingService
-from src.ez_lan_manager.services.CateringService import CateringService
-from src.ez_lan_manager.services.ConfigurationService import ConfigurationService
-from src.ez_lan_manager.services.DatabaseService import DatabaseService
-from src.ez_lan_manager.services.MailingService import MailingService
-from src.ez_lan_manager.services.NewsService import NewsService
-from src.ez_lan_manager.services.SeatingService import SeatingService
-from src.ez_lan_manager.services.TicketingService import TicketingService
-from src.ez_lan_manager.services.UserService import UserService
-from src.ez_lan_manager.types.CateringMenuItem import CateringMenuItemCategory, CateringMenuItem
-from src.ez_lan_manager.types.CateringOrder import CateringOrderStatus
+from src.ez_lan_manager import pages, init_services
 
 logger = logging.getLogger(__name__.split(".")[-1])
 
 if __name__ == "__main__":
-    logging.basicConfig(level=logging.DEBUG)
-    configuration_service = ConfigurationService(from_root("config.toml"))
-    lan_info = configuration_service.get_lan_info()
-    seating_config = configuration_service.get_seating_configuration()
-    db_config = configuration_service.get_database_configuration()
-    db_service = DatabaseService(db_config)
-    user_service = UserService(db_service)
-    accounting_service = AccountingService(db_service)
-    news_service = NewsService(db_service)
-    mailing_service = MailingService(configuration_service.get_mailing_service_configuration())
-    ticketing_service = TicketingService(lan_info, db_service, accounting_service)
-    seating_service = SeatingService(seating_config, lan_info, db_service, ticketing_service)
-    catering_service = CateringService(db_service, accounting_service, user_service)
+    theme = rio.Theme.from_colors(
+        primary_color=rio.Color.from_hex("ffffff"),
+        secondary_color=rio.Color.from_hex("018786"),
+        neutral_color=rio.Color.from_hex("1e1e1e"),
+        background_color=rio.Color.from_hex("121212"),
+        hud_color=rio.Color.from_hex("02dac5"),
+        text_color=rio.Color.from_hex("018786"),
+        mode="dark",
+        corner_radius_small=0,
+        corner_radius_medium=0,
+        corner_radius_large=0,
+        font=rio.Font(from_root("src/ez_lan_manager/assets/fonts/joystix.otf"))
+    )
 
+    app = rio.App(
+        name='',
+        pages=[
+            rio.Page(
+                name="News",
+                page_url='',
+                build=pages.NewsPage,
+            ),
+        ],
+        theme=theme,
+        assets_dir=Path(__file__).parent / "assets",
+        default_attachments=init_services()
+    )
+
+    app.run_as_web_server()

src/ez_lan_manager/__init__.py

@@ -1,2 +1,30 @@
+import logging
+
+from from_root import from_root
+
 from src.ez_lan_manager.services import *
+from src.ez_lan_manager.services.AccountingService import AccountingService
+from src.ez_lan_manager.services.CateringService import CateringService
+from src.ez_lan_manager.services.ConfigurationService import ConfigurationService
+from src.ez_lan_manager.services.DatabaseService import DatabaseService
+from src.ez_lan_manager.services.MailingService import MailingService
+from src.ez_lan_manager.services.NewsService import NewsService
+from src.ez_lan_manager.services.SeatingService import SeatingService
+from src.ez_lan_manager.services.TicketingService import TicketingService
+from src.ez_lan_manager.services.UserService import UserService
 from src.ez_lan_manager.types import *
+
+# Inits services in the correct order
+def init_services() -> tuple[AccountingService, CateringService, ConfigurationService, DatabaseService, MailingService, NewsService, SeatingService, TicketingService, UserService]:
+    logging.basicConfig(level=logging.DEBUG)
+    configuration_service = ConfigurationService(from_root("config.toml"))
+    db_service = DatabaseService(configuration_service.get_database_configuration())
+    user_service = UserService(db_service)
+    accounting_service = AccountingService(db_service)
+    news_service = NewsService(db_service)
+    mailing_service = MailingService(configuration_service.get_mailing_service_configuration())
+    ticketing_service = TicketingService(configuration_service.get_lan_info(), db_service, accounting_service)
+    seating_service = SeatingService(configuration_service.get_seating_configuration(), configuration_service.get_lan_info(), db_service, ticketing_service)
+    catering_service = CateringService(db_service, accounting_service, user_service)
+
+    return accounting_service, catering_service, configuration_service, db_service, mailing_service, news_service, seating_service, ticketing_service, user_service

src/ez_lan_manager/components/DesktopNavigation.py

@@ -0,0 +1,60 @@
+from rio import *
+
+from src.ez_lan_manager import ConfigurationService
+from src.ez_lan_manager.components.LoginBox import LoginBox
+
+
+class DesktopNavigationButton(Component):
+    STYLE = TextStyle(fill=Color.from_hex("02dac5"), font_size=0.9)
+    label: str
+    target_url: str
+    open_new_tab: bool = False
+
+    def build(self) -> Component:
+        return Link(
+                content=Button(
+                    content=Text(self.label, style=self.STYLE),
+                    shape="rectangle",
+                    style="minor",
+                    color="secondary",
+                    grow_x=True,
+                    margin_left=0.6,
+                    margin_right=0.6,
+                    margin_top=0.6
+            ),
+            target_url=self.target_url,
+            open_in_new_tab=self.open_new_tab
+        )
+
+
+class DesktopNavigation(Component):
+    def build(self) -> Component:
+        lan_info = self.session[ConfigurationService].get_lan_info()
+        return Card(
+            Column(
+                Text(lan_info.name, align_x=0.5, margin_top=0.3, style=TextStyle(fill=self.session.theme.hud_color, font_size=2.5)),
+                Text(f"Edition {lan_info.iteration}", align_x=0.5, style=TextStyle(fill=self.session.theme.hud_color, font_size=1.2), margin_top=0.3, margin_bottom=2),
+                LoginBox(),
+                DesktopNavigationButton("News", "./news"),
+                Spacer(min_height=1),
+                DesktopNavigationButton(f"Über {lan_info.name} {lan_info.iteration}", "./overview"),
+                DesktopNavigationButton("Ticket kaufen", "./buy_ticket"),
+                DesktopNavigationButton("Sitzplan", "./seating"),
+                DesktopNavigationButton("Catering", "./catering"),
+                DesktopNavigationButton("Teilnehmer", "./guests"),
+                DesktopNavigationButton("Turniere", "./tournaments"),
+                DesktopNavigationButton("FAQ", "./faq"),
+                DesktopNavigationButton("Regeln & AGB", "./rules-and-agb"),
+                Spacer(min_height=1),
+                DesktopNavigationButton("Die EZ GG e.V.", "https://ezgg-ev.de/about", open_new_tab=True),
+                DesktopNavigationButton("Kontakt", "./contact"),
+                DesktopNavigationButton("Impressum & DSGVO", "./imprint"),
+                Spacer(min_height=1),
+                align_y=0
+            ),
+            color=self.session.theme.neutral_color,
+            min_width=15,
+            grow_y=True,
+            corner_radius=(0.5, 0, 0, 0),
+            margin_right=0.1
+        )

src/ez_lan_manager/components/LoginBox.py

@@ -0,0 +1,56 @@
+from rio import Component, Card, Column, Text, Row, Rectangle, Button, TextStyle, Color, Spacer, TextInput
+
+
+class LoginBox(Component):
+    TEXT_STYLE = TextStyle(fill=Color.from_hex("02dac5"), font_size=0.9)
+    def build(self) -> Component:
+        return Rectangle(
+            content=Column(
+                TextInput(
+                    text="",
+                    label="Benutzername",
+                    accessibility_label = "Benutzername",
+                    min_height=0.5
+                ),
+                TextInput(
+                    text="",
+                    label="Passwort",
+                    accessibility_label="Passwort",
+                    is_secret=True
+                ),
+                Column(
+                    Row(
+                        Button(
+                            Text("LOGIN", style=self.TEXT_STYLE, justify="center"),
+                            shape="rectangle",
+                            style="minor",
+                            color="secondary",
+                            margin_bottom=0.4
+                        )
+                    ),
+                    Row(
+                        Button(
+                            Text("REG", style=self.TEXT_STYLE, justify="center"),
+                            shape="rectangle",
+                            style="minor",
+                            color="secondary"
+                        ),
+                        Spacer(),
+                        Button(
+                            Text("LST PWD",style=self.TEXT_STYLE, justify="center"),
+                            shape="rectangle",
+                            style="minor",
+                            color="secondary"
+                        ),
+                        proportions=(49, 2, 49)
+                    )
+                ),
+                spacing=0.4
+            ),
+            fill=Color.TRANSPARENT,
+            min_height=8,
+            min_width=12,
+            align_x=0.5,
+            margin_top=0.3,
+            margin_bottom=2
+        )

src/ez_lan_manager/components/NewsPost.py

@@ -0,0 +1,54 @@
+from rio import Component, Rectangle, Text, TextStyle, Column, Row
+
+
+class NewsPost(Component):
+    title: str = ""
+    text: str = ""
+    date: str = ""
+
+    def build(self) -> Component:
+        return Rectangle(
+            content=Column(
+                Row(
+                    Text(
+                        self.title,
+                        align_x=0,
+                        grow_x=True,
+                        margin=2,
+                        margin_bottom=0,
+                        style=TextStyle(
+                            fill=self.session.theme.background_color,
+                            font_size=1.3
+                        ),
+                        wrap=False
+                    ),
+                    Text(
+                        self.date,
+                        margin=2,
+                        align_x=1,
+                        style=TextStyle(
+                            fill=self.session.theme.background_color,
+                            font_size=0.6
+                        ),
+                        wrap=True
+                    )
+                ),
+                Text(
+                    self.text,
+                    margin=2,
+                    style=TextStyle(
+                        fill=self.session.theme.background_color
+                    ),
+                    wrap=True
+                )
+            ),
+            fill=self.session.theme.primary_color,
+            margin_left=1,
+            margin_right=1,
+            margin_top=2,
+            margin_bottom=1,
+            shadow_radius=0.5,
+            shadow_color=self.session.theme.hud_color,
+            shadow_offset_y=0,
+            corner_radius=0.2
+        )

src/ez_lan_manager/pages/BasePage.py

@@ -0,0 +1,65 @@
+from __future__ import annotations
+
+from typing import *  # type: ignore
+
+from rio import Component, event, Spacer, Card, Container, Column, Row, Rectangle, TextStyle, Color, Text
+
+from src.ez_lan_manager.components.DesktopNavigation import DesktopNavigation
+
+class BasePage(Component):
+    content: Component
+
+    @event.on_window_size_change
+    async def on_window_size_change(self):
+        await self.force_refresh()
+
+    def build(self) -> Component:
+        if self.content is None:
+            content = Spacer()
+        else:
+            content = Card(
+                self.content,
+                color="secondary",
+                min_width=38,
+                corner_radius=(0, 0.5, 0, 0)
+            )
+        if self.session.window_width > 28:
+            return Container(
+                content=Column(
+                    Row(),
+                    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=Text("EZ LAN Manager Version 0.0.1 © EZ GG e.V.", align_x=0.5, align_y=0.5, style=TextStyle(fill=self.session.theme.primary_color, font_size=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=53.1
+                            ),
+                            Spacer(grow_x=True, grow_y=False),
+                            grow_y=False
+                        )
+                    ),
+                    Row(),
+                    proportions=[4, 92, 4]
+                ),
+            grow_x=True,
+            grow_y=True
+            )
+        else:
+            return Text(
+                "Der EZ LAN Manager wird\nauf mobilen Endgeräten nur\nim Querformat unterstützt.\nBitte drehe dein Gerät.",
+                align_x=0.5,
+                align_y=0.5,
+                style=TextStyle(fill=Color.from_hex("FFFFFF"), font_size=0.8)
+            )

src/ez_lan_manager/pages/NewsPage.py

@@ -0,0 +1,29 @@
+from rio import Text, Column, Rectangle, TextStyle, Component
+
+from src.ez_lan_manager.components.NewsPost import NewsPost
+from src.ez_lan_manager.pages import BasePage
+
+class NewsPage(Component):
+    def build(self) -> Component:
+        return BasePage(
+            content=Column(
+                NewsPost(
+                    title="EZ LAN Manager",
+                    text="Der EZ LAN Manager ist die offizielle Software der EZ GG e.V. um LAn-Parties zu verwalten."
+                         "Ist schon echt cool wie der funktioniert! So kann LAN Party richtig geschmeidig ablaufen.",
+                    date="23.08.2024"
+                ),
+                NewsPost(
+                    title="Alkohöl",
+                    text="Der Verein 'EZ GG e.V.' ist bekannt für seinen unstillbaren Durst. "
+                         "Bei jedem Treffen fließt der Alkohol in Strömen – egal ob Bier, Wein oder Hochprozentiges. "
+                         "Kein Glas bleibt lange leer, und bevor der Pegel auch nur ansatzweise sinkt, "
+                         "wird schon nachgefüllt. Die Mitglieder feiern ausgiebig und trinken dabei so viel, "
+                         "dass die Vorräte nie lange halten. Bei jeder Gelegenheit wird angestoßen, "
+                         "die Stimmung steigt und der Alkohol fließt ohne Ende. "
+                         "Ihr Motto: 'Kein Abend ohne reichlich Alkohol!'",
+                    date="23.08.2024"
+                ),
+                align_y=0,
+            )
+        )

src/ez_lan_manager/pages/__init__.py

@@ -0,0 +1,2 @@
+from .BasePage import BasePage
+from .NewsPage import NewsPage