Hard-coding an ID is brittle. The submission event has a reference
to the form that triggered the event in its "target" attribute.
We pass this reference through the event handlers so that
we can eventually call "scrollIntoView" on it.
... | ... |
@@ -31,19 +31,18 @@ |
31 | 31 |
:else {:err (str "Unknown command '" cmdline "'")}))) |
32 | 32 |
|
33 | 33 |
(re-frame/reg-fx |
34 |
- :window/scroll-to-prompt |
|
35 |
- (fn [] |
|
36 |
- (-> js/document |
|
37 |
- (.getElementById "prompt") |
|
38 |
- (.scrollIntoView (clj->js {:behavior :smooth}))))) |
|
34 |
+ :window/scroll-to |
|
35 |
+ (fn [element] |
|
36 |
+ (.scrollIntoView element (clj->js {:behavior :smooth})))) |
|
39 | 37 |
|
40 | 38 |
(re-frame/reg-event-fx |
41 |
- ::scroll-to-prompt |
|
42 |
- (fn [] {:window/scroll-to-prompt []})) |
|
39 |
+ ::scroll-to |
|
40 |
+ (fn [_ [_ x]] |
|
41 |
+ {:window/scroll-to x})) |
|
43 | 42 |
|
44 | 43 |
(re-frame/reg-event-fx |
45 | 44 |
::submit-cmd |
46 |
- (fn [cofx _] |
|
45 |
+ (fn [cofx [_ prompt]] |
|
47 | 46 |
(let [db (cofx :db) |
48 | 47 |
cmdline (some-> db :cmdline :current trim) |
49 | 48 |
not-empty? seq] |
... | ... |
@@ -59,4 +58,4 @@ |
59 | 58 |
{:input cmdline :output output})))) |
60 | 59 |
; dispatch-later to ensure that the DOM has already been updated, |
61 | 60 |
; so that scrollMaxY has been changed appropriately. |
62 |
- :fx [[:dispatch-later {:ms 10 :dispatch [::scroll-to-prompt]}]]}))) |
|
61 |
+ :fx [[:dispatch-later {:ms 10 :dispatch [::scroll-to prompt]}]]}))) |
... | ... |
@@ -12,8 +12,8 @@ |
12 | 12 |
update-cmdline #(re-frame/dispatch-sync |
13 | 13 |
[::events/update-cmdline (-> % .-target .-value)]) |
14 | 14 |
submit-cmd #(do (.preventDefault %) |
15 |
- (re-frame/dispatch [::events/submit-cmd]))] |
|
16 |
- [:form {:id "prompt" :class (styles/prompt-style) |
|
15 |
+ (re-frame/dispatch [::events/submit-cmd (-> % .-target)]))] |
|
16 |
+ [:form {:class (styles/prompt-style) |
|
17 | 17 |
:on-submit submit-cmd} |
18 | 18 |
[:input {:value @cmdline |
19 | 19 |
:on-change update-cmdline |