From 68f7a398872275b9f09e5ec2f767f81543636ee1 Mon Sep 17 00:00:00 2001
From: Andreas Tzionis <andy0n7@gmail.com>
Date: Fri, 10 Jan 2025 16:45:38 +0200
Subject: [PATCH] video diff

---
 client/src/lib.rs | 30 +++++++++++++++++++++++++++++-
 1 file changed, 29 insertions(+), 1 deletion(-)

diff --git a/client/src/lib.rs b/client/src/lib.rs
index 97d8881..69942b0 100644
--- a/client/src/lib.rs
+++ b/client/src/lib.rs
@@ -178,6 +178,9 @@ fn tasks_page() -> El {
         .child(El::new("button").text("about").classes(&["underline", "hover:opacity-50", "m-2"]).on("click", move |_| {
             ROUTER.with(|s| { s.borrow().navigate("/about"); });
         }))
+        .child(El::new("button").text("new page").classes(&["underline", "hover:opacity-50", "m-2"]).on("click", move |_| {
+            ROUTER.with(|s| { s.borrow().navigate("/newpage"); });
+        }))
         .child(container_component());
     layout_component(&[body])
 }
@@ -191,6 +194,31 @@ fn about_page() -> El {
     layout_component(&[body])
 }
 
+fn new_page() -> El {
+
+    let signal_text = Signal::new("-".to_owned());
+
+    let body = El::new("div")
+        .child(El::new("button").text("tasks").classes(&["underline", "hover:opacity-50", "m-2"]).on("click", move |_| {
+            ROUTER.with(|s| { s.borrow().navigate("/tasks"); });
+        }))
+        .child(El::new("br"))
+        .child(El::new("button").text("api call").classes(&["bg-blue-500", "text-white", "p-2", "rounded", "hover:opacity-50", "m-2"]).on("click", move |_| {
+
+            Runtime::block_on(async move {
+                let float = Js::invoke("return Math.random()", &[]).to_num().unwrap();
+                let url = format!("https://pokeapi.co/api/v2/pokemon/{}", (float * 151f64).round());
+                let result = fetch_json("GET", &url, None).await.unwrap();
+                signal_text.set(result["name"].to_string());
+            });
+        }))
+        .child(El::new("span").text("-").classes(&["ml-2"]).once(move |el| {
+            signal_text.on(move |v| { Js::invoke("{}.innerHTML = {}", &[el.element.into(), v.to_string().into()]); });
+        }))
+        .child(El::new("div").text("This is the new page").classes(&["m-2"]));
+    layout_component(&[body])
+}
+
 fn layout_component(children: &[El]) -> El {
     El::new("div")
         .classes(&["m-2", "mt-8", "text-center"])
@@ -203,6 +231,6 @@ pub fn main() {
     std::panic::set_hook(Box::new(|e| { Js::invoke("console.log({})", &[e.to_string().into()]); }));
 
     // init router
-    let pages = &[Page::new("/tasks", tasks_page(), None), Page::new("/about", about_page(), None)];
+    let pages = &[Page::new("/tasks", tasks_page(), None), Page::new("/about", about_page(), None), Page::new("/newpage", new_page(), None)];
     ROUTER.with(|s| { *s.borrow_mut() = Router::new("body", pages); });
 }