import { Container, Graphics, Point, Color } from 'pixi.js'; import { JlGraphic, calculateMirrorPoint, VectorText } from 'jl-graphic'; import { getTrainConsts, EnumDiriveModel, EnumTrainType } from './TrainConfig.js'; class TrainHead extends Container { arrow; // 列车箭头 pause; // 列车停止 train; isStop; arrowColor; pauseColor; constructor(train) { super(); this.arrow = new Graphics(); this.pause = new Graphics(); this.addChild(this.arrow); this.addChild(this.pause); this.train = train; this.isStop = true; this.arrowColor = this.train.constDatas.arrowDefaultColor; this.pauseColor = this.train.constDatas.pauseDefaultColor; } clear() { this.arrow.clear(); this.pause.clear(); } doRepaint() { this.clear(); const trainConsts = this.train.constDatas; const bodyWH = this.train.trainbody.getBodyWH(); const marginX = trainConsts.marginX; const pauseW = trainConsts.pauseW; const bodyWidth = bodyWH ? bodyWH.width : trainConsts.bodyWidth; const bodyHeight = bodyWH ? bodyWH.height : trainConsts.bodyHeight; let pauseTW = pauseW + marginX; if (trainConsts.arrowPauseOnlyOne) { pauseTW = 0; } let arrowPoint = [ -bodyHeight * 0.4 - marginX - pauseTW - bodyWidth / 2, 0, -marginX - pauseTW - bodyWidth / 2, bodyHeight / 2, -marginX - pauseTW - bodyWidth / 2, -bodyHeight / 2, ]; let pausePoint = [ -marginX - pauseW / 2 - bodyWidth / 2, -bodyHeight / 2, -marginX - pauseW / 2 - bodyWidth / 2, bodyHeight / 2, ]; // 列车是向右或者向上 if (this.isRight()) { const aP = []; arrowPoint.forEach((item, index) => { if (index % 2 == 1) { const p = new Point(arrowPoint[index - 1], item); const newP = calculateMirrorPoint(new Point(0, 0), p); aP.push(newP.x, newP.y); } }); arrowPoint = aP; const pP = []; pausePoint.forEach((item, index) => { if (index % 2 == 1) { const p = new Point(pausePoint[index - 1], item); const newP = calculateMirrorPoint(new Point(0, 0), p); pP.push(newP.x, newP.y); } }); pausePoint = pP; } this.pause.lineStyle(pauseW, this.pauseColor, 1); this.pause.moveTo(pausePoint[0], pausePoint[1]); this.pause.lineTo(pausePoint[2], pausePoint[3]); const arrow = this.arrow; arrow.beginFill(this.arrowColor, 1); arrow.drawPolygon(arrowPoint); arrow.endFill(); } isRight() { let d = false; if (this.train.isRightRoTop) { d = true; } return d; } } class TrainBody extends Container { bodyRact; codeAGraph = new VectorText(''); //识别号AA codeBGraph = new VectorText(''); //识别号BBB train; codeAColor; codeBColor; codeAText; codeBText; constructor(train) { super(); this.bodyRact = new Graphics(); this.addChild(this.bodyRact); this.addChild(this.codeAGraph); this.addChild(this.codeBGraph); this.train = train; this.codeAGraph.setVectorFontSize(this.train.constDatas.codeFontSize); this.codeBGraph.setVectorFontSize(this.train.constDatas.codeFontSize); this.codeAColor = this.train.constDatas.codeColor; this.codeBColor = this.train.constDatas.codeColor; this.codeAText = ''; this.codeBText = ''; } clear() { this.bodyRact.clear(); } getBodyWH() { const bodyAWH = this.codeAGraph.getLocalBounds(); const bodyBWH = this.codeBGraph.getLocalBounds(); return { width: bodyAWH.width + bodyBWH.width + this.train.constDatas.bodyPadding * 2, height: bodyAWH.height + this.train.constDatas.bodyPadding * 2, }; } doRepaint() { this.clear(); const trainConsts = this.train.constDatas; const codeAGraph = this.codeAGraph; const codeBGraph = this.codeBGraph; codeAGraph.text = this.codeAText; codeBGraph.text = this.codeBText; codeAGraph.anchor.set(0.5); codeBGraph.anchor.set(0.5); const styleA = { fill: this.codeAColor, fontSize: trainConsts.codeFontSize, }; const styleB = { fill: this.codeBColor, fontSize: trainConsts.codeFontSize, }; codeAGraph.style = styleA; codeBGraph.style = styleB; if (this.codeBText) { const bodyAWH = codeAGraph.getLocalBounds(); const bodyBWH = codeBGraph.getLocalBounds(); codeAGraph.position.set(-bodyBWH.width / 2, 0); codeBGraph.position.set(bodyAWH.width / 2, 0); } if (this.train.constDatas.hasBodyRact) { const bodyRact = this.bodyRact; const { width: bodyWidth, height: bodyHeight } = this.getBodyWH(); bodyRact.lineStyle(trainConsts.borderWidth, new Color(trainConsts.borderColor)); const bgColor = trainConsts.bodyBgColor; bodyRact.beginFill(new Color(bgColor)); bodyRact.drawRect(-bodyWidth / 2, -bodyHeight / 2, bodyWidth, bodyHeight); bodyRact.endFill(); } } } class StatusText extends Container { sText = new VectorText(''); train; constructor(train) { super(); this.train = train; this.addChild(this.sText); } doRepaint(text, bodyWH) { const trainConsts = this.train.constDatas; let t = text; if (trainConsts.statusTextTransform) { t = trainConsts.statusTextTransform[text]; } this.sText.text = t; this.sText.anchor.set(0.5); const c = trainConsts.statusTextColor[text] || trainConsts.statusTextColor.D; const style = { fill: c, fontSize: trainConsts.textFontSize, }; this.sText.style = style; const { width: bodyWidth, height: bodyHeight } = bodyWH; const { width: textHWidth, height: textHeight } = this.sText.getLocalBounds(); const num = trainConsts.statusTextList.length; let index = trainConsts.statusTextList.findIndex((item) => { return item == text; }); if (index < 0) { index = (num - 1) / 2; // 中间 } const textMargin = (bodyWidth - textHWidth * num) / (num - 1); this.sText.position.set(-bodyWidth / 2 + (textHWidth * (index * 2 + 1)) / 2 + textMargin * index, -bodyHeight / 2 - textHeight / 2 - trainConsts.textMarginY); } clear() { this.sText.text = ''; } } /** * 列车 */ class Train extends JlGraphic { static Type = 'Train'; trainHead; trainbody; statusTextMap = new Map(); isRightRoTop; // 方向是否向右或者向上 constDatas; constructor(data) { super(Train.Type); this.isRightRoTop = false; this.constDatas = getTrainConsts(); if (data) { Object.assign(this.constDatas, data); } this.trainbody = new TrainBody(this); this.trainHead = new TrainHead(this); this.addChild(this.trainHead); this.addChild(this.trainbody); } get datas() { return this.getDatas(); } doRepaint() { this.trainbody.doRepaint(); this.trainHead.doRepaint(); } // 设置列车是否显示停止 setIsStop(v) { this.trainHead.isStop = v; } // 设置列车箭头是否显示 setArrowVisible(v) { this.trainHead.arrow.visible = v; } // 设置列车暂停是否显示 setPauseVisible(v) { this.trainHead.pause.visible = v; } run() { this.trainHead.arrow.visible = true; this.trainHead.pause.visible = !this.constDatas.arrowPauseOnlyOne; } stop() { this.trainHead.arrow.visible = false; this.trainHead.pause.visible = true; } setCodeAText(v) { this.trainbody.codeAText = v; } setCodeBText(v) { this.trainbody.codeBText = v; } // 设置驾驶模式对应颜色 setDiriveModelColor(s) { const DiriveModelColorEnum = this.constDatas.DiriveModelColorEnum; let aColor = DiriveModelColorEnum.AM; let pColor = DiriveModelColorEnum.SM; if (s == EnumDiriveModel.SM) { aColor = DiriveModelColorEnum.SM; pColor = DiriveModelColorEnum.SM; } else if (s == EnumDiriveModel.RM) { aColor = DiriveModelColorEnum.RM; pColor = DiriveModelColorEnum.RM; } this.trainHead.arrowColor = aColor; this.trainHead.pauseColor = pColor; } // 设置列车类型对应颜色 setTrainTypeColor(s) { const typeColorEnum = this.constDatas.typeColorEnum; const fillAColor = typeColorEnum.schedule; let fillBColor = typeColorEnum.schedule; if (s == EnumTrainType.late) { fillBColor = typeColorEnum.late; } else if (s == EnumTrainType.early) { fillBColor = typeColorEnum.early; } else if (s == EnumTrainType.head) { fillBColor = typeColorEnum.head; } else if (s == EnumTrainType.manual) { fillBColor = typeColorEnum.manual; } this.trainbody.codeAColor = fillAColor; this.trainbody.codeBColor = fillBColor; } // 显示列车状态文字 showStatus(s) { if (this.statusTextMap.has(s)) { return; } const bodyWH = this.trainbody.getBodyWH(); const textD = new StatusText(this); textD.doRepaint(s, bodyWH); this.addChild(textD); this.statusTextMap.set(s, textD); } // 隐藏列车状态文字 hideStatus(s) { if (!this.statusTextMap.has(s)) { return; } const textD = this.statusTextMap.get(s); if (textD) { textD.clear(); this.statusTextMap.delete(s); } } } export { Train };