Fix drawer styles. Rename
This commit is contained in:
parent
55dc64f6e6
commit
b76a3d4afd
|
@ -13,7 +13,7 @@
|
|||
[syng-im.components.chats.new-group :refer [new-group]]
|
||||
[syng-im.components.chat.new-participants :refer [new-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.utils :refer [toast]]
|
||||
[syng-im.navigation :as nav]
|
||||
|
|
|
@ -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"]]]])
|
|
@ -5,7 +5,6 @@
|
|||
text
|
||||
image
|
||||
touchable-highlight
|
||||
drawer-layout-android
|
||||
navigator]]
|
||||
[syng-im.components.realm :refer [list-view]]
|
||||
[syng-im.utils.logging :as log]
|
||||
|
@ -14,7 +13,7 @@
|
|||
[syng-im.utils.listview :refer [to-realm-datasource]]
|
||||
[reagent.core :as r]
|
||||
[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
|
||||
action-button-item]]
|
||||
[syng-im.components.styles :refer [font
|
||||
|
@ -28,11 +27,10 @@
|
|||
[syng-im.components.icons.ionicons :refer [icon]]))
|
||||
|
||||
(defn chats-list-toolbar []
|
||||
[toolbar {:nav-action {:image {:source {:uri "icon_hamburger"}
|
||||
:style {:width 16
|
||||
:height 12}}
|
||||
:handler (fn []
|
||||
(.openDrawer js/React.DrawerLayoutAndroid.drawer))}
|
||||
[toolbar {:nav-action {:image {:source {:uri "icon_hamburger"}
|
||||
:style {:width 16
|
||||
:height 12}}
|
||||
:handler open-drawer}
|
||||
:title "Chats"
|
||||
:action {:image {:source {:uri "icon_search"}
|
||||
:style {:width 17
|
||||
|
@ -45,11 +43,7 @@
|
|||
(let [chats @chats
|
||||
_ (log/debug "chats=" chats)
|
||||
datasource (to-realm-datasource chats)]
|
||||
[drawer-layout-android {:drawerWidth 300
|
||||
:drawerPosition js/React.DrawerLayoutAndroid.positions.Left
|
||||
:render-navigation-view #(r/as-element [chat-menu navigator])
|
||||
:ref (fn [drawer]
|
||||
(set! js/React.DrawerLayoutAndroid.drawer drawer))}
|
||||
[drawer-view {:navigator navigator}
|
||||
[view {:style {:flex 1
|
||||
:backgroundColor "white"}}
|
||||
[chats-list-toolbar]
|
||||
|
|
|
@ -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])
|
|
@ -1,4 +1,4 @@
|
|||
(ns syng-im.components.chatmenu.profile
|
||||
(ns syng-im.components.profile
|
||||
(:require [clojure.string :as s]
|
||||
[re-frame.core :refer [subscribe dispatch dispatch-sync]]
|
||||
[syng-im.components.react :refer [android?
|
||||
|
@ -30,14 +30,12 @@
|
|||
:width 66
|
||||
:height 66}}]])
|
||||
|
||||
(defn chats-list-toolbar []
|
||||
[toolbar {:title "Profile"}])
|
||||
|
||||
(defn profile [navigator]
|
||||
(defn profile [{:keys [navigator]}]
|
||||
[view {:style {:flex 1
|
||||
:backgroundColor "#FFF"
|
||||
:flexDirection "column"}}
|
||||
[toolbar {:title "Profile"}]
|
||||
[toolbar {:navigator navigator
|
||||
:title "Profile"}]
|
||||
[view {:style {:flex .20
|
||||
:alignItems "center"
|
||||
:justifyContent "center"}}
|
Loading…
Reference in New Issue