Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
  • Loading branch information
nihaojob committed Jun 6, 2024
2 parents 0d5abbf + 4533e78 commit 081ae9a
Show file tree
Hide file tree
Showing 14 changed files with 335 additions and 96 deletions.
2 changes: 1 addition & 1 deletion .eslintrc-auto-import.json
Original file line number Diff line number Diff line change
Expand Up @@ -64,4 +64,4 @@
"watchPostEffect": true,
"watchSyncEffect": true
}
}
}
49 changes: 35 additions & 14 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -275,19 +275,19 @@ pnpm dev
</a>
</td>
<td align="center">
<a href="https://github.com/zjc2233">
<img src="https://avatars.githubusercontent.com/u/43945226?v=4" width="80;" alt="zjc2233"/>
<a href="https://github.com/a847244052">
<img src="https://avatars.githubusercontent.com/u/28621500?v=4" width="80;" alt="a847244052"/>
<br />
<sub><b>zjc2233</b></sub>
<sub><b>a847244052</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/a847244052">
<img src="https://avatars.githubusercontent.com/u/28621500?v=4" width="80;" alt="a847244052"/>
<a href="https://github.com/zjc2233">
<img src="https://avatars.githubusercontent.com/u/43945226?v=4" width="80;" alt="zjc2233"/>
<br />
<sub><b>a847244052</b></sub>
<sub><b>zjc2233</b></sub>
</a>
</td>
<td align="center">
Expand All @@ -304,6 +304,13 @@ pnpm dev
<sub><b>skyscraperno1</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/pengzhijian">
<img src="https://avatars.githubusercontent.com/u/133614612?v=4" width="80;" alt="pengzhijian"/>
<br />
<sub><b>pengzhijian</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/ijry">
<img src="https://avatars.githubusercontent.com/u/3102798?v=4" width="80;" alt="ijry"/>
Expand All @@ -318,15 +325,15 @@ pnpm dev
<sub><b>JiangShuQ</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/hudenghui">
<img src="https://avatars.githubusercontent.com/u/17875293?v=4" width="80;" alt="hudenghui"/>
<br />
<sub><b>hudenghui</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/ddshiyu">
<img src="https://avatars.githubusercontent.com/u/37503208?v=4" width="80;" alt="ddshiyu"/>
Expand Down Expand Up @@ -362,15 +369,15 @@ pnpm dev
<sub><b>x007xyz</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/wozhi-cl">
<img src="https://avatars.githubusercontent.com/u/25359239?v=4" width="80;" alt="wozhi-cl"/>
<br />
<sub><b>wozhi-cl</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/vvbear">
<img src="https://avatars.githubusercontent.com/u/32010827?v=4" width="80;" alt="vvbear"/>
Expand Down Expand Up @@ -399,6 +406,15 @@ pnpm dev
<sub><b>macheteHot</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/liuyaojun">
<img src="https://avatars.githubusercontent.com/u/25071631?v=4" width="80;" alt="liuyaojun"/>
<br />
<sub><b>liuyaojun</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/jooyyy">
<img src="https://avatars.githubusercontent.com/u/30552622?v=4" width="80;" alt="jooyyy"/>
Expand All @@ -413,8 +429,6 @@ pnpm dev
<sub><b>guda-art</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/nanfb">
<img src="https://avatars.githubusercontent.com/u/56207464?v=4" width="80;" alt="nanfb"/>
Expand Down Expand Up @@ -443,22 +457,29 @@ pnpm dev
<sub><b>Yangzongtai</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/Alicehhhmm">
<img src="https://avatars.githubusercontent.com/u/86783773?v=4" width="80;" alt="Alicehhhmm"/>
<br />
<sub><b>Alicehhhmm</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/fuqianxi">
<img src="https://avatars.githubusercontent.com/u/20251751?v=4" width="80;" alt="fuqianxi"/>
<br />
<sub><b>fuqianxi</b></sub>
</a>
</td>
<td align="center">
<a href="https://github.com/icleitoncosta">
<img src="https://avatars.githubusercontent.com/u/3260480?v=4" width="80;" alt="icleitoncosta"/>
<br />
<sub><b>icleitoncosta</b></sub>
</a>
</td>
</tr>
<tr>
<td align="center">
<a href="https://github.com/liucity">
<img src="https://avatars.githubusercontent.com/u/12006542?v=4" width="80;" alt="liucity"/>
Expand Down
29 changes: 28 additions & 1 deletion packages/core/ServersPlugin.ts
Original file line number Diff line number Diff line change
Expand Up @@ -95,16 +95,36 @@ class ServersPlugin {
});
}

// 设置path属性
renderITextPath(textPaths: Record<'id' | 'path', any>[]) {
textPaths.forEach((item) => {
const object = this.canvas.getObjects().find((o) => o.id === item.id);
if (object) {
fabric.Path.fromObject(item.path, (e) => {
object.set('path', e);
});
}
});
}

loadJSON(jsonFile: string | object, callback?: () => void) {
// 确保元素存在id
const temp = typeof jsonFile === 'string' ? JSON.parse(jsonFile) : jsonFile;
const textPaths: Record<'id' | 'path', any>[] = [];
temp.objects.forEach((item: any) => {
!item.id && (item.id = uuid());
// 收集所有路径文本元素i-text,并设置path为null
if (item.type === 'i-text' && item.path) {
textPaths.push({ id: item.id, path: item.path });
item.path = null;
}
});
jsonFile = JSON.stringify(temp);
// 加载前钩子
this.editor.hooksEntity.hookImportBefore.callAsync(jsonFile, () => {
this.canvas.loadFromJSON(jsonFile, () => {
// 把i-text对应的path加上
this.renderITextPath(textPaths);
this.canvas.renderAll();
// 加载后钩子
this.editor.hooksEntity.hookImportAfter.callAsync(jsonFile, () => {
Expand All @@ -119,7 +139,14 @@ class ServersPlugin {
}

getJson() {
return this.canvas.toJSON(['id', 'gradientAngle', 'selectable', 'hasControls', 'linkData']);
return this.canvas.toJSON([
'id',
'gradientAngle',
'selectable',
'hasControls',
'linkData',
'editable',
]);
}

/**
Expand Down
135 changes: 64 additions & 71 deletions packages/core/plugin.ts
Original file line number Diff line number Diff line change
@@ -1,89 +1,82 @@
import Editor from './Editor';
type IEditor = Editor;

class EditorWorkspacePlugin {
class FontPlugin {
public canvas: fabric.Canvas;
public editor: IEditor;
public defautOption = {
color: 'red',
size: 0.5,
};
static pluginName = 'textPlugin';
// 插件名称
static pluginName = 'FontPlugin';
// 挂载API名称
static apis = ['downFontByJSON'];
// 发布事件
static events = ['textEvent1', 'textEvent2'];
static apis = ['textAPI1', 'textAPI2'];
public hotkeys: string[] = ['ctrl+v', 'ctrl+a'];
constructor(canvas: fabric.Canvas, editor: IEditor, options: IPluginOption = {}) {
// 快捷键 keyCode hotkeys-js
public hotkeys: string[] = ['backspace', 'space'];
// 私有属性
repoSrc: string;

constructor(canvas: fabric.Canvas, editor: IEditor, config: { repoSrc: string }) {
// 初始化
this.canvas = canvas;
this.editor = editor;
this.defautOption = { ...this.defautOption, ...options };
this.init();
}
init() {
console.log('pluginInit', this.canvas, this.editor, this.defautOption);
// 可插入外部配置
this.repoSrc = config.repoSrc;
}

destroy() {
console.log('pluginDestroy');
}
// 保存文件前
hookSaveBefore() {
console.log('pluginHookSaveBefore');
// 钩子函数 hookImportAfter/hookSaveBefore/hookSaveAfter Promise
hookImportBefore(json: string) {
return this.downFontByJSON(json);
}
// 保存文件前
hookSaveAfter() {
console.log('pluginHookSaveAfter');

// 挂载API方法
downFontByJSON(str: string) {}

// 私有方法 + 发布事件
_createFontCSS(){
const params = []
this.editor.emit('textEvent1', params)
}
// 快捷键扩展回调
hotkeyEvent(eventName: string, e?: Event) {
console.log('pluginHotkeyEvent', eventName, e);
}
// 右键菜单扩展

// 右键菜单
contextMenu() {
return [
{ text: 'Back', hotkey: 'Alt+Left arrow', disabled: true },
{ text: 'Forward', hotkey: 'Alt+Right arrow', disabled: true },
{ text: 'Reload', hotkey: 'Ctrl+R' },
null,
{ text: 'Save as...', hotkey: 'Ctrl+S' },
{ text: 'Print...', hotkey: 'Ctrl+P' },
{ text: 'Cast...' },
{ text: 'Translate to English' },
null,
{ text: 'View page source', hotkey: 'Ctrl+U' },
{ text: 'Inspect', hotkey: 'Ctrl+Shift+I' },
null,
{
text: 'Kali tools',
hotkey: '❯',
subitems: [
{
text: 'Fuzzing Tools',
hotkey: '❯',
subitems: [
{ text: 'spike-generic_chunked' },
{ text: 'spike-generic_listen_tcp' },
{ text: 'spike-generic_send_tcp' },
{ text: 'spike-generic_send_udp' },
],
},
{
text: 'VoIP Tools',
hotkey: '❯',
subitems: [{ text: 'voiphopper' }],
},
{ text: 'nikto' },
{ text: 'nmap' },
{ text: 'sparta' },
{ text: 'unix-privesc-check' },
],
},
{ text: 'Skins', hotkey: '❯' },
];
const selectedMode = this.editor.getSelectMode();
if (selectedMode === SelectMode.ONE) {
return [
null, // 分割线
{
text: '翻转',
hotkey: '❯',
subitems: [
{
text: t('flip.x'),
hotkey: '|',
onclick: () => this.flip('X'),
},
{
text: t('flip.y'),
hotkey: '-',
onclick: () => this.flip('Y'),
},
],
},
];
}
}

// 快捷键
hotkeyEvent(eventName: string, e: { type, code }) {
// eventName:hotkeys中的属性 backspace、space
// type:keyUp keyDown
// code:hotkeys-js Code
if (eventName === 'backspace' && type === 'keydown') {
this.del();
}
}

_command() {
console.log('pluginContextMenuCommand');
// 注销
destroy() {
console.log('pluginDestroy');
}
}

export default EditorWorkspacePlugin;
export default FontPlugin;
15 changes: 15 additions & 0 deletions packages/core/plugin/FreeDrawPlugin.ts
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { fabric } from 'fabric';
import Editor from '../Editor';
import { v4 as uuid } from 'uuid';

type IEditor = Editor;

Expand All @@ -12,14 +13,28 @@ export default class FreeDrawPlugin {
static apis = ['startDraw', 'endDraw'];
constructor(public canvas: fabric.Canvas, public editor: IEditor) {}

_bindEvent() {
this.canvas.on('path:created', this._createdHandler);
}

_unbindEvent() {
this.canvas.off('path:created', this._createdHandler);
}

_createdHandler = (opt: any) => {
opt.path.set('id', uuid());
};

startDraw(options: DrawOptions) {
this.canvas.isDrawingMode = true;
this.canvas.freeDrawingBrush = new fabric.PencilBrush(this.canvas);
this.canvas.freeDrawingBrush.width = options.width;
this._bindEvent();
}
endDraw() {
if (this.canvas.isDrawingMode) {
this.canvas.isDrawingMode = false;
this._unbindEvent();
return;
}
}
Expand Down
Loading

0 comments on commit 081ae9a

Please sign in to comment.