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

Merge pull request #14 from syng-im/participants-colors 

each chat participant gets his own color
This commit is contained in:
Jarrad 2016-04-07 12:38:29 +02:00
parent b27fdfe96c 3fe4f44c04
commit ee54e12f5a
7 changed files with 133 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
src/syng_im/components/chat.cljs
View File

@ -18,13 +18,26 @@
[syng-im.components.chat.chat-message-new :refer [chat-message-new]]))
(defn contacts-by-identity [contacts]
(->> contacts
(map (fn [{:keys [identity] :as contact}]
[identity contact]))
(into {})))
(defn add-msg-color [{:keys [from] :as msg} contact-by-identity]
(let [{:keys [text-color background-color]} (get contact-by-identity from)]
(assoc msg :text-color text-color
:background-color background-color)))
(defn chat [{:keys [navigator]}]
(let [messages (subscribe [:get-chat-messages])
chat (subscribe [:get-current-chat])]
(fn []
(let [msgs @messages
_ (log/debug "messages=" msgs)
datasource (to-realm-datasource msgs)]
(let [msgs @messages
;_ (log/debug "messages=" msgs)
datasource (to-realm-datasource msgs)
contacts (:contacts @chat)
contact-by-identity (contacts-by-identity contacts)]
[view {:style {:flex 1
:backgroundColor "#eef2f5"}}
(when android?
@ -45,6 +58,8 @@
:renderScrollComponent (fn [props]
(invertible-scroll-view nil))
:renderRow (fn [row section-id row-id]
(r/as-element [chat-message (js->clj row :keywordize-keys true)]))
(let [msg (-> (js->clj row :keywordize-keys true)
(add-msg-color contact-by-identity))]
(r/as-element [chat-message msg])))
:style {:backgroundColor "white"}}]
[chat-message-new]]))))

87
src/syng_im/components/chat/chat_message.cljs
View File

@ -69,42 +69,45 @@
[view {:style {:margin 10
:backgroundColor (:color command)
:borderRadius 10}}
[text {:style {:marginTop -2
[text {:style {:marginTop -2
:marginHorizontal 10
:fontSize 14
:fontFamily "Avenir-Roman"
:color "white"}}
:color "white"}}
(:text command)]]
[text {:style {:marginTop -2
:marginHorizontal 10
:fontSize 14
:fontFamily "Avenir-Roman"
:color "black"}}
[text {:style {:marginTop -2
:marginHorizontal 10
:fontSize 14
:fontFamily "Avenir-Roman"
:color "black"}}
;; TODO isn't smart
(if (= (:command command) :keypair-password)
"******"
content)]]))
(if (= (:command command) :keypair-password)
"******"
content)]]))
(defn message-content [{:keys [content-type content outgoing]}]
[view {:style (merge {:borderRadius 6}
(if (= content-type text-content-type)
{:paddingVertical 12
:paddingHorizontal 16}
{:paddingVertical 14
:paddingHorizontal 10})
(if outgoing
{:backgroundColor "#D3EEEF"}
{:backgroundColor "#FBF6E3"}))}
(cond
(= content-type text-content-type)
[text {:style {:fontSize 14
:fontFamily "Avenir-Roman"
:color "#4A5258"}}
content]
(= content-type content-type-command)
[message-content-command content]
:else [message-content-audio {:content content
:content-type content-type}])])
(defn message-content [{:keys [content-type content outgoing text-color background-color]}]
(let [_ (log/debug color)]
[view {:style (merge {:borderRadius 6}
(if (= content-type text-content-type)
{:paddingVertical 12
:paddingHorizontal 16}
{:paddingVertical 14
:paddingHorizontal 10})
(if outgoing
{:backgroundColor "#D3EEEF"}
{:backgroundColor background-color}))}
(cond
(= content-type text-content-type)
[text {:style (merge {:fontSize 14
:fontFamily "Avenir-Roman"}
(if outgoing
{:color "#4A5258"}
{:color text-color}))}
content]
(= content-type content-type-command)
[message-content-command content]
:else [message-content-audio {:content content
:content-type content-type}])]))
(defn message-delivery-status [{:keys [delivery-status]}]
[view {:style {:flexDirection "row"
@ -125,7 +128,7 @@
:seen "Seen"
:failed "Failed")]])
(defn message-body [{:keys [msg-id content content-type outgoing delivery-status]}]
(defn message-body [{:keys [msg-id content content-type outgoing delivery-status text-color background-color]}]
[view {:style (merge {:flexDirection "column"
:width 260
:marginVertical 5}
@ -134,18 +137,22 @@
:alignItems "flex-end"}
{:alignSelf "flex-start"
:alignItems "flex-start"}))}
[message-content {:content-type content-type
:content content
:outgoing outgoing}]
[message-content {:content-type content-type
:content content
:outgoing outgoing
:text-color text-color
:background-color background-color}]
(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] :as msg}]
(defn chat-message [{:keys [msg-id content content-type outgoing delivery-status date new-day text-color background-color] :as msg}]
[view {:paddingHorizontal 15}
(when new-day
[message-date {:date date}])
[message-body {:msg-id msg-id
:content content
:content-type content-type
:outgoing outgoing
:delivery-status (keyword delivery-status)}]])
[message-body {:msg-id msg-id
:content content
:content-type content-type
:outgoing outgoing
:text-color text-color
:background-color background-color
:delivery-status (keyword delivery-status)}]])

5
src/syng_im/components/react.cljs
View File

@ -20,6 +20,11 @@
(defn list-item [component]
(r/as-element component))
(comment
(.-width (.get (.. js/React -Dimensions) "window"))
)
;; (do
;; (def activity-indicator-ios (r/adapt-react-class (.-ActivityIndicatorIOS js/React)))
;; (def animated-image (r/adapt-react-class (.-Animated.Image js/React)))

26
src/syng_im/constants.cljs
View File

@ -7,3 +7,29 @@
(def text-content-type "text/plain")
(def content-type-command "command")
(def group-chat-colors [{:background "#AB7967", :text "#FFFFFF"}
{:background "#B48EAD", :text "#FFFFFF"}
{:background "#8FA1B3", :text "#FFFFFF"}
{:background "#96B5B4", :text "#FFFFFF"}
{:background "#A3BE8C", :text "#FFFFFF"}
{:background "#EBCB8B", :text "#FFFFFF"}
{:background "#D08770", :text "#FFFFFF"}
{:background "#BF616A", :text "#FFFFFF"}
{:background "#EFF1F5", :text "#000000"}
{:background "#DFE1E8", :text "#000000"}
{:background "#C0C5CE", :text "#000000"}
{:background "#A7ADBA", :text "#000000"}
{:background "#65737E", :text "#FFFFFF"}
{:background "#4F5B66", :text "#FFFFFF"}
{:background "#343D46", :text "#FFFFFF"}
{:background "#2B303B", :text "#FFFFFF"}])
(comment
(map (fn [c]
{:background c
:foreground c}) group-chat-colors)
(reverse group-chat-colors)
)

32
src/syng_im/models/chats.cljs
View File

@ -3,7 +3,8 @@
[syng-im.utils.random :refer [timestamp]]
[clojure.string :refer [join blank?]]
[syng-im.db :as db]
[syng-im.utils.logging :as log]))
[syng-im.utils.logging :as log]
[syng-im.constants :refer [group-chat-colors]]))
(defn signal-chats-updated [db]
(update-in db db/updated-chats-signal-path (fn [current]
@ -40,8 +41,10 @@
_ (log/debug "creating chat" chat-name)]
(r/write
(fn []
(let [contacts (mapv (fn [ident]
{:identity ident}) identities)]
(let [contacts (mapv (fn [ident {:keys [background text]}]
{:identity ident
:background-color background
:text-color text}) identities group-chat-colors)]
(r/create :chats {:chat-id chat-id
:name chat-name
:group-chat group-chat?
@ -55,12 +58,29 @@
(defn chat-by-id [chat-id]
(-> (r/get-by-field :chats :chat-id chat-id)
(r/single-cljs)))
(r/single-cljs)
(r/list-to-array :contacts)))
(comment
(chat-by-id "1459693168208-31d4942e-ca3b-5c03-a397-cd7a29f777d4")
(chats-list)
(-> (r/get-by-field :chats :chat-id "0x04ed4c3797026cddeb7d64a54ca58142e57ea03cda21072358d67455b506db90c56d95033e3d221992f70d01922c3d90bf0697c49e4be118443d03ae4a1cd3c15c")
(r/single)
(aget "contacts")
(.map (fn [object index collection]
object)))
(-> (chat-by-id "0x04ed4c3797026cddeb7d64a54ca58142e57ea03cda21072358d67455b506db90c56d95033e3d221992f70d01922c3d90bf0697c49e4be118443d03ae4a1cd3c15c")
:contacts
vals
vec)
(-> (aget (aget (chats-list) 0) "contacts")
(js->clj :keywordize-keys true)
)
(r/delete (chats-list))
(swap! re-frame.db/app-db signal-chats-updated)

4
src/syng_im/models/contacts.cljs
View File

@ -94,12 +94,12 @@
(comment
(r/write #(create-contact {:phone-number "0543072333"
:whisper-identity "0x04b6552945c18ebca487c8a829365d3812a246e1cd00d775f47248a21a61bad0912409b8bd18dc0604d1df494cea001cce85098906df231d2a431067734ecc5a21"
:whisper-identity "0x04ed4c3797026cddeb7d64a54ca58142e57ea03cda21072358d67455b506db90c56d95033e3d221992f70d01922c3d90bf0697c49e4be118443d03ae4a1cd3c15c"
:name "Mr. Bean"
:photo-path ""}))
(r/write #(create-contact {:phone-number "0544828649"
:whisper-identity "0x043d9e25c6cf89941849cf5e4439084a93002f757cfd49fef411d4793d888b408dfa5bc54ac5989f65da8d764dc332f06b646f3cfae194a0801f6090b272a0c56e"
:whisper-identity "0x0498bcce41dbe05c6d4776ef50d12c2ef1a00d9d7f7144d174ece3dce85ca3428bf0900352abcccdc463bd2cfa4ec319cda46c2079152c4cb14d1cad9a00dd7571"
:name "Mr. Batman"
:photo-path ""}))

9
src/syng_im/persistence/realm.cljs
View File

@ -34,7 +34,9 @@
:delivery-status {:type "string"
:optional true}}}
{:name :chat-contact
:properties {:identity "string"}}
:properties {:identity "string"
:text-color "string"
:background-color "string"}}
{:name :chats
:primaryKey :chat-id
:properties {:chat-id "string"
@ -100,6 +102,11 @@
(some-> (aget result 0)
(js->clj :keywordize-keys true)))
(defn list-to-array [record list-field]
(assoc record list-field (-> (get record list-field)
vals
vec)))
(defn decode-value [{:keys [key value]}]
(read-string value))