From bb6240d4e8612dba5aa7f65981823ebc4672ac71 Mon Sep 17 00:00:00 2001 From: michaelr Date: Wed, 6 Apr 2016 16:13:31 +0300 Subject: [PATCH] each chat participant gets his own color Former-commit-id: 3fe4f44c042b2454a001246bb4c030a13d5d9d77 --- src/syng_im/components/chat.cljs | 23 ++++- src/syng_im/components/chat/chat_message.cljs | 87 ++++++++++--------- src/syng_im/components/react.cljs | 5 ++ src/syng_im/constants.cljs | 26 ++++++ src/syng_im/models/chats.cljs | 32 +++++-- src/syng_im/models/contacts.cljs | 4 +- src/syng_im/persistence/realm.cljs | 9 +- 7 files changed, 133 insertions(+), 53 deletions(-) diff --git a/src/syng_im/components/chat.cljs b/src/syng_im/components/chat.cljs index 5804e557ab..6ae060535a 100644 --- a/src/syng_im/components/chat.cljs +++ b/src/syng_im/components/chat.cljs @@ -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]])))) diff --git a/src/syng_im/components/chat/chat_message.cljs b/src/syng_im/components/chat/chat_message.cljs index ca52ed8d95..8e2a3540c1 100644 --- a/src/syng_im/components/chat/chat_message.cljs +++ b/src/syng_im/components/chat/chat_message.cljs @@ -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)}]]) diff --git a/src/syng_im/components/react.cljs b/src/syng_im/components/react.cljs index 565fdd3ae3..a9f31957b7 100644 --- a/src/syng_im/components/react.cljs +++ b/src/syng_im/components/react.cljs @@ -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))) diff --git a/src/syng_im/constants.cljs b/src/syng_im/constants.cljs index dd6729fe43..a41bc7251a 100644 --- a/src/syng_im/constants.cljs +++ b/src/syng_im/constants.cljs @@ -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) + + ) diff --git a/src/syng_im/models/chats.cljs b/src/syng_im/models/chats.cljs index fa63a2d353..8aef29e8a0 100644 --- a/src/syng_im/models/chats.cljs +++ b/src/syng_im/models/chats.cljs @@ -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) diff --git a/src/syng_im/models/contacts.cljs b/src/syng_im/models/contacts.cljs index 0250eb9183..41cbd2742e 100644 --- a/src/syng_im/models/contacts.cljs +++ b/src/syng_im/models/contacts.cljs @@ -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 ""})) diff --git a/src/syng_im/persistence/realm.cljs b/src/syng_im/persistence/realm.cljs index 819c2839d9..694ff7af16 100644 --- a/src/syng_im/persistence/realm.cljs +++ b/src/syng_im/persistence/realm.cljs @@ -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))