-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge branch 'main' of https://github.com/nihaojob/vue-fabric-editor
- Loading branch information
Showing
14 changed files
with
335 additions
and
96 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -64,4 +64,4 @@ | |
"watchPostEffect": true, | ||
"watchSyncEffect": true | ||
} | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
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; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.