resolve conflicts between select and swipe on non-editing mode

Also, fix issue that it is hard to move caret on editing mode
pull/5557/head^2
llcc 2022-06-06 15:55:56 +08:00 committed by Tienson Qin
parent 13cc487592
commit cd6e2ca051
1 changed files with 71 additions and 66 deletions

View File

@ -148,16 +148,18 @@
(state/exit-editing-and-set-selected-blocks! blocks))))
(def *swipe (atom nil))
(def *touch-start (atom nil))
(defn on-touch-start
[event uuid]
(let [input (state/get-input)
input-id (state/get-edit-input-id)]
input-id (state/get-edit-input-id)
selection-type (.-type (.getSelection js/document))]
(reset! *touch-start (js/Date.now))
(when-not (and input
(string/ends-with? input-id (str uuid)))
(state/clear-edit!))
(when (= (util/get-selection-start input)
(util/get-selection-end input))
(when (not= selection-type "Range")
(when-let [touches (.-targetTouches event)]
(when (= (.-length touches) 1)
(let [touch (aget touches 0)
@ -168,74 +170,77 @@
(defn on-touch-move
[event block uuid edit? *show-left-menu? *show-right-menu?]
(when-let [touches (.-targetTouches event)]
(when (and (= (.-length touches) 1) @*swipe)
(let [{:keys [x0 xi direction]} @*swipe
touch (aget touches 0)
tx (.-clientX touch)
ty (.-clientY touch)
direction (if (nil? direction)
(if (> tx x0)
:right
:left)
direction)]
(swap! *swipe #(-> %
(assoc :tx tx)
(assoc :ty ty)
(assoc :xi tx)
(assoc :yi ty)
(assoc :direction direction)))
(when (< (* (- xi x0) (- tx xi)) 0)
(swap! *swipe #(-> %
(assoc :x0 tx)
(assoc :y0 ty))))
(let [{:keys [x0 y0]} @*swipe
dx (- tx x0)
dy (- ty y0)]
(when (and (< (. js/Math abs dy) 20)
(> (. js/Math abs dx) 10))
(let [left (gdom/getElement (str "block-left-menu-" uuid))
right (gdom/getElement (str "block-right-menu-" uuid))]
(let [selection-type (.-type (.getSelection js/document))]
(when-not (= selection-type "Range")
(when (< (- (js/Date.now) @*touch-start) 600)
(when (and (= (.-length touches) 1) @*swipe)
(let [{:keys [x0 xi direction]} @*swipe
touch (aget touches 0)
tx (.-clientX touch)
ty (.-clientY touch)
direction (if (nil? direction)
(if (> tx x0)
:right
:left)
direction)]
(swap! *swipe #(-> %
(assoc :tx tx)
(assoc :ty ty)
(assoc :xi tx)
(assoc :yi ty)
(assoc :direction direction)))
(when (< (* (- xi x0) (- tx xi)) 0)
(swap! *swipe #(-> %
(assoc :x0 tx)
(assoc :y0 ty))))
(let [{:keys [x0 y0]} @*swipe
dx (- tx x0)
dy (- ty y0)]
(when (and (< (. js/Math abs dy) 20)
(> (. js/Math abs dx) 10))
(let [left (gdom/getElement (str "block-left-menu-" uuid))
right (gdom/getElement (str "block-right-menu-" uuid))]
(cond
(= direction :right)
(do
(reset! *show-left-menu? true)
(when left
(when (>= dx 0)
(set! (.. left -style -width) (str dx "px")))
(when (< dx 0)
(set! (.. left -style -width) (str (max (+ 40 dx) 0) "px")))
(cond
(= direction :right)
(do
(reset! *show-left-menu? true)
(when left
(when (>= dx 0)
(set! (.. left -style -width) (str dx "px")))
(when (< dx 0)
(set! (.. left -style -width) (str (max (+ 40 dx) 0) "px")))
(let [indent (gdom/getFirstElementChild left)]
(when (indentable? block)
(if (>= (.-clientWidth left) 40)
(set! (.. indent -style -opacity) "100%")
(set! (.. indent -style -opacity) "30%"))))))
(let [indent (gdom/getFirstElementChild left)]
(when (indentable? block)
(if (>= (.-clientWidth left) 40)
(set! (.. indent -style -opacity) "100%")
(set! (.. indent -style -opacity) "30%"))))))
(= direction :left)
(do
(reset! *show-right-menu? true)
(when right
(when (<= dx 0)
(set! (.. right -style -width) (str (- dx) "px")))
(when (> dx 0)
(set! (.. right -style -width) (str (max (- 80 dx) 0) "px")))
(= direction :left)
(do
(reset! *show-right-menu? true)
(when right
(when (<= dx 0)
(set! (.. right -style -width) (str (- dx) "px")))
(when (> dx 0)
(set! (.. right -style -width) (str (max (- 80 dx) 0) "px")))
(let [outdent (gdom/getFirstElementChild right)
more (when-not edit?
(gdom/getLastElementChild right))]
(when (and outdent (outdentable? block))
(if (and (>= (.-clientWidth right) 40)
(< (.-clientWidth right) 80))
(set! (.. outdent -style -opacity) "100%")
(set! (.. outdent -style -opacity) "30%")))
(let [outdent (gdom/getFirstElementChild right)
more (when-not edit?
(gdom/getLastElementChild right))]
(when (and outdent (outdentable? block))
(if (and (>= (.-clientWidth right) 40)
(< (.-clientWidth right) 80))
(set! (.. outdent -style -opacity) "100%")
(set! (.. outdent -style -opacity) "30%")))
(when more
(if (>= (.-clientWidth right) 80)
(set! (.. more -style -opacity) "100%")
(set! (.. more -style -opacity) "30%"))))))
:else
nil))))))))
(when more
(if (>= (.-clientWidth right) 80)
(set! (.. more -style -opacity) "100%")
(set! (.. more -style -opacity) "30%"))))))
:else
nil)))))))))))
(defn on-touch-end
[_event block uuid *show-left-menu? *show-right-menu?]