From a58ed1a384f2f831894c330e1e57589a6aae0e65 Mon Sep 17 00:00:00 2001 From: alwx Date: Thu, 22 Dec 2016 13:32:17 +0300 Subject: [PATCH] multiline chat input --- src/status_im/chat/views/message_input.cljs | 25 +++++++++++++++------ src/status_im/components/drawer/view.cljs | 5 ++++- 2 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/status_im/chat/views/message_input.cljs b/src/status_im/chat/views/message_input.cljs index 49ad30f1163..190c924de25 100644 --- a/src/status_im/chat/views/message_input.cljs +++ b/src/status_im/chat/views/message_input.cljs @@ -24,9 +24,7 @@ (defn plain-input-options [disable?] {:style st-message/message-input - :on-change-text (when-not disable? plain-message/set-input-message) - :editable (not disable?) - :on-submit-editing plain-message/send}) + :editable (not disable?)}) (defn on-press-commands-handler [{:keys [suggestions-trigger]}] @@ -40,23 +38,36 @@ (defview message-input [input-options set-layout-size] [input-message [:get-chat-input-text] disable? [:get :disable-input] - active? [:chat :is-active]] + active? [:chat :is-active] + input-ref (r/atom nil) + change-content-size? (r/atom true)] [text-input (merge (plain-input-options (or disable? (not active?))) {:placeholder-text-color :#c0c5c9 :auto-focus false - :blur-on-submit true :multiline true + :ref #(reset! input-ref %) :on-content-size-change #(let [size (-> (.-nativeEvent %) (.-contentSize) (.-height))] - (set-layout-size size)) + (when @change-content-size? + (set-layout-size size))) :accessibility-label :input :on-focus #(do (dispatch [:set :focused true]) (dispatch [:set-chat-ui-props :show-emoji? false])) :on-blur #(do (dispatch [:set :focused false]) (set-layout-size 0)) - :default-value (or input-message "")} + :default-value (or input-message "") + :on-key-press #(when (= "Enter" (.-key (.-nativeEvent %))) + (reset! change-content-size? false)) + :on-change-text #(when-not disable? + (if (str/includes? % "\n") + (do + (.clear @input-ref) + (plain-message/set-input-message "") + (plain-message/send) + (reset! change-content-size? true)) + (plain-message/set-input-message %)))} input-options)]) (defview command-input [input-options {:keys [fullscreen] :as command}] diff --git a/src/status_im/components/drawer/view.cljs b/src/status_im/components/drawer/view.cljs index 4a8a7ebbb50..7470e943b7e 100644 --- a/src/status_im/components/drawer/view.cljs +++ b/src/status_im/components/drawer/view.cljs @@ -55,7 +55,8 @@ keyboard-height (subscribe [:get :keyboard-height]) placeholder (generate-gfy) status-edit? (r/atom false) - status-text (r/atom nil)] + status-text (r/atom nil) + input-ref (r/atom nil)] (fn [] (let [{:keys [name photo-path status]} @account {new-name :name @@ -81,6 +82,7 @@ [view st/status-container (if @status-edit? [text-input {:style st/status-input + :ref #(reset! input-ref %) :editable true :multiline true :auto-focus true @@ -96,6 +98,7 @@ (reset! status-text status) (if (str/includes? % "\n") (do + (.clear @input-ref) (reset! status-edit? false) (update-status status)) (dispatch [:set-in [:profile-edit :status] status])))}]