Chat name edit form. Fix styles.

This commit is contained in:
virvar 2016-05-13 18:03:45 +03:00
parent 6b54767b98
commit bf6c419c5d
8 changed files with 99 additions and 23 deletions

View File

@ -16,6 +16,7 @@
[syng-im.components.chat.new-participants :refer [new-participants]]
[syng-im.components.chat.remove-participants :refer [remove-participants]]
[syng-im.group-settings.group-settings :refer [group-settings]]
[syng-im.group-settings.views.chat-name-edit :refer [chat-name-edit]]
[syng-im.components.profile :refer [profile my-profile]]
[syng-im.utils.logging :as log]
[syng-im.utils.utils :refer [toast]]
@ -48,6 +49,7 @@
:chat-list [chats-list]
:new-group [new-group]
:group-settings [group-settings]
:chat-name-edit [chat-name-edit]
:contact-list [contact-list]
:chat [chat]
:profile [profile]

View File

@ -2,7 +2,8 @@
(def font "sans-serif")
;; (def font "Avenir-Roman")
(def title-font "sans-serif-medium")
(def font-medium "sans-serif-medium")
(def title-font font-medium)
(def color-blue "#7099e6")
(def color-blue-transparent "#7099e632")

View File

@ -14,7 +14,7 @@
text2-color]]
[syng-im.group-settings.styles.group-settings :as st]
[syng-im.utils.listview :refer [to-realm-datasource]]
[syng-im.group-settings.views.member :refer [contact-inner-view]]
[syng-im.group-settings.views.member :refer [member-view]]
[reagent.core :as r]))
(defn remove-member [{:keys [whisper-identity]}]
@ -36,13 +36,13 @@
[text {:style st/modal-remove-text}
"Remove"]]]]])
(defn set-group-chat-name [chat-name]
(dispatch [:set-group-chat-name chat-name]))
(defn chat-members [members]
[view st/chat-members-container
(for [member members]
^{:key member} [contact-inner-view member])])
^{:key member} [member-view member])])
(defn show-chat-name-edit []
(dispatch [:navigate-to :chat-name-edit]))
(defn chat-icon []
(let [chat-name (subscribe [:get-current-chat-name])]
@ -63,12 +63,13 @@
[new-group-toolbar]
[text {:style st/chat-name-text}
"Chat name"]
[text-input {:style st/chat-name-input
:underlineColorAndroid color-purple
:autoFocus true
:placeholderTextColor text2-color
:onChangeText set-group-chat-name}
[view st/chat-name-value-container
[text {:style st/chat-name-value}
@chat-name]
[touchable-highlight {:style st/chat-name-btn-edit-container
:on-press show-chat-name-edit}
[text {:style st/chat-name-btn-edit-text}
"Edit"]]]
[text {:style st/members-text}
"Members"]
[touchable-highlight {:on-press (fn []

View File

@ -0,0 +1,19 @@
(ns syng-im.group-settings.styles.chat-name-edit
(:require [syng-im.components.styles :refer [font
color-white
text1-color]]))
(def save-action-icon
{:width 18
:height 14})
(def chat-name-container
{:flex 1
:flexDirection :column
:backgroundColor color-white})
(def chat-name-input
{:marginLeft 12
:fontSize 14
:fontFamily font
:color text1-color})

View File

@ -1,5 +1,6 @@
(ns syng-im.group-settings.styles.group-settings
(:require [syng-im.components.styles :refer [font
font-medium
title-font
color-white
color-purple
@ -63,22 +64,42 @@
:marginLeft 16
:marginBottom 16
:color text2-color
:fontFamily font
:fontFamily font-medium
:fontSize 14
:lineHeight 20})
(def chat-name-input
{:marginLeft 12
:fontSize 14
(def chat-name-value-container
{:flexDirection :row
:marginLeft 16
:height 56
:alignItems :center
:justifyContent :center
:borderBottomWidth 1
:borderBottomColor separator-color})
(def chat-name-value
{:flex 1
:fontSize 16
:fontFamily font
:color text1-color})
(def chat-name-btn-edit-container
{:padding 16
:justifyContent :center})
(def chat-name-btn-edit-text
{:marginTop -1
:color text2-color
:fontFamily font
:fontSize 16
:lineHeight 20})
(def members-text
{:marginTop 24
:marginLeft 16
:marginBottom 16
:color text2-color
:fontFamily font
:fontFamily font-medium
:fontSize 14
:lineHeight 20})
@ -90,15 +111,14 @@
:height 17})
(def add-members-container
{:flexDirection :row
:marginBottom 16})
{:flexDirection :row})
(def add-members-text
{:marginTop 18
:marginLeft 32
:color text2-color
:fontFamily font
:fontSize 14
:fontSize 16
:lineHeight 20})
(def settings-text
@ -106,6 +126,6 @@
:marginLeft 16
:marginBottom 16
:color text2-color
:fontFamily font
:fontFamily font-medium
:fontSize 14
:lineHeight 20})

View File

@ -0,0 +1,33 @@
(ns syng-im.group-settings.views.chat-name-edit
(:require [reagent.core :as r]
[re-frame.core :refer [subscribe dispatch dispatch-sync]]
[syng-im.components.react :refer [view text-input]]
[syng-im.components.toolbar :refer [toolbar]]
[syng-im.group-settings.styles.chat-name-edit :as st]
[syng-im.components.styles :refer [toolbar-background2
text2-color]]))
(defn save-group-chat-name [chat-name]
(dispatch [:set-group-chat-name chat-name])
(dispatch [:navigate-back]))
(defn chat-name-edit-toolbar [chat-name]
[toolbar {:background-color toolbar-background2
:title "Edit chat name"
;; TODO change to dark 'ok' icon
:action {:image {:source {:uri :icon_ok}
:style st/save-action-icon}
:handler #(save-group-chat-name chat-name)}}])
(defn chat-name-edit []
(let [current-chat-name (subscribe [:get-current-chat-name])
chat-name (r/atom @current-chat-name)]
(fn []
[view st/chat-name-container
[chat-name-edit-toolbar @chat-name]
[text-input {:style st/chat-name-input
:autoFocus true
:placeholderTextColor text2-color
:onChangeText (fn [text]
(reset! chat-name text))}
@chat-name]])))

View File

@ -22,7 +22,7 @@
[view st/online-dot-left]
[view st/online-dot-right]]))
(defn contact-inner-view [{:keys [whisper-identity name photo-path online role]}]
(defn member-view [{:keys [whisper-identity name photo-path online role]}]
[view st/contact-container
[view st/photo-container
[contact-photo {:photo-path photo-path}]

View File

@ -94,7 +94,7 @@
(register-sub :get-current-chat-name
(fn [db _]
(let [current-chat-id (current-chat-id @db)]
(reaction (get-in @db (db/chat-name-path current-chat-id :name))))))
(reaction (get-in @db (db/chat-name-path current-chat-id))))))
;; -- User data --------------------------------------------------------------