Răsfoiți Sursa

improve(editor): move editing into center of viewport when editor input out of viewport

charlie 3 ani în urmă
părinte
comite
ddbf0de9f2

+ 6 - 1
src/main/frontend/handler/editor/lifecycle.cljs

@@ -2,6 +2,8 @@
   (:require [frontend.handler.editor :as editor-handler :refer [get-state]]
             [frontend.handler.editor.keyboards :as keyboards-handler]
             [frontend.state :as state]
+            [frontend.util :as util]
+            [frontend.mobile.util :as mobile-util]
             [goog.dom :as gdom]))
 
 (defn did-mount!
@@ -18,7 +20,10 @@
     (js/setTimeout #(keyboards-handler/esc-save! state) 100)
 
     (when-let [element (gdom/getElement id)]
-      (.focus element)))
+      (.focus element)
+      (when (and (util/mobile?)
+                 (not (mobile-util/native-ios?)))
+        (js/setTimeout #(util/make-el-into-viewport element 60) 64))))
   state)
 
 (defn did-remount!

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

@@ -1463,3 +1463,12 @@
             true
             (catch js/Error _e
               false)))))
+
+#?(:cljs
+   (defn make-el-into-viewport
+     [^js/HTMLElement el offset]
+     (let [wrap-height (.-clientHeight js/document.documentElement)
+           target-bottom (.-bottom (.getBoundingClientRect el))]
+       (when (> (+ target-bottom (or (safe-parse-int offset) 0))
+                wrap-height)
+         (.scrollIntoView el #js {:block "center" :behavior "smooth"})))))