notid/integreat
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

more typeahead improvements.

Browse Source
This commit is contained in:
BC
2019-01-25 06:44:45 -08:00
parent c677d0191f
commit 226a54b7ad
1 changed files with 14 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/cljs/auto_ap/views/components/typeahead.cljs
View File

@@ -3,6 +3,15 @@
[reagent.ratom :as ra] [reagent.ratom :as ra]
[clojure.string :as str])) [clojure.string :as str]))
(defn get-valid-matches [matches not-found-description not-found-value text]
(let [valid-matches (take 5 (for [[[id t :as match] i] (map vector matches (range))
:when (str/includes? (or (some-> t .toLowerCase) "") (or (some-> text .toLowerCase) ""))]
match))
valid-matches (if (and not-found-description text)
(concat valid-matches [[:not-found (not-found-description text) (not-found-value text)]])
valid-matches)]
valid-matches))
(defn typeahead [{:keys [matches on-change field text-field value class not-found-description (defn typeahead [{:keys [matches on-change field text-field value class not-found-description
not-found-value auto-focus]}] not-found-value auto-focus]}]
(let [text (r/atom (or (second (first (filter #(= (first %) value) matches))) "")) (let [text (r/atom (or (second (first (filter #(= (first %) value) matches))) ""))
@@ -18,15 +27,8 @@
] ]
(r/create-class (r/create-class
{:reagent-render (fn [{:keys [matches on-change field text-field value class not-found-description]}] {:reagent-render (fn [{:keys [matches on-change field text-field value class not-found-description]}]
(let [text @text (let [text @text
valid-matches (take 5 (for [[[id t :as match] i] (map vector matches (range)) valid-matches (get-valid-matches matches not-found-description not-found-value text)]
:when (str/includes? (or (some-> t .toLowerCase) "") (or (some-> text .toLowerCase) ""))]
match))
valid-matches (if (and not-found-description text)
(concat valid-matches [[:not-found (not-found-description text) (not-found-value text)]])
valid-matches)]
[:div.typeahead [:div.typeahead
(if @selected (if @selected
[:div.input {:class class [:div.input {:class class
@@ -41,7 +43,6 @@
[:div.tags.has-addons [:div.tags.has-addons
[:span.tag text] [:span.tag text]
[:a.tag.is-delete {:on-click (fn [] (select [nil "" nil]))}]]]] [:a.tag.is-delete {:on-click (fn [] (select [nil "" nil]))}]]]]
[:input.input {:type "text" [:input.input {:type "text"
:class class :class class
:field field :field field
@@ -69,8 +70,9 @@
false) false)
true)) true))
:on-change (fn [e] :on-change (fn [e]
(println valid-matches) (let [new-matches (get-valid-matches matches not-found-description not-found-value (.. e -target -value))]
(reset! highlighted (ffirst valid-matches)) (reset! highlighted (ffirst new-matches)))
(select [nil (.. e -target -value)]))} (select [nil (.. e -target -value)]))}
]) ])
(cond (cond
@@ -78,6 +80,7 @@
(not @selected) (not @selected)
(seq valid-matches)) (seq valid-matches))
(let [h @highlighted] (let [h @highlighted]
[:div.typeahead-menu [:div.typeahead-menu
[:ul [:ul
(for [[id t :as match] valid-matches] (for [[id t :as match] valid-matches]
@@ -85,7 +88,5 @@
"typeahead-highlighted") "typeahead-highlighted")
:on-mouse-down #(do (select match))} t])]]) :on-mouse-down #(do (select match))} t])]])
:else :else
nil)]))}))) nil)]))})))