@owdproject/core 3.1.2 → 3.1.4-beta.0

package/runtime/core/controllers/WindowController.ts

@@ -1,430 +1,467 @@
-import {useApplicationManager} from '../../composables/useApplicationManager'
-import {useDesktopWindowStore} from '../../stores/storeDesktopWindow'
-import {deepClone} from '../../utils/utilCommon'
-import {markRaw} from '@vue/reactivity'
-import {defineAsyncComponent} from "vue"
+import { useApplicationManager } from '../../composables/useApplicationManager'
+import { useDesktopWindowStore } from '../../stores/storeDesktopWindow'
+import { deepClone } from '../../utils/utilCommon'
+import { markRaw } from '@vue/reactivity'
+import { defineAsyncComponent } from 'vue'
 
 export class WindowController implements IWindowController {
-    public readonly application: IApplicationController
+  public readonly application: IApplicationController
 
-    public readonly instanced: boolean = true
-    public readonly model: string
+  public readonly instanced: boolean = true
+  public readonly model: string
 
-    public config: WindowConfig = {
-        title: '',
-        category: '',
+  public config: WindowConfig = {
+    title: '',
+    category: '',
 
-        component: undefined,
+    component: undefined,
 
-        // position
-        position: {
-            x: 0,
-            y: 0,
-            z: 0,
-        },
+    // position
+    position: {
+      x: 0,
+      y: 0,
+      z: 0,
+    },
 
-        // sizes
-        size: {
-            width: undefined,
-            height: undefined,
-        },
+    // sizes
+    size: {
+      width: undefined,
+      height: undefined,
+    },
 
-        // minimize
-        minimizable: true,
+    // minimize
+    minimizable: true,
 
-        // maximize
-        maximized: false,
-        maximizable: false,
+    // maximize
+    maximized: false,
+    maximizable: false,
 
-        // destroy
-        destroyable: true,
+    // destroy
+    destroyable: true,
 
-        // draggable
-        draggable: true,
+    // draggable
+    draggable: true,
 
-        // resizable
-        resizable: true,
-    }
+    // resizable
+    resizable: true,
+  }
+
+  public override: WindowOverride = {}
 
-    public override: WindowOverride = {}
+  private storedState: WindowStoredState
 
-    private storedState: WindowStoredState
+  constructor(
+    application: IApplicationController,
+    model: string,
+    windowConfig: WindowConfig,
+    windowStoredState: WindowStoredState,
+  ) {
+    this.application = application
+    this.model = model
 
-    constructor(
-        application: IApplicationController,
-        model: string,
-        windowConfig: WindowConfig,
-        windowStoredState: WindowStoredState,
-    ) {
-        this.application = application
-        this.model = model
+    this.storedState = windowStoredState
 
-        this.storedState = windowStoredState
+    this.setConfig(windowConfig)
 
-        this.setConfig(windowConfig)
+    this.restoreState()
+  }
 
-        this.restoreState()
+  private setConfig(config: WindowConfig) {
+    // component
+    if (config.component) {
+      this.config.component = markRaw(defineAsyncComponent(config.component))
     }
 
-    private setConfig(config: WindowConfig) {
-        // component
-        if (config.component) {
-            this.config.component = markRaw(
-                defineAsyncComponent(config.component)
-            )
-        }
+    // title
+    if (config.title) this.config.title = config.title
+    if (config.icon) this.config.icon = config.icon
 
-        // title
-        if (config.title) this.config.title = config.title
-        if (config.icon) this.config.icon = config.icon
-
-        // position
-        if (!this.config.position) this.config.position = { x: 0, y: 0, z: 0 }
-        if (config.position?.x) this.config.position.x = config.position.x
-        if (config.position?.y) this.config.position.y = config.position.y
-        if (config.position?.z) this.config.position.z = config.position.z
-
-        // sizes
-        if (config.size?.width) this.config.size.width = config.size.width
-        if (config.size?.height) this.config.size.height = config.size.height
-        if (config.size?.minWidth) this.config.size.minWidth = config.size.minWidth
-        if (config.size?.minHeight) this.config.size.minHeight = config.size.minHeight
-        if (config.size?.maxWidth) this.config.size.maxWidth = config.size.maxWidth
-        if (config.size?.maxHeight) this.config.size.maxHeight = config.size.maxHeight
-
-        // minimize
-        if (typeof config.minimizable !== 'undefined') {
-            this.config.minimizable = config.minimizable
-        }
-        if (typeof config.maximizable !== 'undefined') {
-            this.config.maximizable = config.maximizable
-        }
+    // position
+    if (!this.config.position) this.config.position = { x: 0, y: 0, z: 0 }
+    if (config.position?.x) this.config.position.x = config.position.x
+    if (config.position?.y) this.config.position.y = config.position.y
+    if (config.position?.z) this.config.position.z = config.position.z
 
-        // maximize
-        if (typeof config.maximized !== 'undefined') {
-            this.config.maximized = config.maximized
-        }
+    // sizes
+    if (config.size?.width) this.config.size.width = config.size.width
+    if (config.size?.height) this.config.size.height = config.size.height
+    if (config.size?.minWidth) this.config.size.minWidth = config.size.minWidth
+    if (config.size?.minHeight)
+      this.config.size.minHeight = config.size.minHeight
+    if (config.size?.maxWidth) this.config.size.maxWidth = config.size.maxWidth
+    if (config.size?.maxHeight)
+      this.config.size.maxHeight = config.size.maxHeight
 
-        // draggable
-        if (typeof config.draggable !== 'undefined') {
-            this.config.draggable = config.draggable
-        }
+    // minimize
+    if (typeof config.minimizable !== 'undefined') {
+      this.config.minimizable = config.minimizable
+    }
+    if (typeof config.maximizable !== 'undefined') {
+      this.config.maximizable = config.maximizable
+    }
 
-        // resizable
-        if (typeof config.resizable !== 'undefined') {
-            this.config.resizable = config.resizable
-        }
+    // maximize
+    if (typeof config.maximized !== 'undefined') {
+      this.config.maximized = config.maximized
+    }
 
-        // destroy
-        if (typeof config.destroyable !== 'undefined') {
-            this.config.destroyable = config.destroyable
-        }
+    // draggable
+    if (typeof config.draggable !== 'undefined') {
+      this.config.draggable = config.draggable
+    }
 
-        const DEFAULT_OVERRIDABLE = {
-            draggable: true,
-            resizable: false,
-            position: false,
-            size: false,
-            maximized: false,
-            destroyable: false,
-            minimizable: false,
-            maximizable: false,
-        }
+    // resizable
+    if (typeof config.resizable !== 'undefined') {
+      this.config.resizable = config.resizable
+    }
 
-        DEFAULT_OVERRIDABLE.position = DEFAULT_OVERRIDABLE.draggable
-        DEFAULT_OVERRIDABLE.size = DEFAULT_OVERRIDABLE.resizable
-        DEFAULT_OVERRIDABLE.maximized = DEFAULT_OVERRIDABLE.maximizable
+    // destroy
+    if (typeof config.destroyable !== 'undefined') {
+      this.config.destroyable = config.destroyable
+    }
 
-        this.config.overridable = {
-            ...DEFAULT_OVERRIDABLE,
-            ...(config.overridable || {})
-        }
+    const DEFAULT_OVERRIDABLE = {
+      draggable: true,
+      resizable: false,
+      position: false,
+      size: false,
+      maximized: false,
+      destroyable: false,
+      minimizable: false,
+      maximizable: false,
     }
 
-    // state
+    DEFAULT_OVERRIDABLE.position = DEFAULT_OVERRIDABLE.draggable
+    DEFAULT_OVERRIDABLE.size = DEFAULT_OVERRIDABLE.resizable
+    DEFAULT_OVERRIDABLE.maximized = DEFAULT_OVERRIDABLE.maximizable
 
-    get state() {
-        return this.storedState.state
+    this.config.overridable = {
+      ...DEFAULT_OVERRIDABLE,
+      ...(config.overridable || {}),
     }
+  }
 
-    private restoreState() {
-        const overridable = this.config.overridable || {}
+  // state
 
-        for (const key in overridable) {
-            if (overridable[key as keyof typeof overridable]) {
-                const stateKey = key as keyof WindowState
+  get state() {
+    return this.storedState.state
+  }
 
-                if (typeof this.state[stateKey] === 'undefined') {
-                    if (typeof this.config[stateKey] === 'object') {
-                        this.state[stateKey] = deepClone(this.config[stateKey])
-                    } else {
-                        this.state[stateKey] = !!this.config[stateKey]
-                    }
-                }
-            }
-        }
-    }
+  private restoreState() {
+    const overridable = this.config.overridable || {}
 
-    // meta
+    for (const key in overridable) {
+      if (overridable[key as keyof typeof overridable]) {
+        const stateKey = key as keyof WindowState
 
-    get meta() {
-        return this.storedState.meta
+        if (typeof this.state[stateKey] === 'undefined') {
+          if (typeof this.config[stateKey] === 'object') {
+            this.state[stateKey] = deepClone(this.config[stateKey])
+          } else {
+            this.state[stateKey] = !!this.config[stateKey]
+          }
+        }
+      }
     }
+  }
 
-    // position
+  private setState(state: WindowState) {
+    this.storedState.state = state
+  }
 
-    private setPosition(data: { x: number, y: number}) {
-        if (!this.state.position) {
-            this.state.position = { x: 0, y: 0}
-        }
+  // meta
 
-        this.state.position.x = data.x
-        this.state.position.y = data.y
-    }
+  get meta() {
+    return this.storedState.meta
+  }
 
-    private setActive(value: boolean) {
-        this.state.active = value
-    }
+  // position
 
-    private setFocus(value: boolean) {
-        this.state.focused = value
+  public setPosition(data: { x: number; y: number }) {
+    if (!this.state.position) {
+      this.state.position = { x: 0, y: 0 }
     }
 
-    private bringToFront() {
-        const applicationManager = useApplicationManager()
-        const desktopWindowStore = useDesktopWindowStore()
+    this.state.position.x = data.x
+    this.state.position.y = data.y
+  }
 
-        if (!this.state.position) {
-            this.state.position = { x: 0, y: 0, z: 0 }
-        }
+  public setActive(value: boolean) {
+    this.state.active = value
+  }
 
-        // already focused
-        if (this.state.focused) {
-            return
-        }
+  public setFocus(value: boolean) {
+    this.state.focused = value
+  }
 
-        // set focus false on all other windows
-        for (const [windowId, window] of applicationManager.windowsOpened) {
-            window.actions.setFocus(false)
-        }
+  public focus() {
+    const applicationManager = useApplicationManager()
+    const desktopWindowStore = useDesktopWindowStore()
 
-        this.setFocus(true)
-
-        this.state.position.z = desktopWindowStore.incrementPositionZ()
+    if (!this.state.position) {
+      this.state.position = { x: 0, y: 0, z: 0 }
     }
 
-    // common
+    // already focused
+    if (this.state.focused) {
+      return
+    }
 
-    get title(): string {
-        if (typeof this.override.title !== 'undefined') {
-            return this.override.title
-        }
+    // set focus false on all other windows
+    for (const [windowId, window] of applicationManager.windowsOpened) {
+      window.actions.setFocus(false)
+    }
 
-        if (this.config.title) {
-            return this.config.title
-        }
+    this.setFocus(true)
 
-        return this.application.config.title
-    }
+    this.state.position.z = desktopWindowStore.incrementPositionZ()
+  }
 
-    get icon() {
-        if (typeof this.override.icon !== 'undefined') {
-            return this.override.icon
-        }
+  // common
 
-        if (this.config.icon) {
-            return this.config.icon
-        }
+  get title(): string {
+    if (typeof this.override.title !== 'undefined') {
+      return this.override.title
+    }
 
-        return this.application.config.icon
+    if (this.config.title) {
+      return this.config.title
     }
 
-    // position
+    return this.application.config.title
+  }
 
-    get position() {
-        if (typeof this.state.position === 'undefined') {
-            return this.config.position
-        }
+  get icon() {
+    if (typeof this.override.icon !== 'undefined') {
+      return this.override.icon
+    }
 
-        return this.state.position
+    if (this.config.icon) {
+      return this.config.icon
     }
 
-    // sizes
+    return this.application.config.icon
+  }
 
-    get size() {
-        const stateSize = this.state.size || {}
-        const configSize = this.config.size || {}
-
-        return {
-            width: typeof stateSize.width !== 'undefined' ? stateSize.width : configSize.width,
-            height: typeof stateSize.height !== 'undefined' ? stateSize.height : configSize.height,
-            minWidth: typeof stateSize.minWidth !== 'undefined' ? stateSize.minWidth : configSize.minWidth,
-            maxWidth: typeof stateSize.maxWidth !== 'undefined' ? stateSize.maxWidth : configSize.maxWidth,
-            minHeight: typeof stateSize.minHeight !== 'undefined' ? stateSize.minHeight : configSize.minHeight,
-            maxHeight: typeof stateSize.maxHeight !== 'undefined' ? stateSize.maxHeight : (configSize.maxHeight ?? 600),
-        }
+  // position
+
+  get position() {
+    if (typeof this.state.position === 'undefined') {
+      return this.config.position
     }
 
-    private setSize(data: { width: number, height: number}) {
-        if (!this.state.size) {
-            this.state.size = { width: undefined, height: undefined }
-        }
+    return this.state.position
+  }
+
+  // sizes
+
+  get size() {
+    const stateSize = this.state.size || {}
+    const configSize = this.config.size || {}
+
+    return {
+      width:
+        typeof stateSize.width !== 'undefined'
+          ? stateSize.width
+          : configSize.width,
+      height:
+        typeof stateSize.height !== 'undefined'
+          ? stateSize.height
+          : configSize.height,
+      minWidth:
+        typeof stateSize.minWidth !== 'undefined'
+          ? stateSize.minWidth
+          : configSize.minWidth,
+      maxWidth:
+        typeof stateSize.maxWidth !== 'undefined'
+          ? stateSize.maxWidth
+          : configSize.maxWidth,
+      minHeight:
+        typeof stateSize.minHeight !== 'undefined'
+          ? stateSize.minHeight
+          : configSize.minHeight,
+      maxHeight:
+        typeof stateSize.maxHeight !== 'undefined'
+          ? stateSize.maxHeight
+          : (configSize.maxHeight ?? 600),
+    }
+  }
 
-        this.state.size.width = data.width
-        this.state.size.height = data.height
+  public setSize(data: { width: number; height: number }) {
+    if (!this.state.size) {
+      this.state.size = { width: undefined, height: undefined }
     }
 
-    // minimize
+    this.state.size.width = data.width
+    this.state.size.height = data.height
+  }
 
-    get isMinimizable() {
-        if (this.config.overridable?.minimizable) {
-            return !!this.state.minimizable
-        }
+  // minimize
 
-        return !!this.config.minimizable
+  get isMinimizable() {
+    if (this.config.overridable?.minimizable) {
+      return !!this.state.minimizable
     }
 
-    private minimize() {
-        if (!this.isMinimizable) {
-            return false
-        }
+    return !!this.config.minimizable
+  }
 
-        this.state.active = false
-        return true
+  public minimize() {
+    if (!this.isMinimizable) {
+      return false
     }
 
-    private toggleMinimize() {
-        this.state.active = !this.state.active
-        this.bringToFront()
-    }
+    this.state.active = false
+    return true
+  }
 
-    // maximize
+  public unminimize() {
+    this.state.active = true
+    return true
+  }
 
-    get isMaximizable() {
-        if (typeof this.state.maximizable === 'undefined') {
-            return !!this.config.maximizable
-        }
+  public toggleMinimize() {
+    this.state.active = !this.state.active
+    this.focus()
+  }
+
+  // maximize
 
-        return this.state.maximizable
+  get isMaximizable() {
+    if (typeof this.state.maximizable === 'undefined') {
+      return !!this.config.maximizable
     }
 
-    get isMaximized() {
-        if (this.config.overridable?.maximized) {
-            return !!this.state.maximized
-        }
+    return this.state.maximizable
+  }
 
-        return !!this.config.maximized
+  get isMaximized() {
+    if (this.config.overridable?.maximized) {
+      return !!this.state.maximized
     }
 
-    private toggleMaximize() {
-        if (!this.isMaximizable) {
-            return false
-        }
+    return !!this.config.maximized
+  }
 
-        this.state.maximized = !this.state.maximized
-        return true
+  public toggleMaximize() {
+    if (!this.isMaximizable) {
+      return false
     }
 
-    private maximize() {
-        if (!this.isMaximizable) {
-            return false
-        }
+    this.state.maximized = !this.state.maximized
+    return true
+  }
 
-        this.state.maximized = true
-        return true
+  public maximize() {
+    if (!this.isMaximizable) {
+      return false
     }
 
-    private unmaximize() {
-        if (!this.isMaximizable) {
-            return false
-        }
+    this.state.maximized = true
+    return true
+  }
 
-        this.state.maximized = false
-        return true
+  public unmaximize() {
+    if (!this.isMaximizable) {
+      return false
     }
 
-    // destroy
+    this.state.maximized = false
+    return true
+  }
 
-    get isDestroyable() {
-        if (this.config.overridable?.destroyable) {
-            return !!this.state.destroyable
-        }
+  // destroy
 
-        return !!this.config.destroyable
+  get isDestroyable() {
+    if (this.config.overridable?.destroyable) {
+      return !!this.state.destroyable
     }
 
-    private destroy() {
-        if (!this.isDestroyable) {
-            return false
-        }
-
-        this.application.closeWindow(this.state.id)
+    return !!this.config.destroyable
+  }
 
-        return true
+  public destroy() {
+    if (!this.isDestroyable) {
+      return false
     }
 
-    // draggable
-    get isDraggable() {
-        if (this.config.overridable?.draggable) {
-            return !!this.state.draggable
-        }
+    this.application.closeWindow(this.state.id)
+
+    return true
+  }
 
-        return !!this.config.draggable
+  // draggable
+  get isDraggable() {
+    if (this.config.overridable?.draggable) {
+      return !!this.state.draggable
     }
 
-    // resizable
-    get isResizable() {
-        if (this.config.overridable?.resizable) {
-            return !!this.state.resizable
-        }
+    return !!this.config.draggable
+  }
 
-        return !!this.config.resizable
+  // resizable
+  get isResizable() {
+    if (this.config.overridable?.resizable) {
+      return !!this.state.resizable
     }
 
-    // workspace
-    private setWorkspace(workspaceId: string) {
-        this.state.workspace = workspaceId
-    }
+    return !!this.config.resizable
+  }
 
-    // override
+  // workspace
+  public setWorkspace(workspaceId: string) {
+    this.state.workspace = workspaceId
+  }
 
-    setTitleOverride(value: undefined|string) {
-        this.override.title = value
-    }
+  // override
 
-    resetTitleOverride() {
-        this.override.title = undefined
-    }
+  public setTitleOverride(value: undefined | string) {
+    this.override.title = value
+  }
 
-    get actions() {
-        return {
-            // position
-            setActive: this.setActive.bind(this),
-            setFocus: this.setFocus.bind(this),
-            bringToFront: this.bringToFront.bind(this),
-            setPosition: this.setPosition.bind(this),
+  public resetTitleOverride() {
+    this.override.title = undefined
+  }
 
-            // size
-            setSize: this.setSize.bind(this),
+  // menu
 
-            // minimize
-            minimize: this.minimize.bind(this),
-            toggleMinimize: this.toggleMinimize.bind(this),
+  public menu: any[] = []
 
-            // maximize
-            toggleMaximize: this.toggleMaximize.bind(this),
-            maximize: this.maximize.bind(this),
-            unmaximize: this.unmaximize.bind(this),
+  public setMenu(menu: any[]) {
+    this.menu = menu
+  }
 
-            // destroy
-            destroy: this.destroy.bind(this),
+  // deprecated ?
+  get actions() {
+    return {
+      // position
+      setActive: this.setActive.bind(this),
+      setFocus: this.setFocus.bind(this),
+      bringToFront: this.focus.bind(this),
+      focus: this.focus.bind(this),
+      setPosition: this.setPosition.bind(this),
 
-            // workspace
-            setWorkspace: this.setWorkspace.bind(this),
+      // size
+      setSize: this.setSize.bind(this),
 
-            // override
-            setTitleOverride: this.setTitleOverride.bind(this),
-            resetTitleOverride: this.resetTitleOverride.bind(this),
-        }
+      // minimize
+      minimize: this.minimize.bind(this),
+      toggleMinimize: this.toggleMinimize.bind(this),
+
+      // maximize
+      toggleMaximize: this.toggleMaximize.bind(this),
+      maximize: this.maximize.bind(this),
+      unmaximize: this.unmaximize.bind(this),
+
+      // destroy
+      destroy: this.destroy.bind(this),
+
+      // workspace
+      setWorkspace: this.setWorkspace.bind(this),
+
+      // override
+      setTitleOverride: this.setTitleOverride.bind(this),
+      resetTitleOverride: this.resetTitleOverride.bind(this),
     }
+  }
 }