esengine/packages/particle-editor/src/ParticleEditorModule.ts

/**
 * 粒子编辑器模块
 * Particle Editor Module
 *
 * Registers file handlers, panels, and templates for .particle files.
 */

import type { ServiceContainer, Entity } from '@esengine/ecs-framework';
import { Core } from '@esengine/ecs-framework';
import type {
    IEditorModuleLoader,
    PanelDescriptor,
    EntityCreationTemplate,
    ComponentInspectorProviderDef,
    FileActionHandler,
    FileCreationTemplate,
    IPlugin,
    ModuleManifest
} from '@esengine/editor-core';
import {
    PanelPosition,
    InspectorRegistry,
    EntityStoreService,
    MessageHub,
    ComponentRegistry,
    FileActionRegistry
} from '@esengine/editor-core';
import { TransformComponent } from '@esengine/engine-core';
import {
    ParticleSystemComponent,
    ParticleRuntimeModule,
    createDefaultParticleAsset
} from '@esengine/particle';

import { ParticleEditorPanel } from './panels/ParticleEditorPanel';
import { ParticleInspectorProvider } from './providers/ParticleInspectorProvider';
import { useParticleEditorStore } from './stores/ParticleEditorStore';

// 导入编辑器 CSS 样式（会被 vite 自动处理并注入到 DOM）
// Import editor CSS styles (automatically handled and injected by vite)
import './styles/ParticleEditor.css';

/**
 * 粒子编辑器模块
 * Particle Editor Module
 */
export class ParticleEditorModule implements IEditorModuleLoader {
    async install(services: ServiceContainer): Promise<void> {
        // 注册检视器提供者 | Register inspector provider
        const inspectorRegistry = services.resolve(InspectorRegistry);
        if (inspectorRegistry) {
            inspectorRegistry.register(new ParticleInspectorProvider());
        }

        // 注册组件到编辑器组件注册表 | Register to editor component registry
        const componentRegistry = services.resolve(ComponentRegistry);
        if (componentRegistry) {
            componentRegistry.register({
                name: 'ParticleSystem',
                type: ParticleSystemComponent,
                category: 'components.category.effects',
                description: 'Particle system for 2D visual effects',
                icon: 'Sparkles'
            });
        }

        // 注册资产创建消息映射 | Register asset creation message mappings
        const fileActionRegistry = services.resolve(FileActionRegistry);
        if (fileActionRegistry) {
            fileActionRegistry.registerAssetCreationMapping({
                extension: '.particle',
                createMessage: 'particle:create-asset'
            });
        }
    }

    async uninstall(): Promise<void> {
        // 清理 | Clean up
    }

    getPanels(): PanelDescriptor[] {
        return [
            {
                id: 'particle-editor',
                title: 'Particle Editor',
                position: PanelPosition.Center,
                closable: true,
                component: ParticleEditorPanel,
                isDynamic: true
            }
        ];
    }

    getInspectorProviders(): ComponentInspectorProviderDef[] {
        return [
            {
                componentType: 'ParticleSystem',
                priority: 100,
                render: (component, entity, onChange) => {
                    const provider = new ParticleInspectorProvider();
                    return provider.render(
                        { entityId: String(entity.id), component },
                        { target: component, onChange }
                    );
                }
            }
        ];
    }

    getEntityCreationTemplates(): EntityCreationTemplate[] {
        return [
            {
                id: 'create-particle-entity',
                label: '创建粒子效果',
                icon: 'Sparkles',
                category: 'effects',
                order: 100,
                create: (): number => {
                    const scene = Core.scene;
                    if (!scene) {
                        throw new Error('Scene not available');
                    }

                    const entityStore = Core.services.resolve(EntityStoreService);
                    const messageHub = Core.services.resolve(MessageHub);

                    if (!entityStore || !messageHub) {
                        throw new Error('EntityStoreService or MessageHub not available');
                    }

                    const particleCount = entityStore.getAllEntities()
                        .filter((e: Entity) => e.name.startsWith('ParticleSystem ')).length;
                    const entityName = `ParticleSystem ${particleCount + 1}`;

                    const entity = scene.createEntity(entityName);
                    entity.addComponent(new TransformComponent());
                    entity.addComponent(new ParticleSystemComponent());

                    entityStore.addEntity(entity);
                    messageHub.publish('entity:added', { entity });
                    messageHub.publish('scene:modified', {});
                    entityStore.selectEntity(entity);

                    return entity.id;
                }
            }
        ];
    }

    getFileActionHandlers(): FileActionHandler[] {
        return [
            {
                extensions: ['particle', 'json'],
                onDoubleClick: (filePath: string) => {
                    // 只处理 .particle 和 .particle.json 文件
                    // Only handle .particle and .particle.json files
                    const lowerPath = filePath.toLowerCase();
                    if (!lowerPath.endsWith('.particle') && !lowerPath.endsWith('.particle.json')) {
                        return;
                    }

                    // 先设置待打开的文件路径到 store
                    // Set pending file path to store first
                    useParticleEditorStore.getState().setPendingFilePath(filePath);

                    const messageHub = Core.services.resolve(MessageHub);
                    if (messageHub) {
                        // 打开粒子编辑器面板（面板挂载后会从 store 读取 pendingFilePath）
                        // Open particle editor panel (panel will read pendingFilePath from store after mount)
                        messageHub.publish('dynamic-panel:open', {
                            panelId: 'particle-editor',
                            title: `Particle Editor - ${filePath.split(/[\\/]/).pop()}`
                        });
                    }
                }
            }
        ];
    }

    getFileCreationTemplates(): FileCreationTemplate[] {
        return [
            {
                id: 'create-particle',
                label: 'Particle Effect',
                extension: 'particle',
                icon: 'Sparkles',
                category: 'effects',
                getContent: (fileName: string) => {
                    const assetData = createDefaultParticleAsset(fileName.replace('.particle', ''));
                    return JSON.stringify(assetData, null, 2);
                }
            }
        ];
    }
}

export const particleEditorModule = new ParticleEditorModule();

/**
 * 粒子插件清单
 * Particle Plugin Manifest
 */
const manifest: ModuleManifest = {
    id: '@esengine/particle',
    name: '@esengine/particle',
    displayName: 'Particle System',
    version: '1.0.0',
    description: 'Particle system for 2D visual effects',
    category: 'Rendering',
    isCore: false,
    defaultEnabled: true,
    isEngineModule: true,
    canContainContent: true,
    dependencies: ['engine-core'],
    exports: {
        components: ['ParticleSystemComponent'],
        systems: ['ParticleUpdateSystem'],
        loaders: ['ParticleLoader']
    }
};

/**
 * 完整的粒子插件（运行时 + 编辑器）
 * Complete Particle Plugin (runtime + editor)
 */
export const ParticlePlugin: IPlugin = {
    manifest,
    runtimeModule: new ParticleRuntimeModule(),
    editorModule: particleEditorModule
};

export default particleEditorModule;