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

replaced android toolbar with new custom toolbar

This commit is contained in:
Adrian Tiberius 2016-05-05 18:04:17 +03:00
parent 2c9174af63
commit c11da58c50
4 changed files with 169 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

115
src/syng_im/components/discovery/discovery.cljs
View File

@ -8,9 +8,9 @@
view view
scroll-view scroll-view
text text
text-input text-input]]
toolbar-android]]
[reagent.core :as r] [reagent.core :as r]
[syng-im.components.toolbar :refer [toolbar]]
[syng-im.components.discovery.discovery-popular :refer [discovery-popular]] [syng-im.components.discovery.discovery-popular :refer [discovery-popular]]
[syng-im.components.discovery.discovery-recent :refer [discovery-recent]] [syng-im.components.discovery.discovery-recent :refer [discovery-recent]]
[syng-im.resources :as res] [syng-im.resources :as res]
@ -24,66 +24,67 @@
hashtags hashtags
[]))) [])))
(defn title-content [showSearch]
(if showSearch
[text-input {:underlineColorAndroid "transparent"
;:value (:search @search-input)
:style {:flex 1
:marginLeft 18
:lineHeight 42
:fontSize 14
:fontFamily "Avenir-Roman"
:color "#9CBFC0"}
:autoFocus true
:placeholder "Type your search tags here"
:onSubmitEditing (fn [e]
(let [search (aget e "nativeEvent" "text")
hashtags (get-hashtags search)]
(dispatch [:broadcast-status search hashtags])))}]
[view {:style {;:flex 1
;:flexDirection "row"
;:justifyContent "center"
;:alignSelf "stretch"
;:alignItems "center"
}}
[text {:style {:color "#000000de"
:alignSelf "center"
:textAlign "center"
:fontFamily "sans-serif"
:fontSize 16}} "Discover"]]))
(defn create-fake-discovery []
(let [number (rand-int 999)]
(do
(save-discoveries [{:name (str "Name " number)
:status (str "Status This is some longer status to get the second line " number)
:whisper-id (str number)
:photo ""
:location ""
:tags ["tag1" "tag2" "tag3"]
:last-updated (new js/Date)}])
(dispatch [:updated-discoveries]))))
(defn discovery [{:keys [navigator]}] (defn discovery [{:keys [navigator]}]
(let [showSearch (r/atom false)] (let [showSearch (r/atom false)]
(fn [] (fn []
[view {:style {:flex 1 [view {:style {:flex 1
:backgroundColor "#eef2f5"}} :backgroundColor "#eef2f5"}}
[toolbar-android {:titleColor "#4A5258" [toolbar {:style {:backgroundColor "#eef2f5"
:navIcon res/menu :elevation 0}
:actions [{:title "Search" :navigator navigator
:icon res/search :nav-action {:image {:source {:uri "icon_hamburger"}
:show "always"}] :style {:width 16
:style {:backgroundColor "#eef2f5" :height 12}}
:justifyContent "center" :handler create-fake-discovery}
:height 56 :title "Add Participants"
:elevation 0} :content (title-content @showSearch)
:onIconClicked (fn [] :action {:image {:source {:uri "icon_search"}
(let [number (rand-int 999)] :style {:width 17
(do :height 17}}
(save-discoveries [{:name (str "Name " number) :handler (fn []
:status (str "Status This is some longer status to get the second line " number) (if @showSearch
:whisper-id (str number) (reset! showSearch false)
:photo "" (reset! showSearch true)))}}]
:location ""
:tags ["tag1" "tag2" "tag3"]
:last-updated (new js/Date)}])
(dispatch [:updated-discoveries]))))
;; temporary dispatch for testing
:onActionSelected (fn [index]
(if @showSearch
(reset! showSearch false)
(reset! showSearch true)))}
(if @showSearch
[text-input {:underlineColorAndroid "transparent"
;:value (:search @search-input)
:style {:flex 1
:marginLeft 18
:lineHeight 42
:fontSize 14
:fontFamily "Avenir-Roman"
:color "#9CBFC0"}
:autoFocus true
:placeholder "Type your search tags here"
:onChangeText (fn [new-text]
(let [old-text (:search @search-input)]
(log/debug (str new-text "-" old-text))))
:onSubmitEditing (fn [e]
(let [search (aget e "nativeEvent" "text")
hashtags (get-hashtags search)]
(dispatch [:broadcast-status search hashtags])))}]
[view {:style {;:flex 1
;:flexDirection "row"
;:justifyContent "center"
;:alignSelf "stretch"
;:alignItems "center"
}}
[text {:style {:color "#000000de"
:alignSelf "center"
:textAlign "center"
:fontFamily "sans-serif"
:fontSize 16}} "Discover"]])]
[scroll-view {:style {}} [scroll-view {:style {}}
[view {:style {:paddingLeft 30 [view {:style {:paddingLeft 30
:paddingTop 15 :paddingTop 15

1
src/syng_im/components/discovery/discovery_recent.cljs
View File

@ -28,6 +28,7 @@
(let [discoveries (subscribe [:get-discoveries]) (let [discoveries (subscribe [:get-discoveries])
datasource (to-realm-datasource @discoveries)] datasource (to-realm-datasource @discoveries)]
[list-view {:dataSource datasource [list-view {:dataSource datasource
:enableEmptySections true
:renderRow render-row :renderRow render-row
:renderSeparator render-separator :renderSeparator render-separator
:style {:backgroundColor "white" :style {:backgroundColor "white"

71
src/syng_im/components/discovery/discovery_tag.cljs Normal file
View File

@ -0,0 +1,71 @@
(ns syng-im.components.discovery.discovery-tag
(:require
[re-frame.core :refer [subscribe]]
[syng-im.utils.logging :as log]
[syng-im.utils.listview :refer [to-realm-datasource
to-datasource]]
[syng-im.navigation :refer [nav-pop]]
[syng-im.components.react :refer [android?
view
text]]
[syng-im.components.realm :refer [list-view]]
[syng-im.components.toolbar :refer [toolbar]]
[reagent.core :as r]
[syng-im.components.discovery.discovery-popular-list-item :refer [discovery-popular-list-item]]
[syng-im.resources :as res]))
(defn render-row [row section-id row-id]
(log/debug "discovery-tag-row: " row section-id row-id)
(if row
(let [elem (discovery-popular-list-item row)]
elem)
(r/as-element [text "null"])
))
(defn render-separator [sectionID, rowID, adjacentRowHighlighted]
(let [elem (r/as-element [view {:style {:borderBottomWidth 1
:borderBottomColor "#eff2f3"}
:key rowID}])]
elem))
(defn title-content [tag]
[view {:style {:backgroundColor "#eef2f5"
:flexWrap :wrap
:borderRadius 5
:padding 4}}
[text {:style {:color "#7099e6"
:fontFamily "sans-serif-medium"
:fontSize 14
:paddingRight 5
:paddingBottom 2}}
(str " #" tag)]])
(defn discovery-tag [{:keys [tag navigator]}]
(let [tag (subscribe [:get-current-tag])
discoveries (subscribe [:get-discoveries-by-tag @tag 0])]
(log/debug "Got discoveries: " @discoveries)
(fn []
(let [items @discoveries
datasource (to-realm-datasource items)]
[view {:style {:flex 1
:backgroundColor "#eef2f5"}}
[toolbar {:navigator navigator
:nav-action {:image {:source {:uri "icon_back"}
:style {:width 8
:height 14}}
:handler (fn [] (nav-pop navigator))}
:title "Add Participants"
:content (title-content @tag)
:action {:image {:source {:uri "icon_search"}
:style {:width 17
:height 17}}
:handler (fn []
())}}]
[list-view {:dataSource datasource
:enableEmptySections true
:renderRow render-row
:renderSeparator render-separator
:style {:backgroundColor "white"
:paddingLeft 15}}]
]))))

72
src/syng_im/components/toolbar.cljs
View File

@ -18,41 +18,47 @@
[reagent.core :as r] [reagent.core :as r]
[syng-im.navigation :refer [nav-pop]])) [syng-im.navigation :refer [nav-pop]]))
(defn toolbar [{:keys [navigator title nav-action action background-color]}] (defn toolbar [{:keys [navigator title nav-action action background-color content style]}]
[view {:style {:flexDirection "row" (let [style (merge {:flexDirection "row"
:backgroundColor (or background-color toolbar-background1) :backgroundColor (or background-color toolbar-background1)
:height 56 :height 56
:elevation 2}} :elevation 2} style)]
(if nav-action [view {:style style}
[touchable-highlight {:on-press (:handler nav-action) (if nav-action
[touchable-highlight {:on-press (:handler nav-action)
:underlay-color :transparent}
[view {:width 56
:height 56
:alignItems "center"
:justifyContent "center"}
[image (:image nav-action)]]]
[touchable-highlight {:on-press (fn []
(nav-pop navigator))
:underlay-color :transparent}
[view {:width 56
:height 56}
[image {:source {:uri "icon_back"}
:style {:marginTop 21
:marginLeft 23
:width 8
:height 14}}]]])
(if content
[view {:style {:flex 1
:alignItems "center"
:justifyContent "center"}}
content]
[view {:style {:flex 1
:alignItems "center"
:justifyContent "center"}}
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 16
:fontFamily font}}
title]])
[touchable-highlight {:on-press (:handler action)
:underlay-color :transparent} :underlay-color :transparent}
[view {:width 56 [view {:width 56
:height 56 :height 56
:alignItems "center" :alignItems "center"
:justifyContent "center"} :justifyContent "center"}
[image (:image nav-action)]]] [image (:image action)]]]]))
[touchable-highlight {:on-press (fn []
(nav-pop navigator))
:underlay-color :transparent}
[view {:width 56
:height 56}
[image {:source {:uri "icon_back"}
:style {:marginTop 21
:marginLeft 23
:width 8
:height 14}}]]])
[view {:style {:flex 1
:alignItems "center"
:justifyContent "center"}}
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 16
:fontFamily font}}
title]]
[touchable-highlight {:on-press (:handler action)
:underlay-color :transparent}
[view {:width 56
:height 56
:alignItems "center"
:justifyContent "center"}
[image (:image action)]]]])