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

Show QR in profile (#422)

This commit is contained in:
Alexander Pantyuhov 2016-11-08 13:56:36 +03:00
parent 21aa16b842
commit 3819a0e8e5
20 changed files with 138 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
android/app/src/main/res/drawable-hdpi/icon_qr_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.7 KiB

BIN
android/app/src/main/res/drawable-mdpi/icon_qr.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 422 B

After

Width:  |  Height:  |  Size: 826 B

BIN
android/app/src/main/res/drawable-mdpi/icon_qr_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
android/app/src/main/res/drawable-xhdpi/icon_qr_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.5 KiB

BIN
android/app/src/main/res/drawable-xxhdpi/icon_qr_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
android/app/src/main/res/drawable-xxxhdpi/icon_qr_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 917 B

21
ios/StatusIm/Images.xcassets/icon_qr_gray.imageset/Contents.json vendored Normal file
View File

@ -0,0 +1,21 @@
{
"images" : [
{
"idiom" : "universal",
"filename" : "icon_qr_gray.png",
"scale" : "1x"
},
{
"idiom" : "universal",
"scale" : "2x"
},
{
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"version" : 1,
"author" : "xcode"
}
}

BIN
ios/StatusIm/Images.xcassets/icon_qr_gray.imageset/icon_qr_gray.png vendored Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

1
src/status_im/accounts/login/screen.cljs
View File

@ -20,7 +20,6 @@
icon-qr
button-input
white-form-text-input]]
[status-im.qr-scanner.views.scan-button :refer [scan-button]]
[status-im.i18n :refer [label]]
[status-im.accounts.login.styles :as st]))

28
src/status_im/components/image_button/styles.cljs Normal file
View File

@ -0,0 +1,28 @@
(ns status-im.components.image-button.styles)
(def image-button
{:position :absolute
:bottom 2
:right 16
:flex 1
:height 50
:alignItems :center})
(def image-button-content
{:flex 1
:flexDirection :row
:height 50
:alignItems :center
:alignSelf :center})
(def image-button-text
{:flex 1
:flexDirection :column
:letter-spacing -0.3
:margin-left 8})
(def scan-button-text
(merge image-button-text {:color "#7099e6"}))
(def show-qr-button-text
(merge image-button-text {:color "#838c93"}))

31
src/status_im/components/image_button/view.cljs Normal file
View File

@ -0,0 +1,31 @@
(ns status-im.components.image-button.view
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
text
image
touchable-highlight]]
[status-im.components.styles :refer [icon-scan]]
[status-im.i18n :refer [label]]
[status-im.components.image-button.styles :as st]))
(defn image-button [{:keys [value style icon handler]}]
[view st/image-button
[touchable-highlight {:on-press handler}
[view st/image-button-content
[image {:source {:uri (or icon :scan_blue)}
:style icon-scan}]
(when text
[text {:style style} value])]]])
(defn scan-button [{:keys [show-label? handler]}]
[image-button {:icon :scan_blue
:value (if show-label?
(label :t/scan-qr))
:style st/scan-button-text
:handler handler}])
(defn show-qr-button [{:keys [handler]}]
[image-button {:icon :icon_qr_gray
:value (label :t/show-qr)
:style st/show-qr-button-text
:handler handler}])

6
src/status_im/components/selectable_field/styles.cljs
View File

@ -14,9 +14,9 @@
:font-size 14})
(def text-container
{:padding 0
:margin-bottom 18
:margin 0})
{:padding 0
:margin-bottom 18
:margin 0})
(def text
{:font-size 16

10
src/status_im/contacts/views/new_contact.cljs
View File

@ -20,7 +20,7 @@
icon-back
button-input-container
button-input]]
[status-im.qr-scanner.views.scan-button :refer [scan-button]]
[status-im.components.image-button.view :refer [scan-button]]
[status-im.i18n :refer [label]]
[cljs.spec :as s]
[status-im.contacts.validations :as v]
@ -90,10 +90,10 @@
:on-change-text #(do
(dispatch [:set-in [:new-contact-identity] %])
(dispatch [:set :new-contact-address-error nil]))}]
[scan-button {:showLabel (zero? (count whisper-identity))
:handler #(dispatch [:scan-qr-code
{:toolbar-title (label :t/new-contact)}
:set-contact-identity-from-qr])}]]))
[scan-button {:show-label? (zero? (count whisper-identity))
:handler #(dispatch [:scan-qr-code
{:toolbar-title (label :t/new-contact)}
:set-contact-identity-from-qr])}]]))
(defview new-contact []

2
src/status_im/group_settings/screen.cljs
View File

@ -29,7 +29,7 @@
(defview member-menu []
[{:keys [name] :as participant} [:selected-participant]]
(when participant
[modal {:animated false
[modal {:animationType :none
:transparent false
:onRequestClose close-member-menu}
[touchable-highlight {:style st/modal-container

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

@ -9,9 +9,11 @@
text-input
image
icon
modal
scroll-view
touchable-highlight
touchable-opacity
touchable-without-feedback
show-image-picker
dismiss-keyboard!]]
[status-im.components.icons.custom-icons :refer [oct-icon]]
@ -27,6 +29,7 @@
[status-im.profile.validations :as v]
[status-im.profile.styles :as st]
[status-im.utils.random :refer [id]]
[status-im.components.image-button.view :refer [show-qr-button]]
[status-im.i18n :refer [label]]))
(defn toolbar [{:keys [account edit?]}]
@ -161,8 +164,20 @@
)}
[view [text {:style st/report-user-text} (label :t/report-user)]]]]]])
(defview qr-modal []
[qr [:get-in [:profile-edit :qr-code]]]
[modal {:transparent true
:visible (not (nil? qr))
:animationType :fade}
[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 my-profile []
[edit? [:get-in [:profile-edit :edit?]]
qr [:get-in [:profile-edit :qr-code]]
current-account [:get-current-account]
changed-account [:get :profile-edit]]
(let [{:keys [phone
@ -171,6 +186,7 @@
changed-account
current-account)]
[scroll-view {:style st/profile
:bounces false
:keyboardShouldPersistTaps true}
[status-bar]
[toolbar {:account account
@ -188,16 +204,20 @@
[view st/underline-container]]
[view st/profile-property
[selectable-field {:label (label :t/address)
:value address}]
[view st/profile-property-row
[view st/profile-property-field
[selectable-field {:label (label :t/address)
:value address}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] address])}]]
[view st/underline-container]]
[view st/profile-property
[selectable-field {:label (label :t/public-key)
:value public-key}]]
[view st/profile-property-row
[view st/profile-property-field
[selectable-field {:label (label :t/public-key)
:value public-key}]]
[show-qr-button {:handler #(dispatch [:set-in [:profile-edit :qr-code] public-key])}]]]
[view st/underline-container]
[view st/qr-code-container
[qr-code {:value (str "ethereum:" public-key)
:size 220}]]]]))
[qr-modal]]]))

24
src/status_im/profile/styles.cljs
View File

@ -121,6 +121,14 @@
(def profile-property
{:margin-left 16})
(def profile-property-row
{:flex 1
:flex-direction :row})
(def profile-property-field
{:margin-right 90
:flex 1})
(def profile-input-wrapper
{:margin-bottom 16})
@ -143,9 +151,19 @@
:letter-spacing 0.5})
(def qr-code-container
{:flex 1
:alignItems :center
:margin 32})
{:flex 1
:alignItems :center
:justify-content :center
:background-color "#000000aa"})
(def qr-code
{:width 250
:height 250
:background-color "white"
:border-radius 4
:align-items :center
:padding-top 15
:elevation 4})
(def hashtag
{:color "#7099e6"})

22
src/status_im/qr_scanner/styles.cljs
View File

@ -73,26 +73,4 @@
{:flex 1
:flexDirection :column
:color color-white
:margin-left 8})
(def scan-button
{:position :absolute
:bottom 0
:right 16
:flex 1
:height 50
:alignItems :center})
(def scan-button-content
{:flex 1
:flexDirection :row
:height 50
:alignItems :center
:alignSelf :center})
(def scan-text
{:flex 1
:flexDirection :column
:color "#7099e6"
:margin-left 8})

21
src/status_im/qr_scanner/views/import_button.cljs
View File

@ -1,21 +0,0 @@
(ns status-im.qr-scanner.views.import-button
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
text
image
touchable-highlight]]
[status-im.components.styles :refer [icon-qr]]
[status-im.i18n :refer [label]]
[status-im.qr-scanner.styles :as st]))
(defview import-button [handler]
[]
[view st/import-button
[touchable-highlight
{:on-press handler}
[view st/import-button-content
[image {:source {:uri :icon_qr}
:style icon-qr}]
[text {:style st/import-text} (label :t/import-qr)]]]])

22
src/status_im/qr_scanner/views/scan_button.cljs
View File

@ -1,22 +0,0 @@
(ns status-im.qr-scanner.views.scan-button
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
text
image
touchable-highlight]]
[status-im.components.styles :refer [icon-scan]]
[status-im.i18n :refer [label]]
[status-im.qr-scanner.styles :as st]))
(defview scan-button [{:keys [showLabel icon labelStyle handler]}]
(let [showLabel (if (nil? showLabel) true showLabel)]
[view st/scan-button
[touchable-highlight
{:on-press handler}
[view st/scan-button-content
[image {:source {:uri (or icon :scan_blue)}
:style icon-scan}]
(when showLabel [text {:style (merge st/scan-text labelStyle)}
(label :t/scan-qr)])]]]))

1
src/status_im/translations/en.cljs
View File

@ -117,6 +117,7 @@
:contacts-group-people "People"
:contacts-group-new-chat "Start new chat"
:no-contacts "No contacts yet"
:show-qr "Show QR"
;group-settings
:remove "Remove"