@lvce-editor/server 0.14.0 → 0.14.2

package/static/8093538/packages/renderer-worker/src/parts/Viewlet/ViewletExtensionsList.js

@@ -0,0 +1,485 @@
+import * as Assert from '../Assert/Assert.js'
+import * as Command from '../Command/Command.js'
+import * as ErrorHandling from '../ErrorHandling/ErrorHandling.js'
+import * as ExtensionManagement from '../ExtensionManagement/ExtensionManagement.js' // TODO use Command.execute instead
+import * as MenuEntryId from '../MenuEntryId/MenuEntryId.js'
+import * as Platform from '../Platform/Platform.js'
+import * as RendererProcess from '../RendererProcess/RendererProcess.js'
+
+import * as ScrollBarFunctions from '../ScrollBarFunctions/ScrollBarFunctions.js'
+
+export const ITEM_HEIGHT = 62
+
+const MINIMUM_SLIDER_SIZE = 20
+
+export const name = 'ExtensionsList'
+
+// then state can be recycled by Viewlet when there is only a single ViewletExtensions instance
+
+export const create = (id, uri, x, y, width, height) => {
+  return {
+    filteredExtensions: [],
+    disposed: false,
+    focusedIndex: -1,
+    deltaY: 0,
+    minLineY: 0,
+    maxLineY: 0,
+    width,
+    height,
+    negativeMargin: 0,
+    scrollBarHeight: 0,
+    handleOffset: 0,
+    x,
+    y,
+    finalDeltaY: 2728,
+  }
+}
+
+const getVisible = (state) => {
+  return state.filteredExtensions.slice(state.minLineY, state.maxLineY)
+}
+
+export const loadContent = async (state) => {
+  // TODO just get local extensions on demand (not when query string is already different)
+
+  // TODO get installed extensions from extension host
+  // TODO just get local extensions on demand (not when query string is already different)
+  const extensions = await ExtensionManagement.getAllExtensions()
+  const viewObjects = filterExtensions(extensions.map(toInstalledViewObject), state.parsedValue)
+
+  const listHeight = state.height
+  const contentHeight = viewObjects.length * ITEM_HEIGHT
+  const scrollBarHeight = ScrollBarFunctions.getScrollBarSize(state.height, contentHeight, MINIMUM_SLIDER_SIZE)
+
+  return {
+    ...state,
+    maxLineY: Math.round(listHeight / ITEM_HEIGHT),
+    scrollBarHeight,
+  }
+}
+
+const RE_PUBLISHER = /^[a-z\d\-]+/
+
+// TODO handle case when extension is of type number|array|null|string
+const getPublisher = (extension) => {
+  if (!extension || !extension.id) {
+    return 'n/a'
+  }
+  // TODO handle case when id is not of type string -> should not crash application
+  const match = extension.id.match(RE_PUBLISHER)
+  if (!match) {
+    return 'n/a'
+  }
+  return match[0]
+}
+
+// TODO all icon related logic should be here, not in renderer process
+const getIcon = (extension) => {
+  if (!extension || !extension.path || !extension.icon) {
+    return ''
+  }
+  if (Platform.platform === 'remote') {
+    return `/remote/${extension.path}/${extension.icon}` // TODO support windows paths
+  }
+  if (Platform.platform === 'electron') {
+    return `/remote/${extension.path}/${extension.icon}` // TODO support windows paths
+  }
+  return ''
+}
+
+const getName = (extension) => {
+  if (extension && extension.name) {
+    return extension.name
+  }
+  if (extension && extension.id) {
+    return extension.id
+  }
+  return 'n/a'
+}
+
+const getVersion = (extension) => {
+  if (!extension || !extension.version) {
+    return 'n/a'
+  }
+  return extension.version
+}
+
+const getDescription = (extension) => {
+  if (!extension || !extension.description) {
+    return 'n/a'
+  }
+  return extension.description
+}
+
+const getId = (extension) => {
+  if (!extension || !extension.id) {
+    return 'n/a'
+  }
+  return extension.id
+}
+
+const toInstalledViewObject = (extension) => {
+  return {
+    name: getName(extension),
+    publisher: getPublisher(extension),
+    version: getVersion(extension),
+    description: getDescription(extension),
+    // TODO type field: builtin|marketplace|external
+    // TODO should be status
+    state: 'installed',
+    id: getId(extension),
+    icon: getIcon(extension),
+  }
+}
+
+const toDisabledViewObject = (extension) => {
+  return {
+    name: extension.name,
+    publisher: extension.authorId || extension.publisher,
+    version: extension.version,
+    // TODO type field: builtin|marketplace|external
+    // TODO should be status
+    state: 'disabled',
+    id: extension.id,
+  }
+}
+
+export const dispose = () => {}
+
+export const focusIndex = (state, index) => {
+  if (index === -1) {
+    return {
+      ...state,
+      focusedIndex: -1,
+    }
+  }
+  const listHeight = state.height
+  if (index < state.minLineY + 1) {
+    // scroll up
+    const minLineY = index
+    const maxLineY = minLineY + Math.ceil(listHeight / ITEM_HEIGHT)
+    const negativeMargin = -minLineY * ITEM_HEIGHT
+    return {
+      ...state,
+      focusedIndex: index,
+      minLineY,
+      maxLineY,
+      negativeMargin,
+    }
+  }
+  if (index >= state.maxLineY - 1) {
+    //  scroll down
+    const maxLineY = index + 1
+    const minLineY = maxLineY - Math.ceil(listHeight / ITEM_HEIGHT)
+    const negativeMargin = -minLineY * ITEM_HEIGHT + (listHeight % ITEM_HEIGHT) - ITEM_HEIGHT
+    return {
+      ...state,
+      focusedIndex: index,
+      minLineY,
+      maxLineY,
+      negativeMargin,
+    }
+  }
+  return {
+    ...state,
+    focusedIndex: index,
+  }
+}
+
+// TODO lazyload this
+export const handleClick = (state, index) => {
+  return focusIndex(state, index)
+}
+
+export const focusNext = (state) => {
+  if (state.focusedIndex === state.filteredExtensions.length - 1) {
+    return state
+  }
+  return focusIndex(state, state.focusedIndex + 1)
+}
+
+export const focusNextPage = (state) => {
+  if (state.focusedIndex === state.filteredExtensions.length - 1) {
+    return state
+  }
+  const indexNextPage = Math.min(state.maxLineY + (state.maxLineY - state.minLineY) - 2, state.filteredExtensions.length - 1)
+  return focusIndex(state, indexNextPage)
+}
+
+export const focusPrevious = (state) => {
+  if (state.focusedIndex === 0 || state.focusedIndex === -1) {
+    return state
+  }
+  return focusIndex(state, state.focusedIndex - 1)
+}
+
+export const focusPreviousPage = (state) => {
+  if (state.focusedIndex === 0 || state.focusedIndex === -1) {
+    return state
+  }
+
+  const indexPreviousPage = Math.max(state.minLineY - (state.maxLineY - state.minLineY) + 1, 0)
+  return focusIndex(state, indexPreviousPage)
+}
+
+export const focusFirst = (state) => {
+  if (state.filteredExtensions.length === 0) {
+    return state
+  }
+  return focusIndex(state, 0)
+}
+
+export const focusLast = (state) => {
+  if (state.filteredExtensions.length === 0) {
+    return state
+  }
+  return focusIndex(state, state.filteredExtensions.length - 1)
+}
+
+// TODO show error / warning  when installment fails / times out
+export const handleInstall = async (state, id) => {
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'installing'
+  )
+  try {
+    await ExtensionManagement.install(/* id */ id)
+  } catch (error) {
+    // TODO have multi send command
+    await RendererProcess.invoke(
+      /* viewletSend */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setExtensionState',
+      /* id */ id,
+      /* state */ 'uninstalled'
+    )
+    // TODO use command.execute
+    ErrorHandling.handleError(error)
+    return
+  }
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'installed'
+  )
+}
+
+// TODO lazyload this
+export const handleUninstall = async (state, id) => {
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'uninstalling'
+  )
+  try {
+    await ExtensionManagement.uninstall(id)
+  } catch (error) {
+    await RendererProcess.invoke(
+      /* viewletSend */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setExtensionState',
+      /* id */ id,
+      /* state */ 'installed'
+    )
+    ErrorHandling.handleError(error)
+    return
+  }
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'uninstalled'
+  )
+}
+
+// TODO lazyload this
+export const handleEnable = async (state, id) => {
+  try {
+    await ExtensionManagement.enable(id)
+  } catch (error) {
+    await RendererProcess.invoke(
+      /* viewletSend */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setExtensionState',
+      /* id */ id,
+      /* state */ 'disabled'
+    )
+    ErrorHandling.handleError(error)
+    return
+  }
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'enabled'
+  )
+}
+
+// TODO lazyload this
+export const handleDisable = async (state, id) => {
+  try {
+    await ExtensionManagement.disable(id)
+  } catch (error) {
+    console.error(error)
+    ErrorHandling.handleError(error)
+    return
+  }
+  await RendererProcess.invoke(
+    /* viewletSend */ 'Viewlet.send',
+    /* id */ 'Extensions',
+    /* method */ 'setExtensionState',
+    /* id */ id,
+    /* state */ 'disabled'
+  )
+}
+
+// TODO pass index instead
+export const handleContextMenu = async (state, x, y, extensionId) => {
+  await Command.execute(/* ContextMenu.show */ 'ContextMenu.show', /* x */ x, /* y */ y, /* id */ MenuEntryId.ManageExtension)
+}
+
+export const resize = (state, dimensions) => {
+  // TODO should just return new state, render function can take old state and new state and return render commands
+  const listHeight = dimensions.height
+  const maxLineY = state.minLineY + Math.ceil(listHeight / ITEM_HEIGHT)
+  return {
+    newState: {
+      ...state,
+      ...dimensions,
+      maxLineY,
+    },
+    commands: [],
+  }
+}
+
+export const setDeltaY = (state, deltaY) => {
+  console.log({ deltaY })
+  Assert.object(state)
+  Assert.number(deltaY)
+  const listHeight = state.height
+  if (deltaY < 0) {
+    deltaY = 0
+  } else if (deltaY > state.filteredExtensions.length * ITEM_HEIGHT - listHeight) {
+    deltaY = Math.max(state.filteredExtensions.length * ITEM_HEIGHT - listHeight, 0)
+  }
+  if (state.deltaY === deltaY) {
+    return state
+  }
+  // TODO when it only moves by one px, extensions don't need to be rerendered, only negative margin
+  const minLineY = Math.floor(deltaY / ITEM_HEIGHT)
+  const maxLineY = minLineY + Math.round(listHeight / ITEM_HEIGHT)
+  const negativeMargin = -Math.round(deltaY)
+  return {
+    ...state,
+    deltaY,
+    minLineY,
+    maxLineY,
+    negativeMargin,
+  }
+  // await scheduleExtensions(state)
+}
+
+export const handleWheel = (state, deltaY) => {
+  return setDeltaY(state, state.deltaY + deltaY)
+}
+
+const getNewPercent = (state, relativeY) => {
+  if (relativeY <= state.height - state.scrollBarHeight / 2) {
+    // clicked in middle
+    return relativeY / (state.height - state.scrollBarHeight)
+  }
+  // clicked at bottom
+  return 1
+}
+
+export const handleScrollBarMove = (state, eventY) => {
+  const { y, handleOffset } = state
+  const relativeY = eventY - y - handleOffset
+  const newPercent = getNewPercent(state, relativeY)
+  const newDeltaY = newPercent * state.finalDeltaY
+  return setDeltaY(state, newDeltaY)
+}
+
+const getNewDeltaPercent = (state, relativeY) => {
+  if (relativeY <= state.scrollBarHeight / 2) {
+    // clicked at top
+    return 0
+  }
+  if (relativeY <= state.height - state.scrollBarHeight / 2) {
+    // clicked in middle
+    return (relativeY - state.scrollBarHeight / 2) / (state.height - state.scrollBarHeight)
+  }
+  // clicked at bottom
+  return 1
+}
+
+export const handleScrollBarClick = (state, eventY) => {
+  const { y } = state
+  const relativeY = eventY - y
+  const newPercent = getNewDeltaPercent(state, relativeY)
+  const newDeltaY = newPercent * state.finalDeltaY
+  return {
+    ...setDeltaY(state, newDeltaY),
+    handleOffset: state.scrollBarHeight / 2,
+  }
+}
+
+export const hasFunctionalRender = true
+
+export const render = (oldState, newState) => {
+  const changes = []
+  if (oldState === newState) {
+    return changes
+  }
+  if (
+    oldState.filteredExtensions !== newState.filteredExtensions ||
+    oldState.minLineY !== newState.minLineY ||
+    oldState.maxLineY !== newState.maxLineY
+  ) {
+    const visibleExtensions = getVisible(newState)
+    changes.push([/* Viewlet.send */ 'Viewlet.send', /* id */ 'Extensions', /* method */ 'setExtensions', /* visibleExtensions */ visibleExtensions])
+  }
+  if (oldState.filteredExtensions.length !== newState.filteredExtensions.length) {
+    const contentHeight = newState.filteredExtensions.length * ITEM_HEIGHT
+    changes.push([/* Viewlet.send */ 'Viewlet.send', /* id */ 'Extensions', /* method */ 'setContentHeight', /* contentHeight */ contentHeight])
+  }
+
+  if (oldState.negativeMargin !== newState.negativeMargin) {
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setNegativeMargin',
+      /* negativeMargin */ newState.negativeMargin,
+    ])
+  }
+
+  if (oldState.focusedIndex !== newState.focusedIndex) {
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setFocusedIndex',
+      /* oldFocusedIndex */ oldState.focusedIndex - oldState.minLineY,
+      /* newFocusedIndex */ newState.focusedIndex - newState.minLineY,
+    ])
+  }
+  if (oldState.deltaY !== newState.deltaY) {
+    const scrollBarY = (newState.deltaY / newState.finalDeltaY) * (newState.height - newState.scrollBarHeight)
+    changes.push([
+      /* Viewlet.send */ 'Viewlet.send',
+      /* id */ 'Extensions',
+      /* method */ 'setScrollBar',
+      /* scrollBarY */ scrollBarY,
+      /* scrollBarHeight */ newState.scrollBarHeight,
+    ])
+  }
+  return changes
+}

package/static/8093538/packages/renderer-worker/src/parts/ViewletActivityBar/ViewletActivityBar.ipc.js

@@ -0,0 +1,16 @@
+import * as ViewletActivityBar from './ViewletActivityBar.js'
+
+export const name = 'ActivityBar'
+
+export const Events = {
+  'SourceControl.changeBadgeCount': ViewletActivityBar.updateSourceControlCount,
+  'Layout.hideSideBar': ViewletActivityBar.handleSideBarHidden,
+  'SideBar.viewletChange': ViewletActivityBar.handleSideBarViewletChange,
+}
+
+export * from './ViewletActivityBar.js'
+export * from './ViewletActivityBarCommands.js'
+export * from './ViewletActivityBarCss.js'
+export * from './ViewletActivityBarKeyBindings.js'
+export * from './ViewletActivityBarRender.js'
+export * from './ViewletActivityBarResize.js'

package/static/8093538/packages/renderer-worker/src/parts/ViewletActivityBar/ViewletActivityBar.js

@@ -0,0 +1,176 @@
+import * as ActivityBarItemFlags from '../ActivityBarItemFlags/ActivityBarItemFlags.js'
+import * as Height from '../Height/Height.js'
+import * as Icon from '../Icon/Icon.js'
+import * as ViewletModuleId from '../ViewletModuleId/ViewletModuleId.js'
+import * as ViewletStates from '../ViewletStates/ViewletStates.js'
+import { focusIndex } from './ViewletActivityBarFocusIndex.js'
+import * as ViewletActivityBarStrings from './ViewletActivityBarStrings.js'
+
+// TODO rename viewlet parameter to something else (e.g. clicking settings opens context menu not settings viewlet)
+// TODO should just pass index
+// then if item is viewlet -> open viewlet
+// else if item is settings -> open settings
+
+// TODO this should be create
+// TODO unregister listeners when hidden
+
+export const create = (id, uri, x, y, width, height) => {
+  return {
+    // TODO declarative event api is good, but need to bind
+    // listeners to state somehow
+    // also the use of global event bus is not good
+    // and this api is not strongly typed
+    events: {
+      'SourceControl.changeBadgeCount': 8012,
+      'Layout.hideSideBar': 8014,
+      'SideBar.viewletChange': 8013,
+    },
+    activityBarItems: [],
+    focusedIndex: -1,
+    selectedIndex: -1,
+    focused: false,
+    x,
+    y,
+    width,
+    height,
+    itemHeight: Height.ActivityBarItem,
+  }
+}
+
+const getActivityBarItems = () => {
+  return [
+    // Top
+    {
+      id: ViewletModuleId.Explorer,
+      title: ViewletActivityBarStrings.explorer(),
+      icon: Icon.Files,
+      enabled: true,
+      flags: ActivityBarItemFlags.Tab,
+      keyShortcuts: 'Control+Shift+E',
+    },
+    {
+      id: ViewletModuleId.Search,
+      title: ViewletActivityBarStrings.search(),
+      icon: Icon.Search,
+      enabled: true,
+      flags: ActivityBarItemFlags.Tab,
+      keyShortcuts: 'Control+Shift+F',
+    },
+    {
+      id: ViewletModuleId.SourceControl,
+      title: ViewletActivityBarStrings.sourceControl(),
+      icon: Icon.SourceControl,
+      enabled: true,
+      flags: ActivityBarItemFlags.Tab,
+      keyShortcuts: 'Control+Shift+G',
+    },
+    {
+      id: ViewletModuleId.RunAndDebug,
+      title: ViewletActivityBarStrings.runAndDebug(),
+      icon: Icon.DebugAlt2,
+      enabled: true,
+      flags: ActivityBarItemFlags.Tab,
+      keyShortcuts: 'Control+Shift+D',
+    },
+    {
+      id: ViewletModuleId.Extensions,
+      title: ViewletActivityBarStrings.extensions(),
+      icon: Icon.Extensions,
+      enabled: true,
+      flags: ActivityBarItemFlags.Tab,
+      keyShortcuts: 'Control+Shift+X',
+    },
+    // Bottom
+    {
+      id: 'Settings',
+      title: ViewletActivityBarStrings.settings(),
+      icon: Icon.SettingsGear,
+      enabled: true,
+      flags: ActivityBarItemFlags.Button,
+      keyShortcuts: '',
+    },
+  ]
+}
+
+export const loadContent = async (state) => {
+  const activityBarItems = getActivityBarItems()
+  const sideBar = ViewletStates.getInstance('SideBar')
+  const viewletId = sideBar && sideBar.state ? sideBar.state.currentViewletId : ''
+  const selectedIndex = findIndex(activityBarItems, viewletId)
+  return {
+    ...state,
+    selectedIndex,
+    activityBarItems,
+  }
+}
+
+const findIndex = (activityBarItems, id) => {
+  for (let i = 0; i < activityBarItems.length; i++) {
+    if (activityBarItems[i].id === id) {
+      return i
+    }
+  }
+  return -1
+}
+
+export const handleSideBarViewletChange = (state, id, ...args) => {
+  const index = findIndex(state.activityBarItems, id)
+  return {
+    ...state,
+    selectedIndex: index,
+  }
+}
+
+export const handleSideBarHidden = (state) => {
+  return {
+    ...state,
+    focusedIndex: -1,
+    selectedIndex: -1,
+  }
+}
+
+export const updateSourceControlCount = async (state, count) => {
+  if (count === 0) {
+    return
+  }
+  const index = state.activityBarItems.findIndex((item) => item.id === 'Source Control')
+  if (index === -1) {
+    return
+  }
+  return {
+    ...state,
+    badgeCount: count,
+  }
+
+  // TODO send count to renderer process (if activity bar is visible)
+}
+
+export const toggleItem = (context, item) => {
+  // const item = activityBarFindItem(id)
+}
+
+const isEnabled = (activityBarItem) => {
+  return activityBarItem.enabled
+}
+
+export const toggleActivityBarItem = async (state, item) => {
+  const activityBarItem = state.activityBarItems.find((activityBarItem) => activityBarItem.id === item.label)
+  activityBarItem.enabled = !activityBarItem.enabled
+  return {
+    ...state,
+    items: state.activityBarItems.filter(isEnabled),
+  }
+}
+
+export const handleBlur = (state) => {
+  return {
+    ...state,
+    focused: false,
+  }
+}
+
+export const focus = (state) => {
+  const { focusedIndex } = state
+  const indexToFocus = focusedIndex === -1 ? 0 : focusedIndex
+  return focusIndex(state, indexToFocus)
+}

package/static/8093538/packages/renderer-worker/src/parts/ViewletActivityBar/ViewletActivityBarCommands.js

@@ -0,0 +1,24 @@
+import * as ViewletActivityBar from './ViewletActivityBar.js'
+
+// prettier-ignore
+export const Commands = {
+  handleBlur:  ViewletActivityBar.handleBlur,
+  handleSideBarHidden: ViewletActivityBar.handleSideBarHidden,
+  handleSideBarViewletChange: ViewletActivityBar.handleSideBarViewletChange,
+  toggleItem: ViewletActivityBar.toggleItem,
+  updateSourceControlCount:  ViewletActivityBar.updateSourceControlCount,
+}
+
+// prettier-ignore
+export const LazyCommands={
+  focus: () => import('./ViewletActivityBarFocus.js'),
+  focusFirst: () => import('./ViewletActivityBarFocusFirst.js'),
+  focusIndex: () => import('./ViewletActivityBarFocusIndex.js'),
+  focusLast: () => import('./ViewletActivityBarFocusLast.js'),
+  focusNext: () => import('./ViewletActivityBarFocusNext.js'),
+  focusPrevious: () => import('./ViewletActivityBarFocusPrevious.js'),
+  selectCurrent: () => import('./ViewletActivityBarSelectCurrent.js'),
+  handleClick: () => import('./ViewletActivityBarHandleClick.js'),
+  handleContextMenu: () => import('./ViewletActivityBarHandleContextMenu.js'),
+  getHiddenItems: () => import('./ViewletActivityBarGetHiddenItems.js')
+}

package/static/8093538/packages/renderer-worker/src/parts/ViewletActivityBar/ViewletActivityBarCss.js

@@ -0,0 +1 @@
+export const Css = ['/css/parts/ViewletActivityBar.css', '/css/parts/MaskIcon.css']