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

View File

@ -8,9 +8,9 @@
view
scroll-view
text
text-input
toolbar-android]]
text-input]]
[reagent.core :as r]
[syng-im.components.toolbar :refer [toolbar]]
[syng-im.components.discovery.discovery-popular :refer [discovery-popular]]
[syng-im.components.discovery.discovery-recent :refer [discovery-recent]]
[syng-im.resources :as res]
@ -24,37 +24,8 @@
hashtags
[])))
(defn discovery [{:keys [navigator]}]
(let [showSearch (r/atom false)]
(fn []
[view {:style {:flex 1
:backgroundColor "#eef2f5"}}
[toolbar-android {:titleColor "#4A5258"
:navIcon res/menu
:actions [{:title "Search"
:icon res/search
:show "always"}]
:style {:backgroundColor "#eef2f5"
:justifyContent "center"
:height 56
:elevation 0}
:onIconClicked (fn []
(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]))))
;; temporary dispatch for testing
:onActionSelected (fn [index]
(if @showSearch
(reset! showSearch false)
(reset! showSearch true)))}
(if @showSearch
(defn title-content [showSearch]
(if showSearch
[text-input {:underlineColorAndroid "transparent"
;:value (:search @search-input)
:style {:flex 1
@ -65,9 +36,6 @@
: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)]
@ -82,8 +50,41 @@
:alignSelf "center"
:textAlign "center"
:fontFamily "sans-serif"
:fontSize 16}} "Discover"]])]
: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]}]
(let [showSearch (r/atom false)]
(fn []
[view {:style {:flex 1
:backgroundColor "#eef2f5"}}
[toolbar {:style {:backgroundColor "#eef2f5"
:elevation 0}
:navigator navigator
:nav-action {:image {:source {:uri "icon_hamburger"}
:style {:width 16
:height 12}}
:handler create-fake-discovery}
:title "Add Participants"
:content (title-content @showSearch)
:action {:image {:source {:uri "icon_search"}
:style {:width 17
:height 17}}
:handler (fn []
(if @showSearch
(reset! showSearch false)
(reset! showSearch true)))}}]
[scroll-view {:style {}}
[view {:style {:paddingLeft 30
:paddingTop 15

View File

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

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}}]
]))))

View File

@ -18,11 +18,12 @@
[reagent.core :as r]
[syng-im.navigation :refer [nav-pop]]))
(defn toolbar [{:keys [navigator title nav-action action background-color]}]
[view {:style {:flexDirection "row"
(defn toolbar [{:keys [navigator title nav-action action background-color content style]}]
(let [style (merge {:flexDirection "row"
:backgroundColor (or background-color toolbar-background1)
:height 56
:elevation 2}}
:elevation 2} style)]
[view {:style style}
(if nav-action
[touchable-highlight {:on-press (:handler nav-action)
:underlay-color :transparent}
@ -41,6 +42,11 @@
: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"}}
@ -48,11 +54,11 @@
:color text1-color
:fontSize 16
:fontFamily font}}
title]]
title]])
[touchable-highlight {:on-press (:handler action)
:underlay-color :transparent}
[view {:width 56
:height 56
:alignItems "center"
:justifyContent "center"}
[image (:image action)]]]])
[image (:image action)]]]]))