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

2
.re-natal
View File

@ -1,7 +1,7 @@
{ {
"name": "StatusIm", "name": "StatusIm",
"interface": "reagent", "interface": "reagent",
"androidHost": "localhost", "androidHost": "10.0.3.2",
"modules": [ "modules": [
"react-native-contacts", "react-native-contacts",
"react-native-invertible-scroll-view", "react-native-invertible-scroll-view",

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

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

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

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

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

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

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

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

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

@ -45,18 +45,28 @@
(def status-container (def status-container
{:margin-left 16 {:margin-left 16
:margin-right 16 :margin-right 16
:flex-direction "row"
:margin-top (if p/ios? 5 5) :margin-top (if p/ios? 5 5)
:align-items :center}) :justify-content :center})
(def status-input (def status-view
{:align-self "stretch" {:height 56
:height 56 :width 200
:font-size 14 :font-size 14
:padding-left 4
:text-align :center :text-align :center
:text-align-vertical :top :text-align-vertical :top
:color text2-color}) :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 (def menu-items-container
{:flex 1 {:flex 1
:margin-top 20 :margin-top 20

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

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

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

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

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

@ -67,13 +67,17 @@
(assoc :style (merge style font)))] (assoc :style (merge style font)))]
ts)))))) ts))))))
(defn text-input [props text] (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 [text-input-class (merge
{:underline-color-android :transparent {:underline-color-android :transparent
:placeholder-text-color st/text2-color :placeholder-text-color st/text2-color
:placeholder "Type" :placeholder "Type"
:value text} :value text}
props)]) (-> opts
(dissoc :font)
(assoc :style (merge style font))))]))
(defn icon (defn icon
([n] (icon n {})) ([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 (ns status-im.components.toolbar.view
(:require [re-frame.core :refer [subscribe dispatch]] (:require [re-frame.core :refer [subscribe dispatch]]
[status-im.components.react :refer [view [status-im.components.react :refer [view
text-input
icon icon
text text
image image

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

@ -4,7 +4,6 @@
[clojure.string :as str] [clojure.string :as str]
[status-im.components.react :refer [view [status-im.components.react :refer [view
text text
text-input
image image
linear-gradient linear-gradient
touchable-highlight]] 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-macros [status-im.utils.views :refer [defview]])
(:require [re-frame.core :refer [subscribe dispatch]] (:require [re-frame.core :refer [subscribe dispatch]]
[clojure.string :as str] [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.discovery.styles :as st]
[status-im.components.status-view.view :refer [status-view]]
[status-im.utils.gfycat.core :refer [generate-gfy]] [status-im.utils.gfycat.core :refer [generate-gfy]]
[status-im.utils.identicon :refer [identicon]] [status-im.utils.identicon :refer [identicon]]
[status-im.i18n :refer [label]]
[status-im.components.chat-icon.screen :as ci] [status-im.components.chat-icon.screen :as ci]
[status-im.utils.platform :refer [platform-specific]] [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 " ")))])
(defview discovery-list-item [{{:keys [name (defview discovery-list-item [{{:keys [name
photo-path photo-path
whisper-id] whisper-id
message-id
status]
:as message} :message :as message} :message
show-separator? :show-separator? show-separator? :show-separator?
{account-photo-path :photo-path {account-photo-path :photo-path
@ -49,7 +35,9 @@
(not (str/blank? contact-name)) contact-name (not (str/blank? contact-name)) contact-name
(not (str/blank? name)) name (not (str/blank? name)) name
:else (generate-gfy))] :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 [view (merge st/popular-list-item-avatar-container
(:icon item-style)) (:icon item-style))
[touchable-highlight {:on-press #(dispatch [:start-chat whisper-id])} [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]] (:require [re-frame.core :refer [subscribe dispatch]]
[status-im.resources :as res] [status-im.resources :as res]
[status-im.components.react :refer [view [status-im.components.react :refer [view
text-input
text text
image image
icon icon

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

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

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

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

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

@ -72,17 +72,27 @@
:margin-left 55 :margin-left 55
:margin-right 55}) :margin-right 55})
(defn status-input [height] (defn status-view [height]
{:align-self "stretch" {:align-self "stretch"
:margin-left (if p/ios? 22 16)
:margin-right 16
:margin-top (if p/ios? 6 1)
:font-size 14 :font-size 14
:height height :height height
:min-height 30 :min-height 30
:text-align "center" :text-align "center"
:color text2-color}) :color text2-color})
(defn status-input [height]
(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 (def btns-container
{:margin-top 0 {:margin-top 0
:flex-direction :row}) :flex-direction :row})

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

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