Browse Source

refactor(editor): add nearest-scrollable-container util fn

Andelf 2 years ago
parent
commit
f6211c77b7

+ 3 - 2
src/main/frontend/commands.cljs

@@ -414,10 +414,11 @@
     (state/set-edit-content! (state/get-edit-input-id)
                              (str prefix value))
     ;; HACK: save scroll-pos of current pos, then add trailing content
-    (let [scroll-pos (.-scrollTop (gdom/getElement "main-content-container"))]
+    (let [scroll-container (util/nearest-scrollable-container input)
+          scroll-pos (.-scrollTop scroll-container)]
       (state/set-block-content-and-last-pos! id new-value new-pos)
       (cursor/move-cursor-to input new-pos)
-      (set! (.-scrollTop (gdom/getElement "main-content-container")) scroll-pos)
+      (set! (.-scrollTop scroll-container) scroll-pos)
       (when check-fn
         (check-fn new-value (dec (count prefix)) new-pos)))))
 

+ 3 - 2
src/main/frontend/handler/editor.cljs

@@ -2226,11 +2226,12 @@
        (state/set-edit-content! (state/get-edit-input-id)
                                 (str s1 insertion))
        ;; HACK: save scroll-pos of current pos, then add trailing content
-       (let [scroll-pos (.-scrollTop (gdom/getElement "main-content-container"))]
+       (let [scroll-container (util/nearest-scrollable-container input)
+             scroll-pos (.-scrollTop scroll-container)]
          (state/set-edit-content! (state/get-edit-input-id)
                                   (str s1 insertion s2))
          (cursor/move-cursor-to input (+ selected-start (count insertion)))
-         (set! (.-scrollTop (gdom/getElement "main-content-container")) scroll-pos))))))
+         (set! (.-scrollTop scroll-container) scroll-pos))))))
 
 (defn- keydown-new-line
   "Insert newline to current cursor position"

+ 7 - 0
src/main/frontend/util.cljc

@@ -398,6 +398,13 @@
    (defn stop-propagation [e]
      (when e (.stopPropagation e))))
 
+#?(:cljs
+   (defn nearest-scrollable-container [^js/HTMLElement element]
+     (some #(when-let [overflow-y (.-overflowY (js/window.getComputedStyle %))]
+              (when (contains? #{"auto" "scroll" "overlay"} overflow-y)
+                %))
+           (take-while (complement nil?) (iterate #(.-parentElement %) element)))))
+
 #?(:cljs
    (defn element-top [elem top]
      (when elem