@owdproject/core 3.1.2 → 3.1.4-beta.0

package/runtime/components/Core/Time/CoreTime.vue

@@ -1,17 +1,18 @@
 <script setup lang="ts">
-import {ref, onMounted, onUnmounted} from 'vue'
-import {computed} from "@vue/reactivity"
-import {useI18n} from "vue-i18n"
+import { ref, onMounted, onUnmounted } from 'vue'
+import { computed } from '@vue/reactivity'
+import { useI18n } from 'vue-i18n'
 
 const date: Ref<Date> = ref(new Date())
-const {locale} = useI18n()
+const { locale } = useI18n()
 
 let minuteTimeout: any
 
 onMounted(() => {
   function scheduleNextMinute() {
     const now = new Date()
-    const millisecondsToNextMinute = (60 - now.getSeconds()) * 1000 - now.getMilliseconds()
+    const millisecondsToNextMinute =
+      (60 - now.getSeconds()) * 1000 - now.getMilliseconds()
     minuteTimeout = setTimeout(() => {
       date.value = new Date()
       scheduleNextMinute()
@@ -44,10 +45,12 @@ const time = computed(() => {
 
   if (minutes.length === 1) minutes = `0${minutes}`
 
-  return locale.value === 'it' ? `${hours}:${minutes}` : `${hours}:${minutes} ${period}`
+  return locale.value === 'it'
+    ? `${hours}:${minutes}`
+    : `${hours}:${minutes} ${period}`
 })
 </script>
 
 <template>
   <time class="owd-time" v-text="time" />
-</template>
+</template>

package/runtime/components/Core/Window/CoreWindow.vue

@@ -1,8 +1,8 @@
 <script setup lang="ts">
-import {ref,provide} from 'vue'
-import {computed} from "@vue/reactivity"
-import {useDesktopManager} from "@owdproject/core/runtime/composables/useDesktopManager"
-import {handleWindowControllerProps} from "@owdproject/core/runtime/utils/utilWindow"
+import { ref, provide } from 'vue'
+import { computed } from '@vue/reactivity'
+import { useDesktopManager } from '@owdproject/core/runtime/composables/useDesktopManager'
+import { handleWindowControllerProps } from '@owdproject/core/runtime/utils/utilWindow'
 
 const props = defineProps<{
   window?: IWindowController
@@ -24,11 +24,13 @@ const emit = defineEmits([
   'restore',
   'maximize',
   'unmaximize',
-  'toggle-maximize'
+  'toggle-maximize',
 ])
 
 const desktopManager = useDesktopManager() // used in <style v-bind>
-const windowController: IWindowController = handleWindowControllerProps(props.window)
+const windowController: IWindowController = handleWindowControllerProps(
+  props.window,
+)
 
 provide<IWindowController>('windowController', windowController)
 provide<WindowContent>('windowContent', props.content ?? {})
@@ -54,7 +56,7 @@ function onWindowDragMove(data: any) {
 function onWindowDragEnd(data: { left: number; top: number }) {
   windowController?.actions?.setPosition({
     x: data.left,
-    y: data.top
+    y: data.top,
   })
 
   isDragging.value = false
@@ -75,17 +77,22 @@ function onWindowResizeMove(data: any) {
 /**
  * Window end resize event
  */
-function onWindowResizeEnd(data: { left: number; top: number, width: number, height: number }) {
+function onWindowResizeEnd(data: {
+  left: number
+  top: number
+  width: number
+  height: number
+}) {
   isResizing.value = false
 
   windowController?.actions?.setPosition({
     x: data.left,
-    y: data.top
+    y: data.top,
   })
 
   windowController?.actions?.setSize({
     width: data.width,
-    height: data.height
+    height: data.height,
   })
 
   emit('resize:end', data)
@@ -112,29 +119,33 @@ const classes = computed(() => {
 
 <template>
   <vue-resizable
-      ref="windowResizableController"
-      :class="classes"
-      :width="windowController?.size.width"
-      :height="windowController?.size.height"
-      :min-height="windowController?.size.minHeight"
-      :max-width="windowController?.size.maxWidth"
-      :max-height="windowController?.size.maxHeight"
-      :left="windowController?.position?.x"
-      :top="windowController?.position?.y"
-      :active="windowController?.isResizable ? undefined : []"
-      @drag:start="onWindowDragStart"
-      @drag:move="onWindowDragMove"
-      @drag:end="onWindowDragEnd"
-      @resize:start="onWindowResizeStart"
-      @resize:move="onWindowResizeMove"
-      @resize:end="onWindowResizeEnd"
-      :style="{zIndex: windowController?.position?.z}"
-      :drag-selector="windowController?.isDraggable ? '.owd-window-nav__draggable' : '.owd-window-nav__draggable-none'"
-      @pointerdown="onWindowPointerDown"
+    ref="windowResizableController"
+    :class="classes"
+    :width="windowController?.size.width"
+    :height="windowController?.size.height"
+    :min-width="windowController?.size.minWidth"
+    :min-height="windowController?.size.minHeight"
+    :max-width="windowController?.size.maxWidth"
+    :max-height="windowController?.size.maxHeight"
+    :left="windowController?.position?.x"
+    :top="windowController?.position?.y"
+    :active="windowController?.isResizable ? undefined : []"
+    fit-parent
+    @drag:start="onWindowDragStart"
+    @drag:move="onWindowDragMove"
+    @drag:end="onWindowDragEnd"
+    @resize:start="onWindowResizeStart"
+    @resize:move="onWindowResizeMove"
+    @resize:end="onWindowResizeEnd"
+    :style="{ zIndex: windowController?.position?.z }"
+    :drag-selector="
+      windowController?.isDraggable
+        ? '.owd-window-nav__draggable'
+        : '.owd-window-nav__draggable-none'
+    "
+    @pointerdown="onWindowPointerDown"
   >
-
-    <slot/>
-
+    <slot />
   </vue-resizable>
 </template>
 
@@ -142,7 +153,8 @@ const classes = computed(() => {
 .owd-window {
   position: v-bind('desktopManager.config.windows.position');
 
-  &--dragging, &--resizing {
+  &--dragging,
+  &--resizing {
     :deep(.owd-window__content) {
       pointer-events: none;
     }
@@ -153,4 +165,4 @@ const classes = computed(() => {
     height: 100%;
   }
 }
-</style>
+</style>

package/runtime/components/Core/Window/CoreWindowContent.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-import {inject} from "vue"
-import {computed} from "@vue/reactivity"
+import { inject } from 'vue'
+import { computed } from '@vue/reactivity'
 
 const windowContent = inject<WindowContent>('windowContent')
 
@@ -25,6 +25,4 @@ const classes = computed(() => {
   </div>
 </template>
 
-<style scoped lang="scss">
-
-</style>
+<style scoped lang="scss"></style>

package/runtime/components/Core/Window/CoreWindowNav.vue

@@ -1,17 +1,23 @@
 <script setup lang="ts">
-import {inject} from "vue"
-import {computed} from "@vue/reactivity"
+import { inject } from 'vue'
+import { computed } from '@vue/reactivity'
 
 const windowController = inject<IWindowController>('windowController')
 
 const classes = computed(() => {
   const list = ['owd-window-nav']
 
-  if (typeof windowController?.state.active === 'undefined' || !!windowController?.state.active) {
+  if (
+    typeof windowController?.state.active === 'undefined' ||
+    !!windowController?.state.active
+  ) {
     list.push('owd-window-nav--active')
   }
 
-  if (typeof windowController?.state.focused === 'undefined' || !!windowController?.state.focused) {
+  if (
+    typeof windowController?.state.focused === 'undefined' ||
+    !!windowController?.state.focused
+  ) {
     list.push('owd-window-nav--focused')
   }
 
@@ -21,10 +27,9 @@ const classes = computed(() => {
 
 <template>
   <div :class="classes">
-    <div class="owd-window-nav__draggable"/>
-
-    <slot/>
+    <div class="owd-window-nav__draggable" />
 
+    <slot />
   </div>
 </template>
 

package/runtime/composables/useApplicationEntries.ts

@@ -0,0 +1,51 @@
+import { useApplicationManager } from './useApplicationManager'
+import { computed } from '@vue/reactivity'
+
+type SortBy =
+  | 'title'
+  | 'category'
+  | ((
+      a: ApplicationEntryWithInherited,
+      b: ApplicationEntryWithInherited,
+    ) => number)
+type Visibility =
+  | 'primary'
+  | 'all'
+  | ((entry: ApplicationEntryWithInherited) => boolean)
+
+export function useApplicationEntries() {
+  const applicationManager = useApplicationManager()
+
+  const sortedAppEntries = function (
+    sortBy: SortBy = 'title',
+    visibility: Visibility = 'primary',
+  ): Ref<ApplicationEntryWithInherited[]> {
+    return computed(() => {
+      const currentEntries = [...applicationManager.appsEntries]
+
+      // filtering
+      const filtered =
+        typeof visibility === 'function'
+          ? currentEntries.filter(visibility)
+          : visibility === 'primary'
+            ? currentEntries.filter((e) => e.visibility !== 'secondary')
+            : currentEntries
+
+      // sorting
+      const sorted =
+        typeof sortBy === 'function'
+          ? filtered.sort(sortBy)
+          : sortBy === 'title'
+            ? filtered.sort((a, b) =>
+                (a.title || '').localeCompare(b.title || ''),
+              )
+            : filtered.sort((a, b) =>
+                (a.category || '').localeCompare(b.category || ''),
+              )
+
+      return sorted
+    })
+  }
+
+  return { sortedAppEntries }
+}

package/runtime/composables/useApplicationManager.ts

@@ -1,7 +1,7 @@
-import {ApplicationManager} from "../core/managers/ApplicationManager";
+import { ApplicationManager } from '../core/managers/ApplicationManager'
 
 const applicationManager = new ApplicationManager()
 
 export function useApplicationManager(): IApplicationManager {
-    return applicationManager
-}
+  return applicationManager
+}

package/runtime/composables/useClipboardFs.ts

@@ -1,25 +1,25 @@
-import { ref } from 'vue';
+import { ref } from 'vue'
 
-type ClipboardOperation = 'copy' | 'cut';
+type ClipboardOperation = 'copy' | 'cut'
 
-const clipboardPath = ref<string | null>(null);
-const clipboardType = ref<ClipboardOperation | null>(null);
+const clipboardFiles = ref<string[]>([])
+const clipboardType = ref<ClipboardOperation | null>(null)
 
 export function useClipboardFs() {
-  function setClipboard(path: string, type: ClipboardOperation) {
-    clipboardPath.value = path;
-    clipboardType.value = type;
+  function setClipboard(paths: string[], type: ClipboardOperation) {
+    clipboardFiles.value = paths
+    clipboardType.value = type
   }
 
   function clearClipboard() {
-    clipboardPath.value = null;
-    clipboardType.value = null;
+    clipboardFiles.value = []
+    clipboardType.value = null
   }
 
   return {
-    clipboardPath,
+    clipboardFiles,
     clipboardType,
     setClipboard,
     clearClipboard,
-  };
+  }
 }

package/runtime/composables/useDesktopManager.ts

@@ -1,7 +1,7 @@
-import {DesktopManager} from "../core/managers/DesktopManager";
+import { DesktopManager } from '../core/managers/DesktopManager'
 
 const desktopManager = new DesktopManager()
 
 export function useDesktopManager() {
-    return desktopManager
+  return desktopManager
 }

package/runtime/composables/useTerminalManager.ts

@@ -1,7 +1,7 @@
-import {TerminalManager} from "../core/managers/TerminalManager";
+import { TerminalManager } from '../core/managers/TerminalManager'
 
 const terminalManager = new TerminalManager()
 
 export function useTerminalManager() {
-    return terminalManager
-}
+  return terminalManager
+}