103 lines
3.5 KiB
JavaScript
103 lines
3.5 KiB
JavaScript
import { Container, Graphics } from 'pixi.js';
|
|
import { VectorText, JlGraphic, JlGraphicTemplate } from 'jl-graphic';
|
|
import { getTransponderConsts, getTypePoints, TransponderTypeEnum } from './TransponderConfig.js';
|
|
|
|
class TransponderCode extends Container {
|
|
codeText = new VectorText('');
|
|
name = 'transponderCode';
|
|
constructor() {
|
|
super();
|
|
this.addChild(this.codeText);
|
|
}
|
|
clear() {
|
|
this.codeText.text = '';
|
|
}
|
|
paint(datas) {
|
|
this.codeText.text = datas.code;
|
|
this.codeText.anchor.set(0.5);
|
|
}
|
|
}
|
|
class Transponder extends JlGraphic {
|
|
static Type = 'Transponder';
|
|
polygonGraphic = new Graphics();
|
|
labelGraphic = new TransponderCode();
|
|
constDatas;
|
|
constructor(data) {
|
|
super(Transponder.Type);
|
|
this.addChild(this.polygonGraphic);
|
|
this.addChild(this.labelGraphic);
|
|
this.constDatas = getTransponderConsts();
|
|
if (data) {
|
|
Object.assign(this.constDatas, data);
|
|
}
|
|
}
|
|
get datas() {
|
|
return this.getDatas();
|
|
}
|
|
clear() {
|
|
this.polygonGraphic.clear();
|
|
this.labelGraphic.clear();
|
|
}
|
|
doRepaint() {
|
|
this.clear();
|
|
const polygonGraphic = this.polygonGraphic;
|
|
const ps = getTypePoints(this.datas.type, this.constDatas);
|
|
let lineColor = this.constDatas.lineColor;
|
|
if (this.datas.type == TransponderTypeEnum.WB) {
|
|
lineColor = this.constDatas.wblineColor;
|
|
}
|
|
else if (this.datas.type == TransponderTypeEnum.VB) {
|
|
lineColor = this.constDatas.vblineColor;
|
|
}
|
|
else if (this.datas.type == TransponderTypeEnum.IB) {
|
|
lineColor = this.constDatas.iblineColor;
|
|
}
|
|
polygonGraphic.lineStyle(this.constDatas.lineWidth, lineColor);
|
|
polygonGraphic.beginFill(this.constDatas.lineColor, 0.00001); // 填充透明色（用于碰撞检测）
|
|
const indexArr = [0, 5, 7];
|
|
ps.forEach((item, index) => {
|
|
if (indexArr.includes(index)) {
|
|
polygonGraphic.moveTo(item[0], item[1]);
|
|
}
|
|
else {
|
|
polygonGraphic.lineTo(item[0], item[1]);
|
|
}
|
|
});
|
|
polygonGraphic.endFill;
|
|
this.labelGraphic.paint(this.datas);
|
|
const style = {
|
|
fill: lineColor,
|
|
fontSize: this.constDatas.textFontSize,
|
|
};
|
|
this.labelGraphic.codeText.style = style;
|
|
const codeTransform = this.datas?.childTransforms?.find((item) => item.name === 'transponderCode');
|
|
if (codeTransform) {
|
|
const position = codeTransform?.transform.position;
|
|
const rotation = codeTransform?.transform?.rotation;
|
|
this.labelGraphic.position.set(position?.x, position?.y);
|
|
this.labelGraphic.rotation = rotation || 0;
|
|
}
|
|
else {
|
|
const { height: polygonHeight } = this.polygonGraphic.getLocalBounds();
|
|
const { height: textHeight } = this.labelGraphic.getLocalBounds();
|
|
this.labelGraphic.position.set(0, polygonHeight / 2 + textHeight / 2 + this.constDatas.textMarginY);
|
|
}
|
|
}
|
|
}
|
|
class TransponderTemplate extends JlGraphicTemplate {
|
|
updataConsts;
|
|
constructor(dataTemplate, data) {
|
|
super(Transponder.Type, {
|
|
dataTemplate,
|
|
});
|
|
this.updataConsts = data;
|
|
}
|
|
new() {
|
|
const transponder = new Transponder(this.updataConsts);
|
|
transponder.loadData(this.datas);
|
|
return transponder;
|
|
}
|
|
}
|
|
|
|
export { Transponder, TransponderCode, TransponderTemplate };
|