From 5a63f527d37f64a4920e791955fda45c9eb82b04 Mon Sep 17 00:00:00 2001 From: virvar Date: Wed, 11 May 2016 13:05:33 +0300 Subject: [PATCH 1/3] Add my profile view Former-commit-id: 3dfc4619244a0e54901d82f74b54232ee729373e --- .../src/main/res/drawable-hdpi/icon_dots.png | Bin 0 -> 181 bytes .../src/main/res/drawable-mdpi/icon_dots.png | Bin 0 -> 130 bytes .../src/main/res/drawable-xhdpi/icon_dots.png | Bin 0 -> 210 bytes .../main/res/drawable-xxhdpi/icon_dots.png | Bin 0 -> 301 bytes .../main/res/drawable-xxxhdpi/icon_dots.png | Bin 0 -> 437 bytes src/syng_im/android/core.cljs | 5 +- src/syng_im/components/drawer.cljs | 70 +++++++++--------- src/syng_im/components/profile.cljs | 39 +++++++++- src/syng_im/components/profile_styles.cljs | 20 ++++- src/syng_im/db.cljs | 9 ++- src/syng_im/handlers.cljs | 6 ++ src/syng_im/subs.cljs | 26 +++++-- 12 files changed, 124 insertions(+), 51 deletions(-) create mode 100644 android/app/src/main/res/drawable-hdpi/icon_dots.png create mode 100644 android/app/src/main/res/drawable-mdpi/icon_dots.png create mode 100644 android/app/src/main/res/drawable-xhdpi/icon_dots.png create mode 100644 android/app/src/main/res/drawable-xxhdpi/icon_dots.png create mode 100644 android/app/src/main/res/drawable-xxxhdpi/icon_dots.png diff --git a/android/app/src/main/res/drawable-hdpi/icon_dots.png b/android/app/src/main/res/drawable-hdpi/icon_dots.png new file mode 100644 index 0000000000000000000000000000000000000000..7f9961ec1b999f6bac7fb1d1a7609d572ea21053 GIT binary patch literal 181 zcmeAS@N?(olHy`uVBq!ia0vp^Y(Ol*0U~b-^ehHajKx9jP7LeL$-D$|@;zM~Lo`H_ zuUz9xt^WTxO89Vnn+2OdLP~_niFKjJ&zw4cxGhZ|*7^YczwmT;nOG->>bgM~BNtwa6NygdmCsWU2ITkj# cyU79!YF9m44bQs%1X|7D>FVdQ&MBb@0APe3GXGU99}`|9`#Y1O{d0$HHm?%#sF;QyEhaY;w>&G3mz5 d9_M3X3@rg_d^*h&YJlc2c)I$ztaD0e0sv>uDgyuj literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xhdpi/icon_dots.png b/android/app/src/main/res/drawable-xhdpi/icon_dots.png new file mode 100644 index 0000000000000000000000000000000000000000..e4d3d40921fbfa5423efaf03c96ab1cff1910eb4 GIT binary patch literal 210 zcmeAS@N?(olHy`uVBq!ia0vp^96+qV!3HGtKUiJ>QjEnx?oJHr&dIz4a(X;n978Mw zlT#R&GDU4?{{R2KjBzHPf}Ma&LQ0BWb=C7r!fqQ>4&U$o|KFIy@ri9hl1 zQc8jV<0E~CJ*+RzCQLB@IK$6eb3wJ+<0KQkgqOJiPq-PL>@IF!UFozD=q?6NS3j3^ HP6B@#mMfc!dZpp16d7OlB!cngC!;Yopmx7wVtop z%lRbj&7>KN6t?;p@F#gCcQsrwO5}Php2);1Tc^qqIUy=R!|<#t$HVl-D@ILCp;4~s z{Oc?lBpJK9mzS^G!QkBa(Ox6SfyuzLL`sD{j5&lm#hGEFC-btpDaXW_RM@p64rlZo x7GLJD^P-HqLWA47FByHxBHtI6%4{r^VF(xaI#1k2j}ho)22WQ%mvv4FO#t}oZ6p8y literal 0 HcmV?d00001 diff --git a/android/app/src/main/res/drawable-xxxhdpi/icon_dots.png b/android/app/src/main/res/drawable-xxxhdpi/icon_dots.png new file mode 100644 index 0000000000000000000000000000000000000000..972f7be2fd0051ebd87c33337c4a07224afb7e96 GIT binary patch literal 437 zcmV;m0ZRUfP)Px$Z%IT!R9FdPWIzLQD*D=g8UCgGWBBI=l#+u=KVo8F+QrPkH0RNsi&v4gFv2+6 z+M#Uke_reR|DPcfD8>X6N2C8SGBQjTWY;RXdUf?LkQ~?mu;w4vw*O~fa6;37l?&9g zPmn{)6J!W8NChiD<3yn5aIC7a3o8Ej`&#JpyVu(oL4N-I|Ia0$I$X}iZUh6vKUPK- zJtk0qk)au6C|EBOG_-Nqf>#`*7vyYMRN+;OLsE`Ze`A;fGT;%0DDeW1m_R9vc=f0% zL3)`$$rC924^@gN-an9D=8x}QzUC7a69Z~7BT5@o5im(ldvfRULU160(l#i05^DfB zDFgL@)Ps}q>(|%*%1Jq_03}bLmjg;W8?6_B;V@b+KoY|!InW^hFV Date: Wed, 11 May 2016 13:53:38 +0300 Subject: [PATCH 2/3] Chat view toolbar refactoring Former-commit-id: 0e2cd2f653f6227178ac4295d4a0b51273d118ba --- src/syng_im/components/chat.cljs | 72 ++++++++++--------- .../components/discovery/discovery.cljs | 25 +++---- src/syng_im/components/discovery/styles.cljs | 7 +- src/syng_im/components/toolbar.cljs | 62 ++++++++-------- 4 files changed, 90 insertions(+), 76 deletions(-) diff --git a/src/syng_im/components/chat.cljs b/src/syng_im/components/chat.cljs index 1644bc8b6f..7b5d595add 100644 --- a/src/syng_im/components/chat.cljs +++ b/src/syng_im/components/chat.cljs @@ -7,7 +7,6 @@ icon navigator touchable-highlight - toolbar-android list-view list-item android?]] @@ -18,6 +17,7 @@ [syng-im.utils.listview :refer [to-datasource to-datasource2]] [syng-im.components.invertible-scroll-view :refer [invertible-scroll-view]] + [syng-im.components.toolbar :refer [toolbar]] [syng-im.components.chat.chat-message :refer [chat-message]] [syng-im.components.chat.chat-message-new :refer [chat-message-new]])) @@ -139,40 +139,48 @@ [overlay {:on-click-outside #(dispatch [:set-show-actions false])} [actions-list-view]]) -(defn toolbar [] +(defn toolbar-content [] (let [{:keys [group-chat name contacts]} (subscribe [:chat-properties [:group-chat :name :contacts]]) show-actions (subscribe [:show-actions])] (fn [] - [view st/toolbar-view - (when (not @show-actions) - [touchable-highlight {:on-press #(dispatch [:navigate-back])} - [view st/icon-view - [icon :back st/back-icon]]]) - [view (st/chat-name-view @show-actions) - [text {:style st/chat-name-text} - (or @name "Chat name")] - (if @group-chat - [view {:flexDirection :row} - [icon :group st/group-icon] - [text {:style st/members} - (let [cnt (count @contacts)] - (str cnt - (if (< 1 cnt) - " members" - " member") - ", " cnt " active"))]] - [text {:style st/last-activity} "Active a minute ago"])] - (if @show-actions - [touchable-highlight - {:on-press #(dispatch [:set-show-actions false])} - [view st/icon-view - [icon :up st/up-icon]]] - [touchable-highlight - {:on-press #(dispatch [:set-show-actions true])} - [view st/icon-view - [chat-photo {}] - [contact-online {:online true}]]])]))) + [view (st/chat-name-view @show-actions) + [text {:style st/chat-name-text} + (or @name "Chat name")] + (if @group-chat + [view {:flexDirection :row} + [icon :group st/group-icon] + [text {:style st/members} + (let [cnt (count @contacts)] + (str cnt + (if (< 1 cnt) + " members" + " member") + ", " cnt " active"))]] + [text {:style st/last-activity} "Active a minute ago"])]))) + +(defn toolbar-action [] + (let [show-actions (subscribe [:show-actions])] + (fn [] + (if @show-actions + [touchable-highlight + {:on-press #(dispatch [:set-show-actions false])} + [view st/icon-view + [icon :up st/up-icon]]] + [touchable-highlight + {:on-press #(dispatch [:set-show-actions true])} + [view st/icon-view + [chat-photo {}] + [contact-online {:online true}]]])))) + +(defn chat-toolbar [] + (let [{:keys [group-chat name contacts]} + (subscribe [:chat-properties [:group-chat :name :contacts]]) + show-actions (subscribe [:show-actions])] + (fn [] + [toolbar {:hide-nav? @show-actions + :custom-content [toolbar-content] + :custom-action [toolbar-action]}]))) (defn messages-view [group-chat] (let [messages (subscribe [:chat :messages]) @@ -191,7 +199,7 @@ show-actions-atom (subscribe [:show-actions])] (fn [] [view st/chat-view - [toolbar] + [chat-toolbar] [messages-view @group-chat] (when @group-chat [typing-all]) (when is-active [chat-message-new]) diff --git a/src/syng_im/components/discovery/discovery.cljs b/src/syng_im/components/discovery/discovery.cljs index 8536715102..c4a4bb0782 100644 --- a/src/syng_im/components/discovery/discovery.cljs +++ b/src/syng_im/components/discovery/discovery.cljs @@ -26,17 +26,18 @@ []))) (defn title-content [showSearch] - (if showSearch - [text-input {:underlineColorAndroid "transparent" - :style st/discovery-search-input - :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 - [text {:style st/discovery-title} "Discover"]])) + [view st/discovery-toolbar-content + (if showSearch + [text-input {:underlineColorAndroid "transparent" + :style st/discovery-search-input + :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 + [text {:style st/discovery-title} "Discover"]])]) (defn create-fake-discovery [] (let [number (rand-int 999)] @@ -62,7 +63,7 @@ :height 12}} :handler create-fake-discovery} :title "Add Participants" - :content (title-content @showSearch) + :custom-content [title-content @showSearch] :action {:image {:source {:uri "icon_search"} :style {:width 17 :height 17}} diff --git a/src/syng_im/components/discovery/styles.cljs b/src/syng_im/components/discovery/styles.cljs index 9c988558f9..0044f86c94 100644 --- a/src/syng_im/components/discovery/styles.cljs +++ b/src/syng_im/components/discovery/styles.cljs @@ -24,6 +24,11 @@ ;; discovery.cljs +(def discovery-toolbar-content + {:flex 1 + :alignItems :center + :justifyContent :center}) + (def discovery-search-input {:flex 1 :marginLeft 18 @@ -172,4 +177,4 @@ (def icon-search {:width 17 - :height 17}) \ No newline at end of file + :height 17}) diff --git a/src/syng_im/components/toolbar.cljs b/src/syng_im/components/toolbar.cljs index 2b5608f078..f66ddf5735 100644 --- a/src/syng_im/components/toolbar.cljs +++ b/src/syng_im/components/toolbar.cljs @@ -17,44 +17,44 @@ [syng-im.utils.listview :refer [to-realm-datasource]] [reagent.core :as r])) -(defn toolbar [{:keys [navigator title nav-action action background-color content style]}] +(defn toolbar [{:keys [navigator title nav-action hide-nav? action custom-action + background-color custom-content style]}] (let [style (merge {:flexDirection "row" :backgroundColor (or background-color toolbar-background1) :height 56 :elevation 2} style)] [view {:style style} - (if nav-action - [touchable-highlight {:on-press (:handler nav-action)} + (when (not hide-nav?) + (if nav-action + [touchable-highlight {:on-press (:handler nav-action)} + [view {:width 56 + :height 56 + :alignItems "center" + :justifyContent "center"} + [image (:image nav-action)]]] + [touchable-highlight {:on-press #(dispatch [:navigate-back])} + [view {:width 56 + :height 56} + [image {:source {:uri "icon_back"} + :style {:marginTop 21 + :marginLeft 23 + :width 8 + :height 14}}]]])) + (or custom-content + [view {:style {:flex 1 + :alignItems "center" + :justifyContent "center"}} + [text {:style {:marginTop -2.5 + :color text1-color + :fontSize 16 + :fontFamily font}} + title]]) + custom-action + (when action + [touchable-highlight {:on-press (:handler action)} [view {:width 56 :height 56 :alignItems "center" :justifyContent "center"} - [image (:image nav-action)]]] - [touchable-highlight {:on-press #(dispatch [:navigate-back])} - [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)} - [view {:width 56 - :height 56 - :alignItems "center" - :justifyContent "center"} - [image (:image action)]]]])) + [image (:image action)]]])])) From ad65b798b5bbc81c6eb71d1da7b2ea2c1e6b79f0 Mon Sep 17 00:00:00 2001 From: virvar Date: Wed, 11 May 2016 14:37:31 +0300 Subject: [PATCH 3/3] Profile menu item of chat view Former-commit-id: 249ea85201aa3557a20e4ca239fdd6e78f86ecdf --- src/syng_im/components/chat.cljs | 48 ++++++++++++++++++++++--- src/syng_im/components/chat_styles.cljs | 31 ++++++++++++++++ 2 files changed, 75 insertions(+), 4 deletions(-) diff --git a/src/syng_im/components/chat.cljs b/src/syng_im/components/chat.cljs index 7b5d595add..e11d48e727 100644 --- a/src/syng_im/components/chat.cljs +++ b/src/syng_im/components/chat.cljs @@ -81,20 +81,39 @@ [view nil]] items]) -(defn action-view [{:keys [icon-style handler title subtitle] +(defn action-view [{:keys [icon-style custom-icon handler title subtitle] icon-name :icon}] [touchable-highlight {:on-press (fn [] (dispatch [:set-show-actions false]) - (handler))} + (when handler + (handler)))} [view st/action-icon-row [view st/action-icon-view - [icon icon-name icon-style]] + (or custom-icon + [icon icon-name icon-style])] [view st/action-view [text {:style st/action-title} title] (when-let [subtitle subtitle] [text {:style st/action-subtitle} subtitle])]]]) +(defn menu-item-contact-photo [{:keys [photo-path]}] + [image {:source (if (s/blank? photo-path) + res/user-no-photo + {:uri photo-path}) + :style st/menu-item-profile-contact-photo}]) + +(defn menu-item-contact-online [{:keys [online]}] + (when online + [view st/menu-item-profile-online-view + [view st/menu-item-profile-online-dot-left] + [view st/menu-item-profile-online-dot-right]])) + +(defn menu-item-icon-profile [] + [view st/icon-view + [menu-item-contact-photo {}] + [menu-item-contact-online {:online true}]]) + (defn actions-list-view [] (let [{:keys [group-chat chat-id]} (subscribe [:chat-properties [:group-chat :chat-id]])] @@ -125,10 +144,31 @@ :height 13} :handler (fn [])}] [{:title "Profile" + :custom-icon [menu-item-icon-profile] :icon :menu_group :icon-style {:width 25 :height 19} - :handler #(dispatch [:show-profile @chat-id])}])] + :handler #(dispatch [:show-profile @chat-id])} + {:title "Search chat" + :subtitle "!not implemented" + :icon :search_gray_copy + :icon-style {:width 17 + :height 17} + :handler nil #_#(dispatch + [:show-remove-participants navigator])} + {:title "Notifications and sounds" + :subtitle "!not implemented" + :icon :muted + :icon-style {:width 18 + :height 21} + :handler nil #_#(dispatch [:leave-group-chat + navigator])} + {:title "Settings" + :subtitle "!not implemented" + :icon :settings + :icon-style {:width 20 + :height 13} + :handler (fn [])}])] [view st/actions-wrapper [view st/actions-separator] [view st/actions-view diff --git a/src/syng_im/components/chat_styles.cljs b/src/syng_im/components/chat_styles.cljs index f66e57ed89..43a7aeb373 100644 --- a/src/syng_im/components/chat_styles.cljs +++ b/src/syng_im/components/chat_styles.cljs @@ -167,3 +167,34 @@ (def overlay-highlight {:flex 1}) + +;;----- Menu item Profile ---------------- + +(def menu-item-profile-contact-photo + {:marginTop 13 + :marginLeft 16 + :borderRadius 50 + :width 24 + :height 24}) + +(def menu-item-profile-online-view + {:position :absolute + :top 26 + :left 29 + :width 15 + :height 15 + :borderRadius 50 + :backgroundColor online-color + :borderWidth 2 + :borderColor color-white}) + +(def menu-item-profile-online-dot + {:position :absolute + :top 4 + :width 3 + :height 3 + :borderRadius 50 + :backgroundColor color-white}) + +(def menu-item-profile-online-dot-left (merge menu-item-profile-online-dot {:left 1.7})) +(def menu-item-profile-online-dot-right (merge menu-item-profile-online-dot {:left 6.3}))