106 lines
2.9 KiB
TypeScript
106 lines
2.9 KiB
TypeScript
|
import { ref, computed } from 'vue';
|
||
|
import { defineStore } from 'pinia';
|
||
|
import type { AppInfo } from './apps';
|
||
|
|
||
|
export interface DesktopIconPosition {
|
||
|
appId: string;
|
||
|
x: number;
|
||
|
y: number;
|
||
|
}
|
||
|
|
||
|
export const useDesktopStore = defineStore('desktop', () => {
|
||
|
// Desktop icon positions
|
||
|
const iconPositions = ref<DesktopIconPosition[]>([]);
|
||
|
|
||
|
// Default grid positions for new icons
|
||
|
const getNextGridPosition = () => {
|
||
|
const iconSize = 80;
|
||
|
const padding = 20;
|
||
|
|
||
|
// Check if we're in browser environment
|
||
|
const screenWidth = typeof window !== 'undefined' ? window.innerWidth : 1200;
|
||
|
const cols = Math.floor((screenWidth - padding) / (iconSize + padding));
|
||
|
|
||
|
const currentCount = iconPositions.value.length;
|
||
|
const row = Math.floor(currentCount / cols);
|
||
|
const col = currentCount % cols;
|
||
|
|
||
|
return {
|
||
|
x: padding + col * (iconSize + padding),
|
||
|
y: 48 + padding + row * (iconSize + padding) // Below taskbar
|
||
|
};
|
||
|
};
|
||
|
|
||
|
// Initialize desktop icons for available apps
|
||
|
function initializeDesktopIcons(apps: AppInfo[]) {
|
||
|
if (iconPositions.value.length === 0) {
|
||
|
apps.forEach((app, index) => {
|
||
|
const position = getNextGridPosition();
|
||
|
iconPositions.value.push({
|
||
|
appId: app.id,
|
||
|
x: position.x,
|
||
|
y: position.y
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Update icon position
|
||
|
function updateIconPosition(appId: string, x: number, y: number) {
|
||
|
const icon = iconPositions.value.find(pos => pos.appId === appId);
|
||
|
if (icon) {
|
||
|
icon.x = x;
|
||
|
icon.y = y;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Get icon position
|
||
|
function getIconPosition(appId: string) {
|
||
|
return iconPositions.value.find(pos => pos.appId === appId);
|
||
|
}
|
||
|
|
||
|
// Add new icon to desktop
|
||
|
function addIconToDesktop(appId: string) {
|
||
|
const existing = iconPositions.value.find(pos => pos.appId === appId);
|
||
|
if (!existing) {
|
||
|
const position = getNextGridPosition();
|
||
|
iconPositions.value.push({
|
||
|
appId,
|
||
|
x: position.x,
|
||
|
y: position.y
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
|
||
|
// Remove icon from desktop
|
||
|
function removeIconFromDesktop(appId: string) {
|
||
|
iconPositions.value = iconPositions.value.filter(pos => pos.appId !== appId);
|
||
|
}
|
||
|
|
||
|
// Auto-arrange icons in grid
|
||
|
function arrangeIconsInGrid() {
|
||
|
const iconSize = 80;
|
||
|
const padding = 20;
|
||
|
const screenWidth = typeof window !== 'undefined' ? window.innerWidth : 1200;
|
||
|
const cols = Math.floor((screenWidth - padding) / (iconSize + padding));
|
||
|
|
||
|
iconPositions.value.forEach((icon, index) => {
|
||
|
const row = Math.floor(index / cols);
|
||
|
const col = index % cols;
|
||
|
|
||
|
icon.x = padding + col * (iconSize + padding);
|
||
|
icon.y = 48 + padding + row * (iconSize + padding);
|
||
|
});
|
||
|
}
|
||
|
|
||
|
return {
|
||
|
iconPositions,
|
||
|
initializeDesktopIcons,
|
||
|
updateIconPosition,
|
||
|
getIconPosition,
|
||
|
addIconToDesktop,
|
||
|
removeIconFromDesktop,
|
||
|
arrangeIconsInGrid,
|
||
|
};
|
||
|
});
|