added navigator

syng-im/env/dev/env/android/main.cljs

@@ -1,16 +1,17 @@
  (ns ^:figwheel-no-load env.android.main
-  (:require [reagent.core :as r]
+   (:require [reagent.core :as r]
-            [syng-im.android.core :as core]
+             [syng-im.android.core :refer [app-root]]
-            [figwheel.client :as figwheel :include-macros true]))
+             [figwheel.client :as figwheel :include-macros true]
+             [syng-im.android.core :as core]))
 
  (enable-console-print!)
 
 (def cnt (r/atom 0))
-(defn reloader [] @cnt [core/app-root])
+(defn reloader [] @cnt [app-root])
 (def root-el (r/as-element [reloader]))
 
 (figwheel/watch-and-reload
- :websocket-url "ws://localhost:3449/figwheel-ws"
+ :websocket-url "ws://10.0.3.2:3449/figwheel-ws"
  :heads-up-display true
  :jsload-callback #(swap! cnt inc))
 

syng-im/project.clj

@@ -8,7 +8,8 @@
                  [reagent "0.5.1" :exclusions [cljsjs/react]]
                  [re-frame "0.6.0"]
                  [prismatic/schema "1.0.4"]
-                 [syng-im/protocol "0.1.1"]]
+                 [syng-im/protocol "0.1.1"]
+                 [natal-shell "0.1.6"]]
   :plugins [[lein-cljsbuild "1.1.1"]
             [lein-figwheel "0.5.0-2"]]
   :clean-targets ["target/" "index.ios.js" "index.android.js"]

syng-im/src/syng_im/android/core.cljs

@@ -1,13 +1,47 @@
 (ns syng-im.android.core
+  (:require-macros
+    [natal-shell.back-android :refer [add-event-listener remove-event-listener]])
   (:require [reagent.core :as r :refer [atom]]
+            [cljs.core :as cljs]
             [re-frame.core :refer [subscribe dispatch dispatch-sync]]
             [syng-im.handlers]
             [syng-im.subs]
-            [syng-im.components.app-root :refer [app-root]]
+            [syng-im.components.react :refer [navigator app-registry]]
-            [syng-im.components.react :refer [view text image touchable-highlight]]
+            [syng-im.components.chat :refer [chat]]
-            [syng-im.components.react :refer [app-registry]]))
+            [syng-im.utils.logging :as log]))
 
 
+(def ^{:dynamic true :private true} *nav-render*
+  "Flag to suppress navigator re-renders from outside om when pushing/popping."
+  true)
+
+(def back-button-handler (cljs/atom {:nav     nil
+                                     :handler nil}))
+
+(defn init-back-button-handler! [nav]
+  (let [handler @back-button-handler]
+    (when-not (= nav (:nav handler))
+      (remove-event-listener "hardwareBackPress" (:handler handler))
+      (let [new-listener (fn []
+                           (binding [*nav-render* false]
+                             (when (< 1 (.-length (.getCurrentRoutes nav)))
+                               (.pop nav)
+                               true)))]
+        (reset! back-button-handler {:nav     nav
+                                     :handler new-listener})
+        (add-event-listener "hardwareBackPress" new-listener)))))
+
+(defn app-root []
+  [navigator {:initial-route (clj->js {:view-id :chat})
+              :render-scene  (fn [route nav]
+                               (log/debug "route" route)
+                               (when *nav-render*
+                                 (let [{:keys [view-id]} (js->clj route :keywordize-keys true)
+                                       view-id (keyword view-id)]
+                                   (init-back-button-handler! nav)
+                                   (case view-id
+                                     :chat (r/as-element [chat {:navigator nav}])))))}])
+
 (defn init []
   (dispatch-sync [:initialize-db])
   (dispatch [:initialize-protocol])

syng-im/src/syng_im/components/chat.cljs

@@ -1,14 +1,15 @@
-(ns syng-im.components.app-root
+(ns syng-im.components.chat
   (:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
-            [syng-im.components.react :refer [view text image touchable-highlight]]))
+            [syng-im.components.react :refer [view text image touchable-highlight navigator]]
-
+            [syng-im.utils.logging :as log]))
 
 (def logo-img (js/require "./images/cljs.png"))
 
 (defn alert [title]
   (.alert (.-Alert js/React) title))
 
-(defn app-root []
+
+(defn chat [{:keys [navigator]}]
   (let [greeting (subscribe [:get-greeting])]
     (fn []
       [view {:style {:flex-direction "column" :margin 40 :align-items "center"}}
@@ -18,4 +19,3 @@
        [touchable-highlight {:style    {:background-color "#999" :padding 10 :border-radius 5}
                              :on-press #(alert "HELLO!")}
         [text {:style {:color "white" :text-align "center" :font-weight "bold"}} "press me"]]])))
-