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

Command input 

Former-commit-id: 98e03d1ba9
This commit is contained in:
virvar 2016-04-21 10:31:06 +03:00
parent 5b431d3a24
commit 6be9a83f5b
3 changed files with 64 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
images/icon_close_gray.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 274 B

92
src/syng_im/components/chat/input/simple_command.cljs
View File

@ -6,7 +6,11 @@
text text
text-input text-input
touchable-highlight]] touchable-highlight]]
[syng-im.components.styles :refer [font]] [syng-im.components.styles :refer [font
color-white
color-blue
text1-color
text2-color]]
[syng-im.utils.utils :refer [log toast http-post]] [syng-im.utils.utils :refer [log toast http-post]]
[syng-im.utils.logging :as log] [syng-im.utils.logging :as log]
[syng-im.resources :as res] [syng-im.resources :as res]
@ -28,58 +32,62 @@
(fn [command input-options] (fn [command input-options]
(let [chat-id @chat-id-atom (let [chat-id @chat-id-atom
message @message-atom] message @message-atom]
[view {:style {:flexDirection "row"}} [view {:style {:flexDirection "row"
[view {:style {:flex 1 :height 56
:flexDirection "column" :backgroundColor color-white
:backgroundColor "white"}} :elevation 4}}
[view {:style {:flexDirection "column" [view {:style {:flexDirection "column"
:margin 10 :marginTop 16
:width 200 :marginBottom 16
:backgroundColor "#ebf0f4" :marginLeft 16
:borderRadius 10}} :marginRight 0
[view {:style {:flexDirection "row"}}
[view {:style {:flexDirection "column"
:margin 10
:backgroundColor (:color command) :backgroundColor (:color command)
:borderRadius 10}} :height 24
[text {:style {:marginTop -2 :borderRadius 50}}
:marginHorizontal 10 [text {:style {:marginTop 3
:fontSize 14 :marginHorizontal 12
:fontSize 12
:fontFamily font :fontFamily font
:color "white"}} :color color-white}}
(:text command)]] (:text command)]]
[touchable-highlight {:style {:marginTop 14 [text-input (merge {:underlineColorAndroid "transparent"
:marginRight 16 :style {:flex 1
:position "absolute"
:top 3
:right 20}
:onPress (fn []
(cancel-command-input))}
[image {:source res/att
:style {:width 17
:height 14}}]]]
[text-input (merge {:style {:flex 1
:marginLeft 8 :marginLeft 8
:lineHeight 42 :marginTop 7
:fontSize 14 :fontSize 14
:fontFamily font :fontFamily font
:color "black"} :color text1-color}
:underlineColorAndroid "transparent"
:autoFocus true :autoFocus true
:keyboardType "default" :placeholder "Type"
:placeholderTextColor text2-color
:onChangeText (fn [new-text] :onChangeText (fn [new-text]
(set-input-message new-text)) (set-input-message new-text))
:onSubmitEditing (fn [e] :onSubmitEditing (fn [e]
(send-command chat-id command message))} (send-command chat-id command message))}
input-options) input-options)
message]]] message]
[touchable-highlight {:style {:marginTop 14 (if (< 0 (count message))
:marginRight 16 [touchable-highlight {:on-press (fn []
:position "absolute"
:right 20
:bottom 20}
:onPress (fn []
(send-command chat-id command message))} (send-command chat-id command message))}
[image {:source res/att [view {:style {:marginTop 10
:style {:width 34 :marginRight 10
:height 28}}]]])))) :width 36
:height 36
:borderRadius 50
:backgroundColor color-blue}}
[image {:source res/icon-send
:style {:marginTop 10.5
:marginLeft 12
:width 15
:height 15}}]]]
[touchable-highlight {:on-press (fn []
(cancel-command-input))}
[view {:style {:marginTop 10
:marginRight 10
:width 36
:height 36}}
[image {:source res/icon-close-gray
:style {:marginTop 10.5
:marginLeft 12
:width 12
:height 12}}]]])]))))

1
src/syng_im/resources.cljs
View File

@ -27,3 +27,4 @@
(def icon-hamburger (js/require "./images/icon_hamburger.png")) (def icon-hamburger (js/require "./images/icon_hamburger.png"))
(def icon-search (js/require "./images/icon_search.png")) (def icon-search (js/require "./images/icon_search.png"))
(def icon-send (js/require "./images/icon_send.png")) (def icon-send (js/require "./images/icon_send.png"))
(def icon-close-gray (js/require "./images/icon_close_gray.png"))