@lvce-editor/server 0.10.7 → 0.11.0

package/static/73a0912/packages/renderer-process/src/parts/Editor/EditorEvents.js

@@ -1,442 +0,0 @@
-// TODO so many things in this file
-
-import * as Focus from '../Focus/Focus.js'
-import * as InputEventType from '../InputEventType/InputEventType.js'
-import * as MenuEntryId from '../MenuEntryId/MenuEntryId.js'
-import * as ModifierKey from '../ModifierKey/ModifierKey.js'
-import * as MouseEventType from '../MouseEventType/MouseEventType.js'
-import * as RendererWorker from '../RendererWorker/RendererWorker.js'
-import * as WheelEventType from '../WheelEventType/WheelEventType.js'
-// TODO go back to edit mode after pressing escape so screenreaders can navigate https://stackoverflow.com/questions/53909477/how-to-handle-tabbing-for-accessibility-with-a-textarea-that-uses-the-tab-button
-
-// TODO tree shake out mobile support when targeting electron -> less code -> less event listeners -> less memory -> less cpu
-
-export const handleContextMenu = (event) => {
-  event.preventDefault()
-  const { clientX, clientY } = event
-  RendererWorker.send(
-    /* ContextMenu.show */ 'ContextMenu.show',
-    /* x */ clientX,
-    /* y */ clientY,
-    /* id */ MenuEntryId.Editor
-  )
-}
-
-export const handleFocus = (event) => {
-  Focus.setFocus('EditorText')
-}
-
-export const handleBlur = (event) => {
-  // needed for save on blur
-  // also needed to close completions on blur
-  RendererWorker.send(/* EditorBlur.editorBlur */ 'Editor.blur')
-}
-
-/**
- *
- * @param {InputEvent} event
- */
-export const handleBeforeInput = (event) => {
-  event.preventDefault()
-  switch (event.inputType) {
-    case InputEventType.InsertText:
-      RendererWorker.send(
-        /* Editor.type */ 'Editor.type',
-        /* text */ event.data
-      )
-      break
-    default:
-      break
-  }
-  // if (!event.data) {
-  //   return
-  // }
-}
-
-// TODO composition should be better supported,
-// for example
-// - gedit draws a line below the composed text
-// - codemirror 6 also draws that line
-// - codemirror 5 also draws that line
-// - vscode does not draw a line, but displays characters during composition
-
-export const handleCompositionStart = (event) => {
-  RendererWorker.send(
-    /* Editor.compositionStart */ 'Editor.compositionStart',
-    /* text */ event.data
-  )
-}
-
-export const handleCompositionUpdate = (event) => {
-  RendererWorker.send(
-    /* Editor.compositionUpdate */ 'Editor.compositionUpdate',
-    /* text */ event.data
-  )
-}
-
-export const handleCompositionEnd = (event) => {
-  RendererWorker.send(
-    /* Editor.compositionEnd */ 'Editor.compositionEnd',
-    /* text */ event.data
-  )
-}
-
-export const handleCut = (event) => {
-  event.preventDefault()
-  RendererWorker.send(/* Editor.cut */ 'Editor.cut')
-}
-
-export const handleSelectionMove = (event) => {
-  const x = event.clientX
-  const y = event.clientY
-  const totalOffset = getTotalOffset(event)
-  if (event.altKey) {
-    RendererWorker.send(
-      /* Editor.moveRectangleSelectionPx */ 'Editor.moveRectangleSelectionPx',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ totalOffset
-    )
-  } else {
-    RendererWorker.send(
-      /* Editor.moveSelectionPx */ 'Editor.moveSelectionPx',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ totalOffset
-    )
-  }
-}
-
-export const handleSelectionDone = (event) => {
-  document.removeEventListener('mousemove', handleSelectionMove)
-  document.removeEventListener('mouseup', handleSelectionDone)
-}
-
-const getModifier = (event) => {
-  if (event.ctrlKey) {
-    return ModifierKey.Ctrl
-  }
-  if (event.altKey) {
-    return ModifierKey.Alt
-  }
-  return ModifierKey.None
-}
-
-export const handleSingleClick = (event, x, y, offset) => {
-  const modifier = getModifier(event)
-  RendererWorker.send(
-    /* Editor.handleSingleClick */ 'Editor.handleSingleClick',
-    /* modifier */ modifier,
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  )
-  const $Target = event.target
-  // const $InputBox = $Target.closest('.Editor').firstElementChild
-  // $InputBox.focus()
-  // TODO this logic should be in renderer worker
-  document.addEventListener('mousemove', handleSelectionMove, { passive: true })
-  document.addEventListener('mouseup', handleSelectionDone)
-}
-
-export const handleDoubleClick = (event, x, y, offset) => {
-  RendererWorker.send(
-    /* Editor.handleDoubleClick */ 'Editor.handleDoubleClick',
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  )
-}
-
-export const handleTripleClick = (event, x, y, offset) => {
-  RendererWorker.send(
-    /* Editor.handleTripleClick */ 'Editor.handleTripleClick',
-    /* x */ x,
-    /* y */ y,
-    /* offset */ offset
-  )
-}
-
-const isRightClick = (event) => {
-  return event.button === MouseEventType.RightClick
-}
-
-const getTextNodeOffset = (textNode) => {
-  let $Token = textNode.parentElement
-  let offset = 0
-  while ($Token.previousSibling) {
-    $Token = $Token.previousSibling
-    offset += $Token.textContent.length
-  }
-  return offset
-}
-
-const getTotalOffset = (event) => {
-  if (document.caretRangeFromPoint) {
-    // chrome uses deprecated version
-    const range = document.caretRangeFromPoint(event.clientX, event.clientY)
-    if (!range) {
-      return 0
-    }
-    const textNode = range.startContainer
-    const textNodeOffset = getTextNodeOffset(textNode)
-    const offset = range.startOffset
-    const totalOffset = textNodeOffset + offset
-    return totalOffset
-    // @ts-ignore
-  }
-  // @ts-ignore
-  if (document.caretPositionFromPoint) {
-    // firefox uses new version
-    // @ts-ignore
-    const range = document.caretPositionFromPoint(event.clientX, event.clientY)
-    if (!range) {
-      return 0
-    }
-    const textNode = range.offsetNode
-    const textNodeOffset = getTextNodeOffset(textNode)
-    const offset = range.offset
-    const totalOffset = textNodeOffset + offset
-    return totalOffset
-  }
-  throw new Error('caret position is not supported')
-}
-
-export const handleMouseDown = (event) => {
-  if (isRightClick(event)) {
-    return
-  }
-  event.preventDefault()
-  const totalOffset = getTotalOffset(event)
-  const x = event.clientX
-  const y = event.clientY
-  switch (event.detail) {
-    case 1:
-      handleSingleClick(event, x, y, totalOffset)
-      break
-    case 2:
-      handleDoubleClick(event, x, y, totalOffset)
-      break
-    case 3:
-      handleTripleClick(event, x, y, totalOffset)
-      break
-    default:
-      break
-  }
-}
-
-// TODO figure out whether it is possible to register hover provider without mousemove
-// mousemove handler is called very often and could slow down editor / drain battery
-
-// disabled for now because of constant cpu usage on mousemove
-// bad for performance
-export const handlePointerMove = (event) => {
-  const x = event.clientX
-  const y = event.clientY
-  if (event.altKey) {
-    const offset = getTotalOffset(event)
-    RendererWorker.send(
-      /* Editor.handleMouseMoveWithAltKey */ 'Editor.handleMouseMoveWithAltKey',
-      /* x */ x,
-      /* y */ y,
-      /* offset */ offset
-    )
-  }
-  // console.log(event.altKey)
-  // RendererWorker.send(/* Editor.handleMouseMove */ 389, /* x */ x, /* y */ y)
-}
-
-/**
- *
- * @param {WheelEvent} event
- */
-export const handleWheel = (event) => {
-  const { deltaMode, deltaY } = event
-  // event.preventDefault()
-  // const state = EditorHelper.getStateFromEvent(event)
-  // TODO send editor id
-  switch (deltaMode) {
-    case WheelEventType.DomDeltaLine:
-      RendererWorker.send(
-        /* Editor.setDeltaY */ 'Editor.setDeltaY',
-        /* value */ deltaY
-      )
-      break
-    case WheelEventType.DomDeltaPixel:
-      RendererWorker.send(
-        /* Editor.setDeltaY */ 'Editor.setDeltaY',
-        /* value */ deltaY
-      )
-      break
-    default:
-      break
-  }
-}
-
-export const handlePaste = (event) => {
-  event.preventDefault()
-  const text = event.clipboardData.getData('text')
-  RendererWorker.send(/* Editor.paste */ 'Editor.paste', /* text */ text)
-}
-
-export const handleScrollBarThumbPointerMove = (event) => {
-  const { clientY } = event
-  RendererWorker.send(
-    /* Editor.handleScrollBarMouseMove */ 'Editor.handleScrollBarMove',
-    /* y */ clientY
-  )
-}
-
-export const handleScrollBarThumbPointerUp = (event) => {
-  const { target, pointerId } = event
-  target.releasePointerCapture(pointerId)
-  target.removeEventListener('pointermove', handleScrollBarThumbPointerMove)
-  target.removeEventListener('pointerup', handleScrollBarThumbPointerUp)
-}
-
-export const handleScrollBarThumbPointerDown = (event) => {
-  const { target, pointerId } = event
-  target.setPointerCapture(pointerId)
-  target.addEventListener('pointermove', handleScrollBarThumbPointerMove, {
-    passive: false,
-  })
-  target.addEventListener('pointerup', handleScrollBarThumbPointerUp)
-}
-
-export const handleScrollBarMouseDown = (event) => {
-  event.preventDefault()
-  const y = event.clientY
-  RendererWorker.send(
-    /* EditorHandleScrollBarClick.editorHandleScrollBarClick */ 'Editor.handleScrollBarClick',
-    /* y */ y
-  )
-}
-
-export const handleScrollBarContextMenu = (event) => {
-  event.preventDefault()
-  event.stopPropagation()
-}
-
-const toSimpleTouch = (touch) => {
-  return {
-    x: touch.clientX,
-    y: touch.clientY,
-  }
-}
-
-const toSimpleTouchEvent = (event) => {
-  const touches = Array.from(event.touches).map(toSimpleTouch)
-  const changedTouches = Array.from(event.changedTouches).map(toSimpleTouch)
-  return {
-    touches,
-    changedTouches,
-  }
-}
-
-// TODO add touch cancel handler
-
-// TODO use touch events for scrolling
-
-export const handleTouchStart = (event) => {
-  const touchEvent = toSimpleTouchEvent(event)
-  RendererWorker.send(
-    /* EditorHandleTouchStart.editorHandleTouchStart */ 'Editor.handleTouchStart',
-    /* touchEvent */ touchEvent
-  )
-}
-
-export const handleTouchMove = (event) => {
-  const touchEvent = toSimpleTouchEvent(event)
-  RendererWorker.send(
-    /* EditorHandleTouchMove.editorHandleTouchMove */ 'Editor.handleTouchMove',
-    /* touchEvent */ touchEvent
-  )
-}
-
-export const handleTouchEnd = (event) => {
-  if (event.cancelable) {
-    event.preventDefault()
-  }
-  const touchEvent = toSimpleTouchEvent(event)
-  RendererWorker.send(
-    /* EditorHandleTouchEnd.editorHandleTouchEnd */ 'Editor.handleTouchEnd',
-    /* touchEvent */ touchEvent
-  )
-}
-
-const getRangeFromSelection = (selection) => {
-  if (!selection.anchorNode) {
-    return undefined
-  }
-  const $StartToken = selection.anchorNode.parentNode
-  const $EndToken = selection.focusNode.parentNode
-  const $StartRow = $StartToken.parentNode
-  const $EndRow = $EndToken.parentNode
-  const $Rows = $StartRow.parentNode
-  let startRowIndex = 0
-  for (let i = 0; i < $Rows.children.length; i++) {
-    if ($Rows.children[i] === $StartRow) {
-      startRowIndex = i
-      break
-    }
-  }
-  let startColumnIndex = 0
-  for (let i = 0; i < $StartRow.children.length; i++) {
-    if ($StartRow.children[i] === $StartToken) {
-      break
-    }
-    startColumnIndex += $StartRow.children[i].textContent.length
-  }
-  startColumnIndex += selection.anchorOffset
-  let endRowIndex = 0
-  for (let i = 0; i < $Rows.children.length; i++) {
-    if ($Rows.children[i] === $EndRow) {
-      endRowIndex = i
-      break
-    }
-  }
-  let endColumnIndex = 0
-  for (let i = 0; i < $EndRow.children.length; i++) {
-    if ($EndRow.children[i] === $EndToken) {
-      break
-    }
-    endColumnIndex += $EndRow.children[i].textContent.length
-  }
-  endColumnIndex += selection.focusOffset
-  return {
-    startRowIndex,
-    startColumnIndex,
-    endRowIndex,
-    endColumnIndex,
-  }
-}
-
-export const handleContentEditableBeforeInput = (event) => {
-  const selection = document.getSelection()
-  const range = getRangeFromSelection(selection)
-  if (!range) {
-    console.error('[Editor] cannot handle input event without selection')
-    return
-  }
-  RendererWorker.send(
-    /* EditorHandleBeforeInputFromContentEditable.editorHandleBeforeInputFromContentEditable */ 'Editor.handleBeforeInputFromContentEditable',
-    /* data */ event.data || '',
-    /* range */ range
-  )
-}
-
-export const handleNativeSelectionChange = (event) => {
-  // if (state.shouldIgnoreSelectionChange) {
-  //   state.shouldIgnoreSelectionChange = false
-  //   return
-  // }
-  // const selection = document.getSelection()
-  // const range = getRangeFromSelection(selection)
-  // if (!range) {
-  //   return
-  // }
-  // RendererWorker.send(
-  //   /* EditorHandleNativeSelectionChange.editorHandleNativeSelectionChange */ 'Editor.handleNativeSelectionChange',
-  //   /* range */ range
-  // )
-}

package/static/73a0912/packages/renderer-process/src/parts/Editor/LayerCursor.js

@@ -1,123 +0,0 @@
-const create$Cursor = () => {
-  const $Cursor = document.createElement('div')
-  $Cursor.className = 'EditorCursor'
-  return $Cursor
-}
-
-const render$Cursor = ($Cursor, $Texts, cursor) => {
-  $Cursor.style.top = `${cursor.top}px`
-  const range = document.createRange()
-  if (cursor.leftIndex === -1) {
-    console.warn('cursor left is negative')
-    $Cursor.style.left = '0px' // TODO need to compute column width, this would only work for monospace fonts
-    return
-  }
-  const $Row = $Texts.children[cursor.topIndex]
-  if (!$Row) {
-    console.warn('no row', cursor, $Row)
-    return
-  }
-  const $Node = $Row.children[cursor.leftIndex]
-  if (!$Node) {
-    console.warn('no node', cursor, $Row)
-    return
-  }
-  if (cursor.leftIndex === 0 && cursor.remainingOffset === 0) {
-    $Cursor.style.left = '0px'
-  } else {
-    const $TextNode = $Node.firstChild
-    range.setStart($TextNode, cursor.remainingOffset)
-    range.setEnd($TextNode, cursor.remainingOffset)
-    const rect = range.getBoundingClientRect()
-    const left = Math.round(rect.left)
-    $Cursor.style.left = `${left}px`
-  }
-}
-
-const render$CursorsLess = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < $Cursors.children.length; i++) {
-    render$Cursor($Cursors.children[i], $Texts, cursors[i])
-  }
-  const fragment = document.createDocumentFragment()
-  for (let i = $Cursors.children.length; i < cursors.length; i++) {
-    const $Cursor = create$Cursor()
-    render$Cursor($Cursor, $Texts, cursors[i])
-    fragment.append($Cursor)
-  }
-  $Cursors.append(fragment)
-}
-
-const render$CursorsEqual = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < cursors.length; i++) {
-    render$Cursor($Cursors.children[i], $Texts, cursors[i])
-  }
-}
-
-const render$CursorsMore = ($Cursors, $Texts, cursors) => {
-  for (let i = 0; i < cursors.length; i++) {
-    render$Cursor($Cursors.children[i], $Texts, cursors[i])
-  }
-  const diff = $Cursors.children.length - cursors.length
-  for (let i = 0; i < diff; i++) {
-    $Cursors.lastChild.remove()
-  }
-}
-
-const render$Cursors = ($Cursors, $Texts, cursors) => {
-  if ($Cursors.children.length < cursors.length) {
-    render$CursorsLess($Cursors, $Texts, cursors)
-  } else if ($Cursors.children.length === cursors.length) {
-    render$CursorsEqual($Cursors, $Texts, cursors)
-  } else {
-    render$CursorsMore($Cursors, $Texts, cursors)
-  }
-}
-
-const renderCursorsNative = (state, cursors) => {
-  if (cursors.length > 1) {
-    console.warn('[editor] cannot render more than one native cursor')
-    return
-  }
-  if (cursors.length === 0) {
-    return
-  }
-  const cursor = cursors[0]
-  const $Rows = state.$LayerText
-  const $StartRow = $Rows.children[cursor.rowIndex]
-  let startOffset = 0
-  let $Anchor
-  for (let i = 0; i < $StartRow.children.length; i++) {
-    if (startOffset >= cursor.columnIndex) {
-      console.log({ startOffset })
-      $Anchor = $StartRow.children[i - 1].firstChild
-      startOffset -= $Anchor.textContent.length
-      startOffset = cursor.columnIndex - startOffset
-      break
-    }
-    startOffset += $StartRow.children[i].textContent.length
-  }
-  if (!$Anchor) {
-    $Anchor = $StartRow.children[$StartRow.children.length - 1].firstChild
-    startOffset -= $Anchor.textContent.length
-    startOffset = cursor.columnIndex - startOffset
-  }
-  const selection = document.getSelection()
-  if (
-    selection.anchorNode === $Anchor &&
-    selection.focusNode === $Anchor &&
-    selection.anchorOffset === startOffset &&
-    selection.focusOffset === startOffset
-  ) {
-    return
-  }
-  state.shouldIgnoreSelectionChange = true
-  const documentRange = document.createRange()
-  documentRange.setStart($Anchor, startOffset)
-  documentRange.setEnd($Anchor, startOffset)
-  selection.removeAllRanges()
-  selection.addRange(documentRange)
-}
-
-export const setCursors = (state, cursors) => {
-  render$Cursors(state.$LayerCursor, state.$LayerText, cursors)
-}

package/static/73a0912/packages/renderer-process/src/parts/EditorGroup/EditorGroup.js

@@ -1,55 +0,0 @@
-import * as Editor from '../Editor/Editor.js'
-import * as EditorHelper from '../Editor/EditorHelper.js'
-import * as EditorTabs from '../EditorTab/EditorTab.js'
-import * as RendererWorker from '../RendererWorker/RendererWorker.js'
-
-const handleEditorTabsContextMenu = (event) => {
-  event.preventDefault()
-  const x = event.clientX
-  const y = event.clientY
-  RendererWorker.send(
-    /* editorTabsHandleContextMenu */ 'Main.handleTabContextMenu',
-    /* x */ x,
-    /* y */ y
-  )
-}
-
-export const create = () => {
-  const $EditorTabs = EditorTabs.create()
-
-  const $Editors = document.createElement('div')
-  $Editors.className = 'Editors'
-
-  // TODO create should not have side effect of mounting
-  // TODO this causes 2 times layout (when also calling add after)
-  // TODO
-  // Layout.state.$Main.append($EditorTabs, $Editors)
-  return {
-    $EditorTabs,
-    $Editors,
-  }
-}
-
-export const addOne = (state, id, uri, languageId) => {
-  EditorTabs.addOne(state.$EditorTabs, id, uri, languageId)
-  // const $Editor = EditorController.create(id)
-  // const $EditorTab = EditorTabsController.create(id, uri, languageId)
-  // TODO should call addOne as well
-  const editorState = Editor.create()
-  EditorHelper.setState(id, editorState)
-  Editor.mount(editorState, state.$Editors)
-  return editorState
-}
-
-export const replaceOne = (state, id, uri, languageId) => {
-  console.log('replace one')
-  EditorTabs.addOne(state.$EditorTabs, id, uri, languageId)
-}
-
-// TODO remove single tab
-export const removeOne = (state, index) => {
-  // EditorTabs.removeOne(state.$EditorTabs, index)
-  // Editor.removeOne(state.$Editors, index)
-  state.$Editors.remove()
-  state.$EditorTabs.remove()
-}