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

Begin Chat view 

Former-commit-id: 280aa6881b
This commit is contained in:
virvar 2016-02-25 20:55:22 +03:00
parent 0ed10176b2
commit 8fa81ec0ff
3 changed files with 44 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
src/messenger/android/chat.cljs
View File

@ -20,17 +20,34 @@
[:message/by-id id]) [:message/by-id id])
static om/IQuery static om/IQuery
(query [this] (query [this]
'[:id :body :delivery-status :datetime]) '[:id :body :outgoing :delivery-status :datetime])
Object Object
(render [this] (render [this]
(let [{:keys [id body delivery-status datetime]} (let [{:keys [id body outgoing delivery-status datetime]}
(om/props this)] (om/props this)]
(text {:style {:color "#AAB2B2" (view {:height 70}
:fontFamily "Avenir-Roman" (text {:style {:marginVertical 10
:fontSize 14 :fontFamily "Avenir-Roman"
:marginTop 2 :fontSize 11
:paddingRight 10}} :color "#AAB2B2"
body)))) :letterSpacing 1
:lineHeight 15
:textAlign "center"
:opacity 0.8}}
datetime)
(view {:style (merge {:borderRadius 6
:marginVertical 5
:paddingVertical 12
:paddingHorizontal 16}
(if outgoing
{:backgroundColor "#D3EEEF"
:alignSelf "flex-end"}
{:backgroundColor "#FBF6E3"
:alignSelf "flex-start"}))}
(text {:style {:fontSize 14
:fontFamily "Avenir-Roman"
:color "#4A5258"}}
body))))))
(def message (om/factory Message {:keyfn :id})) (def message (om/factory Message {:keyfn :id}))
@ -39,17 +56,18 @@
(defn generate-message [n] (defn generate-message [n]
{:id n {:id n
:body "Hi" :body "This is a text. This is a text."
:outgoing (< (rand) 0.5)
:delivery-status (if (< (rand) 0.5) :delivered :seen) :delivery-status (if (< (rand) 0.5) :delivered :seen)
:datetime "15:30"}) :datetime "15:30"})
(defn generate-messages [n] (defn generate-messages [n]
(map generate-message (range 1 (inc n)))) (map generate-message (range 1 (inc n))))
(defn load-message [] (defn load-messages []
(swap! state/app-state update :contacts-ds (clone-with-rows (data-source {:rowHasChanged (fn [row1 row2]
#(clone-with-rows % (not= row1 row2))})
(vec (generate-messages 10))))) (vec (generate-messages 10))))
(defui Chat (defui Chat
;; static om/IQuery ;; static om/IQuery
@ -59,20 +77,21 @@
;; (componentDidMount [this] ;; (componentDidMount [this]
;; (load-contacts)) ;; (load-contacts))
(render [this] (render [this]
(let [{:keys [contacts-ds]} (om/props this) (let [{:keys [nav]} (om/get-computed this)
{:keys [nav]} (om/get-computed this)] messages-ds (load-messages)]
(view {:style {:flex 1}} (view {:style {:flex 1}}
(toolbar-android {:logo res/logo-icon (toolbar-android {:logo res/logo-icon
:title "Chat name" :title "Chat name"
:titleColor "#4A5258"
:subtitle "Last seen just now"
:subtitleColor "#AAB2B2"
:navIcon res/nav-back-icon
:style {:backgroundColor "#e9eaed" :style {:backgroundColor "#e9eaed"
:height 56} :height 56}
:navIcon res/nav-back-icon
:onIconClicked (fn [] :onIconClicked (fn []
(nav-pop nav))}) (nav-pop nav))})
(text {} "Hello") (list-view {:dataSource messages-ds
;; (list-view {:dataSource contacts-ds :renderRow render-row
;; :renderRow render-row :style {}})))))
;; :style {}})
))))
(def chat (om/factory Chat)) (def chat (om/factory Chat))

1
src/messenger/android/contacts_list.cljs
View File

@ -179,6 +179,7 @@
(view {:style {:flex 1}} (view {:style {:flex 1}}
(toolbar-android {:logo res/logo-icon (toolbar-android {:logo res/logo-icon
:title "Chats" :title "Chats"
:titleColor "#4A5258"
:style {:backgroundColor "#e9eaed" :style {:backgroundColor "#e9eaed"
:height 56}}) :height 56}})
(list-view {:dataSource contacts-ds (list-view {:dataSource contacts-ds

5
src/messenger/android/core.cljs
View File

@ -34,13 +34,14 @@
'[:page :contacts-ds]) '[:page :contacts-ds])
Object Object
(render [this] (render [this]
(let [{:keys [page contacts-ds]} (om/props this)] (let [{:keys [page]} (om/props this)]
(navigator (navigator
{:initialRoute {:component contacts-list} {:initialRoute {:component contacts-list}
:renderScene (fn [route nav] :renderScene (fn [route nav]
(when state/*nav-render* (when state/*nav-render*
(init-back-button-handler! nav) (init-back-button-handler! nav)
(let [{:keys [component]} (js->clj route :keywordize-keys true)] (let [{:keys [component]}
(js->clj route :keywordize-keys true)]
(component (om/computed (om/props this) {:nav nav})))))})))) (component (om/computed (om/props this) {:nav nav})))))}))))
(swap! state/app-state assoc :contacts-ds (swap! state/app-state assoc :contacts-ds