Chat status design
This commit is contained in:
virvar
parent
2a9d6df8d9
commit
9a84baf131
|
|
@ -20,6 +20,7 @@
|
|||
[syng-im.utils.logging :as log]
|
||||
[syng-im.navigation :refer [nav-pop]]
|
||||
[syng-im.resources :as res]
|
||||
[syng-im.constants :refer [content-type-status]]
|
||||
[syng-im.utils.listview :refer [to-realm-datasource]]
|
||||
[syng-im.components.invertible-scroll-view :refer [invertible-scroll-view]]
|
||||
[reagent.core :as r]
|
||||
|
|
@ -146,6 +147,21 @@
|
|||
(fn []
|
||||
(let [msgs @messages
|
||||
;_ (log/debug "messages=" msgs)
|
||||
;; temp to show first status
|
||||
msgs-clj (assoc (js->clj msgs) "-1"
|
||||
{:msg-id "-1"
|
||||
:content (str "The brash businessman’s braggadocio "
|
||||
"and public exchange with candidates "
|
||||
"in the US presidential election")
|
||||
:delivery-status "seen"
|
||||
:from "Status"
|
||||
:chat-id "-"
|
||||
:content-type content-type-status
|
||||
:timestamp 1
|
||||
:outgoing false
|
||||
:to nil})
|
||||
msgs (clj->js msgs-clj)
|
||||
;; end temp
|
||||
datasource (to-realm-datasource msgs)
|
||||
contacts (:contacts @chat)
|
||||
contact-by-identity (contacts-by-identity contacts)]
|
||||
|
|
|
|||
|
|
@ -14,6 +14,7 @@
|
|||
color-black
|
||||
color-blue
|
||||
selected-message-color
|
||||
online-color
|
||||
text1-color
|
||||
text2-color]]
|
||||
[syng-im.models.commands :refer [parse-command-msg-content
|
||||
|
|
@ -22,6 +23,7 @@
|
|||
[syng-im.navigation :refer [nav-pop]]
|
||||
[syng-im.resources :as res]
|
||||
[syng-im.constants :refer [text-content-type
|
||||
content-type-status
|
||||
content-type-command
|
||||
content-type-command-request]]))
|
||||
|
||||
|
|
@ -39,6 +41,64 @@
|
|||
:textAlign "center"}}
|
||||
date]])
|
||||
|
||||
(defn contact-photo [{:keys [photo-path]}]
|
||||
[view {:borderRadius 50}
|
||||
[image {:source (if (s/blank? photo-path)
|
||||
res/user-no-photo
|
||||
{:uri photo-path})
|
||||
:style {:borderRadius 50
|
||||
:width 64
|
||||
:height 64}}]])
|
||||
|
||||
(defn contact-online [{:keys [online]}]
|
||||
(when online
|
||||
[view {:position "absolute"
|
||||
:top 44
|
||||
:left 44
|
||||
: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 [from content]
|
||||
[view {:style {:flex 1
|
||||
:marginBottom 20
|
||||
:alignSelf "center"
|
||||
:alignItems "center"
|
||||
:width 249}}
|
||||
[view {:style {:marginTop 20}}
|
||||
[contact-photo {}]
|
||||
[contact-online {:online true}]]
|
||||
[text {:style {:marginTop 20
|
||||
:fontSize 18
|
||||
: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 [{:keys [content-type content-type]}]
|
||||
[view {:style {:flexDirection "row"
|
||||
:alignItems "center"}}
|
||||
|
|
@ -164,7 +224,8 @@
|
|||
:fontFamily font}}
|
||||
"Justas"])
|
||||
(cond
|
||||
(= content-type text-content-type)
|
||||
(or (= content-type text-content-type)
|
||||
(= content-type content-type-status))
|
||||
[text {:style (merge {:marginTop (if (and group-chat (not outgoing))
|
||||
4
|
||||
0)
|
||||
|
|
@ -266,7 +327,7 @@
|
|||
(when (and outgoing delivery-status)
|
||||
[message-delivery-status {:delivery-status delivery-status}])]))
|
||||
|
||||
(defn chat-message [{:keys [msg-id content content-type outgoing delivery-status date new-day text-color background-color group-chat selected] :as msg}]
|
||||
(defn chat-message [{:keys [msg-id from content content-type outgoing delivery-status date new-day text-color background-color group-chat selected] :as msg}]
|
||||
[view {}
|
||||
(when new-day
|
||||
[message-date {:date date}])
|
||||
|
|
@ -279,6 +340,9 @@
|
|||
:delivery-status (keyword delivery-status)
|
||||
:group-chat group-chat
|
||||
:selected selected}]
|
||||
[view {}
|
||||
(when (= content-type content-type-status)
|
||||
[message-content-status from content])
|
||||
(if (and group-chat (not outgoing))
|
||||
[incoming-group-message-body msg-data]
|
||||
[message-body msg-data]))])
|
||||
[message-body msg-data])])])
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
(def text-content-type "text/plain")
|
||||
(def content-type-command "command")
|
||||
(def content-type-command-request "command-request")
|
||||
(def content-type-status "status")
|
||||
(def group-chat-colors [{:background "#AB7967", :text "#FFFFFF"}
|
||||
{:background "#B48EAD", :text "#FFFFFF"}
|
||||
{:background "#8FA1B3", :text "#FFFFFF"}
|
||||
|
|
|
|||
Loading…
Reference in New Issue