status-im
/
status-mobile
mirror of https://github.com/status-im/status-mobile.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add loading spinner

This commit is contained in:
virvar 2016-03-17 23:48:52 +03:00
parent 15eb6f4c00
commit b10b44988c
5 changed files with 56 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -11,6 +11,7 @@
"react-native-contacts": "^0.2.1", "react-native-contacts": "^0.2.1",
"react-native-i18n": "0.0.8", "react-native-i18n": "0.0.8",
"react-native-invertible-scroll-view": "^0.2.0", "react-native-invertible-scroll-view": "^0.2.0",
"react-native-loading-spinner-overlay": "0.0.6",
"realm": "^0.10.0" "realm": "^0.10.0"
} }
} }

2
src/messenger/android/core.cljs
View File

@ -40,7 +40,7 @@
(defui AppRoot (defui AppRoot
static om/IQuery static om/IQuery
(query [this] (query [this]
'[:contacts-ds :user-phone-number :confirmation-code]) '[:loading :contacts-ds :user-phone-number :confirmation-code])
Object Object
(render [this] (render [this]
(navigator (navigator

71
src/messenger/android/login.cljs
View File

@ -9,6 +9,7 @@
[messenger.comm.intercom :as intercom :refer [set-user-phone-number]] [messenger.comm.intercom :as intercom :refer [set-user-phone-number]]
[messenger.utils.utils :refer [log toast http-post]] [messenger.utils.utils :refer [log toast http-post]]
[messenger.utils.resources :as res] [messenger.utils.resources :as res]
[messenger.utils.ui-utils :as ui]
[messenger.android.sign-up-confirm :refer [sign-up-confirm]] [messenger.android.sign-up-confirm :refer [sign-up-confirm]]
[messenger.constants :refer [ethereum-rpc-url]])) [messenger.constants :refer [ethereum-rpc-url]]))
@ -18,11 +19,13 @@
(def country-code "US") (def country-code "US")
(defn show-confirm-view [] (defn show-confirm-view []
(swap! state/app-state assoc :loading false)
(binding [state/*nav-render* false] (binding [state/*nav-render* false]
(.replace @nav-atom (clj->js {:component sign-up-confirm (.replace @nav-atom (clj->js {:component sign-up-confirm
:name "sign-up-confirm"})))) :name "sign-up-confirm"}))))
(defn sign-up [] (defn sign-up []
(swap! state/app-state assoc :loading true)
(let [app-state (state/state) (let [app-state (state/state)
phone-number (:user-phone-number app-state) phone-number (:user-phone-number app-state)
whisper-identity (:user-whisper-identity app-state)] whisper-identity (:user-whisper-identity app-state)]
@ -35,42 +38,46 @@
(defui Login (defui Login
static om/IQuery static om/IQuery
(query [this] (query [this]
'[:user-phone-number :user-whisper-identity]) '[:user-phone-number :user-whisper-identity :loading])
Object Object
(render [this] (render [this]
(let [{:keys [user-phone-number user-whisper-identity]} (om/props this) (let [{:keys [user-phone-number user-whisper-identity loading]} (om/props this)
{:keys [nav]} (om/get-computed this)] {:keys [nav]} (om/get-computed this)]
(reset! nav-atom nav) (reset! nav-atom nav)
(view (view
{:style {:flex 1 {:style {:flex 1}}
:backgroundColor "white"}} (view
(toolbar-android {:logo res/logo-icon {:style {:flex 1
:title "Login" :backgroundColor "white"}}
:titleColor "#4A5258" (toolbar-android {:logo res/logo-icon
:style {:backgroundColor "white" :title "Login"
:height 56 :titleColor "#4A5258"
:elevation 2}}) :style {:backgroundColor "white"
(view {:style {;; :alignItems "center" :height 56
}} :elevation 2}})
(text-input {:underlineColorAndroid "#9CBFC0" (view {:style { ;; :alignItems "center"
:placeholder "Enter your phone number" }}
:keyboardType "phone-pad" (text-input {:underlineColorAndroid "#9CBFC0"
:onChangeText (fn [value] :placeholder "Enter your phone number"
(update-phone-number value)) :keyboardType "phone-pad"
:style {:flex 1 :onChangeText (fn [value]
:marginHorizontal 18 (update-phone-number value))
:lineHeight 42 :style {:flex 1
:fontSize 14 :marginHorizontal 18
:fontFamily "Avenir-Roman" :lineHeight 42
:color "#9CBFC0"}} :fontSize 14
user-phone-number) :fontFamily "Avenir-Roman"
(touchable-highlight {:onPress #(sign-up) :color "#9CBFC0"}}
:style {:alignSelf "center" user-phone-number)
:borderRadius 7 (touchable-highlight {:onPress #(sign-up)
:backgroundColor "#E5F5F6" :style {:alignSelf "center"
:width 100}} :borderRadius 7
(text {:style {:marginVertical 10 :backgroundColor "#E5F5F6"
:textAlign "center"}} :width 100}}
"Sign up"))))))) (text {:style {:marginVertical 10
:textAlign "center"}}
"Sign up"))))
(when loading
(ui/spinner {:visible true}))))))
(def login (om/factory Login)) (def login (om/factory Login))

3
src/messenger/state.cljs
View File

@ -10,6 +10,7 @@
(set! js/React (js/require "react-native")) (set! js/React (js/require "react-native"))
(defonce app-state (atom {:component nil (defonce app-state (atom {:component nil
:loading false
:user-phone-number nil :user-phone-number nil
:user-whisper-identity nil :user-whisper-identity nil
:confirmation-code nil :confirmation-code nil
@ -42,4 +43,4 @@
(defn pub-sub-publisher [app] (get-in app pub-sub-bus-path)) (defn pub-sub-publisher [app] (get-in app pub-sub-bus-path))
(defn kv-store [] (defn kv-store []
(get-in @app-state simple-store-path)) (get-in @app-state simple-store-path))

13
src/messenger/utils/ui_utils.cljs Normal file
View File

@ -0,0 +1,13 @@
(ns messenger.utils.ui-utils
;; (:require-macros
;; [natal-shell.components :refer [view text image touchable-highlight list-view
;; toolbar-android text-input]]
;; [natal-shell.core :refer [with-error-view]])
;; (:require [om.next :as om :refer-macros [defui]])
)
(set! js/Spinner (.-default (js/require "react-native-loading-spinner-overlay")))
(defn spinner [props]
(js/React.createElement js/Spinner
(clj->js props)))