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

Fix drawer styles. Rename 

Former-commit-id: b76a3d4afd
This commit is contained in:
virvar 2016-05-06 11:40:18 +03:00
parent ce53fec09c
commit 3c788b4d4b
5 changed files with 102 additions and 113 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/syng_im/android/core.cljs
View File

@ -13,7 +13,7 @@
[syng-im.components.chats.new-group :refer [new-group]] [syng-im.components.chats.new-group :refer [new-group]]
[syng-im.components.chat.new-participants :refer [new-participants]] [syng-im.components.chat.new-participants :refer [new-participants]]
[syng-im.components.chat.remove-participants :refer [remove-participants]] [syng-im.components.chat.remove-participants :refer [remove-participants]]
[syng-im.components.chatmenu.profile :refer [profile]] [syng-im.components.profile :refer [profile]]
[syng-im.utils.logging :as log] [syng-im.utils.logging :as log]
[syng-im.utils.utils :refer [toast]] [syng-im.utils.utils :refer [toast]]
[syng-im.navigation :as nav] [syng-im.navigation :as nav]

94
src/syng_im/components/chatmenu/chat_menu.cljs
View File

@ -1,94 +0,0 @@
(ns syng-im.components.chatmenu.chat_menu
(:require [clojure.string :as s]
[re-frame.core :refer [subscribe dispatch dispatch-sync]]
[syng-im.components.react :refer [android?
view
text
image
navigator
toolbar-android
drawer-layout-android
touchable-opacity]]
[syng-im.resources :as res]
[syng-im.components.styles :refer [font
title-font
color-white
chat-background
online-color
selected-message-color
text1-color
text2-color
text3-color]]))
(defn chat-photo [{:keys [photo-path]}]
[view {:borderRadius 50}
[image {:source (if (s/blank? photo-path)
res/user-no-photo
{:uri photo-path})
:style {:borderRadius 50
:width 66
:height 66}}]])
(defn chat-menu [navigator]
[view {:style {:flex 1
:backgroundColor "#FFF"
:flexDirection "column"}}
[view {:style {:flex .25
:alignItems "center"
:justifyContent "center"}}
[chat-photo {}]]
[view {:style {:flex .15
:alignItems "center"}}
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 18}}
"Status"]]
[view {:style {:flex .50
:alignItems "flex-start"
:flexDirection "column"
:paddingTop 10}}
[view {:style {:height 40
:justifyContent "center"
:padding 10
:paddingLeft 20}}
[touchable-opacity
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 14}
:onPress (fn []
(dispatch [:show-profile navigator]))}
"Profile"]]]
[view {:style {:height 40
:justifyContent "center"
:padding 10
:paddingLeft 20}}
[touchable-opacity
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 14}}
"Settings"]]]
[view {:style {:height 40
:justifyContent "center"
:padding 10
:paddingLeft 20}}
[touchable-opacity
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 14}}
"Invite friends"]]]
[view {:style {:height 40
:justifyContent "center"
:padding 10
:paddingLeft 20}}
[touchable-opacity
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 14}}
"FAQ"]]]]
[view {:style {:flex .10
:alignItems "center"}}
[touchable-opacity
[text {:style {:marginTop -2.5
:color text3-color
:fontSize 14}}
"Switch User"]]]])

18
src/syng_im/components/chats/chats_list.cljs
View File

@ -5,7 +5,6 @@
text text
image image
touchable-highlight touchable-highlight
drawer-layout-android
navigator]] navigator]]
[syng-im.components.realm :refer [list-view]] [syng-im.components.realm :refer [list-view]]
[syng-im.utils.logging :as log] [syng-im.utils.logging :as log]
@ -14,7 +13,7 @@
[syng-im.utils.listview :refer [to-realm-datasource]] [syng-im.utils.listview :refer [to-realm-datasource]]
[reagent.core :as r] [reagent.core :as r]
[syng-im.components.chats.chat-list-item :refer [chat-list-item]] [syng-im.components.chats.chat-list-item :refer [chat-list-item]]
[syng-im.components.chatmenu.chat_menu :refer [chat-menu]] [syng-im.components.drawer :refer [drawer-view open-drawer]]
[syng-im.components.action-button :refer [action-button [syng-im.components.action-button :refer [action-button
action-button-item]] action-button-item]]
[syng-im.components.styles :refer [font [syng-im.components.styles :refer [font
@ -28,11 +27,10 @@
[syng-im.components.icons.ionicons :refer [icon]])) [syng-im.components.icons.ionicons :refer [icon]]))
(defn chats-list-toolbar [] (defn chats-list-toolbar []
[toolbar {:nav-action {:image {:source {:uri "icon_hamburger"} [toolbar {:nav-action {:image {:source {:uri "icon_hamburger"}
:style {:width 16 :style {:width 16
:height 12}} :height 12}}
:handler (fn [] :handler open-drawer}
(.openDrawer js/React.DrawerLayoutAndroid.drawer))}
:title "Chats" :title "Chats"
:action {:image {:source {:uri "icon_search"} :action {:image {:source {:uri "icon_search"}
:style {:width 17 :style {:width 17
@ -45,11 +43,7 @@
(let [chats @chats (let [chats @chats
_ (log/debug "chats=" chats) _ (log/debug "chats=" chats)
datasource (to-realm-datasource chats)] datasource (to-realm-datasource chats)]
[drawer-layout-android {:drawerWidth 300 [drawer-view {:navigator navigator}
:drawerPosition js/React.DrawerLayoutAndroid.positions.Left
:render-navigation-view #(r/as-element [chat-menu navigator])
:ref (fn [drawer]
(set! js/React.DrawerLayoutAndroid.drawer drawer))}
[view {:style {:flex 1 [view {:style {:flex 1
:backgroundColor "white"}} :backgroundColor "white"}}
[chats-list-toolbar] [chats-list-toolbar]

91
src/syng_im/components/drawer.cljs Normal file
View File

@ -0,0 +1,91 @@
(ns syng-im.components.drawer
(:require [clojure.string :as s]
[re-frame.core :refer [subscribe dispatch dispatch-sync]]
[reagent.core :as r]
[syng-im.components.react :refer [android?
view
text
image
navigator
toolbar-android
drawer-layout-android
touchable-opacity]]
[syng-im.resources :as res]
[syng-im.components.styles :refer [font
title-font
color-white
chat-background
online-color
selected-message-color
text1-color
text2-color
text3-color]]))
(defonce drawer-atom (atom))
(defn open-drawer []
(.openDrawer @drawer-atom))
(defn user-photo [{:keys [photo-path]}]
[view {:borderRadius 50}
[image {:source (if (s/blank? photo-path)
res/user-no-photo
{:uri photo-path})
:style {:borderRadius 50
:width 64
:height 64}}]])
(defn menu-item [{:keys [name handler]}]
[touchable-opacity {:style {:height 48
:paddingLeft 16
:paddingTop 14}
:onPress handler}
[text {:style {:fontSize 14
:fontFamily font
:lineHeight 21
:color text1-color}}
name]])
(defn drawer-menu [navigator]
[view {:style {:flex 1
:backgroundColor color-white
:flexDirection :column}}
[view {:style {:marginTop 40
:alignItems :center
:justifyContent :center}}
[user-photo {}]]
[view {:style {:marginTop 20
:alignItems :center}}
[text {:style {:marginTop -2.5
:color text1-color
:fontSize 16}}
"Status"]]
[view {:style {:flex 1
:marginTop 80
:alignItems :stretch
:flexDirection :column}}
[menu-item {:name "Profile"
:handler (fn []
(dispatch [:show-profile navigator]))}]
[menu-item {:name "Settings"
:handler (fn [])}]
[menu-item {:name "Invite friends"
:handler (fn [])}]
[menu-item {:name "FAQ"
:handler (fn [])}]]
[view {:style {:paddingVertical 36
:alignItems :center}}
[touchable-opacity {}
[text {:style {:fontSize 14
:fontFamily font
:lineHeight 21
:color text3-color}}
"Switch users"]]]])
(defn drawer-view [{:keys [navigator]} items]
[drawer-layout-android {:drawerWidth 300
:drawerPosition js/React.DrawerLayoutAndroid.positions.Left
:render-navigation-view #(r/as-element [drawer-menu navigator])
:ref (fn [drawer]
(reset! drawer-atom drawer))}
items])

10
src/syng_im/components/chatmenu/profile.cljs → src/syng_im/components/profile.cljs
View File

@ -1,4 +1,4 @@
(ns syng-im.components.chatmenu.profile (ns syng-im.components.profile
(:require [clojure.string :as s] (:require [clojure.string :as s]
[re-frame.core :refer [subscribe dispatch dispatch-sync]] [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[syng-im.components.react :refer [android? [syng-im.components.react :refer [android?
@ -30,14 +30,12 @@
:width 66 :width 66
:height 66}}]]) :height 66}}]])
(defn chats-list-toolbar [] (defn profile [{:keys [navigator]}]
[toolbar {:title "Profile"}])
(defn profile [navigator]
[view {:style {:flex 1 [view {:style {:flex 1
:backgroundColor "#FFF" :backgroundColor "#FFF"
:flexDirection "column"}} :flexDirection "column"}}
[toolbar {:title "Profile"}] [toolbar {:navigator navigator
:title "Profile"}]
[view {:style {:flex .20 [view {:style {:flex .20
:alignItems "center" :alignItems "center"
:justifyContent "center"}} :justifyContent "center"}}