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 #369 from status-im/bug/ui-fixes 

Several UI fixes (#362, #364, #367)

Former-commit-id: 891507f767
This commit is contained in:
Roman Volosovskyi 2016-10-19 09:35:27 +03:00 committed by GitHub
parent 3b80659985 9993ebd074
commit c4739fb4bc
9 changed files with 70 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -261,52 +261,6 @@
:textAlign :center :textAlign :center
:color text2-color}) :color text2-color})
(def online-container
{:position :absolute
:top 44
:left 44
:width 24
:height 24
:borderRadius 12
:backgroundColor online-color
:borderWidth 2
:borderColor color-white})
(def online-dot
{:position :absolute
:top 8
:width 4
:height 4
:borderRadius 2
: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 32})
(def contact-photo
{:border-radius 32
:width 64
:height 64})
(def message-date-container
{:backgroundColor color-light-blue-transparent
:height 24
:borderRadius 12
:alignSelf :center
:marginTop 20
:marginBottom 20
:paddingTop 5
:paddingHorizontal 12})
(def message-date-text
(assoc style-sub-text :textAlign :center))
(defn message-container [height] (defn message-container [height]
{:height height}) {:height height})

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

@ -24,30 +24,15 @@
content-type-status content-type-status
content-type-command content-type-command
content-type-command-request]] content-type-command-request]]
[status-im.components.chat-icon.screen :refer [chat-icon-message-status]]
[status-im.utils.identicon :refer [identicon]] [status-im.utils.identicon :refer [identicon]]
[status-im.utils.gfycat.core :refer [generate-gfy]] [status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.i18n :refer [label]] [status-im.i18n :refer [label]]
[status-im.chat.utils :as cu] [status-im.chat.utils :as cu]
[clojure.string :as str])) [clojure.string :as str]))
(defn contact-photo [photo-path] (defn message-content-status [_]
[view st/contact-photo-container (let [{:keys [chat-id group-chat name color]} (subscribe [:chat-properties [:chat-id :group-chat :name :color]])
[image {:source (if (s/blank? photo-path)
res/user-no-photo
{:uri photo-path})
:style st/contact-photo}]])
(defn contact-online [online?]
(when online?
[view st/online-container
[view st/online-dot-left]
[view st/online-dot-right]]))
;;[photo-path (subscribe [:chat-photo from])
(defn message-content-status [{:keys [from]}]
(let [chat-photo-path (subscribe [:chat-photo from])
{:keys [group-chat name]} (subscribe [:chat-properties [:group-chat :name]])
members (subscribe [:current-chat-contacts])] members (subscribe [:current-chat-contacts])]
(fn [{:keys [messages-count content datemark]}] (fn [{:keys [messages-count content datemark]}]
(let [{:keys [photo-path (let [{:keys [photo-path
@ -56,13 +41,9 @@
{:photo-path nil {:photo-path nil
:status nil :status nil
:last-online 0} :last-online 0}
(first @members)) (first @members))]
online? (-> (- (time/now-ms) last-online)
(< (* 60 1000)))]
[view st/status-container [view st/status-container
[view st/status-image-view [chat-icon-message-status @chat-id @group-chat @name @color false]
[contact-photo (or photo-path @chat-photo-path)]
[contact-online online?]]
[text {:style st/status-from [text {:style st/status-from
:font :default :font :default
:number-of-lines 1} :number-of-lines 1}

9
src/status_im/chats_list/views/chat_list_item.cljs
View File

@ -4,13 +4,10 @@
text text
image image
touchable-highlight]] touchable-highlight]]
[status-im.chats-list.views.inner-item :refer [chat-list-item-inner-view]])) [status-im.chats-list.views.inner-item :refer [chat-list-item-inner-view]]
[taoensso.timbre :as log]))
(defn chat-list-item [[chat-id chat]] (defn chat-list-item [[chat-id chat]]
[touchable-highlight {:on-press #(dispatch [:navigate-to :chat chat-id])} [touchable-highlight {:on-press #(dispatch [:navigate-to :chat chat-id])}
[view [view
[chat-list-item-inner-view (merge chat [chat-list-item-inner-view (assoc chat :chat-id chat-id)]]])
;; TODO stub data
{:chat-id chat-id
:new-messages-count 3
:online true})]]])

35
src/status_im/chats_list/views/inner_item.cljs
View File

@ -1,20 +1,37 @@
(ns status-im.chats-list.views.inner-item (ns status-im.chats-list.views.inner-item
(:require-macros [status-im.utils.views :refer [defview]]) (:require-macros [status-im.utils.views :refer [defview]])
(:require [status-im.components.react :refer [view image icon text]] (:require [re-frame.core :refer [subscribe dispatch]]
[clojure.string :as str]
[status-im.components.react :refer [view image icon text]]
[status-im.components.chat-icon.screen :refer [chat-icon-view-chat-list]] [status-im.components.chat-icon.screen :refer [chat-icon-view-chat-list]]
[status-im.models.commands :refer [parse-command-message-content]]
[status-im.chats-list.styles :as st] [status-im.chats-list.styles :as st]
[status-im.utils.utils :refer [truncate-str]] [status-im.utils.utils :refer [truncate-str]]
[status-im.i18n :refer [label label-pluralize]] [status-im.i18n :refer [label label-pluralize]]
[status-im.utils.datetime :as time] [status-im.utils.datetime :as time]
[status-im.utils.gfycat.core :refer [generate-gfy]] [status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.constants :refer [console-chat-id]] [status-im.constants :refer [console-chat-id
[clojure.string :as str])) content-type-command
content-type-command-request]]
[taoensso.timbre :as log]))
(defn message-content [{:keys [content] :as message}] (defmulti message-content (fn [{:keys [content-type] :as message}] content-type))
(let [content (if message
(if (string? content) (defmethod message-content content-type-command
content [{{:keys [command params]} :content}]
(:content content)))] (let [kw (keyword (str "t/command-text-" (name command)))]
(label kw params)))
(defmethod message-content content-type-command-request
[{{:keys [content]} :content}]
content)
(defmethod message-content :default
[{:keys [content]}]
content)
(defn message-content-text [message]
(let [content (message-content message)]
(if (str/blank? content) (if (str/blank? content)
[text {:style st/last-message-text-no-messages} [text {:style st/last-message-text-no-messages}
(label :t/no-messages)] (label :t/no-messages)]
@ -71,7 +88,7 @@
(when group-chat (when group-chat
[text {:style st/memebers-text} [text {:style st/memebers-text}
(label-pluralize (inc (count contacts)) :t/members)])] (label-pluralize (inc (count contacts)) :t/members)])]
[message-content last-message]] [message-content-text last-message]]
[view [view
(when last-message (when last-message
[view st/status-container [view st/status-container

10
src/status_im/components/chat_icon/screen.cljs
View File

@ -78,6 +78,16 @@
:default-chat-icon (st/default-chat-icon-menu-item color) :default-chat-icon (st/default-chat-icon-menu-item color)
:default-chat-icon-text st/default-chat-icon-text}]) :default-chat-icon-text st/default-chat-icon-text}])
(defn chat-icon-message-status [chat-id group-chat name color online]
[chat-icon-view chat-id group-chat name online
{:container st/container-message-status
:online-view st/online-view
:online-dot-left st/online-dot-left
:online-dot-right st/online-dot-right
:chat-icon st/chat-icon-message-status
:default-chat-icon (st/default-chat-icon-message-status color)
:default-chat-icon-text st/message-status-icon-text}])
(defn contact-icon-view [contact styles] (defn contact-icon-view [contact styles]
(let [photo-path (:photo-path contact) (let [photo-path (:photo-path contact)
;; TODO: stub ;; TODO: stub

19
src/status_im/components/chat_icon/styles.cljs
View File

@ -35,12 +35,23 @@
:height 36 :height 36
:border-radius 18})) :border-radius 18}))
(defn default-chat-icon-message-status [color]
(merge (default-chat-icon color)
{:width 64
:height 64
:border-radius 32}))
(def default-chat-icon-text (def default-chat-icon-text
{:marginTop -2 {:marginTop -2
:color color-white :color color-white
:fontSize 16 :fontSize 16
:lineHeight 20}) :lineHeight 20})
(def message-status-icon-text
{:marginTop -2
:color color-white
:fontSize 24})
(def chat-icon (def chat-icon
{:margin 4 {:margin 4
:border-radius 20 :border-radius 20
@ -70,6 +81,11 @@
:height 36 :height 36
:border-radius 18})) :border-radius 18}))
(def chat-icon-message-status
{:border-radius 32
:width 64
:height 64})
(def online-view-wrapper (def online-view-wrapper
{:position :absolute {:position :absolute
:bottom -1 :bottom -1
@ -152,3 +168,6 @@
(def container-profile (def container-profile
{:width 72 {:width 72
:height 72}) :height 72})
(def container-message-status
{:margin-top 20})

4
src/status_im/data_store/messages.cljs
View File

@ -65,7 +65,9 @@
(defn get-last-message (defn get-last-message
[chat-id] [chat-id]
(data-store/get-last-message chat-id)) (let [{:keys [content-type] :as message} (data-store/get-last-message chat-id)]
(when (and message (command-type? content-type))
(clojure.core/update message :content str-to-map))))
(defn get-unviewed (defn get-unviewed
[] []

3
src/status_im/data_store/realm/messages.cljs
View File

@ -31,8 +31,7 @@
[chat-id] [chat-id]
(-> (realm/get-by-field @realm/account-realm :message :chat-id chat-id) (-> (realm/get-by-field @realm/account-realm :message :chat-id chat-id)
(realm/sorted :timestamp :desc) (realm/sorted :timestamp :desc)
(realm/single) (realm/single-cljs)))
(js->clj :keywordize-keys true)))
(defn get-unviewed (defn get-unviewed
[] []

3
src/status_im/translations/en.cljs
View File

@ -139,6 +139,9 @@
:keypair-password-command-description "" :keypair-password-command-description ""
:help-command-description "Help" :help-command-description "Help"
:request "Request" :request "Request"
:command-text-location "Location: {{address}}"
:command-text-browse "Browsing webpage: {{webpage}}"
:command-text-send "Transaction: {{amount}} ETH"
;new-group ;new-group
:group-chat-name "Chat name" :group-chat-name "Chat name"