import { Point } from 'pixi.js'; import { GraphicDrawAssistant, GraphicInteractionPlugin, AbsorbableLine } from 'jl-graphic'; import { Transponder } from './Transponder.js'; class TransponderDraw extends GraphicDrawAssistant { TransponderGraph; constructor(app, template) { super(app, template, 'border_all', '应答器Transponder'); this.TransponderGraph = this.graphicTemplate.new(); this.container.addChild(this.TransponderGraph); TransponderInteraction.init(app); } bind() { super.bind(); this.TransponderGraph.loadData(this.graphicTemplate.datas); this.TransponderGraph.doRepaint(); } onLeftDown(e) { this.container.position.copyFrom(this.toCanvasCoordinates(e.global)); this.createAndStore(true); } redraw(p) { this.container.position.copyFrom(p); } prepareData(data) { data.transform = this.container.saveTransform(); return true; } } class TransponderInteraction extends GraphicInteractionPlugin { static Name = 'Transponder_transform'; constructor(app) { super(TransponderInteraction.Name, app); } static init(app) { return new TransponderInteraction(app); } filter(...grahpics) { return grahpics .filter((g) => g.type === Transponder.Type) .map((g) => g); } bind(g) { g.polygonGraphic.eventMode = 'static'; g.polygonGraphic.cursor = 'pointer'; g.polygonGraphic.scalable = true; g.on('transformstart', this.transformstart, this); g.labelGraphic.on('transformstart', this.codetransformstart, this); g.labelGraphic.draggable = true; g.labelGraphic.selectable = true; g.labelGraphic.rotatable = true; g.labelGraphic.transformSave = true; g.labelGraphic.eventMode = 'static'; } unbind(g) { g.polygonGraphic.eventMode = 'none'; g.polygonGraphic.scalable = false; g.polygonGraphic.rotatable = false; g.off('transformstart', this.transformstart, this); g.labelGraphic.off('transformstart', this.codetransformstart, this); g.labelGraphic.draggable = false; g.labelGraphic.selectable = false; g.labelGraphic.rotatable = false; g.labelGraphic.transformSave = false; g.labelGraphic.eventMode = 'none'; } transformstart(e) { const target = e.target; const transponder = target.getGraphic(); transponder.getGraphicApp().setOptions({ absorbablePositions: buildAbsorbablePositions(transponder), }); } codetransformstart(e) { const target = e.target; const transponder = target.getGraphic(); transponder.getGraphicApp().setOptions({ absorbablePositions: buildCodeAbsorbablePositions(transponder), }); } } /** * 构建吸附线 * @param transponder */ function buildAbsorbablePositions(transponder) { const aps = []; const transponders = transponder.queryStore.queryByType(Transponder.Type); const canvas = transponder.getCanvas(); transponders.forEach((item) => { if (item.id === transponder.id) { return; } const ala = new AbsorbableLine(new Point(item.x, 0), new Point(item.x, canvas.height)); const alb = new AbsorbableLine(new Point(0, item.y), new Point(canvas.width, item.y)); aps.push(ala); aps.push(alb); }); return aps; } /** * 名称构建吸附线 * @param transponder */ function buildCodeAbsorbablePositions(transponder) { const aps = []; const transponders = transponder.queryStore.queryByType(Transponder.Type); const canvas = transponder.getCanvas(); transponders.forEach((item) => { const ala = new AbsorbableLine(new Point(item.x, 0), new Point(item.x, canvas.height)); const alb = new AbsorbableLine(new Point(0, item.y), new Point(canvas.width, item.y)); aps.push(ala); aps.push(alb); }); return aps; } export { TransponderDraw, TransponderInteraction };