@lvce-editor/server 0.0.26 → 0.0.29

package/static/bf7d47a/packages/renderer-worker/src/parts/Location/Location.js

@@ -0,0 +1,22 @@
+import * as RendererProcess from '../RendererProcess/RendererProcess.js'
+
+export const getPathName = () => {
+  return RendererProcess.invoke(
+    /* Location.getPathName */ 'Location.getPathName'
+  )
+}
+
+export const getHref = () => {
+  return RendererProcess.invoke(/* Location.getHref */ 'Location.getHref')
+}
+
+export const setPathName = (pathName) => {
+  return RendererProcess.invoke(
+    /* Location.setPathName */ 'Location.setPathName',
+    /* pathName */ pathName
+  )
+}
+
+export const hydrate = () => {
+  return RendererProcess.invoke(/* Location.hydrate */ 'Location.hydrate')
+}

package/static/bf7d47a/packages/renderer-worker/src/parts/Menu/Menu.ipc.js

@@ -0,0 +1,14 @@
+import * as Menu from './Menu.js'
+
+export const Commands = {
+  'Menu.show': Menu.show,
+  'Menu.hide': Menu.hide,
+  'Menu.selectIndex': Menu.selectIndex,
+  'Menu.focusNext': Menu.focusNext,
+  'Menu.focusPrevious': Menu.focusPrevious,
+  'Menu.focusFirst': Menu.focusFirst,
+  'Menu.focusLast': Menu.focusLast,
+  'Menu.focusIndex': Menu.focusIndex,
+  'Menu.handleMouseEnter': Menu.handleMouseEnter,
+  'Menu.selectItem': Menu.selectItem,
+}

package/static/bf7d47a/packages/renderer-worker/src/parts/Menu/Menu.js

@@ -0,0 +1,360 @@
+import * as RendererProcess from '../RendererProcess/RendererProcess.js'
+import * as Command from '../Command/Command.js'
+// TODO lazyload menuEntries and use Command.execute (maybe)
+import * as MenuEntries from '../MenuEntries/MenuEntries.js'
+import * as Layout from '../Layout/Layout.js'
+
+export const state = {
+  /**
+   * @type {any[]}
+   */
+  menus: [],
+  latestTimeStamp: 0,
+  enterTimeout: -1,
+}
+
+const MENU_WIDTH = 150
+
+const CONTEXT_MENU_ITEM_HEIGHT = 28
+const CONTEXT_MENU_SEPARATOR_HEIGHT = 6
+const CONTEXT_MENU_PADDING = 20
+const CONTEXT_MENU_WIDTH = 250
+
+export const getMenuWidth = () => {
+  return CONTEXT_MENU_WIDTH
+}
+
+export const getMenuHeight = (items) => {
+  let height = CONTEXT_MENU_PADDING
+  for (const item of items) {
+    switch (item.flags) {
+      case /* ContextMenuItemSeparator */ 1:
+        height += CONTEXT_MENU_SEPARATOR_HEIGHT
+        break
+      default:
+        height += CONTEXT_MENU_ITEM_HEIGHT
+        break
+    }
+  }
+  return height
+}
+
+const getCurrentMenu = () => {
+  if (state.menus.length === 0) {
+    console.warn('menu not available')
+  }
+  return state.menus.at(-1)
+}
+
+export const addMenuInternal = (menu) => {
+  if (state.menus.length > 5) {
+    throw new Error('too many menus')
+  }
+  state.menus.push(menu)
+  return menu
+}
+
+export const addRootMenuInternal = (menu) => {
+  state.menus = [menu]
+  return menu
+}
+
+const getMenuBounds = (x, y, items) => {
+  const menuWidth = CONTEXT_MENU_WIDTH
+  const menuHeight = getMenuHeight(items)
+
+  const windowWidth = Layout.state.windowWidth
+  const windowHeight = Layout.state.windowHeight
+  // TODO maybe only send labels and keybindings to ui (id not needed on ui)
+  // TODO what about separators?
+
+  if (x + menuWidth > windowWidth) {
+    x -= menuWidth
+  }
+  if (y + menuHeight > windowHeight) {
+    y -= menuHeight
+  }
+
+  return {
+    x,
+    y,
+    width: menuWidth,
+    height: menuHeight,
+  }
+}
+
+export const show = async (x, y, id, mouseBlocking = false) => {
+  const items = await MenuEntries.getMenuEntries(id)
+  const bounds = getMenuBounds(x, y, items)
+  const menu = addMenuInternal({
+    id,
+    items,
+    focusedIndex: -1,
+    level: state.menus.length,
+    x: bounds.x,
+    y: bounds.y,
+  })
+  await RendererProcess.invoke(
+    /* Menu.show */ 'Menu.showMenu',
+    /* x */ bounds.x,
+    /* y */ bounds.y,
+    /* width */ bounds.width,
+    /* height */ bounds.height,
+    /* items */ menu.items,
+    /* level */ menu.level,
+    /* parentIndex */ -1,
+    /* mouseBlocking */ mouseBlocking
+  )
+}
+
+export const closeSubMenu = () => {
+  const menu = state.menus.pop()
+  const parentMenu = state.menus.at(-1)
+  RendererProcess.invoke(
+    /* Menu.hideSubMenu */ 7903,
+    /* parentIndex */ parentMenu.focusedIndex
+  )
+}
+
+const showSubMenuAtEnter = async (level, index, enterX, enterY) => {
+  // TODO delete old menus
+  state.menus = state.menus.slice(0, level + 1)
+  const parentMenu = state.menus[level]
+  const item = parentMenu.items[index]
+  const subMenuItems = await MenuEntries.getMenuEntries(item.id)
+  const subMenu = addMenuInternal({
+    id: item.id,
+    items: subMenuItems,
+    focusedIndex: -1,
+    level: state.menus.length,
+    y: parentMenu.y + index * 25,
+    x: parentMenu.x + MENU_WIDTH,
+    enterX,
+    enterY,
+  })
+  const width = getMenuWidth()
+  const height = getMenuHeight(subMenuItems)
+  RendererProcess.invoke(
+    /* Menu.showMenu */ 'Menu.showMenu',
+    /* x */ subMenu.x,
+    /* y */ subMenu.y,
+    /* width */ width,
+    /* height */ height,
+    /* items */ subMenu.items,
+    /* level */ subMenu.level,
+    /* parentIndex */ index
+  )
+}
+
+export const showSubMenu = async (level, index) => {
+  await showSubMenuAtEnter(level, index, -1, -1)
+}
+
+export const selectIndex = async (level, index) => {
+  const menu = state.menus[level]
+  menu.focusedIndex = index
+  const item = menu.items[menu.focusedIndex]
+  console.log('[menu] select index', item)
+  switch (item.flags) {
+    case /* None */ 0:
+      if (!item.command) {
+        console.warn('item has missing command', item)
+        return
+      }
+      const args = item.args || []
+      await Promise.all([hide(), Command.execute(item.command, ...args)])
+      break
+    case /* SubMenu */ 4:
+      if (menu.focusedIndex === index) {
+        return
+      }
+      await showSubMenu(menu.level, menu.focusedIndex)
+      break
+    default:
+      break
+  }
+}
+
+export const selectItem = (text) => {
+  for (let level = 0; level < state.menus.length; level++) {
+    const menu = state.menus[level]
+    for (let i = 0; i < menu.items.length; i++) {
+      const item = menu.items[i]
+      if (item.label === text) {
+        return selectIndex(level, i)
+      }
+    }
+  }
+  throw new Error(`menu item not found: ${text}`)
+}
+
+export const selectCurrent = async (level) => {
+  const menu = state.menus[level]
+  await selectIndex(level, menu.focusedIndex)
+}
+
+export const hide = async () => {
+  if (state.menus.length === 0) {
+    return
+  }
+  state.menus = []
+  await RendererProcess.invoke(/* Menu.hide */ 'Menu.hide')
+}
+
+// TODO difference between focusing with mouse or keyboard
+// with mouse -> open submenu
+// with keyboard -> don't open submenu, only focus
+
+const hideSubMenus = async (level) => {
+  if (level < state.menus.length) {
+    state.menus = state.menus.slice(0, level + 1)
+    await RendererProcess.invoke(
+      /* Menu.hideSubMenu */ 'Menu.hideSubMenu',
+      /* level */ level + 1
+    )
+  }
+}
+
+const MENU_DELAY_TRIANGLE = 300
+
+const resolveAfterTimeout = (fn) => {
+  setTimeout(fn, MENU_DELAY_TRIANGLE)
+}
+
+export const handleMouseEnter = async (
+  level,
+  index,
+  enterX,
+  enterY,
+  enterTimeStamp
+) => {
+  state.latestTimeStamp = enterTimeStamp
+  if (level >= state.menus.length) {
+    return
+  }
+  const menu = state.menus[level]
+  if (menu.focusedIndex === index) {
+    return
+  }
+  if (level < state.menus.length - 1) {
+    const subMenu = state.menus[level + 1]
+    const subMenuEnterX = subMenu.enterX
+    // TODO should check for triangle position here
+    if (enterX >= subMenuEnterX) {
+      await new Promise(resolveAfterTimeout)
+      if (state.latestTimeStamp !== enterTimeStamp) {
+        return
+      }
+    }
+  }
+  const item = menu.items[index]
+  await focusIndex(menu, index)
+  switch (item.flags) {
+    case /* SubMenu */ 4:
+      await showSubMenuAtEnter(menu.level, index, enterX, enterY)
+      break
+    default:
+      await hideSubMenus(menu.level)
+      break
+  }
+}
+
+export const focusIndex = async (menu, index) => {
+  if (menu.items.length === 0) {
+    return
+  }
+  const oldFocusedIndex = menu.focusedIndex
+  menu.focusedIndex = index
+  await RendererProcess.invoke(
+    /* Menu.focusIndex */ 'Menu.focusIndex',
+    /* level */ menu.level,
+    /* oldFocusedIndex */ oldFocusedIndex,
+    /* newFocusedIndex */ index
+  )
+}
+
+export const getIndexToFocusNextStartingAt = (items, startIndex) => {
+  for (let i = startIndex; i < startIndex + items.length; i++) {
+    const index = i % items.length
+    const item = items[index]
+    if (canBeFocused(item)) {
+      return index
+    }
+  }
+  console.log({ startIndex, items })
+  return -1
+}
+
+export const focusFirst = async () => {
+  const menu = getCurrentMenu()
+  if (menu.items.length === 0) {
+    return
+  }
+  const indexToFocus = getIndexToFocusNextStartingAt(menu.items, 0)
+  console.log({ first: indexToFocus })
+  await focusIndex(menu, indexToFocus)
+}
+
+export const focusLast = async () => {
+  const menu = getCurrentMenu()
+  const indexToFocus = getIndexToFocusPreviousStartingAt(
+    menu.items,
+    menu.items.length - 1
+  )
+  await focusIndex(menu, indexToFocus)
+}
+
+// TODO this code seems a bit too complicated, maybe it can be simplified
+const getIndexToFocusPreviousStartingAt = (items, startIndex) => {
+  for (let i = startIndex; i > startIndex - items.length; i--) {
+    const index = (i + items.length) % items.length
+    const item = items[index]
+    if (canBeFocused(item)) {
+      return index
+    }
+  }
+  return -1
+}
+
+const getIndexToFocusPrevious = (menu) => {
+  const startIndex =
+    menu.focusedIndex === -1 ? menu.items.length - 1 : menu.focusedIndex - 1
+  return getIndexToFocusPreviousStartingAt(menu.items, startIndex)
+}
+
+export const focusPrevious = async () => {
+  const menu = getCurrentMenu()
+  if (menu.items.length === 0) {
+    return
+  }
+  const indexToFocus = getIndexToFocusPrevious(menu)
+  await focusIndex(menu, indexToFocus)
+}
+
+const canBeFocused = (item) => {
+  return item.flags !== /* Separator */ 1 && item.flags !== /* Disabled */ 5
+}
+
+const getIndexToFocusNext = (menu) => {
+  const startIndex = menu.focusedIndex + 1
+  return getIndexToFocusNextStartingAt(menu.items, startIndex)
+}
+
+export const focusNext = async () => {
+  const menu = getCurrentMenu()
+  if (menu.items.length === 0) {
+    return
+  }
+  const indexToFocus = getIndexToFocusNext(menu)
+  await focusIndex(menu, indexToFocus)
+}
+
+export const resetFocusedIndex = (menu) => {
+  menu.focusedIndex = -1
+}
+
+// TODO handle printable letter and focus item that starts with that letter
+
+// TODO pageup / pagedown keys
+
+// TODO more tests

package/static/bf7d47a/packages/renderer-worker/src/parts/MenuEntries/MenuEntriesActivityBar.js

@@ -0,0 +1,34 @@
+import * as ViewletStates from '../ViewletStates/ViewletStates.js'
+
+const toContextMenuItem = (activityBarItem) => {
+  return {
+    label: activityBarItem.id,
+    id: 8000, // TODO
+    flags: activityBarItem.enabled ? /* Checked */ 2 : /* Unchecked */ 3,
+  }
+}
+
+export const getMenuEntries = async () => {
+  const activityBarItems =
+    ViewletStates.getState('ActivityBar').activityBarItems
+  return [
+    ...activityBarItems.map(toContextMenuItem),
+    {
+      id: 'separator',
+      label: 'Separator',
+      flags: /* Separator */ 1,
+    },
+    {
+      id: 'moveSideBarLeft',
+      label: 'Move Side Bar Left', // TODO should be dynamic
+      flags: /* None */ 0,
+      command: /* TODO */ -1,
+    },
+    {
+      id: 'hideActivityBar',
+      label: 'Hide Activity Bar',
+      flags: /* None */ 0,
+      command: /* Layout.hideActivityBar */ 'Layout.hideActivityBar',
+    },
+  ]
+}

package/static/bf7d47a/packages/renderer-worker/src/parts/MenuEntries/MenuEntriesExplorer.js

@@ -0,0 +1,119 @@
+import * as Viewlet from '../Viewlet/Viewlet.js'
+
+const ALL_ENTRIES = [
+  {
+    id: 'newFile',
+    label: 'New File',
+    flags: /* None */ 0,
+    command: /* Explorer.newFile  */ 'Explorer.newFile',
+  },
+  {
+    id: 'newFolder',
+    label: 'New Folder',
+    flags: /* None */ 0,
+    command: /* Explorer.newFolder */ 'Explorer.newFolder',
+  },
+  {
+    id: 'openContainingFolder',
+    label: 'Open Containing Folder',
+    flags: /* None */ 0,
+    command:
+      /*  Explorer.openContainingFolder */ 'Explorer.openContainingFolder',
+  },
+  {
+    id: 'openInIntegratedTerminal',
+    label: 'Open in integrated Terminal',
+    flags: /* None */ 0,
+    command: /* TODO */ -1,
+  },
+  {
+    id: '',
+    label: '',
+    flags: /* Separator */ 1,
+    command: /* None */ 0,
+  },
+  {
+    id: 'cut',
+    label: 'Cut',
+    flags: /* None */ 0,
+    command: /* TODO */ -1,
+  },
+  {
+    id: 'copy',
+    label: 'Copy',
+    flags: /* None */ 0,
+    command: /* Explorer.handleCopy */ 'Explorer.handleCopy',
+  },
+  {
+    id: 'paste',
+    label: 'Paste',
+    flags: /* None */ 0,
+    command: /* Explorer.handlePaste */ 'Explorer.handlePaste',
+  },
+  {
+    id: '',
+    label: '',
+    flags: /* Separator */ 1,
+    command: /* None */ 0,
+  },
+  {
+    id: 'copyPath',
+    label: 'Copy Path',
+    flags: /* None */ 0,
+    command: /* TODO */ -1,
+  },
+  {
+    id: 'copyRelativePath',
+    label: 'Copy Relative Path',
+    flags: /* None */ 0,
+    command: /* TODO */ -1,
+  },
+  {
+    id: '',
+    label: '',
+    flags: /* Separator */ 1,
+    command: /* None */ 0,
+  },
+  {
+    id: 'rename',
+    label: 'Rename',
+    flags: /* None */ 0,
+    command: /* Explorer.renameDirent */ 'Explorer.renameDirent',
+  },
+  {
+    id: 'delete',
+    label: 'Delete',
+    flags: /* None */ 0,
+    command: /* Explorer.removeDirent */ 'Explorer.removeDirent',
+  },
+]
+
+const isFileEntry = (entry) => {
+  return entry.id !== 'newFile' && entry.id !== 'newFolder'
+}
+
+// TODO there are two possible ways of getting the focused dirent of explorer
+// 1. directly access state of explorer (bad because it directly accesses state of another component)
+// 2. expose getFocusedDirent method in explorer (bad because explorer code should not know about for menuEntriesExplorer, which needs that method)
+const getFocusedDirent = () => {
+  const explorerState = Viewlet.getState('Explorer')
+  if (!explorerState || explorerState.focusedIndex < 0) {
+    return undefined
+  }
+  return explorerState.dirents[explorerState.focusedIndex]
+}
+
+export const getMenuEntries = () => {
+  const focusedDirent = getFocusedDirent()
+  if (!focusedDirent) {
+    return ALL_ENTRIES
+  }
+  switch (focusedDirent.type) {
+    case 'directory':
+      return ALL_ENTRIES
+    case 'file':
+      return ALL_ENTRIES.filter(isFileEntry)
+    default:
+      return ALL_ENTRIES
+  }
+}

package/static/bf7d47a/packages/renderer-worker/src/parts/MenuEntries/MenuEntriesFile.js

@@ -0,0 +1,52 @@
+export const getMenuEntries = () => {
+  return [
+    {
+      id: 'newFile',
+      label: 'New File',
+      flags: /* Disabled */ 5,
+      command: /* TODO */ -1,
+    },
+    {
+      id: 'newWindow',
+      label: 'New Window',
+      flags: /* None */ 0,
+      command: /* Window.openNew */ 'Window.openNew',
+    },
+    {
+      id: 'separator',
+      label: 'Separator',
+      flags: /* Separator */ 1,
+      command: /* None */ 0,
+    },
+    {
+      id: 'openFile',
+      label: 'Open File',
+      flags: /* Disabled */ 5,
+      command: /* TODO */ -1,
+    },
+    {
+      id: 'openFolder',
+      label: 'Open Folder',
+      flags: /* None */ 0,
+      command: 'Dialog.openFolder',
+    },
+    {
+      id: 'openRecent',
+      label: 'Open Recent',
+      flags: /* SubMenu */ 4,
+      command: /* None */ 0,
+    },
+    {
+      id: 'separator',
+      label: 'Separator',
+      flags: /* Separator */ 1,
+      command: /* None */ 0,
+    },
+    {
+      id: 'exit',
+      label: 'Exit',
+      flags: /* None */ 0,
+      command: /* Window.exit */ 'Window.exit',
+    },
+  ]
+}