refactor(editor): 提取行为树编辑器为独立包并重构编辑器架构 (#216)
* refactor(editor): 提取行为树编辑器为独立包并重构编辑器架构 * feat(editor): 添加插件市场功能 * feat(editor): 重构插件市场以支持版本管理和ZIP打包 * feat(editor): 重构插件发布流程并修复React渲染警告 * fix(plugin): 修复插件发布和市场的路径不一致问题 * feat: 重构插件发布流程并添加插件删除功能 * fix(editor): 完善插件删除功能并修复多个关键问题 * fix(auth): 修复自动登录与手动登录的竞态条件问题 * feat(editor): 重构插件管理流程 * feat(editor): 支持 ZIP 文件直接发布插件 - 新增 PluginSourceParser 解析插件源 - 重构发布流程支持文件夹和 ZIP 两种方式 - 优化发布向导 UI * feat(editor): 插件市场支持多版本安装 - 插件解压到项目 plugins 目录 - 新增 Tauri 后端安装/卸载命令 - 支持选择任意版本安装 - 修复打包逻辑,保留完整 dist 目录结构 * feat(editor): 个人中心支持多版本管理 - 合并同一插件的不同版本 - 添加版本历史展开/折叠功能 - 禁止有待审核 PR 时更新插件 * fix(editor): 修复 InspectorRegistry 服务注册 - InspectorRegistry 实现 IService 接口 - 注册到 Core.services 供插件使用 * feat(behavior-tree-editor): 完善插件注册和文件操作 - 添加文件创建模板和操作处理器 - 实现右键菜单创建行为树功能 - 修复文件读取权限问题(使用 Tauri 命令) - 添加 BehaviorTreeEditorPanel 组件 - 修复 rollup 配置支持动态导入 * feat(plugin): 完善插件构建和发布流程 * fix(behavior-tree-editor): 完整恢复编辑器并修复 Toast 集成 * fix(behavior-tree-editor): 修复节点选中、连线跟随和文件加载问题并优化性能 * fix(behavior-tree-editor): 修复端口连接失败问题并优化连线样式 * refactor(behavior-tree-editor): 移除调试面板功能简化代码结构 * refactor(behavior-tree-editor): 清理冗余代码合并重复逻辑 * feat(behavior-tree-editor): 完善编辑器核心功能增强扩展性 * fix(lint): 修复ESLint错误确保CI通过 * refactor(behavior-tree-editor): 优化编辑器工具栏和编译器功能 * refactor(behavior-tree-editor): 清理技术债务,优化代码质量 * fix(editor-app): 修复字符串替换安全问题
This commit is contained in:
132
packages/behavior-tree-editor/src/hooks/useDropHandler.ts
Normal file
132
packages/behavior-tree-editor/src/hooks/useDropHandler.ts
Normal file
@@ -0,0 +1,132 @@
|
||||
import { useState, RefObject } from 'react';
|
||||
import { NodeTemplate, NodeType } from '@esengine/behavior-tree';
|
||||
import { Position } from '../domain/value-objects/Position';
|
||||
import { useNodeOperations } from './useNodeOperations';
|
||||
import { createLogger } from '@esengine/ecs-framework';
|
||||
|
||||
const logger = createLogger('useDropHandler');
|
||||
|
||||
interface DraggedVariableData {
|
||||
variableName: string;
|
||||
}
|
||||
|
||||
interface UseDropHandlerParams {
|
||||
canvasRef: RefObject<HTMLDivElement>;
|
||||
canvasOffset: { x: number; y: number };
|
||||
canvasScale: number;
|
||||
nodeOperations: ReturnType<typeof useNodeOperations>;
|
||||
onNodeCreate?: (template: NodeTemplate, position: { x: number; y: number }) => void;
|
||||
}
|
||||
|
||||
export function useDropHandler(params: UseDropHandlerParams) {
|
||||
const {
|
||||
canvasRef,
|
||||
canvasOffset,
|
||||
canvasScale,
|
||||
nodeOperations,
|
||||
onNodeCreate
|
||||
} = params;
|
||||
|
||||
const [isDragging, setIsDragging] = useState(false);
|
||||
|
||||
const handleDrop = (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
setIsDragging(false);
|
||||
|
||||
try {
|
||||
const rect = canvasRef.current?.getBoundingClientRect();
|
||||
if (!rect) return;
|
||||
|
||||
const position = {
|
||||
x: (e.clientX - rect.left - canvasOffset.x) / canvasScale,
|
||||
y: (e.clientY - rect.top - canvasOffset.y) / canvasScale
|
||||
};
|
||||
|
||||
const blackboardVariableData = e.dataTransfer.getData('application/blackboard-variable');
|
||||
if (blackboardVariableData) {
|
||||
const variableData = JSON.parse(blackboardVariableData) as DraggedVariableData;
|
||||
|
||||
const variableTemplate: NodeTemplate = {
|
||||
type: NodeType.Action,
|
||||
displayName: variableData.variableName,
|
||||
category: 'Blackboard Variable',
|
||||
icon: 'Database',
|
||||
description: `Blackboard variable: ${variableData.variableName}`,
|
||||
color: '#9c27b0',
|
||||
defaultConfig: {
|
||||
nodeType: 'blackboard-variable',
|
||||
variableName: variableData.variableName
|
||||
},
|
||||
properties: [
|
||||
{
|
||||
name: 'variableName',
|
||||
label: '变量名',
|
||||
type: 'variable',
|
||||
defaultValue: variableData.variableName,
|
||||
description: '黑板变量的名称',
|
||||
required: true
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
nodeOperations.createNode(
|
||||
variableTemplate,
|
||||
new Position(position.x, position.y),
|
||||
{
|
||||
nodeType: 'blackboard-variable',
|
||||
variableName: variableData.variableName
|
||||
}
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
let templateData = e.dataTransfer.getData('application/behavior-tree-node');
|
||||
if (!templateData) {
|
||||
templateData = e.dataTransfer.getData('text/plain');
|
||||
}
|
||||
if (!templateData) {
|
||||
return;
|
||||
}
|
||||
|
||||
const template = JSON.parse(templateData) as NodeTemplate;
|
||||
|
||||
nodeOperations.createNode(
|
||||
template,
|
||||
new Position(position.x, position.y),
|
||||
template.defaultConfig
|
||||
);
|
||||
|
||||
onNodeCreate?.(template, position);
|
||||
} catch (error) {
|
||||
logger.error('Failed to create node:', error);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDragOver = (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
e.stopPropagation();
|
||||
e.dataTransfer.dropEffect = 'copy';
|
||||
if (!isDragging) {
|
||||
setIsDragging(true);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDragLeave = (e: React.DragEvent) => {
|
||||
if (e.currentTarget === e.target) {
|
||||
setIsDragging(false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleDragEnter = (e: React.DragEvent) => {
|
||||
e.preventDefault();
|
||||
};
|
||||
|
||||
return {
|
||||
isDragging,
|
||||
handleDrop,
|
||||
handleDragOver,
|
||||
handleDragLeave,
|
||||
handleDragEnter
|
||||
};
|
||||
}
|
||||
Reference in New Issue
Block a user