add node icon
This commit is contained in:
1 parent
fead2cdd96
commit
61a69a3e7f
4 files changed
+32
-18
No files matched your search
@@ -1,6 +1,8 @@
|
|||||||
import { TreeGraphData } from "@antv/g6/lib/types"
|
import { TreeGraphData } from "@antv/g6/lib/types"
|
||||||
import { Tree } from "antd";
|
import { Tree } from "antd";
|
||||||
import { BehaviorNodeModel } from "./BehaviorTreeModel";
|
import { BehaviorNodeModel } from "./BehaviorTreeModel";
|
||||||
|
import Settings from "../main-process/Settings";
|
||||||
|
import { remote } from "electron";
|
||||||
|
|
||||||
export const cloneNodeData = (nodeData: TreeGraphData) => {
|
export const cloneNodeData = (nodeData: TreeGraphData) => {
|
||||||
const newData: TreeGraphData = {
|
const newData: TreeGraphData = {
|
||||||
@@ -67,4 +69,8 @@ export const findFromAllChildren = (node: TreeGraphData, id: string): TreeGraphD
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const getRemoteSettings = () => {
|
||||||
|
return remote.getGlobal("settings") as Settings;
|
||||||
}
|
}
|
||||||
@@ -24,6 +24,7 @@ const sampleNodeClassify: BehaviorNodeClassify[] = [
|
|||||||
|
|
||||||
export default class Settings {
|
export default class Settings {
|
||||||
private settings: SettingsModel;
|
private settings: SettingsModel;
|
||||||
|
private name2classify: { [name: string]: string } = {};
|
||||||
constructor() {
|
constructor() {
|
||||||
this.load();
|
this.load();
|
||||||
}
|
}
|
||||||
@@ -40,6 +41,10 @@ export default class Settings {
|
|||||||
get nodeConfig() {
|
get nodeConfig() {
|
||||||
const str = fs.readFileSync(this.nodeConfigPath, 'utf8');
|
const str = fs.readFileSync(this.nodeConfigPath, 'utf8');
|
||||||
const types: BehaviorNodeTypeModel[] = JSON.parse(str);
|
const types: BehaviorNodeTypeModel[] = JSON.parse(str);
|
||||||
|
this.name2classify = {};
|
||||||
|
types.forEach(t => {
|
||||||
|
this.name2classify[t.name] = t.type;
|
||||||
|
})
|
||||||
return types;
|
return types;
|
||||||
}
|
}
|
||||||
get nodeClassify() {
|
get nodeClassify() {
|
||||||
@@ -72,4 +77,8 @@ export default class Settings {
|
|||||||
save() {
|
save() {
|
||||||
fs.writeFileSync(settingPath, JSON.stringify(this.settings, null, 2));
|
fs.writeFileSync(settingPath, JSON.stringify(this.settings, null, 2));
|
||||||
}
|
}
|
||||||
|
|
||||||
|
getClassify(name: string) {
|
||||||
|
return this.name2classify[name];
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -2,10 +2,6 @@ import React, { Component } from "react";
|
|||||||
import { Menu, Input } from "antd";
|
import { Menu, Input } from "antd";
|
||||||
import * as fs from 'fs';
|
import * as fs from 'fs';
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
import { BehaviorTreeModel } from "../common/BehaviorTreeModel";
|
|
||||||
import { remote } from 'electron';
|
|
||||||
import { MainProcess } from "../main-process/MainProcess";
|
|
||||||
import Settings from "../main-process/Settings";
|
|
||||||
|
|
||||||
const { Search } = Input;
|
const { Search } = Input;
|
||||||
|
|
||||||
|
|||||||
+17
-14
@@ -6,15 +6,14 @@ import { Layout, Tabs } from 'antd';
|
|||||||
import { ipcRenderer, remote } from 'electron';
|
import { ipcRenderer, remote } from 'electron';
|
||||||
import * as path from 'path';
|
import * as path from 'path';
|
||||||
import * as fs from 'fs';
|
import * as fs from 'fs';
|
||||||
|
import * as Utils from '../common/Utils';
|
||||||
import MainEventType from "../common/MainEventType";
|
import MainEventType from "../common/MainEventType";
|
||||||
import Properties from "./Properties";
|
import Properties from "./Properties";
|
||||||
import { BehaviorTreeModel } from "../common/BehaviorTreeModel";
|
|
||||||
import Settings from "../main-process/Settings";
|
import Settings from "../main-process/Settings";
|
||||||
import G6 from '@antv/g6';
|
import G6 from '@antv/g6';
|
||||||
|
|
||||||
import 'antd/dist/antd.dark.css';
|
import 'antd/dist/antd.dark.css';
|
||||||
import './index.css';
|
import './index.css';
|
||||||
import './icons/iconfont.svg';
|
|
||||||
import { ModelConfig, Item } from "@antv/g6/lib/types";
|
import { ModelConfig, Item } from "@antv/g6/lib/types";
|
||||||
|
|
||||||
const { Header, Sider, Content, Footer } = Layout;
|
const { Header, Sider, Content, Footer } = Layout;
|
||||||
@@ -26,18 +25,17 @@ interface MainState {
|
|||||||
curPath?: string;
|
curPath?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const ICON_MAP = {
|
|
||||||
a: 'https://gw.alipayobjects.com/mdn/rms_8fd2eb/afts/img/A*0HC-SawWYUoAAAAAAAAAAABkARQnAQ',
|
|
||||||
b: 'https://gw.alipayobjects.com/mdn/rms_8fd2eb/afts/img/A*sxK0RJ1UhNkAAAAAAAAAAABkARQnAQ',
|
|
||||||
};
|
|
||||||
|
|
||||||
export default class Main extends Component {
|
export default class Main extends Component {
|
||||||
state: MainState = {
|
state: MainState = {
|
||||||
workspace: '',
|
workspace: '',
|
||||||
filepaths: [],
|
filepaths: [],
|
||||||
}
|
}
|
||||||
|
|
||||||
|
settings: Settings;
|
||||||
|
|
||||||
componentWillMount() {
|
componentWillMount() {
|
||||||
|
this.updateSettings();
|
||||||
|
const settings = this.settings;
|
||||||
G6.registerNode(
|
G6.registerNode(
|
||||||
'TreeNode',
|
'TreeNode',
|
||||||
{
|
{
|
||||||
@@ -106,7 +104,7 @@ export default class Main extends Component {
|
|||||||
group.addShape('text', {
|
group.addShape('text', {
|
||||||
attrs: {
|
attrs: {
|
||||||
textBaseline: 'top',
|
textBaseline: 'top',
|
||||||
x: -w / 2 + 8,
|
x: -w / 2 + 13,
|
||||||
y: -h / 2 + 2,
|
y: -h / 2 + 2,
|
||||||
lineHeight: 20,
|
lineHeight: 20,
|
||||||
text: cfg.id,
|
text: cfg.id,
|
||||||
@@ -116,14 +114,16 @@ export default class Main extends Component {
|
|||||||
name: 'id-text',
|
name: 'id-text',
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const classfiy = settings.getClassify(cfg.name as string) || 'Other';
|
||||||
|
var img = `./static/icons/${classfiy}.svg`;
|
||||||
|
console.log(cfg.type, classfiy);
|
||||||
group.addShape('image', {
|
group.addShape('image', {
|
||||||
attrs: {
|
attrs: {
|
||||||
x: -w / 2 + 15,
|
x: -w / 2 + 15,
|
||||||
y: -h / 2 + 2,
|
y: -h / 2,
|
||||||
height: 16,
|
height: 16,
|
||||||
width: 16,
|
width: 16,
|
||||||
cursor: 'pointer',
|
img,
|
||||||
img: './static/icons/Other.svg',
|
|
||||||
},
|
},
|
||||||
name: 'node-icon',
|
name: 'node-icon',
|
||||||
});
|
});
|
||||||
@@ -132,7 +132,7 @@ export default class Main extends Component {
|
|||||||
group.addShape('text', {
|
group.addShape('text', {
|
||||||
attrs: {
|
attrs: {
|
||||||
textBaseline: 'top',
|
textBaseline: 'top',
|
||||||
x: -w / 2 + 20,
|
x: -w / 2 + 35,
|
||||||
y: -h / 2 + 2,
|
y: -h / 2 + 2,
|
||||||
lineHeight: 20,
|
lineHeight: 20,
|
||||||
text: cfg.name,
|
text: cfg.name,
|
||||||
@@ -204,8 +204,11 @@ export default class Main extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
getLastWorkspace() {
|
getLastWorkspace() {
|
||||||
const settings: Settings = remote.getGlobal("settings");
|
return this.settings.recentWorkspaces[0];
|
||||||
return settings.recentWorkspaces[0];
|
}
|
||||||
|
|
||||||
|
updateSettings() {
|
||||||
|
this.settings = Utils.getRemoteSettings();
|
||||||
}
|
}
|
||||||
|
|
||||||
openFile(path: string) {
|
openFile(path: string) {
|
||||||
|
|||||||
Reference in new issue
Block a user