router updates for video2

Author: jqwez

README.md

@@ -1,2 +1,11 @@
 # Flet Routing Tutorial
-A video on how to use Flet's routing system
+
+A video on how I use Flet's routing system
+
+## Main Branch
+
+This shows the current example which is up to date with the tutorial explaining how to persist data accross views [coming soon](https://youtube.com/@codingjq)
+
+## Video1 Branch
+
+This branch shows the code after the first video [Routing in Flet with Python in 3 Min](https://www.youtube.com/watch?v=tvysK9zWbIM)

State.py

@@ -0,0 +1,27 @@
+class GlobalState:
+  def __init__(self):
+    self._state = dict()
+
+  def register_state(self, state):
+    self._state[state.get_key()] = state
+
+  def get_state_by_key(self, key: str):
+    return self._state.get(key)
+  
+global_state = GlobalState()
+
+class State:
+  def __init__(self, key: str, value=None):
+    self._global_state = global_state
+    self._key = key
+    self._value = value
+    self.register_with_global()
+  
+  def register_with_global(self):
+    self._global_state.register_state(self)
+
+  def get_key(self):
+    return self._key
+
+  def get_state(self):
+    return self._value

main.py

@@ -1,22 +1,15 @@
 import flet as ft
-
-from views.FletRouter import Router
+from views.routes import router
 from user_controls.app_bar import NavBar
 
 def main(page: ft.Page):
 
     page.theme_mode = "dark"
-
     page.appbar = NavBar(page)
-    myRouter = Router(page)
-
-    page.on_route_change = myRouter.route_change
-
+    page.on_route_change = router.route_change
     page.add(
-        myRouter.body
+        router.body
     )
-
     page.go('/')
 
-
 ft.app(target=main, assets_dir="assets")

requirements.txt

@@ -0,0 +1,39 @@
+from typing import Callable, Any
+import flet as ft
+from enum import Enum
+
+class DataStrategyEnum(Enum):
+    QUERY = 0
+    ROUTER_DATA = 1
+    CLIENT_STORAGE = 2
+    STATE = 3
+
+class Router:
+    def __init__(self, data_strategy=DataStrategyEnum.QUERY):
+        self.data_strategy = data_strategy
+        self.data = dict()
+        self.routes = {}
+        self.body = ft.Container()
+
+    def set_route(self, stub: str, view: Callable[[ft.Page, Any], ft.Control]):
+        self.routes[stub] = view
+    
+    def set_routes(self, route_dictionary: dict):
+        """Sets multiple routes at once. Ex: {"/": IndexView }"""
+        self.routes.update(route_dictionary)
+
+    def route_change(self, route):
+        _page = route.route.split("?")[0]
+        queries = route.route.split("?")[1:]
+
+        for item in queries:
+            key = item.split("=")[0]
+            value = item.split("=")[1]
+            self.data[key] = value
+
+        self.body.content = self.routes[_page](self)
+        self.body.update()
+
+    def get_query(self, key):
+        return self.data.get(key)
+

views/FletRouter.py

@@ -0,0 +1,37 @@
+from typing import Union
+import flet as ft
+from views.Router import Router, DataStrategyEnum
+from State import global_state
+
+def DataView(router_data: Union[Router, str, None] = None):
+    text = ft.Text("")
+    
+    if router_data and router_data.data_strategy == DataStrategyEnum.QUERY:
+        text = ft.Text("Query Data: " + router_data.get_query("data"))
+    elif router_data and router_data.data_strategy == DataStrategyEnum.ROUTER_DATA:
+        text = ft.Text("Router Data: " + router_data.data.get("data"))
+    elif router_data and router_data.data_strategy == DataStrategyEnum.CLIENT_STORAGE:
+        text = ft.Text("Client Storage: " + ft.Page().client_storage.get("data"))
+    elif router_data and router_data.data_strategy == DataStrategyEnum.STATE:
+        text = ft.Text("State: " + global_state.get_state_by_key("data").get_state())
+        
+    content = ft.Column(
+            [
+                ft.Row(
+                [
+                    ft.Text(
+                        "Data View",
+                        size=50),
+                ], 
+                alignment=ft.MainAxisAlignment.CENTER
+            ),
+                ft.Row(
+                [
+                    text,
+                ],
+                alignment=ft.MainAxisAlignment.CENTER
+                )
+            ]
+    )
+    return content
+

views/Router.py

@@ -1,28 +1,50 @@
-
+from typing import Union
 import flet as ft
+from views.Router import Router, DataStrategyEnum
+from State import global_state, State
 
-def IndexView(page):
-    
+def IndexView(router_data: Union[Router, str, None] = None):
+    
+    def send_data(e: ft.ControlEvent):
+        if text_field.value == "":
+            return
+        if router_data and router_data.data_strategy == DataStrategyEnum.QUERY:
+            e.page.go("/data", data=text_field.value)
+        elif router_data and router_data.data_strategy == DataStrategyEnum.ROUTER_DATA: 
+            router_data.data["data"] = "router_data: " + text_field.value
+            e.page.go("/data", data=text_field.value)
+        elif router_data and router_data.data_strategy == DataStrategyEnum.CLIENT_STORAGE:
+            e.page.client_storage.set("data", "client_storage :" + text_field.value)
+            e.page.go("/data")
+        elif router_data and router_data.data_strategy == DataStrategyEnum.STATE:
+            state = State("data", text_field.value)
+            e.page.go("/data")
+        else:
+            e.page.go("/data")
+            
+    text_field = ft.TextField()
+    send_button = ft.ElevatedButton("Send")
+    send_button.on_click = send_data
     content = ft.Column(
-               
             [
                 ft.Row(
                 [
                     ft.Text(
                         "Welcome to my Flet Router Tutorial",
-                        size=50)
+                        size=50),
                 ], 
                 alignment=ft.MainAxisAlignment.CENTER
-            )
+            ),
+                ft.Row(
+                [
+                    text_field,
+                    send_button
+                ],
+                alignment=ft.MainAxisAlignment.CENTER
+                )
             ]
-    
-    )
-    
-    
-    
-    
-    
-    
+        )
 
     return content
 
+

views/data_view.py

@@ -1,7 +1,7 @@
 
 import flet as ft
 
-def ProfileView(page):
+def ProfileView(*args):
 
     content = ft.Column(
 

views/index_view.py

@@ -0,0 +1,14 @@
+from views.Router import Router
+from views.index_view import IndexView
+from views.profile_view import ProfileView
+from views.settings_view import SettingsView
+from views.data_view import DataView
+
+router = Router()
+
+router.routes = {
+  "/": IndexView,
+  "/profile": ProfileView,
+  "/settings": SettingsView,
+  "/data": DataView
+}