status-im
/
status-react
mirror of https://github.com/status-im/status-react.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-i18n": "0.0.8",
"react-native-invertible-scroll-view": "^0.2.0",
"react-native-loading-spinner-overlay": "0.0.6",
"realm": "^0.10.0"
}
}

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

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

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

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

3
src/messenger/state.cljs
View File

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