Merge pull request #1 from Respo/app

trying with new app definition

moon.mod.json

@@ -2,7 +2,7 @@
   "name": "tiye/respo-workflow",
   "version": "0.1.0",
   "deps": {
-    "tiye/respo": "0.0.9",
+    "tiye/respo": "0.0.13",
     "tiye/dom-ffi": "0.0.4"
   },
   "readme": "README.md",

src/main/counter.mbt

@@ -54,35 +54,35 @@ fn comp_counter(
     }
     dispatch.run!(ActionOp::StatesChange(c))
   }
-  @respo_node.div(
+  div(
     [
-      @respo_node.div(
+      div(
         [
-          @respo_node.button(
+          button(
             inner_text="demo inc",
-            class_name=@respo.ui_button,
-            style=@respo_node.RespoStyle::new(margin=Px(4)),
+            class_name=ui_button,
+            style=respo_style(margin=Px(4)),
             event={}..set(Click, on_inc),
           ),
-          @respo_node.button(
+          button(
             inner_text="demo dec",
-            class_name=@respo.ui_button,
-            style=@respo_node.RespoStyle::new(margin=Px(4)),
+            class_name=ui_button,
+            style=respo_style(margin=Px(4)),
             event={}..set(Click, on_dec),
           ),
-          @respo_node.button(
+          button(
             inner_text="demo inc twice",
-            class_name=@respo.ui_button,
-            style=@respo_node.RespoStyle::new(margin=Px(4)),
+            class_name=ui_button,
+            style=respo_style(margin=Px(4)),
             event={}..set(Click, on_inc_twice),
           ),
         ],
       ),
-      @respo_node.div(
+      div(
         [
-          @respo_node.span(
+          span(
             inner_text="value is: " + counted.to_string(),
-            style=@respo_node.RespoStyle::new(
+            style=respo_style(
               color=Hsluv(270, 100, 40),
               font_family="Menlo",
               font_size=counted.reinterpret_as_uint() + 10,
@@ -91,14 +91,11 @@ fn comp_counter(
           ),
         ],
       ),
-      @respo_node.div(
+      div(
         [
-          @respo_node.span(inner_text="local state: \{counted}", []),
+          span(inner_text="local state: \{counted}", []),
           @respo_node.br(),
-          @respo_node.span(
-            inner_text="global state: " + global_counted.to_string(),
-            [],
-          ),
+          span(inner_text="global state: " + global_counted.to_string(), []),
         ],
       ),
     ],

src/main/main.mbt

@@ -1,117 +1,42 @@
 let app_store_key : String = "mbt-workflow"
 
-struct App {
-  store : Ref[Store]
-  mount_target : @dom_ffi.Node
-}
-
-fn App::get_store(self : App) -> Ref[Store] {
-  self.store
-}
-
-fn App::get_mount_target(self : App) -> @dom_ffi.Node {
-  self.mount_target
-}
-
-fn App::dispatch(self : App, op : ActionOp) -> Unit {
-  // TODO intent
-  @dom_ffi.log("Action: " + op.to_string())
-  self.store.val.update(op)
-}
-
-fn App::view(
-  self : App
+fn view(
+  store : Store
 ) -> @respo_node.RespoNode[ActionOp]!@respo_node.RespoCommonError {
   if false {
     raise @respo_node.RespoCommonError("TODO")
   }
-  let store = self.store.val
   // @dom_ffi.log("Store to render: " + store.to_json().stringify(indent=2))
   let states = store.get_states()
-  @respo_node.div(
+  div(
     class_name=@respo.ui_global,
-    style=@respo_node.RespoStyle::new(padding=Px(12)),
+    style=respo_style(padding=Px(12)),
     [comp_counter(states.pick("counter"), store.counted)],
   )
 }
 
-fn pick_storage_key() -> String {
-  app_store_key
-}
-
-fn try_load_storage(self : App) -> Unit!@respo_node.RespoCommonError {
-  let window = @dom_ffi.window()
-  let storage = window.local_storage()
-  let key = pick_storage_key()
-  match storage.get_item(key) {
-    Some(s) => {
-      let store = self.get_store()
-      store.val = try_from_string!(s)
-    }
-    None => raise @respo_node.RespoCommonError("No storage")
-  }
-}
-
-/// backup store to local storage before unload
-
-fn backup_model_beforeunload(self : App) -> Unit {
-  let window = @dom_ffi.window()
-  let storage = window.local_storage()
-  let p = pick_storage_key()
-  let store = self.get_store().val
-  let beforeunload = fn(_e : @dom_ffi.BeforeUnloadEvent) {
-    let content = store.to_json().stringify(indent=2)
-    // util::log!("before unload {} {}", p, content);
-    storage.set_item(p, content)
-  }
-  window.set_onbeforeunload(beforeunload)
-}
-
 fn main {
-  let app : App = {
-    mount_target: @dom_ffi.window()
+  let window = @dom_ffi.window()
+  let mount_target = window
     .document()
     .query_selector(".app")
-    .reinterpret_as_node(),
-    store: Ref::new(Store::default()),
-  }
-  let ret = app.try_load_storage?()
-  match ret {
-    Ok(_) => ()
-    Err(e) => @dom_ffi.error_log(e.to_string())
+    .reinterpret_as_node()
+  let app : @respo.RespoApp[Store] = {
+    store: Ref::new(@respo.try_load_storage(app_store_key)),
+    mount_target,
+    storage_key: app_store_key,
   }
   app.backup_model_beforeunload()
-  @dom_ffi.log("store: " + app.store.val.to_json().stringify(indent=2))
-  app.render_loop()
-}
-
-fn App::render_loop(self : App) -> Unit {
-  let mount_target = self.mount_target
-  // let store_to_action = global_store.to_owned()
-
-  let dispatch_action = fn(op : ActionOp) -> Unit!@respo_node.RespoCommonError {
-    // @dom_ffi.log("Action: \{op.to_string()}")
-    // @dom_ffi.log("Global store: \{global_store.val.to_json()}")
-
-    // Self::dispatch(store_to_action.to_owned(), op)?;
-    self.store.val.update(op)
-    match op {
-      Noop => raise @respo_node.RespoCommonError("TODO")
-      _ => ()
-    }
-  }
-  let renderer = fn() -> @respo_node.RespoNode[_]!@respo_node.RespoCommonError {
-    self.view!()
-  }
-  let ret = @respo.render_node?(
-    mount_target,
-    fn() { self.store },
-    renderer,
-    dispatch_action,
-    Some(100),
+  // @dom_ffi.log("store: " + app.store.val.to_json().stringify(indent=2))
+  app.render_loop(
+    fn() { view!(app.store.val) },
+    fn(op) {
+      @dom_ffi.log("Action: " + op.to_string())
+      app.store.val.update(op)
+    },
   )
-  match ret {
-    Ok(_) => ()
-    Err(e) => @dom_ffi.error_log(e.to_string())
-  }
+  let dev_mode = @dom_ffi.get_url_search_params(
+    window.get_location().get_search(),
+  ).get("mode")
+  @dom_ffi.log("dev mode: " + dev_mode.to_string())
 }

src/main/moon.pkg.json

@@ -1,8 +1,23 @@
 {
   "is-main": true,
   "import": [
-    { "path": "tiye/respo/lib", "alias": "respo" },
-    { "path": "tiye/respo/lib/node", "alias": "respo_node" },
+    {
+      "path": "tiye/respo/lib",
+      "alias": "respo",
+      "value": ["ui_global", "ui_button"]
+    },
+    {
+      "path": "tiye/respo/lib/node",
+      "alias": "respo_node",
+      "value": [
+        "div",
+        "button",
+        "span",
+        "respo_attrs",
+        "respo_style",
+        "declare_static_style"
+      ]
+    },
     { "path": "tiye/dom-ffi/lib", "alias": "dom_ffi" }
   ]
 }