From 87013d20f8dc7a540b780967f62a1a844e0eef41 Mon Sep 17 00:00:00 2001 From: Alf Eaton Date: Tue, 4 Jul 2023 11:10:19 +0100 Subject: [PATCH] Revert "[cm6] Show "move" cursor when the selection is ready to be dragged (#13532)" (#13673) This reverts commit 1a89abceeadb6e1c53b4bc779df19b6723eab738. GitOrigin-RevId: 05025068f75f1012626359230952e252e941d675 --- .../extensions/draggable-cursor.ts | 64 ------------------- .../source-editor/extensions/index.ts | 3 - .../extensions/visual/utils/selection.ts | 29 --------- 3 files changed, 96 deletions(-) delete mode 100644 services/web/frontend/js/features/source-editor/extensions/draggable-cursor.ts delete mode 100644 services/web/frontend/js/features/source-editor/extensions/visual/utils/selection.ts diff --git a/services/web/frontend/js/features/source-editor/extensions/draggable-cursor.ts b/services/web/frontend/js/features/source-editor/extensions/draggable-cursor.ts deleted file mode 100644 index a29f8dd998..0000000000 --- a/services/web/frontend/js/features/source-editor/extensions/draggable-cursor.ts +++ /dev/null @@ -1,64 +0,0 @@ -import { Extension } from '@codemirror/state' -import { EditorView, ViewPlugin } from '@codemirror/view' -import { isInPrimarySelection } from './visual/utils/selection' - -const showDraggable = { style: 'cursor: move' } - -/** - * An extension that changes the cursor style to "move" when the main mouse button - * is held down on the primary selection for a short amount of time. - */ -export const draggableCursor = (): Extension => { - let timer: number | undefined - - const plugin = ViewPlugin.define( - view => { - return { - isActive: false, - set(isActive: boolean) { - if (this.isActive !== isActive) { - this.isActive = isActive - view.update([]) - } - }, - } - }, - { - eventHandlers: { - mousedown(event, view) { - if (timer) { - window.clearTimeout(timer) - } - // single click with the main mouse button - if (event.detail === 1 && event.button === 0) { - timer = window.setTimeout(() => { - timer = undefined - if (isInPrimarySelection(event, view)) { - this.set(true) - } - }, 50) - } - }, - mouseup() { - if (timer) { - window.clearTimeout(timer) - } - this.set(false) - }, - dragstart() { - if (timer) { - window.clearTimeout(timer) - } - this.set(false) - }, - }, - } - ) - - return [ - plugin, - EditorView.contentAttributes.of(view => - view.plugin(plugin)?.isActive ? showDraggable : null - ), - ] -} diff --git a/services/web/frontend/js/features/source-editor/extensions/index.ts b/services/web/frontend/js/features/source-editor/extensions/index.ts index 7f6b01022c..2f9a017039 100644 --- a/services/web/frontend/js/features/source-editor/extensions/index.ts +++ b/services/web/frontend/js/features/source-editor/extensions/index.ts @@ -46,7 +46,6 @@ import { shortcuts } from './shortcuts' import { effectListeners } from './effect-listeners' import { highlightSpecialChars } from './highlight-special-chars' import { toolbarPanel } from './toolbar/toolbar-panel' -import { draggableCursor } from './draggable-cursor' import { geometryChangeEvent } from './geometry-change-event' import { isSplitTestEnabled } from '../../../utils/splitTestUtils' @@ -79,8 +78,6 @@ export const createExtensions = (options: Record): Extension[] => [ indentationMarkers(options.visual.visual), bracketMatching(), bracketSelection(), - // NOTE: `draggableCursor` needs to be before `crosshairCursor`, so it takes precedence when Alt is held down. - draggableCursor(), // A built-in extension that enables rectangular selections, created by dragging a new selection while holding down Alt. rectangularSelection(), // A built-in extension that turns the pointer into a crosshair while Alt is pressed. diff --git a/services/web/frontend/js/features/source-editor/extensions/visual/utils/selection.ts b/services/web/frontend/js/features/source-editor/extensions/visual/utils/selection.ts deleted file mode 100644 index 71dfedd921..0000000000 --- a/services/web/frontend/js/features/source-editor/extensions/visual/utils/selection.ts +++ /dev/null @@ -1,29 +0,0 @@ -/** - * Adapted from the "isInPrimarySelection" function in CodeMirror 6, licensed under the MIT license: - * https://github.com/codemirror/view/blob/main/src/input.ts - */ - -import { EditorView } from '@codemirror/view' - -export function isInPrimarySelection( - event: MouseEvent | undefined, - view?: EditorView -) { - if (!event) return false - if (view?.state.selection.main.empty) return false - - const selection = document.getSelection() - if (!selection || selection.rangeCount === 0) return true - - const rects = selection.getRangeAt(0).getClientRects() - for (const rect of rects) { - if ( - rect.left <= event.clientX && - rect.right >= event.clientX && - rect.top <= event.clientY && - rect.bottom >= event.clientY - ) - return true - } - return false -}