Animation refactoring

src/status_im/chat/handlers/animation.cljs

@@ -10,12 +10,16 @@
 
 (def zero-height input-height)
 
-(register-handler :finish-animate-cancel-command
+(defn animation-handler
-  (fn [db _]
+  ([name handler] (animation-handler name nil handler))
-    (assoc-in db [:animations :commands-input-is-switching?] false)))
+  ([name middleware handler]
+   (register-handler name [(path :animations) middleware] handler)))
 
-(register-handler :animate-cancel-command
+(animation-handler :finish-animate-cancel-command
-  (path :animations)
+  (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])]
+    (let [fixed (:to-response-height db)]
-      (-> db
+      (assoc db :response-height-current fixed
-          (assoc-in [:animations :response-height-current] fixed)
+                :response-resize? false))))
-          (assoc-in [:animations :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)]
+        (let [db (assoc db :response-height-max height)]
-          (if (= prev-height (get-in db [:animations :to-response-height]))
+          (if (= prev-height (:to-response-height db))
-            (-> db
+            (assoc db :to-response-height height
-                (assoc-in [:animations :to-response-height] height)
+                      :response-height-current height)
-                (assoc-in [:animations :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])]
+    (let [fixed (:to-response-height db)]
-      (-> db
+      (assoc db :response-height-current (- fixed dy)
-          (assoc-in [:animations :response-height-current] (- fixed dy))
+                :response-resize? false))))
-          (assoc-in [:animations :response-resize?] false)))))
 
 (register-handler :fix-response-height
   (fn [db _]

src/status_im/chat/screen.cljs

@@ -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]])
+  (let [to-messages-offset (subscribe [:animations :messages-offset])
-        cur-messages-offset (subscribe [:get-in [:animations ::messages-offset-current]])
+        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}

src/status_im/chat/views/command.cljs

@@ -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

src/status_im/chat/views/message_input.cljs

@@ -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]])
+  (let [to-message-input-offset (subscribe [:animations :message-input-offset])
-        cur-message-input-offset (subscribe [:get-in [:animations ::message-input-offset-current]])
+        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?)]

src/status_im/chat/views/new_message.cljs

@@ -28,12 +28,10 @@
        :request {:input-options {:keyboardType :numeric}}
        (throw (js/Error. "Uknown command type"))))])
 
-(defn chat-message-new []
+(defview chat-message-new []
-  (let [command-atom (subscribe [:get-chat-command])
+  [command [:get-chat-command]
-        staged-commands-atom (subscribe [:get-chat-staged-commands])]
+   staged-commands [:get-chat-staged-commands]]
-    (fn []
+  [view st/new-message-container
-      (let [staged-commands @staged-commands-atom]
+   (when (and staged-commands (pos? (count staged-commands)))
-        [view st/new-message-container
+     [staged-commands-view staged-commands])
-         (when (and staged-commands (pos? (count staged-commands)))
+   [show-input command]])
-           [staged-commands-view staged-commands])
-         [show-input @command-atom]]))))

src/status_im/chat/views/plain_message.cljs

@@ -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?]])
+        animation? (subscribe [:animations :commands-input-is-switching?])
-        to-scale (subscribe [:get-in [:animations :message-input-buttons-scale]])
+        to-scale (subscribe [:animations :message-input-buttons-scale])
-        cur-scale (subscribe [:get-in [:animations ::message-input-buttons-scale-current]])
+        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?]])
+  (let [animation? (subscribe [:animations :commands-input-is-switching?])
-        to-scale (subscribe [:get-in [:animations :message-input-buttons-scale]])
+        to-scale (subscribe [:animations :message-input-buttons-scale])
-        cur-scale (subscribe [:get-in [:animations ::message-input-buttons-scale-current]])
+        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}

src/status_im/chat/views/request_message.cljs

@@ -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
+                                                                 maximum
-                                                                        minimum)]))))))))
+                                                                 minimum)]))))))))
 
 (defn request-button [msg-id command]
-  (let [to-scale (subscribe [:get-in [:animations ::request-button-scale]])
+  (let [to-scale (subscribe [:animations ::request-button-scale])
-        cur-scale (subscribe [:get-in [:animations ::request-button-scale-current]])
+        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

src/status_im/chat/views/response.cljs

@@ -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?]])
+  (let [commands-input-is-switching? (subscribe [:animations :commands-input-is-switching?])
-        response-resize? (subscribe [:get-in [:animations :response-resize?]])
+        response-resize? (subscribe [:animations :response-resize?])
-        to-response-height (subscribe [:get-in [:animations :to-response-height]])
+        to-response-height (subscribe [:animations :to-response-height])
-        cur-response-height (subscribe [:get-in [:animations :response-height-current]])
+        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

src/status_im/handlers.cljs

@@ -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

src/status_im/subs.cljs

@@ -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]))))