Animation refactoring
This commit is contained in:
parent
b2cd5fe1cc
commit
4413d8dc3b
|
@ -10,12 +10,16 @@
|
|||
|
||||
(def zero-height input-height)
|
||||
|
||||
(register-handler :finish-animate-cancel-command
|
||||
(fn [db _]
|
||||
(assoc-in db [:animations :commands-input-is-switching?] false)))
|
||||
(defn animation-handler
|
||||
([name handler] (animation-handler name nil handler))
|
||||
([name middleware handler]
|
||||
(register-handler name [(path :animations) middleware] handler)))
|
||||
|
||||
(register-handler :animate-cancel-command
|
||||
(path :animations)
|
||||
(animation-handler :finish-animate-cancel-command
|
||||
(fn [db _]
|
||||
(assoc db :commands-input-is-switching? false)))
|
||||
|
||||
(animation-handler :animate-cancel-command
|
||||
(fn [db _]
|
||||
(if-not (:commands-input-is-switching? db)
|
||||
(assoc db
|
||||
|
@ -26,20 +30,19 @@
|
|||
:messages-offset 0)
|
||||
db)))
|
||||
|
||||
(register-handler :finish-animate-response-resize
|
||||
(animation-handler :finish-animate-response-resize
|
||||
(fn [db _]
|
||||
(let [fixed (get-in db [:animations :to-response-height])]
|
||||
(-> db
|
||||
(assoc-in [:animations :response-height-current] fixed)
|
||||
(assoc-in [:animations :response-resize?] false)))))
|
||||
(let [fixed (:to-response-height db)]
|
||||
(assoc db :response-height-current fixed
|
||||
:response-resize? false))))
|
||||
|
||||
(register-handler :set-response-height
|
||||
(animation-handler :set-response-height
|
||||
(fn [db [_ value]]
|
||||
(assoc-in db [:animations :response-height-current] value)))
|
||||
(assoc db :response-height-current value)))
|
||||
|
||||
(register-handler :animate-response-resize
|
||||
(animation-handler :animate-response-resize
|
||||
(fn [db _]
|
||||
(assoc-in db [:animations :response-resize?] true)))
|
||||
(assoc db :response-resize? true)))
|
||||
|
||||
(defn get-response-height [db]
|
||||
(let [command (commands/get-chat-command db)
|
||||
|
@ -55,9 +58,9 @@
|
|||
(defn update-response-height [db]
|
||||
(assoc-in db [:animations :to-response-height] (get-response-height db)))
|
||||
|
||||
(register-handler :finish-show-response
|
||||
(animation-handler :finish-show-response
|
||||
(fn [db _]
|
||||
(assoc-in db [:animations :commands-input-is-switching?] false)))
|
||||
(assoc db :commands-input-is-switching? false)))
|
||||
|
||||
(register-handler :animate-show-response
|
||||
(after #(dispatch [:animate-response-resize]))
|
||||
|
@ -70,24 +73,22 @@
|
|||
(assoc-in [:animations :messages-offset] request-info-height)
|
||||
(update-response-height))))
|
||||
|
||||
(register-handler :set-response-max-height
|
||||
(animation-handler :set-response-max-height
|
||||
(fn [db [_ height]]
|
||||
(let [prev-height (get-in db [:animations :response-height-max])]
|
||||
(let [prev-height (:response-height-max db)]
|
||||
(if (not= height prev-height)
|
||||
(let [db (assoc-in db [:animations :response-height-max] height)]
|
||||
(if (= prev-height (get-in db [:animations :to-response-height]))
|
||||
(-> db
|
||||
(assoc-in [:animations :to-response-height] height)
|
||||
(assoc-in [:animations :response-height-current] height))
|
||||
(let [db (assoc db :response-height-max height)]
|
||||
(if (= prev-height (:to-response-height db))
|
||||
(assoc db :to-response-height height
|
||||
:response-height-current height)
|
||||
db))
|
||||
db))))
|
||||
|
||||
(register-handler :on-drag-response
|
||||
(animation-handler :on-drag-response
|
||||
(fn [db [_ dy]]
|
||||
(let [fixed (get-in db [:animations :to-response-height])]
|
||||
(-> db
|
||||
(assoc-in [:animations :response-height-current] (- fixed dy))
|
||||
(assoc-in [:animations :response-resize?] false)))))
|
||||
(let [fixed (:to-response-height db)]
|
||||
(assoc db :response-height-current (- fixed dy)
|
||||
:response-resize? false))))
|
||||
|
||||
(register-handler :fix-response-height
|
||||
(fn [db _]
|
||||
|
|
|
@ -235,11 +235,11 @@
|
|||
(anim/start (anim/spring val {:toValue to-value})
|
||||
(fn [arg]
|
||||
(when (.-finished arg)
|
||||
(dispatch [:set-in [:animations ::messages-offset-current] to-value])))))))
|
||||
(dispatch [:set-animation ::messages-offset-current to-value])))))))
|
||||
|
||||
(defn messages-container [messages]
|
||||
(let [to-messages-offset (subscribe [:get-in [:animations :messages-offset]])
|
||||
cur-messages-offset (subscribe [:get-in [:animations ::messages-offset-current]])
|
||||
(let [to-messages-offset (subscribe [:animations :messages-offset])
|
||||
cur-messages-offset (subscribe [:animations ::messages-offset-current])
|
||||
messages-offset (anim/create-value (or @cur-messages-offset 0))
|
||||
context {:to-value to-messages-offset
|
||||
:val messages-offset}
|
||||
|
|
|
@ -32,7 +32,7 @@
|
|||
[text {:style st/command-text} (:text command)]])
|
||||
|
||||
(defview cancel-button []
|
||||
[commands-input-is-switching? [:get-in [:animations :commands-input-is-switching?]]]
|
||||
[commands-input-is-switching? [:animations :commands-input-is-switching?]]
|
||||
[touchable-highlight {:disabled commands-input-is-switching?
|
||||
:on-press cancel-command-input}
|
||||
[view st/cancel-container
|
||||
|
|
|
@ -19,29 +19,29 @@
|
|||
[status-im.constants :refer [response-input-hiding-duration]]))
|
||||
|
||||
(defview send-button [{:keys [on-press accessibility-label]}]
|
||||
[commands-input-is-switching? [:get-in [:animations :commands-input-is-switching?]]]
|
||||
[commands-input-is-switching? [:animations :commands-input-is-switching?]]
|
||||
[touchable-highlight {:disabled commands-input-is-switching?
|
||||
:on-press on-press
|
||||
:accessibility-label accessibility-label}
|
||||
[view st/send-container
|
||||
[icon :send st/send-icon]]])
|
||||
|
||||
(defn message-input-container-animation-logic [{:keys [to-value val]}]
|
||||
(defn animation-logic [{:keys [to-value val]}]
|
||||
(fn [_]
|
||||
(let [to-value @to-value]
|
||||
(anim/start (anim/timing val {:toValue to-value
|
||||
:duration response-input-hiding-duration})
|
||||
(fn [arg]
|
||||
(when (.-finished arg)
|
||||
(dispatch [:set-in [:animations ::message-input-offset-current] to-value])))))))
|
||||
(dispatch [:set-animation ::message-input-offset-current to-value])))))))
|
||||
|
||||
(defn message-input-container [input]
|
||||
(let [to-message-input-offset (subscribe [:get-in [:animations :message-input-offset]])
|
||||
cur-message-input-offset (subscribe [:get-in [:animations ::message-input-offset-current]])
|
||||
(let [to-message-input-offset (subscribe [:animations :message-input-offset])
|
||||
cur-message-input-offset (subscribe [:animations ::message-input-offset-current])
|
||||
message-input-offset (anim/create-value (or @cur-message-input-offset 0))
|
||||
context {:to-value to-message-input-offset
|
||||
:val message-input-offset}
|
||||
on-update (message-input-container-animation-logic context)]
|
||||
on-update (animation-logic context)]
|
||||
(r/create-class
|
||||
{:component-did-mount
|
||||
on-update
|
||||
|
@ -60,7 +60,7 @@
|
|||
input-command [:get-chat-command-content]
|
||||
staged-commands [:get-chat-staged-commands]
|
||||
typing-command? [:typing-command?]
|
||||
commands-input-is-switching? [:get-in [:animations :commands-input-is-switching?]]]
|
||||
commands-input-is-switching? [:animations :commands-input-is-switching?]]
|
||||
(let [dismiss-keyboard (not (or command typing-command?))
|
||||
response? (and command to-msg-id)
|
||||
message-input? (or (not command) commands-input-is-switching?)
|
||||
|
@ -99,7 +99,7 @@
|
|||
input-command [:get-chat-command-content]
|
||||
staged-commands [:get-chat-staged-commands]
|
||||
typing-command? [:typing-command?]
|
||||
commands-input-is-switching? [:get-in [:animations :commands-input-is-switching?]]]
|
||||
commands-input-is-switching? [:animations :commands-input-is-switching?]]
|
||||
(let [dismiss-keyboard (not (or command typing-command?))
|
||||
response? (and command to-msg-id)
|
||||
message-input? (or (not command) commands-input-is-switching?)]
|
||||
|
|
|
@ -28,12 +28,10 @@
|
|||
:request {:input-options {:keyboardType :numeric}}
|
||||
(throw (js/Error. "Uknown command type"))))])
|
||||
|
||||
(defn chat-message-new []
|
||||
(let [command-atom (subscribe [:get-chat-command])
|
||||
staged-commands-atom (subscribe [:get-chat-staged-commands])]
|
||||
(fn []
|
||||
(let [staged-commands @staged-commands-atom]
|
||||
(defview chat-message-new []
|
||||
[command [:get-chat-command]
|
||||
staged-commands [:get-chat-staged-commands]]
|
||||
[view st/new-message-container
|
||||
(when (and staged-commands (pos? (count staged-commands)))
|
||||
[staged-commands-view staged-commands])
|
||||
[show-input @command-atom]]))))
|
||||
[show-input command]])
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
(defn commands-button-animation-callback [message-input]
|
||||
(fn [arg to-value]
|
||||
(when (.-finished arg)
|
||||
(dispatch [:set-in [:animations ::message-input-buttons-scale-current] to-value])
|
||||
(dispatch [:set-animation ::message-input-buttons-scale-current to-value])
|
||||
(when (<= to-value 0.1)
|
||||
(dispatch [:finish-show-response])
|
||||
(prepare-message-input @message-input)))))
|
||||
|
@ -57,9 +57,9 @@
|
|||
(defn commands-button []
|
||||
(let [typing-command? (subscribe [:typing-command?])
|
||||
message-input (subscribe [:get :message-input])
|
||||
animation? (subscribe [:get-in [:animations :commands-input-is-switching?]])
|
||||
to-scale (subscribe [:get-in [:animations :message-input-buttons-scale]])
|
||||
cur-scale (subscribe [:get-in [:animations ::message-input-buttons-scale-current]])
|
||||
animation? (subscribe [:animations :commands-input-is-switching?])
|
||||
to-scale (subscribe [:animations :message-input-buttons-scale])
|
||||
cur-scale (subscribe [:animations ::message-input-buttons-scale-current])
|
||||
buttons-scale (anim/create-value (or @cur-scale 1))
|
||||
anim-callback (commands-button-animation-callback message-input)
|
||||
context {:to-value to-scale
|
||||
|
@ -84,9 +84,9 @@
|
|||
[icon :list st/list-icon])]]))})))
|
||||
|
||||
(defn smile-button []
|
||||
(let [animation? (subscribe [:get-in [:animations :commands-input-is-switching?]])
|
||||
to-scale (subscribe [:get-in [:animations :message-input-buttons-scale]])
|
||||
cur-scale (subscribe [:get-in [:animations ::message-input-buttons-scale-current]])
|
||||
(let [animation? (subscribe [:animations :commands-input-is-switching?])
|
||||
to-scale (subscribe [:animations :message-input-buttons-scale])
|
||||
cur-scale (subscribe [:animations ::message-input-buttons-scale-current])
|
||||
buttons-scale (anim/create-value (or @cur-scale 1))
|
||||
context {:to-value to-scale
|
||||
:val buttons-scale}
|
||||
|
|
|
@ -33,15 +33,15 @@
|
|||
(anim/spring val {:toValue to-scale})])
|
||||
(fn [arg]
|
||||
(when (.-finished arg)
|
||||
(dispatch [:set-in [:animations ::request-button-scale-current] to-scale])
|
||||
(dispatch [:set-animation ::request-button-scale-current to-scale])
|
||||
(when loop?
|
||||
(dispatch [:set-in [:animations ::request-button-scale] (if (= to-scale minimum)
|
||||
(dispatch [:set-animation ::request-button-scale (if (= to-scale minimum)
|
||||
maximum
|
||||
minimum)]))))))))
|
||||
|
||||
(defn request-button [msg-id command]
|
||||
(let [to-scale (subscribe [:get-in [:animations ::request-button-scale]])
|
||||
cur-scale (subscribe [:get-in [:animations ::request-button-scale-current]])
|
||||
(let [to-scale (subscribe [:animations ::request-button-scale])
|
||||
cur-scale (subscribe [:animations ::request-button-scale-current])
|
||||
scale-anim-val (anim/create-value (or @cur-scale 1))
|
||||
loop? (r/atom true)
|
||||
context {:to-value to-scale
|
||||
|
|
|
@ -61,7 +61,7 @@
|
|||
(anim/start (anim/spring val {:toValue to-value})
|
||||
(fn [arg]
|
||||
(when (.-finished arg)
|
||||
(dispatch [:set-in [:animations :response-height-current] to-value])
|
||||
(dispatch [:set-animation :response-height-current to-value])
|
||||
(dispatch [:finish-animate-response-resize])
|
||||
(when (= to-value input-height)
|
||||
(dispatch [:finish-animate-cancel-command])
|
||||
|
@ -69,10 +69,10 @@
|
|||
(anim/set-value val @current-value))))
|
||||
|
||||
(defn container [& children]
|
||||
(let [commands-input-is-switching? (subscribe [:get-in [:animations :commands-input-is-switching?]])
|
||||
response-resize? (subscribe [:get-in [:animations :response-resize?]])
|
||||
to-response-height (subscribe [:get-in [:animations :to-response-height]])
|
||||
cur-response-height (subscribe [:get-in [:animations :response-height-current]])
|
||||
(let [commands-input-is-switching? (subscribe [:animations :commands-input-is-switching?])
|
||||
response-resize? (subscribe [:animations :response-resize?])
|
||||
to-response-height (subscribe [:animations :to-response-height])
|
||||
cur-response-height (subscribe [:animations :response-height-current])
|
||||
response-height (anim/create-value (or @cur-response-height 0))
|
||||
context {:animation? (reaction (or @commands-input-is-switching? @response-resize?))
|
||||
:to-value to-response-height
|
||||
|
|
|
@ -49,6 +49,10 @@
|
|||
debug
|
||||
set-in)
|
||||
|
||||
(register-handler :set-animation
|
||||
(fn [db [_ k v]]
|
||||
(assoc-in db [:animations k] v)))
|
||||
|
||||
(register-handler :initialize-db
|
||||
(fn [_ _]
|
||||
(assoc app-db
|
||||
|
|
|
@ -15,3 +15,7 @@
|
|||
(register-sub :get-in
|
||||
(fn [db [_ path]]
|
||||
(reaction (get-in @db path))))
|
||||
|
||||
(register-sub :animations
|
||||
(fn [db [_ k]]
|
||||
(reaction (get-in @db [:animations k]))))
|
||||
|
|
Loading…
Reference in New Issue