/* * @Author: 秦少卫 * @Date: 2023-06-15 23:23:18 * @LastEditors: donghao donghao@supervision.ltd * @LastEditTime: 2024-08-06 17:29:53 * @Description: 图层调整插件 */ import { fabric } from "fabric"; import Editor from "../core"; type IEditor = Editor; class LayerPlugin { public canvas: fabric.Canvas; public editor: IEditor; static pluginName = "LayerPlugin"; static apis = ["up", "upTop", "down", "downTop"]; constructor(canvas: fabric.Canvas, editor: IEditor) { this.canvas = canvas; this.editor = editor; } _getWorkspace() { return this.canvas.getObjects().find(item => item.id === "workspace"); } _workspaceSendToBack() { const workspace = this._getWorkspace(); workspace && workspace.sendToBack(); } up() { const actives = this.canvas.getActiveObjects(); if (actives && actives.length === 1) { const activeObject = this.canvas.getActiveObjects()[0]; activeObject && activeObject.bringForward(); this.canvas.renderAll(); this._workspaceSendToBack(); } } upTop() { const actives = this.canvas.getActiveObjects(); if (actives && actives.length === 1) { const activeObject = this.canvas.getActiveObjects()[0]; activeObject && activeObject.bringToFront(); this.canvas.renderAll(); console.log(this); this._workspaceSendToBack(); } } down() { const actives = this.canvas.getActiveObjects(); if (actives && actives.length === 1) { const activeObject = this.canvas.getActiveObjects()[0]; activeObject && activeObject.sendBackwards(); this.canvas.renderAll(); this._workspaceSendToBack(); } } downTop() { const actives = this.canvas.getActiveObjects(); if (actives && actives.length === 1) { const activeObject = this.canvas.getActiveObjects()[0]; activeObject && activeObject.sendToBack(); this.canvas.renderAll(); this._workspaceSendToBack(); } } contextMenu() { const activeObject = this.canvas.getActiveObject(); if (activeObject) { return [ { text: "图层管理", hotkey: "❯", subitems: [ { text: "上一个", hotkey: "key", onclick: () => this.up() }, { text: "下一个", hotkey: "key", onclick: () => this.down() }, { text: "置顶", hotkey: "key", onclick: () => this.upTop() }, { text: "置底", hotkey: "key", onclick: () => this.downTop() } ] } ]; // return [{ text: '复制', hotkey: 'Ctrl+V', disabled: false, onclick: () => this.clone() }]; } } destroy() { console.log("pluginDestroy"); } } export default LayerPlugin;