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

Blue hashtags (#435), other small status-related fixes

This commit is contained in:
Alexander Pantyukhov 2016-11-21 15:45:44 +03:00 committed by Alexander Pantyukhov
parent 4c876587ed
commit deaafded22
19 changed files with 150 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.re-natal
View File

@ -1,7 +1,7 @@
{
"name": "StatusIm",
"interface": "reagent",
"androidHost": "localhost",
"androidHost": "10.0.3.2",
"modules": [
"react-native-contacts",
"react-native-invertible-scroll-view",
@ -43,4 +43,4 @@
"dev": "env/dev",
"prod": "env/prod"
}
}
}

4
src/status_im/accounts/login/screen.cljs
View File

@ -3,7 +3,6 @@
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
text
text-input
image
linear-gradient
touchable-highlight
@ -18,8 +17,7 @@
icon-search
icon-back
icon-qr
button-input
white-form-text-input]]
button-input]]
[status-im.i18n :refer [label]]
[status-im.accounts.login.styles :as st]))

1
src/status_im/accounts/recover/screen.cljs
View File

@ -3,7 +3,6 @@
(:require [re-frame.core :refer [subscribe dispatch dispatch-sync]]
[status-im.components.react :refer [view
text
text-input
image
linear-gradient
touchable-highlight]]

2
src/status_im/android/platform.cljs
View File

@ -27,7 +27,7 @@
:margin-top 2
:margin-bottom 4
:margin-right 2
:elevation 3}
:elevation 2}
:tag {:flex-direction "column"
:background-color "#7099e619"
:border-radius 5

1
src/status_im/chat/views/command.cljs
View File

@ -4,7 +4,6 @@
[status-im.components.react :refer [view
icon
text
text-input
touchable-highlight]]
[status-im.chat.styles.input :as st]))

1
src/status_im/chat/views/response.cljs
View File

@ -8,7 +8,6 @@
icon
image
text
text-input
touchable-highlight
web-view
scroll-view]]

26
src/status_im/components/drawer/styles.cljs
View File

@ -43,20 +43,30 @@
:text-align :center})
(def status-container
{:margin-left 16
:margin-right 16
:margin-top (if p/ios? 5 5)
:align-items :center})
{:margin-left 16
:margin-right 16
:flex-direction "row"
:margin-top (if p/ios? 5 5)
:justify-content :center})
(def status-input
{:align-self "stretch"
:height 56
(def status-view
{:height 56
:width 200
:font-size 14
:padding-left 4
:text-align :center
:text-align-vertical :top
:color text2-color})
(def status-input
(merge status-view
{:padding-left 4
:padding-top (if p/ios? 0 5)}))
(def status-text
(merge status-view
{:padding-left 0
:padding-top 5}))
(def menu-items-container
{:flex 1
:margin-top 20

49
src/status_im/components/drawer/view.cljs
View File

@ -12,10 +12,12 @@
touchable-without-feedback
touchable-opacity]]
[status-im.components.text-field.view :refer [text-field]]
[status-im.components.status-view.view :refer [status-view]]
[status-im.components.drawer.styles :as st]
[status-im.profile.validations :as v]
[status-im.resources :as res]
[status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.utils.utils :refer [clean-text]]
[status-im.i18n :refer [label]]
[status-im.components.react :refer [dismiss-keyboard!]]
[clojure.string :as str]
@ -39,18 +41,13 @@
:font :default}
name]])
(defn clean-text [s]
(-> s
(str/replace #"\n" " ")
(str/replace #"\r" "")
(str/trim)))
(defn drawer-menu []
(let
[account (subscribe [:get-current-account])
profile (subscribe [:get :profile-edit])
keyboard-height (subscribe [:get :keyboard-height])
placeholder (generate-gfy)]
placeholder (generate-gfy)
status-edit? (r/atom false)]
(fn []
(let [{:keys [name photo-path status]} @account
{new-name :name new-status :status} @profile]
@ -73,19 +70,28 @@
:on-end-editing #(when (and new-name (not (str/blank? new-name)))
(dispatch [:account-update {:name (clean-text new-name)}]))}]]
[view st/status-container
[text-input {:style st/status-input
:editable true
:multiline true
:blur-on-submit true
:maxLength 140
:accessibility-label :input
:placeholder (label :t/profile-no-status)
:on-change-text #(dispatch [:set-in [:profile-edit :status] %])
:on-blur (fn []
(when (and new-status (not (str/blank? new-status)))
(dispatch [:check-status-change (clean-text new-status)])
(dispatch [:account-update {:status (clean-text new-status)}])))
:default-value status}]]
(if @status-edit?
[text-input {:style st/status-input
:editable true
:multiline true
:auto-focus true
:blur-on-submit true
:focus status-edit?
:maxLength 140
:accessibility-label :input
:placeholder (label :t/profile-no-status)
:on-change-text (fn [t]
(dispatch [:set-in [:profile-edit :status] (clean-text t)]))
:on-submit-editing (fn []
(reset! status-edit? false)
(when (and new-status (not (str/blank? new-status)))
(dispatch [:check-status-change (clean-text new-status)])
(dispatch [:account-update {:status (clean-text new-status)}])))
:default-value status}]
[status-view {:style st/status-text
:on-press #(reset! status-edit? true)
:number-of-lines 3
:status status}])]
[view st/menu-items-container
[menu-item {:name (label :t/profile)
:handler #(dispatch [:navigate-to :my-profile])}]
@ -96,8 +102,7 @@
[menu-item {:name (label :t/discovery)
:handler #(dispatch [:navigate-to :discovery])}]
[menu-item {:name (label :t/contacts)
:handler #(dispatch [:navigate-to :contact-list])}]
]
:handler #(dispatch [:navigate-to :contact-list])}]]
(when (zero? @keyboard-height)
[text {:style st/feedback
:font :default} (label :t/feedback)])

1
src/status_im/components/main_tabs.cljs
View File

@ -5,7 +5,6 @@
[reagent.core :as r]
[status-im.components.react :refer [view
animated-view
text-input
text
image
touchable-highlight

18
src/status_im/components/react.cljs
View File

@ -67,13 +67,17 @@
(assoc :style (merge style font)))]
ts))))))
(defn text-input [props text]
[text-input-class (merge
{:underline-color-android :transparent
:placeholder-text-color st/text2-color
:placeholder "Type"
:value text}
props)])
(defn text-input [{:keys [font style] :as opts
:or {font :default}} text]
(let [font (get-in platform-specific [:fonts (keyword font)])]
[text-input-class (merge
{:underline-color-android :transparent
:placeholder-text-color st/text2-color
:placeholder "Type"
:value text}
(-> opts
(dissoc :font)
(assoc :style (merge style font))))]))
(defn icon
([n] (icon n {}))

28
src/status_im/components/status_view/view.cljs Normal file
View File

@ -0,0 +1,28 @@
(ns status-im.components.status-view.view
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch]]
[clojure.string :as str]
[status-im.components.react :refer [view text]]
[status-im.utils.platform :refer [platform-specific]]))
(defn tag-view [tag]
[text {:style {:color "#7099e6"}
:font :medium}
(str tag " ")])
(defn status-view [{:keys [style
message-id
status
on-press
number-of-lines]
:or {message-id "msg"}}]
[text {:style style
:on-press on-press
:number-of-lines number-of-lines
:font :default}
(for [[i status] (map-indexed vector (str/split status #" "))]
(if (.startsWith status "#")
^{:key (str "item-" message-id "-" i)}
[tag-view status]
^{:key (str "item-" message-id "-" i)}
(str status " ")))])

1
src/status_im/components/toolbar/view.cljs
View File

@ -1,7 +1,6 @@
(ns status-im.components.toolbar.view
(:require [re-frame.core :refer [subscribe dispatch]]
[status-im.components.react :refer [view
text-input
icon
text
image

1
src/status_im/contacts/views/new_contact.cljs
View File

@ -4,7 +4,6 @@
[clojure.string :as str]
[status-im.components.react :refer [view
text
text-input
image
linear-gradient
touchable-highlight]]

30
src/status_im/discovery/views/discovery_list_item.cljs
View File

@ -2,33 +2,19 @@
(:require-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch]]
[clojure.string :as str]
[status-im.components.react :refer [view text image touchable-highlight]]
[status-im.components.react :refer [view text touchable-highlight]]
[status-im.discovery.styles :as st]
[status-im.components.status-view.view :refer [status-view]]
[status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.utils.identicon :refer [identicon]]
[status-im.i18n :refer [label]]
[status-im.components.chat-icon.screen :as ci]
[status-im.utils.platform :refer [platform-specific]]
[taoensso.timbre :as log]))
(defn tag-view [tag]
[text {:style {:color "#7099e6"}
:font :medium}
(str tag " ")])
(defn status-view [item-style {:keys [message-id status]}]
[text {:style (:status-text item-style)
:font :default}
(for [[i status] (map-indexed vector (str/split status #" "))]
(if (.startsWith status "#")
^{:key (str "item-" message-id "-" i)}
[tag-view status]
^{:key (str "item-" message-id "-" i)}
(str status " ")))])
[status-im.utils.platform :refer [platform-specific]]))
(defview discovery-list-item [{{:keys [name
photo-path
whisper-id]
whisper-id
message-id
status]
:as message} :message
show-separator? :show-separator?
{account-photo-path :photo-path
@ -49,7 +35,9 @@
(not (str/blank? contact-name)) contact-name
(not (str/blank? name)) name
:else (generate-gfy))]
[status-view item-style message]]
[status-view {:id message-id
:style (:status-text item-style)
:status status}]]
[view (merge st/popular-list-item-avatar-container
(:icon item-style))
[touchable-highlight {:on-press #(dispatch [:start-chat whisper-id])}

1
src/status_im/new_group/screen.cljs
View File

@ -3,7 +3,6 @@
(:require [re-frame.core :refer [subscribe dispatch]]
[status-im.resources :as res]
[status-im.components.react :refer [view
text-input
text
image
icon

1
src/status_im/participants/views/remove.cljs
View File

@ -3,7 +3,6 @@
(:require [re-frame.core :refer [subscribe dispatch]]
[status-im.resources :as res]
[status-im.components.react :refer [view
text-input
text
image
touchable-highlight

54
src/status_im/profile/screen.cljs
View File

@ -21,6 +21,7 @@
[status-im.components.status-bar :refer [status-bar]]
[status-im.components.text-field.view :refer [text-field]]
[status-im.components.selectable-field.view :refer [selectable-field]]
[status-im.components.status-view.view :refer [status-view]]
[status-im.utils.phone-number :refer [format-phone-number]]
[status-im.utils.image-processing :refer [img->base64]]
[status-im.utils.platform :refer [platform-specific]]
@ -28,9 +29,9 @@
[status-im.profile.validations :as v]
[status-im.profile.styles :as st]
[status-im.utils.random :refer [id]]
[status-im.utils.utils :refer [clean-text]]
[status-im.components.image-button.view :refer [show-qr-button]]
[status-im.i18n :refer [label]]
[taoensso.timbre :as log]))
[status-im.i18n :refer [label]]))
(defn toolbar [{:keys [account edit?]}]
(let [profile-edit-data-valid? (s/valid? ::v/profile account)]
@ -56,22 +57,10 @@
:style (st/ok-btn-icon profile-edit-data-valid?)}]
[icon :dots st/edit-btn-icon])]]]))
(defn- get-text
[word]
(let [props (merge {:key (id)}
(if (str/starts-with? word "#")
{:style st/hashtag}
{}))]
[text props (str word " ")]))
(defn- highlight-tags
[status]
(->>
(str/split status #" ")
(map get-text)))
(defn status-image-view [_]
(let [component (r/current-component)
just-opened? (r/atom true)
input-ref (r/atom nil)
set-status-height #(let [height (-> (.-nativeEvent %)
(.-contentSize)
(.-height))]
@ -102,15 +91,23 @@
:wrapper-style st/username-wrapper
:value name
:on-change-text #(dispatch [:set-in [:profile-edit :name] %])}]
[text-input {:style (st/status-input (:height (r/state component)))
:on-change #(set-status-height %)
:on-content-size-change #(set-status-height %)
:maxLength 140
:multiline true
:editable edit?
:placeholder (label :t/profile-no-status)
:on-change-text #(dispatch [:set-in [:profile-edit :status] %])
:default-value status}]])})))
(if (or edit? @just-opened?)
[text-input {:ref #(reset! input-ref %)
:style (st/status-input (:height (r/state component)))
:multiline true
:editable true
:blur-on-submit true
:on-content-size-change #(do (set-status-height %)
(reset! just-opened? false))
:max-length 140
:placeholder (label :t/profile-no-status)
:on-change-text (fn [t]
(dispatch [:set-in [:profile-edit :status] (clean-text t)]))
:on-submit-editing (fn []
(.blur @input-ref))
:default-value status}]
[status-view {:style (st/status-text (:height (r/state component)))
:status status}])])})))
(defview profile []
[{whisper-identity :whisper-identity
@ -189,9 +186,10 @@
changed-account [:get :profile-edit]]
(let [{:keys [phone
address
public-key] :as account} (if edit?
changed-account
current-account)]
public-key]
:as account} (if edit?
changed-account
current-account)]
[scroll-view {:style st/profile
:bounces false}
[status-bar]

28
src/status_im/profile/styles.cljs
View File

@ -72,16 +72,26 @@
:margin-left 55
:margin-right 55})
(defn status-view [height]
{:align-self "stretch"
:font-size 14
:height height
:min-height 30
:text-align "center"
:color text2-color})
(defn status-input [height]
{:align-self "stretch"
:margin-left (if p/ios? 22 16)
:margin-right 16
:margin-top (if p/ios? 6 1)
:font-size 14
:height height
:min-height 30
:text-align "center"
:color text2-color})
(merge (status-view height)
{:margin-left (if p/ios? 21 16)
:margin-right 16
:margin-top (if p/ios? 6 1)}))
(defn status-text [height]
(merge (status-view (- height (if p/ios? 5 10)))
{:margin-left 18
:margin-right 18
:margin-top 11
:margin-bottom 0}))
(def btns-container
{:margin-top 0

9
src/status_im/utils/utils.cljs
View File

@ -1,6 +1,7 @@
(ns status-im.utils.utils
(:require [status-im.constants :as const]
[reagent.core :as r]))
[reagent.core :as r]
[clojure.string :as str]))
(defn require [module]
(if (exists? js/window)
@ -54,6 +55,12 @@
(str (subs s 0 (- max 3)) "...")
s))
(defn clean-text [s]
(-> s
(str/replace #"\n" " ")
(str/replace #"\r" "")
(str/trim)))
(defn first-index
[cond coll]
(loop [index 0