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

fix cursor position for command input

This commit is contained in:
Roman Volosovskyi 2017-02-23 15:54:48 +02:00 committed by Roman Volosovskyi
parent 99931c24b9
commit d4128397b9
2 changed files with 76 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/status_im/chat/handlers/commands.cljs
View File

@ -151,7 +151,8 @@
(-> db (-> db
(commands/set-command-input (or type :commands) command-key) (commands/set-command-input (or type :commands) command-key)
(assoc-in [:chats current-chat-id :command-input :content] cu/command-prefix) (assoc-in [:chats current-chat-id :command-input :content] cu/command-prefix)
(assoc :disable-input true))) (assoc :disable-input true)
(assoc :just-set-command? true)))
(register-handler :set-chat-command (register-handler :set-chat-command
[(after invoke-suggestions-handler!) [(after invoke-suggestions-handler!)

98
src/status_im/chat/views/message_input.cljs
View File

@ -15,7 +15,9 @@
[status-im.accessibility-ids :as id] [status-im.accessibility-ids :as id]
[reagent.core :as r] [reagent.core :as r]
[clojure.string :as str] [clojure.string :as str]
[taoensso.timbre :as log])) [taoensso.timbre :as log]
[clojure.string :as s]
[status-im.commands.utils :refer [command-prefix]]))
(defn send-button [{:keys [on-press accessibility-label]}] (defn send-button [{:keys [on-press accessibility-label]}]
[touchable-highlight {:on-press on-press [touchable-highlight {:on-press on-press
@ -40,9 +42,15 @@
:multiline true :multiline true
:editable (not disable?)}) :editable (not disable?)})
(defn command-input-options [{:keys [icon-width disable? sending-disabled?]}] (defn command-input-options [{:keys [icon-width disable? sending-disabled? flag]}]
{:style (st-response/command-input icon-width disable?) {:style (st-response/command-input icon-width disable?)
:on-change-text (when-not disable? command/set-input-message) :on-change-text (when-not disable? (fn [text]
;; update flag only when the first
;; character was added to commands input
(when (and (s/starts-with? text command-prefix)
(= (inc (count command-prefix)) (count text)))
(reset! flag true))
(command/set-input-message text)))
:on-submit-editing (fn [] :on-submit-editing (fn []
(when-not sending-disabled? (when-not sending-disabled?
(dispatch [:send-command!]))) (dispatch [:send-command!])))
@ -62,6 +70,21 @@
options) options)
(assoc options :placeholder "")))) (assoc options :placeholder ""))))
(defn get-selection
[{:keys [focused? flag input-command command? just-set?]}]
(cond (and command?
(= input-command command-prefix)
focused?
(not just-set?))
{:start 2
:end 2}
(and focused? flag)
{:start 3
:end 3}
:else nil))
(defview message-input [set-layout-size] (defview message-input [set-layout-size]
[input-message [:get-chat-input-text] [input-message [:get-chat-input-text]
input-command [:get-chat-command-content] input-command [:get-chat-command-content]
@ -72,24 +95,49 @@
command? [:command?] command? [:command?]
parameter [:get-command-parameter] parameter [:get-command-parameter]
type [:command-type] type [:command-type]
sending-disabled? [:chat-ui-props :sending-disabled?]] just-set? [:get :just-set-command?]
[text-input sending-disabled? [:chat-ui-props :sending-disabled?]
(merge state {:input (atom nil)
(if command? :focused? (atom nil)
(command-input-options {:icon-width icon-width :3-symbols-flag (r/atom false)}]
:disable? disable? {:component-did-update (fn []
:sendind-disabled? sending-disabled?}) (when just-set?
(plain-input-options {:set-layout-size-fn set-layout-size (dispatch [:set :just-set-command? false]))
:disable? (or disable? (not active?))})) (when @(:3-symbols-flag state)
{:placeholder-text-color :#c0c5c9 (reset! (:3-symbols-flag state) false))
:auto-focus (when command? (when (and command?
(not (:fullscreen command))) (not (:fullscreen command)))
:accessibility-label id/chat-message-input (.focus @(:input state))))}
:default-value (if command?
(or input-command "") (do
(or input-message ""))} @(:3-symbols-flag state)
(when command? [text-input
(get-options parameter type)))]) (merge
(if command?
(command-input-options {:icon-width icon-width
:disable? disable?
:sendind-disabled? sending-disabled?
:flag (:3-symbols-flag state)})
(plain-input-options {:set-layout-size-fn set-layout-size
:disable? (or disable? (not active?))}))
{:placeholder-text-color :#c0c5c9
:onFocus #(reset! (:focused? state) true)
:onBlur #(reset! (:focused? state) false)
:auto-focus (when command? (not (:fullscreen command)))
:ref #(reset! (:input state) %)
:accessibility-label id/chat-message-input
;; for some reason app crashes when this property is not nil and
;; input is not focused
:selection (get-selection {:focused? @(:focused? state)
:flag @(:3-symbols-flag state)
:input-command input-command
:command? command?
:just-set? just-set?})
:default-value (if command?
(or input-command "")
(or input-message ""))}
(when command?
(get-options parameter type)))]))
(defn plain-message-get-initial-state [_] (defn plain-message-get-initial-state [_]
{:height 0}) {:height 0})
@ -125,10 +173,10 @@
(let [on-press (if @command? (let [on-press (if @command?
#(dispatch [:send-command!]) #(dispatch [:send-command!])
plain-message/send)] plain-message/send)]
[send-button {:on-press (fn [e] [send-button {:on-press (fn [e]
(when-not @sending-disabled? (when-not @sending-disabled?
(dispatch [:set-chat-ui-props :show-emoji? false]) (dispatch [:set-chat-ui-props :show-emoji? false])
(on-press e))) (on-press e)))
:accessibility-label id/chat-send-button}])) :accessibility-label id/chat-send-button}]))
(when (and @command? (= :command (:type @command))) (when (and @command? (= :command (:type @command)))
[command/command-icon @command])]]))}))) [command/command-icon @command])]]))})))