89 lines
2.7 KiB
TypeScript
89 lines
2.7 KiB
TypeScript
import { v4 as uuidV4 } from 'uuid';
|
|
import XSystem from '../../XSystem.ts'
|
|
import type { IProcess } from '@/core/process/IProcess.ts'
|
|
import type { IWindowForm } from '@/core/window/IWindowForm.ts'
|
|
import type { IWindowFormConfig } from '@/core/window/types/IWindowFormConfig.ts'
|
|
import type { WindowFormPos } from '@/core/window/types/WindowFormTypes.ts'
|
|
import { processManager } from '@/core/process/ProcessManager.ts'
|
|
import { DraggableResizable } from '@/core/utils/DraggableResizable.ts'
|
|
import { DraggableResizableWindow } from '@/core/utils/DraggableResizableWindow.ts'
|
|
|
|
export default class WindowFormImpl implements IWindowForm {
|
|
private readonly _id: string = uuidV4();
|
|
private readonly _procId: string;
|
|
private pos: WindowFormPos = { x: 0, y: 0 };
|
|
private width: number = 0;
|
|
private height: number = 0;
|
|
|
|
public get id() {
|
|
return this._id;
|
|
}
|
|
public get proc() {
|
|
return processManager.findProcessById(this._procId)
|
|
}
|
|
private get desktopRootDom() {
|
|
return XSystem.instance.desktopRootDom;
|
|
}
|
|
|
|
constructor(proc: IProcess, config: IWindowFormConfig) {
|
|
this._procId = proc.id;
|
|
console.log('WindowForm')
|
|
this.pos = {
|
|
x: config.left ?? 0,
|
|
y: config.top ?? 0
|
|
}
|
|
this.width = config.width ?? 0;
|
|
this.height = config.height ?? 0;
|
|
|
|
this.createWindowFrom();
|
|
}
|
|
|
|
public createWindowFrom() {
|
|
const dom = document.createElement('div');
|
|
dom.style.position = 'absolute';
|
|
dom.style.left = `${this.pos.x}px`;
|
|
dom.style.top = `${this.pos.y}px`;
|
|
dom.style.width = `${this.width}px`;
|
|
dom.style.height = `${this.height}px`;
|
|
dom.style.zIndex = '100';
|
|
dom.style.backgroundColor = 'white';
|
|
const div = document.createElement('div');
|
|
div.style.width = '100%';
|
|
div.style.height = '20px';
|
|
div.style.backgroundColor = 'red';
|
|
dom.appendChild(div)
|
|
const bt1 = document.createElement('button');
|
|
bt1.innerText = '最小化';
|
|
bt1.addEventListener('click', () => {
|
|
win.minimize();
|
|
})
|
|
div.appendChild(bt1)
|
|
const bt2 = document.createElement('button');
|
|
bt2.innerText = '最大化';
|
|
bt2.addEventListener('click', () => {
|
|
win.maximize();
|
|
})
|
|
div.appendChild(bt2)
|
|
const bt3 = document.createElement('button');
|
|
bt3.innerText = '关闭';
|
|
bt3.addEventListener('click', () => {
|
|
this.desktopRootDom.removeChild(dom)
|
|
win.destroy();
|
|
this.proc?.windowForms.delete(this.id);
|
|
processManager.removeProcess(this.proc!)
|
|
})
|
|
div.appendChild(bt3)
|
|
|
|
const win = new DraggableResizableWindow({
|
|
target: dom,
|
|
handle: div,
|
|
snapAnimation: true,
|
|
snapThreshold: 20,
|
|
boundary: document.body,
|
|
taskbarElementId: '#taskbar',
|
|
})
|
|
|
|
this.desktopRootDom.appendChild(dom);
|
|
}
|
|
}
|