bigger draggable-box top margin, chat screen overlay

This commit is contained in:
Gustavo Nunes 2017-04-19 00:56:12 -03:00 committed by Roman Volosovskyi
parent 0c7aab902a
commit 84c81002c1
8 changed files with 55 additions and 19 deletions

View File

@ -15,6 +15,10 @@
:bar-style "light-content"
:translucent? true
:color styles/color-transparent}
:overlay {:height 25
:bar-style "dark-content"
:translucent? true
:color styles/color-transparent}
:modal {:height 0
:bar-style "light-content"
:color styles/color-black}}

View File

@ -110,10 +110,11 @@
(defview chat-toolbar []
[show-actions? [:chat-ui-props :show-actions?]
show-chat-overlay? [:show-chat-overlay?]
accounts [:get :accounts]
creating? [:get :creating-account?]]
[view
[status-bar]
[view (when show-chat-overlay? {:style {:zIndex 0}})
[status-bar {:type (if show-chat-overlay? :overlay :default)}]
[toolbar {:hide-nav? (or (empty? accounts) show-actions? creating?)
:custom-content [toolbar-content-view]
:custom-action [toolbar-action]}]
@ -175,6 +176,7 @@
show-actions? [:chat-ui-props :show-actions?]
show-bottom-info? [:chat-ui-props :show-bottom-info?]
show-emoji? [:chat-ui-props :show-emoji?]
show-chat-overlay? [:show-chat-overlay?]
layout-height [:get :layout-height]
input-text [:chat :input-text]]
{:component-did-mount #(dispatch [:check-autorun])
@ -186,6 +188,8 @@
(dispatch [:set-layout-height height]))))}
[chat-toolbar]
[messages-view group-chat]
(when show-chat-overlay?
[view {:style st/result-box-overlay}])
[input/container {:text-empty? (str/blank? input-text)}]
(when show-actions?
[actions-view])

View File

@ -4,8 +4,7 @@
[status-im.utils.platform :as platform]
[taoensso.timbre :as log]))
(def color-root-border "rgba(192, 198, 202, 0.28)")
(def color-root-border-android "#e8eaeb")
(def color-root-border "#e8eaeb")
(def color-input "#edf1f3")
(def color-input-helper-text "rgb(182, 189, 194)")
(def color-input-helper-placeholder "rgb(182, 189, 194)")
@ -22,8 +21,7 @@
:elevation 2
:margin-bottom margin-bottom
:border-top-width 1
:ios {:border-top-color color-root-border}
:android {:border-top-color color-root-border-android}})
:border-top-color color-root-border})
(defn container [container-anim-margin bottom-anim-margin]
{:background-color common/color-white

View File

@ -6,6 +6,7 @@
text1-color
text2-color
text4-color
color-black
color-gray6]]
[status-im.components.toolbar.styles :refer [toolbar-background1]]))
@ -215,3 +216,12 @@
{:text-align :center
:text-align-vertical :center
:color :#7099e6})
(def result-box-overlay
{:background-color color-black
:opacity 0.6
:position :absolute
:top 0
:bottom 0
:left 0
:right 0})

View File

@ -111,6 +111,26 @@
:default
nil)))))
(register-sub
:show-parameter-box?
(fn [db _]
(let [chat-parameter-box (subscribe [:chat-parameter-box])
show-suggestions? (subscribe [:show-suggestions?])
input-text (subscribe [:chat :input-text])
validation-messages (subscribe [:chat-ui-props :validation-messages])]
(reaction (and @chat-parameter-box
(not (str/blank? @input-text))
(not @validation-messages)
(not @show-suggestions?))))))
(register-sub
:show-chat-overlay?
(fn [db _]
(let [show-parameter-box? (subscribe [:show-parameter-box?])
result-box (subscribe [:chat-ui-props :result-box])]
(reaction (or @show-parameter-box?
@result-box)))))
(register-sub
:command-completion
(fn [db [_ chat-id]]

View File

@ -18,14 +18,8 @@
(:hiccup parameter-box)))
(defview parameter-box-view []
[chat-parameter-box [:chat-parameter-box]
show-suggestions? [:show-suggestions?]
input-text [:chat :input-text]
validation-messages [:chat-ui-props :validation-messages]]
(when (and chat-parameter-box
(not (str/blank? input-text))
(not validation-messages)
(not show-suggestions?))
[show-parameter-box? [:show-parameter-box?]]
(when show-parameter-box?
[expandable-view {:key :parameter-box
:draggable? true}
[parameter-box-container]]))
[parameter-box-container]]))

View File

@ -1,16 +1,19 @@
(ns status-im.chat.views.input.utils
(:require [taoensso.timbre :as log]
[status-im.utils.platform :refer [platform-specific]]))
[status-im.components.toolbar-new.styles :as toolbar-st]
[status-im.utils.platform :as p]))
(def min-height 17)
(def default-height 300)
(defn default-container-area-height [bottom screen-height]
(let [status-bar-height (get-in platform-specific [:component-styles :status-bar :default :height])]
(let [status-bar-height (get-in p/platform-specific [:component-styles :status-bar :overlay :height])]
(if (> (+ bottom default-height status-bar-height) screen-height)
(- screen-height bottom status-bar-height)
default-height)))
(defn max-container-area-height [bottom screen-height]
(let [status-bar-height (get-in platform-specific [:component-styles :status-bar :default :height])]
(- screen-height bottom status-bar-height)))
(let [status-bar-height (get-in p/platform-specific [:component-styles :status-bar :overlay :height])
toolbar-height (:height toolbar-st/toolbar)
margin-top (+ status-bar-height (/ toolbar-height 2))]
(- screen-height bottom margin-top)))

View File

@ -13,6 +13,9 @@
:transparent {:height 20
:bar-style "light-content"
:color styles/color-transparent}
:overlay {:height 20
:bar-style "dark-content"
:color styles/color-white}
:modal {:height 20
:bar-style "light-content"
:color "#2f3031"}}