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

Updated QR code layout and #462 fix

This commit is contained in:
Alexander Pantyuhov 2016-11-17 15:02:55 +03:00
parent 5fe3a1b91a
commit cdfa395b34
13 changed files with 120 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/status_im/accounts/handlers.cljs
View File

@ -17,7 +17,8 @@
[status-im.accounts.statuses :as statuses]
[status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.constants :refer [console-chat-id]]
[status-im.utils.scheduler :as s]))
[status-im.utils.scheduler :as s]
[status-im.navigation.handlers :as nav]))
(defn save-account [_ [_ account]]
@ -140,3 +141,10 @@
db))
(register-handler :console-create-account console-create-account)
(defmethod nav/preload-data! :qr-code-view
[{:keys [current-account-id] :as db} [_ _ {:keys [contact qr-source amount?]}]]
(assoc db :qr-modal {:contact (or contact
(get-in db [:accounts current-account-id]))
:qr-source qr-source
:amount? amount?}))

29
src/status_im/accounts/styles.cljs
View File

@ -49,6 +49,11 @@
:alignItems :center
:justifyContent :center})
(def qr-photo-container
(merge photo-container
{:margin-left 8
:margin-right 4}))
(def photo-image
{:width 36
:height 36
@ -121,8 +126,7 @@
:flex-direction :column})
(def account-toolbar
{:background-color "#2f3031"
:padding-bottom 45})
{:background-color "#2f3031"})
(def wallet-account-container
{:flex 1
@ -132,21 +136,18 @@
:justifyContent :center})
(def qr-code
{:align-items :center
:padding-vertical 40})
{:background-color "#2f3031"
:flex 1
:align-items :center
:justify-content :center})
(def footer
{:position :absolute
:left 0
:right 0
:bottom 0
:height 166
:background-color "#2f3031"})
{:background-color "#2f3031"})
(def wallet-info
{:align-items :center
:padding-top 42
:padding-bottom 20})
:padding-bottom 20
:padding-top 20})
(def wallet-name-text
{:color color-white
@ -160,8 +161,8 @@
{:flex 1
:flex-direction :column
:align-items :center
:height 60
:padding-top 20
:justify-content :center
:height 51
:background-color "#7597e4"})
(def done-button-text

64
src/status_im/accounts/views/qr_code.cljs Normal file
View File

@ -0,0 +1,64 @@
(ns status-im.accounts.views.qr-code
(:require-macros [status-im.utils.views :refer [defview]])
(:require [status-im.components.react :refer [view
text
image
touchable-highlight
get-dimensions]]
[status-im.components.status-bar :refer [status-bar]]
[status-im.components.styles :refer [icon-close]]
[status-im.components.qr-code :refer [qr-code]]
[re-frame.core :refer [dispatch subscribe]]
[status-im.accounts.styles :as st]
[status-im.i18n :refer [label]]
[clojure.string :as s]
[reagent.core :as r]))
(defview qr-code-view []
[{:keys [photo-path address name] :as contact} [:get-in [:qr-modal :contact]]
{:keys [qr-source amount? dimensions]} [:get :qr-modal]
{:keys [amount]} [:get :contacts-click-params]]
[view st/wallet-qr-code
[status-bar {:type :modal}]
[view st/account-toolbar
[view st/wallet-account-container
[view st/qr-photo-container
[view st/account-photo-container
[image {:source {:uri (if (s/blank? photo-path) :avatar photo-path)}
:style st/photo-image}]]]
[view st/name-container
[text {:style st/name-text
:number-of-lines 1} name]]
[view st/online-container
[touchable-highlight {:onPress #(dispatch [:navigate-back])}
[image {:source {:uri :icon_close_white}
:style icon-close}]]]]]
[view {:style st/qr-code
:on-layout #(let [layout (.. % -nativeEvent -layout)]
(dispatch [:set-in [:qr-modal :dimensions] {:width (.-width layout)
:height (.-height layout)}]))}
(when (:width dimensions)
[view {:style {:background-color "white"
:width (:width dimensions)
:align-items :center
:justify-content :center
:padding 40}}
[qr-code {:value (if amount?
(prn-str {:address (get contact qr-source)
:amount amount})
(str "ethereum:" (get contact qr-source)))
:size (- (min (:width dimensions)
(:height dimensions))
80)}]])]
[view st/footer
[view st/wallet-info
[text {:style st/wallet-name-text} (label :t/main-wallet)]
[text {:style st/wallet-address-text} address]]
[touchable-highlight {:onPress #(dispatch [:navigate-back])}
[view st/done-button
[text {:style st/done-button-text} (label :t/done)]]]]])

44
src/status_im/accounts/views/wallet_qr_code.cljs
View File

@ -1,44 +0,0 @@
(ns status-im.accounts.views.wallet-qr-code
(:require-macros [status-im.utils.views :refer [defview]])
(:require [status-im.components.react :refer [view
text
image
touchable-highlight]]
[status-im.components.styles :refer [icon-close]]
[status-im.components.qr-code :refer [qr-code]]
[re-frame.core :refer [dispatch subscribe]]
[status-im.accounts.styles :as st]
[status-im.i18n :refer [label]]
[clojure.string :as s]))
(defview wallet-qr-code []
[{:keys [address photo-path name] :as account} [:get-current-account]
{:keys [amount]} [:get :contacts-click-params]]
[view st/wallet-qr-code
[view st/account-toolbar
[view st/wallet-account-container
[view st/photo-container
[view st/account-photo-container
[image {:source {:uri (if (s/blank? photo-path) :avatar photo-path)}
:style st/photo-image}]]]
[view st/name-container
[text {:style st/name-text
:number-of-lines 1} name]]
[view st/online-container
[touchable-highlight {:onPress #(dispatch [:navigate-back])}
[image {:source {:uri :icon-close-white}
:style icon-close}]]]]]
[view st/qr-code
[qr-code {:value (prn-str {:address address
:amount amount})
:size 200}]]
[view st/footer
[view st/wallet-info
[text {:style st/wallet-name-text} (label :t/main-wallet)]
[text {:style st/wallet-address-text} address]]
[touchable-highlight {:onPress #(dispatch [:navigate-back])}
[view st/done-button
[text {:style st/done-button-text} (label :t/done)]]]]])

4
src/status_im/android/core.cljs
View File

@ -32,7 +32,7 @@
[taoensso.timbre :as log]
[status-im.components.status :as status]
[status-im.chat.styles.screen :as st]
[status-im.accounts.views.wallet-qr-code :refer [wallet-qr-code]]))
[status-im.accounts.views.qr-code :refer [qr-code-view]]))
(defn init-back-button-handler! []
(let [new-listener (fn []
@ -117,7 +117,7 @@
:on-request-close #(dispatch [:navigate-back])}
(let [component (case @modal-view
:qr-scanner qr-scanner
:wallet-qr-code wallet-qr-code
:qr-code-view qr-code-view
:confirm confirm
:contact-list-modal contact-list)]
[component])]])]))))})))

5
src/status_im/android/platform.cljs
View File

@ -13,7 +13,10 @@
:transparent {:height 20
:bar-style "light-content"
:translucent? true
:color styles/color-transparent}}
:color styles/color-transparent}
:modal {:height 0
:bar-style "light-content"
:color styles/color-black}}
:sized-text {:margin-top 0
:additional-height 0}
:chat {:new-message {:border-top-color styles/color-transparent

7
src/status_im/chat/handlers/webview_bridge.cljs
View File

@ -38,13 +38,14 @@
(fn [db [_ bridge]]
(assoc db :webview-bridge bridge)))
(defn contacts-click-handler [whisper-identity action params]
(defn contacts-click-handler [{:keys [whisper-identity] :as contact} action params]
(dispatch [:navigate-back])
(when action
(if (= whisper-identity :qr-scan)
(if (= contact :qr-scan)
(if (= action :send)
(dispatch [:show-scan-qr :webview-address-from-qr])
(dispatch [:navigate-to-modal :wallet-qr-code]))
(dispatch [:navigate-to-modal :qr-code-view {:qr-source :whisper-identity
:amount? true}]))
(dispatch [:chat-with-command whisper-identity action params]))))
(register-handler ::send-command

5
src/status_im/contacts/screen.cljs
View File

@ -82,10 +82,9 @@
[view
(doall
(map (fn [contact]
(let [whisper-identity (:whisper-identity contact)
click-handler (or click-handler on-press)]
(let [click-handler (or click-handler on-press)]
^{:key contact}
[contact-extended-view contact nil (click-handler whisper-identity) nil]))
[contact-extended-view contact nil (click-handler contact) nil]))
contacts))]
(when (<= contacts-limit (count contacts))
[view st/show-all

6
src/status_im/contacts/views/contact.cljs
View File

@ -5,7 +5,7 @@
[status-im.contacts.styles :as st]
[status-im.contacts.views.contact-inner :refer [contact-inner-view]]))
(defn on-press [whisper-identity]
(defn on-press [{:keys [whisper-identity]}]
#(dispatch [:start-chat whisper-identity {} :navigation-replace]))
(defn letter-view [letter]
@ -15,7 +15,7 @@
(defview contact-view-with-letter [{:keys [whisper-identity letter] :as contact} click-handler action params]
[touchable-highlight
{:onPress #(click-handler whisper-identity action params)}
{:onPress #(click-handler contact action params)}
[view st/contact-container
[letter-view letter]
[contact-inner-view contact]]])
@ -23,7 +23,7 @@
(defview contact-view [{:keys [whisper-identity] :as contact}]
[chat [:get-chat whisper-identity]]
[touchable-highlight
{:onPress (on-press whisper-identity)}
{:onPress (on-press contact)}
[view st/contact-container
[contact-inner-view contact]]])

3
src/status_im/contacts/views/contact_list.cljs
View File

@ -40,8 +40,7 @@
[contact-view-with-letter row click-handler action params]
[contact-view row
(or click-handler
(let [whisper-identity (:whisper-identity row)]
(on-press whisper-identity)))]))))
(on-press row))]))))
(defn qr-scan [click-handler action]
[touchable-highlight

4
src/status_im/ios/core.cljs
View File

@ -28,7 +28,7 @@
status-im.data-store.core
[taoensso.timbre :as log]
[status-im.chat.styles.screen :as st]
[status-im.accounts.views.wallet-qr-code :refer [wallet-qr-code]]))
[status-im.accounts.views.qr-code :refer [qr-code-view]]))
(defn orientation->keyword [o]
(keyword (.toLowerCase o)))
@ -101,7 +101,7 @@
:on-request-close #(dispatch [:navigate-back])}
(let [component (case @modal-view
:qr-scanner qr-scanner
:wallet-qr-code wallet-qr-code
:qr-code-view qr-code-view
:confirm confirm
:contact-list-modal contact-list)]
[component])]])]))))})))

5
src/status_im/ios/platform.cljs
View File

@ -12,7 +12,10 @@
:color toolbar-background2}
:transparent {:height 20
:bar-style "light-content"
:color styles/color-transparent}}
:color styles/color-transparent}
:modal {:height 20
:bar-style "light-content"
:color "#2f3031"}}
:toolbar {:border-bottom-color styles/color-gray3
:border-bottom-width 0.5}
:sized-text {:margin-top -5

33
src/status_im/profile/screen.cljs
View File

@ -21,7 +21,6 @@
[status-im.components.status-bar :refer [status-bar]]
[status-im.components.text-field.view :refer [text-field]]
[status-im.components.selectable-field.view :refer [selectable-field]]
[status-im.components.qr-code :refer [qr-code]]
[status-im.utils.phone-number :refer [format-phone-number]]
[status-im.utils.image-processing :refer [img->base64]]
[status-im.utils.platform :refer [platform-specific]]
@ -113,18 +112,6 @@
:on-change-text #(dispatch [:set-in [:profile-edit :status] %])
:default-value status}]])})))
(defview qr-modal []
[qr [:get-in [:profile-edit :qr-code]]]
[modal {:transparent true
:visible (not (nil? qr))
:animationType :fade
:onRequestClose #(log/debug "Nothing happens")}
[touchable-without-feedback {:on-press #(dispatch [:set-in [:profile-edit :qr-code] nil])}
[view st/qr-code-container
[view st/qr-code
[qr-code {:value (str "ethereum:" qr)
:size 220}]]]]])
(defview profile []
[{whisper-identity :whisper-identity
address :address
@ -180,7 +167,8 @@
[selectable-field {:label (label :t/address)
:editable? false
:value address}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] address])}]]
[show-qr-button {:handler #(dispatch [:navigate-to-modal :qr-code-view {:contact contact
:qr-source :whisper-identity}])}]]
[view st/underline-container]])
[view st/profile-property
@ -189,11 +177,10 @@
[selectable-field {:label (label :t/public-key)
:editable? false
:value whisper-identity}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] whisper-identity])}]]]
[show-qr-button {:handler #(dispatch [:navigate-to-modal :qr-code-view {:contact contact
:qr-source :public-key}])}]]]
[view st/underline-container]
[qr-modal]]])
[view st/underline-container]]])
(defview my-profile []
[edit? [:get-in [:profile-edit :edit?]]
@ -229,7 +216,8 @@
[selectable-field {:label (label :t/address)
:editable? edit?
:value address}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] address])}]]
[show-qr-button {:handler #(dispatch [:navigate-to-modal :qr-code-view {:contact account
:qr-source :address}])}]]
[view st/underline-container]]
[view st/profile-property
@ -238,8 +226,7 @@
[selectable-field {:label (label :t/public-key)
:editable? edit?
:value public-key}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] public-key])}]]]
[show-qr-button {:handler #(dispatch [:navigate-to-modal :qr-code-view {:contact account
:qr-source :public-key}])}]]]
[view st/underline-container]
[qr-modal]]]))
[view st/underline-container]]]))