From 6be9a83f5b3f2d4d9972fa3c23e93a5b6832a932 Mon Sep 17 00:00:00 2001
From: virvar <revalka@gmail.com>
Date: Thu, 21 Apr 2016 10:31:06 +0300
Subject: [PATCH] Command input

Former-commit-id: 98e03d1ba9a320555b849fdbae72501c023e2662
---
 images/icon_close_gray.png                    | Bin 0 -> 274 bytes
 .../components/chat/input/simple_command.cljs | 118 ++++++++++--------
 src/syng_im/resources.cljs                    |   1 +
 3 files changed, 64 insertions(+), 55 deletions(-)
 create mode 100644 images/icon_close_gray.png

diff --git a/images/icon_close_gray.png b/images/icon_close_gray.png
new file mode 100644
index 0000000000000000000000000000000000000000..c0cca733358933d86b59399c687007f3d565fe25
GIT binary patch
literal 274
zcmV+t0qy>YP)<h;3K|Lk000e1NJLTq000aC000aK1^@s6R&`wG00001b5ch_0Itp)
z=>Px#%t=H+R45gVku46wKoEszwkaX&xd2E`0fzvOtHEK=1cw1j@SLKjsO<rYuW4ZD
zTbQPuYzQN^*?HfapDrIxmn#uZUFz5S?dCy|IG%5lS5x1Kq;w=a6OqNUsdEUHM-Cd8
zP}q(9ikJ%$nOl>>(7<2{Mnx+msc)+hp@723VdP+lnUJ$EQk?;pL8qW{p_Oq(xX<VR
zv+FRZj-P<|F5B-C3>N;mbPU!9jA<^sV5BuBf^qDVrM?r`c4;Y@Iq%O2SYwxE6*Mql
Y-|X|O9pyIW`2YX_07*qoM6N<$g1J_5!T<mO

literal 0
HcmV?d00001

diff --git a/src/syng_im/components/chat/input/simple_command.cljs b/src/syng_im/components/chat/input/simple_command.cljs
index 388bda61f6..9d86a6cb95 100644
--- a/src/syng_im/components/chat/input/simple_command.cljs
+++ b/src/syng_im/components/chat/input/simple_command.cljs
@@ -6,7 +6,11 @@
                                               text
                                               text-input
                                               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.logging :as log]
             [syng-im.resources :as res]
@@ -28,58 +32,62 @@
     (fn [command input-options]
       (let [chat-id @chat-id-atom
             message @message-atom]
-        [view {:style {:flexDirection "row"}}
-         [view {:style {:flex 1
-                        :flexDirection   "column"
-                        :backgroundColor "white"}}
-          [view {:style {:flexDirection   "column"
-                         :margin          10
-                         :width           200
-                         :backgroundColor "#ebf0f4"
-                         :borderRadius    10}}
-           [view {:style {:flexDirection "row"}}
-            [view {:style {:flexDirection   "column"
-                           :margin          10
-                           :backgroundColor (:color command)
-                           :borderRadius    10}}
-             [text {:style {:marginTop -2
-                            :marginHorizontal 10
-                            :fontSize         14
-                            :fontFamily       font
-                            :color           "white"}}
-              (:text command)]]
-            [touchable-highlight {:style {:marginTop   14
-                                          :marginRight 16
-                                          :position    "absolute"
-                                          :top         3
-                                          :right       20}
-                                  :onPress (fn []
+        [view {:style {:flexDirection     "row"
+                       :height            56
+                       :backgroundColor   color-white
+                       :elevation         4}}
+         [view {:style {:flexDirection   "column"
+                        :marginTop       16
+                        :marginBottom    16
+                        :marginLeft      16
+                        :marginRight     0
+                        :backgroundColor (:color command)
+                        :height          24
+                        :borderRadius    50}}
+          [text {:style {:marginTop        3
+                         :marginHorizontal 12
+                         :fontSize         12
+                         :fontFamily       font
+                         :color            color-white}}
+           (:text command)]]
+         [text-input (merge {:underlineColorAndroid "transparent"
+                             :style                 {:flex       1
+                                                     :marginLeft 8
+                                                     :marginTop  7
+                                                     :fontSize   14
+                                                     :fontFamily font
+                                                     :color      text1-color}
+                             :autoFocus             true
+                             :placeholder           "Type"
+                             :placeholderTextColor  text2-color
+                             :onChangeText          (fn [new-text]
+                                                      (set-input-message new-text))
+                             :onSubmitEditing       (fn [e]
+                                                      (send-command chat-id command message))}
+                            input-options)
+          message]
+         (if (< 0 (count message))
+           [touchable-highlight {:on-press (fn []
+                                             (send-command chat-id command message))}
+            [view {:style {:marginTop       10
+                           :marginRight     10
+                           :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))}
-             [image {:source res/att
-                     :style  {:width  17
-                              :height 14}}]]]
-           [text-input (merge {:style                 {:flex       1
-                                                       :marginLeft 8
-                                                       :lineHeight 42
-                                                       :fontSize   14
-                                                       :fontFamily font
-                                                       :color      "black"}
-                               :underlineColorAndroid "transparent"
-                               :autoFocus             true
-                               :keyboardType          "default"
-                               :onChangeText          (fn [new-text]
-                                                        (set-input-message new-text))
-                               :onSubmitEditing       (fn [e]
-                                                        (send-command chat-id command message))}
-                              input-options)
-            message]]]
-         [touchable-highlight {:style {:marginTop   14
-                                       :marginRight 16
-                                       :position    "absolute"
-                                       :right       20
-                                       :bottom      20}
-                               :onPress (fn []
-                                          (send-command chat-id command message))}
-          [image {:source res/att
-                  :style  {:width  34
-                           :height 28}}]]]))))
+            [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}}]]])]))))
diff --git a/src/syng_im/resources.cljs b/src/syng_im/resources.cljs
index 17c231bf56..3f1a20e77f 100644
--- a/src/syng_im/resources.cljs
+++ b/src/syng_im/resources.cljs
@@ -27,3 +27,4 @@
 (def icon-hamburger (js/require "./images/icon_hamburger.png"))
 (def icon-search (js/require "./images/icon_search.png"))
 (def icon-send (js/require "./images/icon_send.png"))
+(def icon-close-gray (js/require "./images/icon_close_gray.png"))