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

custom register-handler & response icon animation

This commit is contained in:
Roman Volosovskyi 2016-06-27 12:07:14 +03:00
parent ce57ab19c8
commit e7b328aa27
11 changed files with 51 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
src/status_im/chat/handlers.cljs
View File

@ -1,5 +1,5 @@
(ns status-im.chat.handlers
(:require [re-frame.core :refer [register-handler enrich after debug dispatch]]
(:require [re-frame.core :refer [enrich after debug dispatch]]
[status-im.models.commands :as commands]
[clojure.string :as str]
[status-im.components.styles :refer [default-chat-color]]
@ -12,7 +12,7 @@
[status-im.chat.sign-up :as sign-up-service]
[status-im.models.chats :as chats]
[status-im.navigation.handlers :as nav]
[status-im.utils.handlers :as u]
[status-im.utils.handlers :refer [register-handler] :as u]
[status-im.persistence.realm :as r]
[status-im.handlers.server :as server]
[status-im.handlers.content-suggestions :refer [get-content-suggestions]]

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

@ -1,5 +1,6 @@
(ns status-im.chat.handlers.animation
(:require [re-frame.core :refer [register-handler after dispatch debug]]
(:require [re-frame.core :refer [after dispatch debug]]
[status-im.utils.handlers :refer [register-handler]]
[re-frame.middleware :refer [path]]
[status-im.handlers.content-suggestions :refer [get-content-suggestions]]
[status-im.chat.constants :refer [input-height request-info-height

8
src/status_im/chat/styles/message.cljs
View File

@ -153,15 +153,13 @@
:backgroundColor (:color command)
:transform [{:scale scale}]})
(defn command-image-view
[command]
(def command-image-view
{:position :absolute
:top 0
:right 0
:width 24
:height 24
:borderRadius 50
:backgroundColor (:color command)
:alignItems :center})
(def command-request-image
@ -198,7 +196,9 @@
(def command-image
{:margin-top 5
:width 12
:height 13})
:height 13
:tintColor :#a9a9a9cc})
(def command-text
(merge style-message-text
{:marginTop 8

21
src/status_im/chat/views/message.cljs
View File

@ -69,7 +69,7 @@
(str "!" (:name command))]]]
;; todo doesn't reflect design
(when-let [icon (:icon command)]
[view (st/command-image-view command)
[view st/command-image-view
[image {:source {:uri icon}
:style st/command-image}]])
(if preview
@ -84,25 +84,6 @@
(->> (when command (name command))
(str "request-")))
;; todo remove (merging leftover)
#_(defview message-content-command-request
[{:keys [msg-id content from incoming-group]}]
[commands [:get-responses]]
(let [{:keys [command content]} (parse-command-request commands content)]
[touchable-highlight {:onPress #(set-chat-command msg-id command)
:accessibility-label (label command)}
[view st/comand-request-view
[view st/command-request-message-view
(when incoming-group
[text {:style st/command-request-from-text} from])
[text {:style st/style-message-text} content]]
[view (st/command-request-image-view command)
[image {:source {:uri (:icon command)}
:style st/command-request-image}]]
(when-let [request-text (:request-text command)]
[view st/command-request-text-view
[text {:style st/style-sub-text} request-text]])]]))
(defn message-view
[message content]
[view (st/message-view message)

50
src/status_im/chat/views/request_message.cljs
View File

@ -19,49 +19,37 @@
(->> (name command)
(str "request-")))
(defn request-button-animation-logic [{:keys [to-value val loop?]}]
(fn [_]
(let [loop? @loop?
minimum 1
maximum 1.3
to-scale (if loop?
(or @to-value maximum)
minimum)]
(anim/start
(anim/anim-sequence
[(anim/anim-delay (if loop? request-message-icon-scale-delay 0))
(anim/spring val {:toValue to-scale})])
(fn [arg]
(when (.-finished arg)
(dispatch [:set-animation ::request-button-scale-current to-scale])
(when loop?
(dispatch [:set-animation ::request-button-scale (if (= to-scale minimum)
maximum
minimum)]))))))))
(def min-scale 1)
(def max-scale 1.3)
(defn request-button-animation-logic
[{:keys [to-value val loop?] :as context}]
(anim/start
(anim/anim-sequence
[(anim/anim-delay (if @loop? request-message-icon-scale-delay 0))
(anim/spring val {:toValue to-value})])
#(when @loop?
(let [new-value (if (= to-value min-scale) max-scale min-scale)
context' (assoc context :to-value new-value)]
(request-button-animation-logic context')))))
(defn request-button [msg-id command]
(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))
(let [scale-anim-val (anim/create-value min-scale)
loop? (r/atom true)
context {:to-value to-scale
context {:to-value max-scale
:val scale-anim-val
:loop? loop?}
on-update (request-button-animation-logic context)]
:loop? loop?}]
(r/create-class
{:component-did-mount
on-update
:component-did-update
on-update
#(request-button-animation-logic context)
:component-will-unmount
#(reset! loop? false)
:reagent-render
(fn [msg-id command]
@to-scale
[touchable-highlight {:on-press (fn []
(reset! loop? false)
(set-chat-command msg-id command))
:style st/command-request-image-touchable}
;:accessibility-label (label command)
[animated-view {:style (st/command-request-image-view command scale-anim-val)}
[image {:source {:uri (:icon command)}
:style st/command-request-image}]]])})))

11
src/status_im/chat/views/response.cljs
View File

@ -83,11 +83,10 @@
[icon :close-white st/cancel-icon]]]]])))
(defn container-animation-logic [{:keys [to-value val]}]
(fn [_]
(let [to-value @to-value]
(anim/start (anim/spring val {:toValue to-value
:tension 50
:friction 10})))))
(let [to-value @to-value]
(anim/start (anim/spring val {:toValue to-value
:tension 50
:friction 10}))))
(defn container [response-height & children]
(let [;; todo to-response-height, cur-response-height must be specific
@ -96,7 +95,7 @@
changed (subscribe [:animations :response-height-changed])
context {:to-value to-response-height
:val response-height}
on-update (container-animation-logic context)]
on-update #(container-animation-logic context)]
(r/create-class
{:component-did-mount
on-update

11
src/status_im/chat/views/suggestions.cljs
View File

@ -93,11 +93,10 @@
[icon :drag_down st/drag-down-icon]])))
(defn container-animation-logic [{:keys [to-value val]}]
(fn [_]
(let [to-value @to-value]
(anim/start (anim/spring val {:toValue to-value
:tension 50
:friction 10})))))
(let [to-value @to-value]
(anim/start (anim/spring val {:toValue to-value
:tension 50
:friction 10}))))
(defn container [h & elements]
(let [;; todo to-response-height, cur-response-height must be specific
@ -106,7 +105,7 @@
changed (subscribe [:animations :commands-height-changed])
context {:to-value to-response-height
:val h}
on-update (container-animation-logic context)]
on-update #(container-animation-logic context)]
(r/create-class
{:component-did-mount
on-update

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

@ -1,6 +1,5 @@
(ns status-im.commands.handlers.jail
(:require [re-frame.core :refer [register-handler after dispatch subscribe
trim-v debug]]
(:require [re-frame.core :refer [after dispatch subscribe trim-v debug]]
[status-im.utils.handlers :as u]
[status-im.utils.utils :refer [http-get toast]]
[status-im.components.jail :as j]

5
src/status_im/commands/utils.cljs
View File

@ -3,7 +3,8 @@
[clojure.walk :as w]
[status-im.components.react :refer [text scroll-view view
image touchable-highlight]]
[re-frame.core :refer [register-handler dispatch trim-v debug]]))
[re-frame.core :refer [register-handler dispatch trim-v debug]]
[status-im.utils.handlers :refer [register-handler]]))
(defn json->clj [json]
(if (= json "undefined")
@ -44,4 +45,4 @@
(defn reg-handler
([name handler] (reg-handler name nil handler))
([name middleware handler]
(register-handler name [#_debug trim-v middleware] handler)))
(register-handler name [trim-v middleware] handler)))

4
src/status_im/handlers.cljs
View File

@ -1,13 +1,13 @@
(ns status-im.handlers
(:require
[re-frame.core :refer [register-handler after dispatch debug]]
[re-frame.core :refer [after dispatch debug]]
[schema.core :as s :include-macros true]
[status-im.db :refer [app-db schema]]
[status-im.persistence.simple-kv-store :as kv]
[status-im.protocol.state.storage :as storage]
[status-im.utils.logging :as log]
[status-im.utils.crypt :refer [gen-random-bytes]]
[status-im.utils.handlers :as u]
[status-im.utils.handlers :refer [register-handler] :as u]
status-im.chat.handlers
status-im.chat.handlers.animation
status-im.group-settings.handlers

8
src/status_im/utils/handlers.cljs
View File

@ -1,4 +1,5 @@
(ns status-im.utils.handlers)
(ns status-im.utils.handlers
(:require [re-frame.core :refer [after dispatch debug] :as re-core]))
(defn side-effect!
"Middleware for handlers that will not affect db."
@ -6,3 +7,8 @@
(fn [db params]
(handler db params)
db))
(defn register-handler
([name handler] (register-handler name nil handler))
([name middleware handler]
(re-core/register-handler name [#_debug middleware] handler)))