119 lines
4.0 KiB
JavaScript
119 lines
4.0 KiB
JavaScript
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 };
|