parent
0ed10176b2
commit
8fa81ec0ff
|
@ -20,17 +20,34 @@
|
|||
[:message/by-id id])
|
||||
static om/IQuery
|
||||
(query [this]
|
||||
'[:id :body :delivery-status :datetime])
|
||||
'[:id :body :outgoing :delivery-status :datetime])
|
||||
Object
|
||||
(render [this]
|
||||
(let [{:keys [id body delivery-status datetime]}
|
||||
(let [{:keys [id body outgoing delivery-status datetime]}
|
||||
(om/props this)]
|
||||
(text {:style {:color "#AAB2B2"
|
||||
:fontFamily "Avenir-Roman"
|
||||
:fontSize 14
|
||||
:marginTop 2
|
||||
:paddingRight 10}}
|
||||
body))))
|
||||
(view {:height 70}
|
||||
(text {:style {:marginVertical 10
|
||||
:fontFamily "Avenir-Roman"
|
||||
:fontSize 11
|
||||
:color "#AAB2B2"
|
||||
: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}))
|
||||
|
||||
|
@ -39,17 +56,18 @@
|
|||
|
||||
(defn generate-message [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)
|
||||
:datetime "15:30"})
|
||||
|
||||
(defn generate-messages [n]
|
||||
(map generate-message (range 1 (inc n))))
|
||||
|
||||
(defn load-message []
|
||||
(swap! state/app-state update :contacts-ds
|
||||
#(clone-with-rows %
|
||||
(vec (generate-messages 10)))))
|
||||
(defn load-messages []
|
||||
(clone-with-rows (data-source {:rowHasChanged (fn [row1 row2]
|
||||
(not= row1 row2))})
|
||||
(vec (generate-messages 10))))
|
||||
|
||||
(defui Chat
|
||||
;; static om/IQuery
|
||||
|
@ -59,20 +77,21 @@
|
|||
;; (componentDidMount [this]
|
||||
;; (load-contacts))
|
||||
(render [this]
|
||||
(let [{:keys [contacts-ds]} (om/props this)
|
||||
{:keys [nav]} (om/get-computed this)]
|
||||
(let [{:keys [nav]} (om/get-computed this)
|
||||
messages-ds (load-messages)]
|
||||
(view {:style {:flex 1}}
|
||||
(toolbar-android {:logo res/logo-icon
|
||||
:title "Chat name"
|
||||
:titleColor "#4A5258"
|
||||
:subtitle "Last seen just now"
|
||||
:subtitleColor "#AAB2B2"
|
||||
:navIcon res/nav-back-icon
|
||||
:style {:backgroundColor "#e9eaed"
|
||||
:height 56}
|
||||
:navIcon res/nav-back-icon
|
||||
:onIconClicked (fn []
|
||||
(nav-pop nav))})
|
||||
(text {} "Hello")
|
||||
;; (list-view {:dataSource contacts-ds
|
||||
;; :renderRow render-row
|
||||
;; :style {}})
|
||||
))))
|
||||
(list-view {:dataSource messages-ds
|
||||
:renderRow render-row
|
||||
:style {}})))))
|
||||
|
||||
(def chat (om/factory Chat))
|
||||
|
|
|
@ -179,6 +179,7 @@
|
|||
(view {:style {:flex 1}}
|
||||
(toolbar-android {:logo res/logo-icon
|
||||
:title "Chats"
|
||||
:titleColor "#4A5258"
|
||||
:style {:backgroundColor "#e9eaed"
|
||||
:height 56}})
|
||||
(list-view {:dataSource contacts-ds
|
||||
|
|
|
@ -34,13 +34,14 @@
|
|||
'[:page :contacts-ds])
|
||||
Object
|
||||
(render [this]
|
||||
(let [{:keys [page contacts-ds]} (om/props this)]
|
||||
(let [{:keys [page]} (om/props this)]
|
||||
(navigator
|
||||
{:initialRoute {:component contacts-list}
|
||||
:renderScene (fn [route nav]
|
||||
(when state/*nav-render*
|
||||
(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})))))}))))
|
||||
|
||||
(swap! state/app-state assoc :contacts-ds
|
||||
|
|
Loading…
Reference in New Issue