Roman Volosovskyi
parent
2e8d87322d
commit
98321167fe
|
|
@ -61,10 +61,11 @@
|
||||||
^{:key member} [typing member])])
|
^{:key member} [typing member])])
|
||||||
|
|
||||||
(defn message-row [contact-by-identity group-chat]
|
(defn message-row [contact-by-identity group-chat]
|
||||||
(fn [row _ _]
|
(fn [row _ idx]
|
||||||
(let [msg (-> row
|
(let [msg (-> row
|
||||||
(add-msg-color contact-by-identity)
|
(add-msg-color contact-by-identity)
|
||||||
(assoc :group-chat group-chat))]
|
(assoc :group-chat group-chat)
|
||||||
|
(assoc :last-msg (zero? (js/parseInt idx))))]
|
||||||
(list-item [chat-message msg]))))
|
(list-item [chat-message msg]))))
|
||||||
|
|
||||||
(defn on-action-selected [position]
|
(defn on-action-selected [position]
|
||||||
|
|
|
||||||
|
|
@ -7,18 +7,9 @@
|
||||||
image
|
image
|
||||||
touchable-highlight
|
touchable-highlight
|
||||||
navigator]]
|
navigator]]
|
||||||
[syng-im.components.styles :refer [font
|
[syng-im.components.chat.chat-message-styles :as st]
|
||||||
color-light-blue-transparent
|
|
||||||
color-white
|
|
||||||
color-black
|
|
||||||
color-blue
|
|
||||||
selected-message-color
|
|
||||||
online-color
|
|
||||||
text1-color
|
|
||||||
text2-color]]
|
|
||||||
[syng-im.models.commands :refer [parse-command-msg-content
|
[syng-im.models.commands :refer [parse-command-msg-content
|
||||||
parse-command-request-msg-content]]
|
parse-command-request]]
|
||||||
[syng-im.utils.logging :as log]
|
|
||||||
[syng-im.navigation :refer [nav-pop]]
|
[syng-im.navigation :refer [nav-pop]]
|
||||||
[syng-im.resources :as res]
|
[syng-im.resources :as res]
|
||||||
[syng-im.constants :refer [text-content-type
|
[syng-im.constants :refer [text-content-type
|
||||||
|
|
@ -26,152 +17,64 @@
|
||||||
content-type-command
|
content-type-command
|
||||||
content-type-command-request]]))
|
content-type-command-request]]))
|
||||||
|
|
||||||
(def style-message-text {:fontSize 14
|
;-------------------------------------------------------------------------------
|
||||||
:fontFamily font
|
;styles
|
||||||
:lineHeight 21
|
|
||||||
:color text1-color})
|
|
||||||
|
|
||||||
(def style-sub-text {:top -2
|
|
||||||
:fontFamily font
|
;-------------------------------------------------------------------------------
|
||||||
:fontSize 12
|
;components
|
||||||
:color text2-color
|
|
||||||
:lineHeight 14
|
|
||||||
:height 16})
|
|
||||||
|
|
||||||
(defn message-date [{:keys [date]}]
|
(defn message-date [{:keys [date]}]
|
||||||
[view {}
|
[view {}
|
||||||
[view {:style {:backgroundColor color-light-blue-transparent
|
[view st/message-date-container
|
||||||
:height 24
|
[text {:style st/message-date-text} date]]])
|
||||||
:borderRadius 50
|
|
||||||
:alignSelf :center
|
|
||||||
:marginTop 20
|
|
||||||
:marginBottom 20
|
|
||||||
:paddingTop 5
|
|
||||||
:paddingHorizontal 12}}
|
|
||||||
[text {:style (assoc style-sub-text :textAlign :center)}
|
|
||||||
date]]])
|
|
||||||
|
|
||||||
(defn contact-photo [{:keys [photo-path]}]
|
(defn contact-photo [{:keys [photo-path]}]
|
||||||
[view {:borderRadius 50}
|
[view st/contact-photo-container
|
||||||
[image {:source (if (s/blank? photo-path)
|
[image {:source (if (s/blank? photo-path)
|
||||||
res/user-no-photo
|
res/user-no-photo
|
||||||
{:uri photo-path})
|
{:uri photo-path})
|
||||||
:style {:borderRadius 50
|
:style st/contact-photo-st}]])
|
||||||
:width 64
|
|
||||||
:height 64}}]])
|
|
||||||
|
|
||||||
(defn contact-online [{:keys [online]}]
|
(defn contact-online [{:keys [online]}]
|
||||||
(when online
|
(when online
|
||||||
[view {:position :absolute
|
[view st/online-container
|
||||||
:top 44
|
[view st/online-dot-left]
|
||||||
:left 44
|
[view st/online-dot-right]]))
|
||||||
:width 24
|
|
||||||
:height 24
|
|
||||||
:borderRadius 50
|
|
||||||
:backgroundColor online-color
|
|
||||||
:borderWidth 2
|
|
||||||
:borderColor color-white}
|
|
||||||
[view {:position :absolute
|
|
||||||
:top 8
|
|
||||||
:left 5
|
|
||||||
:width 4
|
|
||||||
:height 4
|
|
||||||
:borderRadius 50
|
|
||||||
:backgroundColor color-white}]
|
|
||||||
[view {:position :absolute
|
|
||||||
:top 8
|
|
||||||
:left 11
|
|
||||||
:width 4
|
|
||||||
:height 4
|
|
||||||
:borderRadius 50
|
|
||||||
:backgroundColor color-white}]]))
|
|
||||||
|
|
||||||
|
|
||||||
(defn message-content-status [{:keys [from content]}]
|
(defn message-content-status [{:keys [from content]}]
|
||||||
[view {:style {:flex 1
|
[view st/status-container
|
||||||
:alignSelf :center
|
[view st/status-image-view
|
||||||
:alignItems :center
|
|
||||||
:width 249}}
|
|
||||||
[view {:style {:marginTop 20}}
|
|
||||||
[contact-photo {}]
|
[contact-photo {}]
|
||||||
[contact-online {:online true}]]
|
[contact-online {:online true}]]
|
||||||
[text {:style {:marginTop 20
|
[text {:style st/status-from} from]
|
||||||
:fontSize 18
|
[text {:style st/status-text} content]])
|
||||||
:fontFamily font
|
|
||||||
:color text1-color}}
|
|
||||||
from]
|
|
||||||
[text {:style {:marginTop 10
|
|
||||||
:fontFamily font
|
|
||||||
:fontSize 14
|
|
||||||
:lineHeight 20
|
|
||||||
:textAlign :center
|
|
||||||
:color text2-color}}
|
|
||||||
content]])
|
|
||||||
|
|
||||||
(defn message-content-audio [_]
|
(defn message-content-audio [_]
|
||||||
[view {:style {:flexDirection :row
|
[view st/audio-container
|
||||||
:alignItems :center}}
|
[view st/play-view
|
||||||
[view {:style {:width 33
|
|
||||||
:height 33
|
|
||||||
:borderRadius 50
|
|
||||||
:elevation 1}}
|
|
||||||
[image {:source res/play
|
[image {:source res/play
|
||||||
:style {:width 33
|
:style st/play-image}]]
|
||||||
:height 33}}]]
|
[view st/track-container
|
||||||
[view {:style {:marginTop 10
|
[view st/track]
|
||||||
:marginLeft 10
|
[view st/track-mark]
|
||||||
:width 120
|
[text {:style st/track-duration-text}
|
||||||
:height 26
|
|
||||||
:elevation 1}}
|
|
||||||
[view {:style {:position :absolute
|
|
||||||
:top 4
|
|
||||||
:width 120
|
|
||||||
:height 2
|
|
||||||
:backgroundColor "#EC7262"}}]
|
|
||||||
[view {:style {:position :absolute
|
|
||||||
:left 0
|
|
||||||
:top 0
|
|
||||||
:width 2
|
|
||||||
:height 10
|
|
||||||
:backgroundColor "#4A5258"}}]
|
|
||||||
[text {:style {:position :absolute
|
|
||||||
:left 1
|
|
||||||
:top 11
|
|
||||||
:fontFamily font
|
|
||||||
:fontSize 11
|
|
||||||
:color "#4A5258"
|
|
||||||
:letterSpacing 1
|
|
||||||
:lineHeight 15}}
|
|
||||||
"03:39"]]])
|
"03:39"]]])
|
||||||
|
|
||||||
|
|
||||||
(defn message-content-command [content]
|
(defn message-content-command [content]
|
||||||
(let [commands-atom (subscribe [:get-commands])]
|
(let [commands-atom (subscribe [:get-commands])]
|
||||||
(fn [content]
|
(fn [content]
|
||||||
(let [commands @commands-atom
|
(let [commands @commands-atom
|
||||||
{:keys [command content]}
|
{:keys [command content]}
|
||||||
(parse-command-msg-content commands content)]
|
(parse-command-msg-content commands content)]
|
||||||
[view {:style {:flexDirection :column}}
|
[view st/conetent-command-view
|
||||||
[view {:style {:flexDirection :row
|
[view st/command-container
|
||||||
:marginRight 32}}
|
[view (st/command-view command)
|
||||||
[view {:style {:backgroundColor (:color command)
|
[text {:style st/command-text}
|
||||||
:height 24
|
|
||||||
:borderRadius 50
|
|
||||||
:paddingTop 3
|
|
||||||
:paddingHorizontal 12}}
|
|
||||||
[text {:style {:fontSize 12
|
|
||||||
:fontFamily font
|
|
||||||
:color color-white}}
|
|
||||||
(:text command)]]]
|
(:text command)]]]
|
||||||
[image {:source (:icon command)
|
[image {:source (:icon command)
|
||||||
:style {:position :absolute
|
:style st/command-image}]
|
||||||
:top 4
|
[text {:style st/command-text-st}
|
||||||
:right 0
|
|
||||||
:width 12
|
|
||||||
:height 13}}]
|
|
||||||
[text {:style (merge style-message-text
|
|
||||||
{:marginTop 8
|
|
||||||
:marginHorizontal 0})}
|
|
||||||
;; TODO isn't smart
|
;; TODO isn't smart
|
||||||
(if (= (:command command) :keypair-password)
|
(if (= (:command command) :keypair-password)
|
||||||
"******"
|
"******"
|
||||||
|
|
@ -180,98 +83,33 @@
|
||||||
(defn set-chat-command [msg-id command]
|
(defn set-chat-command [msg-id command]
|
||||||
(dispatch [:set-response-chat-command msg-id (:command command)]))
|
(dispatch [:set-response-chat-command msg-id (:command command)]))
|
||||||
|
|
||||||
|
|
||||||
(defn message-content-command-request
|
(defn message-content-command-request
|
||||||
[{:keys [msg-id content outgoing group-chat from]}]
|
[{:keys [msg-id content from incoming-group]}]
|
||||||
(let [commands-atom (subscribe [:get-commands])]
|
(let [commands-atom (subscribe [:get-commands])]
|
||||||
(fn [{:keys [msg-id content outgoing group-chat from]}]
|
(fn [{:keys [msg-id content from incoming-group]}]
|
||||||
(let [commands @commands-atom
|
(let [commands @commands-atom
|
||||||
{:keys [command content]} (parse-command-request-msg-content commands content)]
|
{:keys [command content]} (parse-command-request commands content)]
|
||||||
[touchable-highlight {:onPress #(set-chat-command msg-id command)}
|
[touchable-highlight {:onPress #(set-chat-command msg-id command)}
|
||||||
[view {:style {:paddingRight 16}}
|
[view st/comand-request-view
|
||||||
[view {:style (merge {:borderRadius 14
|
[view st/command-request-message-view
|
||||||
:padding 12
|
(when incoming-group
|
||||||
:backgroundColor color-white})}
|
[text {:style st/command-request-from-text}
|
||||||
(when (and group-chat (not outgoing))
|
|
||||||
[text {:style (merge style-sub-text
|
|
||||||
{:marginBottom 2})}
|
|
||||||
from])
|
from])
|
||||||
[text {:style style-message-text}
|
[text {:style st/style-message-text}
|
||||||
content]]
|
content]]
|
||||||
[view {:style {:position :absolute
|
[view (st/command-request-image-view command)
|
||||||
:top 12
|
|
||||||
:right 0
|
|
||||||
:width 32
|
|
||||||
:height 32
|
|
||||||
:borderRadius 50
|
|
||||||
:backgroundColor (:color command)}}
|
|
||||||
[image {:source (:request-icon command)
|
[image {:source (:request-icon command)
|
||||||
:style {:position :absolute
|
:style st/command-request-image}]]
|
||||||
:top 9
|
|
||||||
:left 10
|
|
||||||
:width 12
|
|
||||||
:height 13}}]]
|
|
||||||
(when (:request-text command)
|
(when (:request-text command)
|
||||||
[view {:style {:marginTop 4
|
[view st/command-request-text-view
|
||||||
:height 14}}
|
[text {:style st/style-sub-text}
|
||||||
[text {:style style-sub-text}
|
|
||||||
(:request-text command)]])]]))))
|
(:request-text command)]])]]))))
|
||||||
|
|
||||||
(defn message-content-plain [content outgoing group-chat]
|
|
||||||
[text {:style (merge style-message-text
|
|
||||||
{:marginTop (if (and group-chat (not outgoing))
|
|
||||||
4
|
|
||||||
0)}
|
|
||||||
(when (and outgoing group-chat)
|
|
||||||
{:color color-white}))}
|
|
||||||
content])
|
|
||||||
|
|
||||||
|
|
||||||
#_(defn message-content [{:keys [msg-id from content-type content outgoing
|
|
||||||
group-chat selected]}]
|
|
||||||
(if (= content-type content-type-command-request)
|
|
||||||
[message-content-command-request msg-id from content outgoing group-chat]
|
|
||||||
[view {:style (merge {:borderRadius 14
|
|
||||||
:padding 12
|
|
||||||
:backgroundColor color-white}
|
|
||||||
(when (= content-type content-type-command)
|
|
||||||
{:paddingTop 10
|
|
||||||
:paddingBottom 14})
|
|
||||||
(if outgoing
|
|
||||||
(when (and group-chat (= content-type text-content-type))
|
|
||||||
{:backgroundColor color-blue})
|
|
||||||
(when selected
|
|
||||||
{:backgroundColor selected-message-color})))}
|
|
||||||
(when (and group-chat (not outgoing))
|
|
||||||
[text {:style (merge style-sub-text
|
|
||||||
{:marginBottom 2})}
|
|
||||||
from])
|
|
||||||
(cond
|
|
||||||
(or (= content-type text-content-type)
|
|
||||||
(= content-type content-type-status))
|
|
||||||
[message-content-plain content outgoing group-chat]
|
|
||||||
(= content-type content-type-command)
|
|
||||||
[message-content-command content]
|
|
||||||
:else [message-content-audio {:content content
|
|
||||||
:content-type content-type}])]))
|
|
||||||
|
|
||||||
(defn message-view
|
(defn message-view
|
||||||
[{:keys [content-type outgoing background-color group-chat selected]} content]
|
[message content]
|
||||||
[view {:style (merge {:borderRadius 14
|
[view (st/message-view-st message)
|
||||||
:padding 12
|
#_(when incoming-group
|
||||||
:backgroundColor color-white}
|
[text {:style message-author-text}
|
||||||
(when (= content-type content-type-command)
|
|
||||||
{:paddingTop 10
|
|
||||||
:paddingBottom 14})
|
|
||||||
(if outgoing
|
|
||||||
(when (and group-chat (= content-type text-content-type))
|
|
||||||
{:backgroundColor color-blue})
|
|
||||||
(when selected
|
|
||||||
{:backgroundColor selected-message-color})))}
|
|
||||||
#_(when (and group-chat (not outgoing))
|
|
||||||
[text {:style {:marginTop 0
|
|
||||||
:fontSize 12
|
|
||||||
:fontFamily font}}
|
|
||||||
"Justas"])
|
"Justas"])
|
||||||
content])
|
content])
|
||||||
|
|
||||||
|
|
@ -283,14 +121,9 @@
|
||||||
[wrapper message [message-content-command-request message]])
|
[wrapper message [message-content-command-request message]])
|
||||||
|
|
||||||
(defn text-message
|
(defn text-message
|
||||||
[{:keys [content outgoing group-chat] :as message}]
|
[{:keys [content] :as message}]
|
||||||
[message-view message
|
[message-view message
|
||||||
[text {:style (merge style-message-text
|
[text {:style (st/text-message-st message)}
|
||||||
{:marginTop (if (and group-chat (not outgoing))
|
|
||||||
4
|
|
||||||
0)}
|
|
||||||
(when (and outgoing group-chat)
|
|
||||||
{:color color-white}))}
|
|
||||||
content]])
|
content]])
|
||||||
|
|
||||||
(defmethod message-content text-content-type
|
(defmethod message-content text-content-type
|
||||||
|
|
@ -314,21 +147,14 @@
|
||||||
:content-type content-type}]]])
|
:content-type content-type}]]])
|
||||||
|
|
||||||
(defn message-delivery-status [{:keys [delivery-status]}]
|
(defn message-delivery-status [{:keys [delivery-status]}]
|
||||||
[view {:style {:flexDirection :row
|
[view st/delivery-view
|
||||||
:marginTop 2}}
|
|
||||||
|
|
||||||
[image {:source (case delivery-status
|
[image {:source (case delivery-status
|
||||||
:delivered {:uri :icon_ok_small}
|
:delivered {:uri :icon_ok_small}
|
||||||
:seen {:uri :icon_ok_small}
|
:seen {:uri :icon_ok_small}
|
||||||
:seen-by-everyone {:uri :icon_ok_small}
|
:seen-by-everyone {:uri :icon_ok_small}
|
||||||
:failed res/delivery-failed-icon)
|
:failed res/delivery-failed-icon)
|
||||||
:style {:marginTop 6
|
:style st/delivery-image}]
|
||||||
:width 9
|
[text {:style st/delivery-text}
|
||||||
:height 7}}]
|
|
||||||
[text {:style {:fontFamily font
|
|
||||||
:fontSize 12
|
|
||||||
:color text2-color
|
|
||||||
:marginLeft 5}}
|
|
||||||
(case delivery-status
|
(case delivery-status
|
||||||
:delivered "Delivered"
|
:delivered "Delivered"
|
||||||
:seen "Seen"
|
:seen "Seen"
|
||||||
|
|
@ -336,85 +162,46 @@
|
||||||
:failed "Failed")]])
|
:failed "Failed")]])
|
||||||
|
|
||||||
(defn member-photo [{:keys [photo-path]}]
|
(defn member-photo [{:keys [photo-path]}]
|
||||||
[view {:borderRadius 50}
|
[view st/photo-view
|
||||||
[image {:source (if (s/blank? photo-path)
|
[image {:source (if (s/blank? photo-path)
|
||||||
res/user-no-photo
|
res/user-no-photo
|
||||||
{:uri photo-path})
|
{:uri photo-path})
|
||||||
:style {:borderRadius 50
|
:style st/photo}]])
|
||||||
:width 24
|
|
||||||
:height 24}}]])
|
|
||||||
|
|
||||||
|
|
||||||
(defn incoming-group-message-body
|
(defn incoming-group-message-body
|
||||||
[{:keys [selected new-day same-author same-direction last-msg typing]}
|
[{:keys [selected same-author] :as message} content]
|
||||||
content]
|
|
||||||
(let [delivery-status :seen-by-everyone]
|
(let [delivery-status :seen-by-everyone]
|
||||||
[view {:style {:flexDirection :column}}
|
[view st/group-message-wrapper
|
||||||
(when selected
|
(when selected
|
||||||
[text {:style {:marginTop 18
|
[text {:style st/selected-message}
|
||||||
:marginLeft 40
|
|
||||||
:fontFamily font
|
|
||||||
:fontSize 12
|
|
||||||
:color text2-color}}
|
|
||||||
"Mar 7th, 15:22"])
|
"Mar 7th, 15:22"])
|
||||||
[view {:style (merge {:flexDirection :row
|
[view (st/incoming-group-message-body-st message)
|
||||||
:alignSelf :flex-start
|
[view st/message-author
|
||||||
:marginTop (cond
|
(when (not same-author) [member-photo {}])]
|
||||||
new-day 0
|
[view st/group-message-view
|
||||||
same-author 4
|
|
||||||
same-direction 20
|
|
||||||
:else 10)
|
|
||||||
:paddingRight 8
|
|
||||||
:paddingLeft 8}
|
|
||||||
(when (and last-msg (not typing))
|
|
||||||
{:paddingBottom 20}))}
|
|
||||||
[view {:style {:width 24}}
|
|
||||||
(when (not same-author)
|
|
||||||
[member-photo {}])]
|
|
||||||
[view {:style {:flexDirection :column
|
|
||||||
:width 260
|
|
||||||
:paddingLeft 8
|
|
||||||
:alignItems :flex-start}}
|
|
||||||
content
|
content
|
||||||
;; TODO show for last or selected
|
;; TODO show for last or selected
|
||||||
(when (and selected delivery-status)
|
(when (and selected delivery-status)
|
||||||
[message-delivery-status {:delivery-status delivery-status}])]]]))
|
[message-delivery-status {:delivery-status delivery-status}])]]]))
|
||||||
|
|
||||||
(defn message-body
|
(defn message-body
|
||||||
[{:keys [outgoing new-day same-author same-direction last-msg typing]}
|
[{:keys [outgoing] :as message} content]
|
||||||
content]
|
(let [delivery-status :seen]
|
||||||
(let [delivery-status :seen
|
[view (st/message-body-st message)
|
||||||
align (if outgoing :flex-end :flex-start)]
|
|
||||||
[view {:style (merge {:flexDirection :column
|
|
||||||
:width 260
|
|
||||||
:paddingTop (cond
|
|
||||||
new-day 0
|
|
||||||
same-author 4
|
|
||||||
same-direction 20
|
|
||||||
:else 10)
|
|
||||||
:paddingRight 8
|
|
||||||
:paddingLeft 8
|
|
||||||
:alignSelf align
|
|
||||||
:alignItems align}
|
|
||||||
(when (and last-msg (not typing))
|
|
||||||
{:paddingBottom 20}))}
|
|
||||||
content
|
content
|
||||||
(when (and outgoing delivery-status)
|
(when (and outgoing delivery-status)
|
||||||
[message-delivery-status {:delivery-status delivery-status}])]))
|
[message-delivery-status {:delivery-status delivery-status}])]))
|
||||||
|
|
||||||
(defn chat-message
|
(defn chat-message
|
||||||
[{:keys [msg-id outgoing delivery-status date new-day group-chat]
|
[{:keys [outgoing delivery-status date new-day group-chat]
|
||||||
:as message}
|
:as message}]
|
||||||
last-msg-id]
|
|
||||||
[view {}
|
[view {}
|
||||||
(when new-day
|
(when new-day [message-date {:date date}])
|
||||||
[message-date {:date date}])
|
[view {}
|
||||||
(let [msg-data
|
(let [incoming-group (and group-chat (not outgoing))]
|
||||||
(merge message {:delivery-status (keyword delivery-status)
|
|
||||||
:last-msg (= last-msg-id msg-id)})]
|
|
||||||
[view {}
|
|
||||||
[message-content
|
[message-content
|
||||||
(if (and group-chat (not outgoing))
|
(if incoming-group
|
||||||
incoming-group-message-body
|
incoming-group-message-body
|
||||||
message-body)
|
message-body)
|
||||||
msg-data]])])
|
(merge message {:delivery-status (keyword delivery-status)
|
||||||
|
:incoming-group incoming-group})])]])
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,311 @@
|
||||||
|
(ns syng-im.components.chat.chat-message-styles
|
||||||
|
(:require [syng-im.components.styles :refer [font
|
||||||
|
color-light-blue-transparent
|
||||||
|
color-white
|
||||||
|
color-black
|
||||||
|
color-blue
|
||||||
|
selected-message-color
|
||||||
|
online-color
|
||||||
|
text1-color
|
||||||
|
text2-color]]
|
||||||
|
[syng-im.constants :refer [text-content-type
|
||||||
|
content-type-command]]))
|
||||||
|
|
||||||
|
(def style-message-text
|
||||||
|
{:fontSize 14
|
||||||
|
:fontFamily font
|
||||||
|
:lineHeight 21
|
||||||
|
:color text1-color})
|
||||||
|
|
||||||
|
(def style-sub-text
|
||||||
|
{:top -2
|
||||||
|
:fontFamily font
|
||||||
|
:fontSize 12
|
||||||
|
:color text2-color
|
||||||
|
:lineHeight 14
|
||||||
|
:height 16})
|
||||||
|
|
||||||
|
|
||||||
|
(defn message-padding-top
|
||||||
|
[{:keys [new-day same-author same-direction]}]
|
||||||
|
(cond
|
||||||
|
new-day 0
|
||||||
|
same-author 4
|
||||||
|
same-direction 20
|
||||||
|
:else 10))
|
||||||
|
|
||||||
|
(defn last-message-padding
|
||||||
|
[{:keys [last-msg typing]}]
|
||||||
|
(when (and last-msg (not typing))
|
||||||
|
{:paddingBottom 20}))
|
||||||
|
|
||||||
|
(def message-body-base
|
||||||
|
{:paddingRight 8
|
||||||
|
:paddingLeft 8})
|
||||||
|
|
||||||
|
(defn message-body-st
|
||||||
|
[{:keys [outgoing] :as message}]
|
||||||
|
(let [align (if outgoing :flex-end :flex-start)]
|
||||||
|
(merge message-body-base
|
||||||
|
{:flexDirection :column
|
||||||
|
:width 260
|
||||||
|
:paddingTop (message-padding-top message)
|
||||||
|
:alignSelf align
|
||||||
|
:alignItems align}
|
||||||
|
(last-message-padding message))))
|
||||||
|
|
||||||
|
(defn incoming-group-message-body-st
|
||||||
|
[message]
|
||||||
|
(merge message-body-base
|
||||||
|
{:flexDirection :row
|
||||||
|
:alignSelf :flex-start
|
||||||
|
:marginTop (message-padding-top message)
|
||||||
|
:paddingRight 8
|
||||||
|
:paddingLeft 8}
|
||||||
|
(last-message-padding message)))
|
||||||
|
|
||||||
|
(def selected-message
|
||||||
|
{:marginTop 18
|
||||||
|
:marginLeft 40
|
||||||
|
:fontFamily font
|
||||||
|
:fontSize 12
|
||||||
|
:color text2-color})
|
||||||
|
|
||||||
|
(def group-message-wrapper
|
||||||
|
{:flexDirection :column})
|
||||||
|
|
||||||
|
(def group-message-view
|
||||||
|
{:flexDirection :column
|
||||||
|
:width 260
|
||||||
|
:paddingLeft 8
|
||||||
|
:alignItems :flex-start})
|
||||||
|
|
||||||
|
(def message-author {:width 24})
|
||||||
|
|
||||||
|
(def photo-view {:borderRadius 50})
|
||||||
|
(def photo
|
||||||
|
{:borderRadius 50
|
||||||
|
:width 24
|
||||||
|
:height 24})
|
||||||
|
|
||||||
|
(def delivery-view
|
||||||
|
{:flexDirection :row
|
||||||
|
:marginTop 2})
|
||||||
|
|
||||||
|
(def delivery-image
|
||||||
|
{:marginTop 6
|
||||||
|
:width 9
|
||||||
|
:height 7})
|
||||||
|
|
||||||
|
(def delivery-text
|
||||||
|
{:fontFamily font
|
||||||
|
:fontSize 12
|
||||||
|
:color text2-color
|
||||||
|
:marginLeft 5})
|
||||||
|
|
||||||
|
(defn text-message-st
|
||||||
|
[{:keys [outgoing group-chat incoming-group]}]
|
||||||
|
(merge style-message-text
|
||||||
|
{:marginTop (if incoming-group
|
||||||
|
4
|
||||||
|
0)}
|
||||||
|
(when (and outgoing group-chat)
|
||||||
|
{:color color-white})))
|
||||||
|
|
||||||
|
(defn message-view-st
|
||||||
|
[{:keys [content-type outgoing group-chat selected]}]
|
||||||
|
(merge {:borderRadius 14
|
||||||
|
:padding 12
|
||||||
|
:backgroundColor color-white}
|
||||||
|
(when (= content-type content-type-command)
|
||||||
|
{:paddingTop 10
|
||||||
|
:paddingBottom 14})
|
||||||
|
(if outgoing
|
||||||
|
(when (and group-chat (= content-type text-content-type))
|
||||||
|
{:backgroundColor color-blue})
|
||||||
|
(when selected
|
||||||
|
{:backgroundColor selected-message-color}))))
|
||||||
|
|
||||||
|
(def comand-request-view
|
||||||
|
{:paddingRight 16})
|
||||||
|
|
||||||
|
(def command-request-message-view
|
||||||
|
{:borderRadius 14
|
||||||
|
:padding 12
|
||||||
|
:backgroundColor color-white})
|
||||||
|
|
||||||
|
(def command-request-from-text
|
||||||
|
(merge style-sub-text {:marginBottom 2}))
|
||||||
|
|
||||||
|
(defn command-request-image-view
|
||||||
|
[command]
|
||||||
|
{:position :absolute
|
||||||
|
:top 12
|
||||||
|
:right 0
|
||||||
|
:width 32
|
||||||
|
:height 32
|
||||||
|
:borderRadius 50
|
||||||
|
:backgroundColor (:color command)})
|
||||||
|
|
||||||
|
(def command-request-image
|
||||||
|
{:position :absolute
|
||||||
|
:top 9
|
||||||
|
:left 10
|
||||||
|
:width 12
|
||||||
|
:height 13})
|
||||||
|
|
||||||
|
(def command-request-text-view
|
||||||
|
{:marginTop 4
|
||||||
|
:height 14})
|
||||||
|
|
||||||
|
|
||||||
|
(def conetent-command-view
|
||||||
|
{:flexDirection :column})
|
||||||
|
|
||||||
|
(def command-container
|
||||||
|
{:flexDirection :row
|
||||||
|
:marginRight 32})
|
||||||
|
|
||||||
|
(defn command-view [command]
|
||||||
|
{:backgroundColor (:color command)
|
||||||
|
:height 24
|
||||||
|
:borderRadius 50
|
||||||
|
:paddingTop 3
|
||||||
|
:paddingHorizontal 12})
|
||||||
|
|
||||||
|
(def command-text
|
||||||
|
{:fontSize 12
|
||||||
|
:fontFamily font
|
||||||
|
:color color-white})
|
||||||
|
|
||||||
|
(def command-image
|
||||||
|
{:position :absolute
|
||||||
|
:top 4
|
||||||
|
:right 0
|
||||||
|
:width 12
|
||||||
|
:height 13})
|
||||||
|
|
||||||
|
(def command-text-st
|
||||||
|
(merge style-message-text
|
||||||
|
{:marginTop 8
|
||||||
|
:marginHorizontal 0}))
|
||||||
|
|
||||||
|
(def message-author-text
|
||||||
|
{:marginTop 0
|
||||||
|
:fontSize 12
|
||||||
|
:fontFamily font})
|
||||||
|
|
||||||
|
(def audio-container
|
||||||
|
{:flexDirection :row
|
||||||
|
:alignItems :center})
|
||||||
|
|
||||||
|
(def play-view
|
||||||
|
{:width 33
|
||||||
|
:height 33
|
||||||
|
:borderRadius 50
|
||||||
|
:elevation 1})
|
||||||
|
|
||||||
|
(def play-image
|
||||||
|
{:width 33
|
||||||
|
:height 33})
|
||||||
|
|
||||||
|
(def track-container
|
||||||
|
{:marginTop 10
|
||||||
|
:marginLeft 10
|
||||||
|
:width 120
|
||||||
|
:height 26
|
||||||
|
:elevation 1})
|
||||||
|
|
||||||
|
(def track
|
||||||
|
{:position :absolute
|
||||||
|
:top 4
|
||||||
|
:width 120
|
||||||
|
:height 2
|
||||||
|
:backgroundColor "#EC7262"})
|
||||||
|
|
||||||
|
(def track-mark
|
||||||
|
{:position :absolute
|
||||||
|
:left 0
|
||||||
|
:top 0
|
||||||
|
:width 2
|
||||||
|
:height 10
|
||||||
|
:backgroundColor "#4A5258"})
|
||||||
|
|
||||||
|
(def track-duration-text
|
||||||
|
{:position :absolute
|
||||||
|
:left 1
|
||||||
|
:top 11
|
||||||
|
:fontFamily font
|
||||||
|
:fontSize 11
|
||||||
|
:color "#4A5258"
|
||||||
|
:letterSpacing 1
|
||||||
|
:lineHeight 15})
|
||||||
|
|
||||||
|
(def status-container
|
||||||
|
{:flex 1
|
||||||
|
:alignSelf :center
|
||||||
|
:alignItems :center
|
||||||
|
:width 249})
|
||||||
|
|
||||||
|
(def status-image-view
|
||||||
|
{:marginTop 20})
|
||||||
|
|
||||||
|
(def status-from
|
||||||
|
{:marginTop 20
|
||||||
|
:fontSize 18
|
||||||
|
:fontFamily font
|
||||||
|
:color text1-color})
|
||||||
|
|
||||||
|
(def status-text
|
||||||
|
{:marginTop 10
|
||||||
|
:fontFamily font
|
||||||
|
:fontSize 14
|
||||||
|
:lineHeight 20
|
||||||
|
:textAlign :center
|
||||||
|
:color text2-color})
|
||||||
|
|
||||||
|
(def online-container
|
||||||
|
{:position :absolute
|
||||||
|
:top 44
|
||||||
|
:left 44
|
||||||
|
:width 24
|
||||||
|
:height 24
|
||||||
|
:borderRadius 50
|
||||||
|
:backgroundColor online-color
|
||||||
|
:borderWidth 2
|
||||||
|
:borderColor color-white})
|
||||||
|
|
||||||
|
(def online-dot
|
||||||
|
{:position :absolute
|
||||||
|
:top 8
|
||||||
|
:width 4
|
||||||
|
:height 4
|
||||||
|
:borderRadius 50
|
||||||
|
:backgroundColor color-white})
|
||||||
|
|
||||||
|
(def online-dot-left
|
||||||
|
(assoc online-dot :left 5))
|
||||||
|
|
||||||
|
(def online-dot-right
|
||||||
|
(assoc online-dot :left 11))
|
||||||
|
|
||||||
|
(def contact-photo-container
|
||||||
|
{:borderRadius 50})
|
||||||
|
|
||||||
|
(def contact-photo-st
|
||||||
|
{:borderRadius 50
|
||||||
|
:width 64
|
||||||
|
:height 64})
|
||||||
|
|
||||||
|
(def message-date-container
|
||||||
|
{:backgroundColor color-light-blue-transparent
|
||||||
|
:height 24
|
||||||
|
:borderRadius 50
|
||||||
|
:alignSelf :center
|
||||||
|
:marginTop 20
|
||||||
|
:marginBottom 20
|
||||||
|
:paddingTop 5
|
||||||
|
:paddingHorizontal 12})
|
||||||
|
|
||||||
|
(def message-date-text
|
||||||
|
(assoc style-sub-text :textAlign :center))
|
||||||
|
|
@ -144,35 +144,31 @@
|
||||||
:to "me"})) (range n)))
|
:to "me"})) (range n)))
|
||||||
|
|
||||||
(defn store-message!
|
(defn store-message!
|
||||||
[db [_ {chat-id :from
|
[{:keys [new-message]} [_ {chat-id :from}]]
|
||||||
outgoing :outgoing
|
(save-message chat-id new-message))
|
||||||
:as msg}]]
|
|
||||||
(let [previous-message (first (get-in db [:chats chat-id :messages]))
|
|
||||||
msg (merge msg
|
|
||||||
{:same-author (if previous-message
|
|
||||||
(= (:from previous-message) outgoing)
|
|
||||||
true)
|
|
||||||
:same-direction (if previous-message
|
|
||||||
(= (:outgoing previous-message) outgoing)
|
|
||||||
true)})]
|
|
||||||
(save-message chat-id msg)))
|
|
||||||
|
|
||||||
(defn add-message-to-db
|
(defn add-message-to-db
|
||||||
[db chat-id {:keys [from outgoing] :as message}]
|
[db chat-id message]
|
||||||
(let [messages [:chats chat-id :messages]
|
(let [messages [:chats chat-id :messages]]
|
||||||
previous-message (first (get-in db [:chats chat-id :messages]))
|
|
||||||
message (merge message
|
|
||||||
{:same-author (if previous-message
|
|
||||||
(= (:from previous-message) from)
|
|
||||||
true)
|
|
||||||
:same-direction (if previous-message
|
|
||||||
(= (:outgoing previous-message) outgoing)
|
|
||||||
true)})]
|
|
||||||
(update-in db messages conj message)))
|
(update-in db messages conj message)))
|
||||||
|
|
||||||
|
(defn check-author-direction
|
||||||
|
[db chat-id {:keys [from outgoing] :as message}]
|
||||||
|
(let [previous-message (first (get-in db [:chats chat-id :messages]))]
|
||||||
|
(merge message
|
||||||
|
{:same-author (if previous-message
|
||||||
|
(= (:from previous-message) from)
|
||||||
|
true)
|
||||||
|
:same-direction (if previous-message
|
||||||
|
(= (:outgoing previous-message) outgoing)
|
||||||
|
true)})))
|
||||||
|
|
||||||
(defn receive-message
|
(defn receive-message
|
||||||
[db [_ {chat-id :from :as msg}]]
|
[db [_ {chat-id :from :as message}]]
|
||||||
(add-message-to-db db chat-id msg))
|
(let [message' (check-author-direction db chat-id message)]
|
||||||
|
(-> db
|
||||||
|
(add-message-to-db chat-id message')
|
||||||
|
(assoc :new-message message'))))
|
||||||
|
|
||||||
(register-handler :received-msg
|
(register-handler :received-msg
|
||||||
(-> receive-message
|
(-> receive-message
|
||||||
|
|
@ -295,41 +291,40 @@
|
||||||
|
|
||||||
(defn prepare-message
|
(defn prepare-message
|
||||||
[{:keys [identity current-chat-id] :as db} _]
|
[{:keys [identity current-chat-id] :as db} _]
|
||||||
(let [text (get-in db [:chats current-chat-id :input-text])
|
(let [text (get-in db [:chats current-chat-id :input-text])
|
||||||
{:keys [command]} (check-suggestion db (str text " "))]
|
{:keys [command]} (check-suggestion db (str text " "))
|
||||||
|
message (check-author-direction
|
||||||
|
db current-chat-id
|
||||||
|
{:msg-id (random/id)
|
||||||
|
:chat-id current-chat-id
|
||||||
|
:content text
|
||||||
|
:to current-chat-id
|
||||||
|
:from identity
|
||||||
|
:content-type text-content-type
|
||||||
|
:outgoing true})]
|
||||||
(if command
|
(if command
|
||||||
(set-chat-command db command)
|
(set-chat-command db command)
|
||||||
(assoc db :new-message (when-not (str/blank? text)
|
(assoc db :new-message (when-not (str/blank? text) message)))))
|
||||||
{:msg-id (random/id)
|
|
||||||
:chat-id current-chat-id
|
|
||||||
:content text
|
|
||||||
:to current-chat-id
|
|
||||||
:from identity
|
|
||||||
:content-type text-content-type
|
|
||||||
:outgoing true
|
|
||||||
;; todo should be refactored
|
|
||||||
:same-author false
|
|
||||||
:same-direction false})))))
|
|
||||||
|
|
||||||
(defn prepare-command [identity chat-id staged-command]
|
(defn prepare-command [identity chat-id staged-command]
|
||||||
(let [command-key (get-in staged-command [:command :command])
|
(let [command-key (get-in staged-command [:command :command])
|
||||||
content {:command (name command-key)
|
content {:command (name command-key)
|
||||||
:content (:content staged-command)}]
|
:content (:content staged-command)}]
|
||||||
{:msg-id (random/id)
|
{:msg-id (random/id)
|
||||||
:from identity
|
:from identity
|
||||||
:to chat-id
|
:to chat-id
|
||||||
:content content
|
:content content
|
||||||
:content-type content-type-command
|
:content-type content-type-command
|
||||||
:outgoing true
|
:outgoing true
|
||||||
:handler (:handler staged-command)
|
:handler (:handler staged-command)}))
|
||||||
:same-author false
|
|
||||||
:same-direction false}))
|
|
||||||
|
|
||||||
(defn prepare-staged-commans
|
(defn prepare-staged-commans
|
||||||
[{:keys [current-chat-id identity] :as db} _]
|
[{:keys [current-chat-id identity] :as db} _]
|
||||||
(let [staged-commands (get-in db [:chats current-chat-id :staged-commands])]
|
(let [staged-commands (get-in db [:chats current-chat-id :staged-commands])]
|
||||||
(->> staged-commands
|
(->> staged-commands
|
||||||
(map #(prepare-command identity current-chat-id %))
|
(map #(prepare-command identity current-chat-id %))
|
||||||
|
;todo this is wrong :(
|
||||||
|
(map #(check-author-direction db current-chat-id %))
|
||||||
(assoc db :new-commands))))
|
(assoc db :new-commands))))
|
||||||
|
|
||||||
(defn add-message
|
(defn add-message
|
||||||
|
|
@ -373,7 +368,6 @@
|
||||||
|
|
||||||
(defn handle-commands
|
(defn handle-commands
|
||||||
[{:keys [new-commands]}]
|
[{:keys [new-commands]}]
|
||||||
(println new-commands)
|
|
||||||
(doseq [{{content :content} :content
|
(doseq [{{content :content} :content
|
||||||
handler :handler} new-commands]
|
handler :handler} new-commands]
|
||||||
(when handler
|
(when handler
|
||||||
|
|
|
||||||
|
|
@ -130,5 +130,5 @@
|
||||||
(defn parse-command-msg-content [commands content]
|
(defn parse-command-msg-content [commands content]
|
||||||
(update content :command #(find-command commands (keyword %))))
|
(update content :command #(find-command commands (keyword %))))
|
||||||
|
|
||||||
(defn parse-command-request-msg-content [commands content]
|
(defn parse-command-request [commands content]
|
||||||
(update content :command #(find-command commands (keyword %))))
|
(update content :command #(find-command commands (keyword %))))
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@
|
||||||
get-chat-command
|
get-chat-command
|
||||||
get-chat-command-content
|
get-chat-command-content
|
||||||
get-chat-command-request
|
get-chat-command-request
|
||||||
parse-command-request-msg-content]]
|
parse-command-request]]
|
||||||
[syng-im.handlers.suggestions :refer [get-suggestions]]))
|
[syng-im.handlers.suggestions :refer [get-suggestions]]))
|
||||||
|
|
||||||
;; -- Chat --------------------------------------------------------------
|
;; -- Chat --------------------------------------------------------------
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue