From ea84c6ecddb8bbfc48da5d752e610464dd4d8f2f Mon Sep 17 00:00:00 2001 From: fan Date: Thu, 25 Jan 2024 10:15:32 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=A1=E5=8F=B7=E6=9C=BA=E5=AE=9E=E7=8E=B0?= =?UTF-8?q?=E9=80=BB=E8=BE=91=E8=B0=83=E6=95=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/graphics/signal/Lamp.ts | 101 ----------------- src/graphics/signal/LampMainBody.ts | 161 ++++++++++++++++++---------- 2 files changed, 106 insertions(+), 156 deletions(-) delete mode 100644 src/graphics/signal/Lamp.ts diff --git a/src/graphics/signal/Lamp.ts b/src/graphics/signal/Lamp.ts deleted file mode 100644 index 00dddd9..0000000 --- a/src/graphics/signal/Lamp.ts +++ /dev/null @@ -1,101 +0,0 @@ -import { Container } from '@pixi/display'; -import { Graphics } from 'pixi.js'; - -const lampConsts = { - lampRadius: 8, - logicModeLineWidth: 2, - logicModeDistance: 5, - logicModeColor: '0x000000', - lampLineWidth: 1, - lampLineColor: '0x3149c3', - lampBadColor: '0xFF0000', - badStart: 10, - badEnd: 15, -}; - -export class Lamp extends Container { - circleLamp: Graphics = new Graphics(); - logicMode: Graphics = new Graphics(); - lampBad: Graphics = new Graphics(); - radiusX = 0; - radiusY = 0; - - constructor() { - super(); - this.addChild(this.circleLamp); - this.addChild(this.logicMode); - this.addChild(this.lampBad); - } - paint(radiusX: number, radiusY: number) { - this.radiusX = radiusX; - this.radiusY = radiusY; - this.createLamp(); - } - createLampBad() { - this.lampBad.clear(); - this.lampBad.lineStyle(lampConsts.lampLineWidth, lampConsts.lampBadColor); - this.lampBad.moveTo(this.radiusX + lampConsts.badStart, this.radiusY); - this.lampBad.lineTo(this.radiusX + lampConsts.badEnd, this.radiusY); - this.lampBad.moveTo(this.radiusX - lampConsts.badStart, this.radiusY); - this.lampBad.lineTo(this.radiusX - lampConsts.badEnd, this.radiusY); - this.lampBad.moveTo(this.radiusX, this.radiusY + lampConsts.badStart); - this.lampBad.lineTo(this.radiusX, this.radiusY + lampConsts.badEnd); - this.lampBad.moveTo(this.radiusX, this.radiusY - lampConsts.badStart); - this.lampBad.lineTo(this.radiusX, this.radiusY - lampConsts.badEnd); - const xieStart = Math.sin(Math.PI / 4) * lampConsts.badStart; - const xieEnd = Math.sin(Math.PI / 4) * lampConsts.badEnd; - this.lampBad.moveTo(this.radiusX + xieStart, this.radiusY + xieStart); - this.lampBad.lineTo(this.radiusX + xieEnd, this.radiusY + xieEnd); - this.lampBad.moveTo(this.radiusX + xieStart, this.radiusY - xieStart); - this.lampBad.lineTo(this.radiusX + xieEnd, this.radiusY - xieEnd); - - this.lampBad.moveTo(this.radiusX - xieStart, this.radiusY - xieStart); - this.lampBad.lineTo(this.radiusX - xieEnd, this.radiusY - xieEnd); - this.lampBad.moveTo(this.radiusX - xieStart, this.radiusY + xieStart); - this.lampBad.lineTo(this.radiusX - xieEnd, this.radiusY + xieEnd); - } - createLamp(color?: string) { - this.circleLamp.clear(); - this.circleLamp.lineStyle( - lampConsts.lampLineWidth, - lampConsts.lampLineColor - ); - if (!color) { - color = '0X' + this.getCanvas().backgroundColor.substring(1); - } - this.circleLamp.beginFill(color, 1); - this.circleLamp.drawCircle( - this.radiusX, - this.radiusY, - lampConsts.lampRadius - ); - this.circleLamp.endFill(); - } - createLogicMode() { - this.logicMode - .clear() - .lineStyle(lampConsts.logicModeLineWidth, lampConsts.logicModeColor) - .moveTo( - this.radiusX - lampConsts.logicModeDistance, - this.radiusY + lampConsts.logicModeDistance - ) - .lineTo( - this.radiusX + lampConsts.logicModeDistance, - this.radiusY - lampConsts.logicModeDistance - ) - .moveTo( - this.radiusX - lampConsts.logicModeDistance, - this.radiusY - lampConsts.logicModeDistance - ) - .lineTo( - this.radiusX + lampConsts.logicModeDistance, - this.radiusY + lampConsts.logicModeDistance - ); - } - logicModeClear() { - this.logicMode.clear(); - } - lampClear() { - this.circleLamp.clear(); - } -} diff --git a/src/graphics/signal/LampMainBody.ts b/src/graphics/signal/LampMainBody.ts index fd04bce..ecebe8e 100644 --- a/src/graphics/signal/LampMainBody.ts +++ b/src/graphics/signal/LampMainBody.ts @@ -10,6 +10,7 @@ export enum LampEnum { yellowLamp = '0XFFFF00', whiteLamp = '0XFFFFFF', blueLamp = '0x3149c3', + closeLamp = '0x000000', } const lampConsts = { @@ -17,6 +18,14 @@ const lampConsts = { levelLampPostLength: 4, postLineWidth: 3, lampRadius: 8, + logicModeLineWidth: 2, + logicModeDistance: 5, + logicModeColor: '0x000000', + lampLineWidth: 1, + lampLineColor: '0x3149c3', + lampBadColor: '0xFF0000', + badStart: 10, + badEnd: 15, }; const anmiationNameConst = { @@ -31,23 +40,31 @@ export class LampMainBody extends JlGraphic { static Type = 'LampMainBody'; lampNum = 1; lampPost: Graphics = new Graphics(); - lamps: Lamp[] = []; + // lamps: Lamp[] = []; + lamps: Graphics = new Graphics(); + logicMode: Graphics = new Graphics(); mirror = false; deltaTime = 0; states: ISignalState | null = null; constructor() { super(LampMainBody.Type); + this.addChild(this.lampPost); + this.addChild(this.lamps); + this.addChild(this.logicMode); } paint(lampNum: number, mirror: boolean, states: ISignalState) { + this.lampPost.clear(); + + this.logicMode.clear(); this.mirror = mirror; this.states = states; if (lampNum < 1) { throw new Error('信号机灯数量异常'); } this.lampNum = lampNum; - this.removeChildren(0); - this.lampPost = new Graphics(); + // this.removeChildren(0); + // this.lampPost = new Graphics(); let lpp = new Point(lampConsts.levelLampPostLength, 0); if (mirror) { lpp = calculateMirrorPoint(new Point(0, 0), lpp); @@ -58,39 +75,81 @@ export class LampMainBody extends JlGraphic { .lineTo(0, lampConsts.verticalLampPostLength / 2) .moveTo(0, 0) .lineTo(lpp.x, lpp.y); - this.addChild(this.lampPost); + // this.addChild(this.lampPost); - this.lamps = []; - for (let i = 0; i < this.lampNum; i++) { - const lamp = new Lamp(); - this.addChild(lamp); + // this.lamps = []; + // for (let i = 0; i < this.lampNum; i++) { + // const lamp = new Lamp(); + // // this.addChild(lamp); + // const radiusX = + // (1 + i * 2) * lampConsts.lampRadius + lampConsts.levelLampPostLength; + // let lrp = new Point(radiusX, 0); + // if (mirror) { + // lrp = calculateMirrorPoint(new Point(0, 0), lrp); + // } + // lamp.paint(lrp.x, lrp.y); + // // this.lamps.push(lamp); + // } + this.chagneState(this.states); + } + paintLamp(colors: string[], lampNum?: number) { + this.lamps.clear(); + this.lamps.lineStyle( + lampConsts.lampLineWidth, + lampConsts.lampLineColor + ); + const number = lampNum || this.lampNum + for (let i = 0; i < number; i++) { const radiusX = - (1 + i * 2) * lampConsts.lampRadius + lampConsts.levelLampPostLength; + (1 + i * 2) * lampConsts.lampRadius + + lampConsts.levelLampPostLength; let lrp = new Point(radiusX, 0); - if (mirror) { + if (this.mirror) { lrp = calculateMirrorPoint(new Point(0, 0), lrp); } - lamp.paint(lrp.x, lrp.y); - this.lamps.push(lamp); + const color = colors[i] ? colors[i] : LampEnum.closeLamp; + this.lamps.beginFill(color, 1); + this.lamps.drawCircle( + lrp.x, + lrp.y, + lampConsts.lampRadius + ); + this.lamps.endFill(); + if (this.states?.extinguish) { + this.logicMode + .lineStyle(lampConsts.logicModeLineWidth, lampConsts.logicModeColor) + .moveTo( + lrp.x - lampConsts.logicModeDistance, + lrp.y + lampConsts.logicModeDistance + ) + .lineTo( + lrp.x + lampConsts.logicModeDistance, + lrp.y - lampConsts.logicModeDistance + ) + .moveTo( + lrp.x - lampConsts.logicModeDistance, + lrp.y - lampConsts.logicModeDistance + ) + .lineTo( + lrp.x + lampConsts.logicModeDistance, + lrp.y + lampConsts.logicModeDistance + ); + } } - this.chagneState(this.states); } setBlueShow() { this.stopAnmiation(); - this.lamps.forEach((lamp) => { - lamp.createLamp(LampEnum.blueLamp); - lamp.logicModeClear(); - }); + this.paintLamp([LampEnum.blueLamp, LampEnum.blueLamp, LampEnum.blueLamp]); } doRepaint() { // this.paint(this.lampNum, this.mirror, this.states); } stopAnmiation() { - const redFlashA = this.animation(anmiationNameConst.signaRedFlash); - const greenFlashA = this.animation(anmiationNameConst.signalGreenFlash); - const blueFlashA = this.animation(anmiationNameConst.signalBlueFlash); - const yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash); - const whiteFlashA = this.animation(anmiationNameConst.signalWhiteFlash); + const redFlashA = this.animation(anmiationNameConst.signaRedFlash + this.states?.code); + const greenFlashA = this.animation(anmiationNameConst.signalGreenFlash + this.states?.code); + const blueFlashA = this.animation(anmiationNameConst.signalBlueFlash + this.states?.code); + const yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash + this.states?.code); + const whiteFlashA = this.animation(anmiationNameConst.signalWhiteFlash + this.states?.code); if (redFlashA) { redFlashA.pause(); } @@ -109,18 +168,13 @@ export class LampMainBody extends JlGraphic { } chagneState(states: ISignalState) { this.stopAnmiation(); - if (states.extinguish) { - this.lamps.forEach((lamp) => lamp.createLogicMode()); - } else { - this.lamps.forEach((lamp) => lamp.logicModeClear()); - } if (states.redOpen) { - this.lamps[0].createLamp(LampEnum.redLamp); + this.paintLamp([LampEnum.redLamp]); } else if (states.redFlash) { - let redFlashA = this.animation(anmiationNameConst.signaRedFlash); + let redFlashA = this.animation(anmiationNameConst.signaRedFlash + states.code); if (!redFlashA) { redFlashA = this.createFlashAnmiation( - anmiationNameConst.signaRedFlash, + anmiationNameConst.signaRedFlash + states.code, LampEnum.redLamp, 0 ); @@ -128,12 +182,12 @@ export class LampMainBody extends JlGraphic { this.addAnimation(redFlashA); redFlashA.resume(); } else if (states.greenOpen) { - this.lamps[1].createLamp(LampEnum.greenLamp); + this.paintLamp([LampEnum.closeLamp, LampEnum.greenLamp]); } else if (states.greenFlash) { - let greenFlashA = this.animation(anmiationNameConst.signalGreenFlash); + let greenFlashA = this.animation(anmiationNameConst.signalGreenFlash + states.code); if (!greenFlashA) { greenFlashA = this.createFlashAnmiation( - anmiationNameConst.signalGreenFlash, + anmiationNameConst.signalGreenFlash + states.code, LampEnum.greenLamp, 1 ); @@ -141,12 +195,12 @@ export class LampMainBody extends JlGraphic { this.addAnimation(greenFlashA); greenFlashA.resume(); } else if (states.yellowOpen) { - this.lamps[1].createLamp(LampEnum.yellowLamp); + this.paintLamp([LampEnum.closeLamp, LampEnum.yellowLamp]); } else if (states.yellowFlash) { - let yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash); + let yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash + states.code); if (!yellowFlashA) { yellowFlashA = this.createFlashAnmiation( - anmiationNameConst.signalYellowFlash, + anmiationNameConst.signalYellowFlash + states.code, LampEnum.yellowLamp, 1 ); @@ -154,12 +208,12 @@ export class LampMainBody extends JlGraphic { this.addAnimation(yellowFlashA); yellowFlashA.resume(); } else if (states.blueOpen) { - this.lamps.forEach((lamp) => lamp.createLamp(LampEnum.blueLamp)); + this.paintLamp([LampEnum.blueLamp, LampEnum.blueLamp, LampEnum.blueLamp]); } else if (states.blueFlash) { - let blueFlashA = this.animation(anmiationNameConst.signalBlueFlash); + let blueFlashA = this.animation(anmiationNameConst.signalBlueFlash + states.code); if (!blueFlashA) { blueFlashA = this.createFlashAnmiation( - anmiationNameConst.signalBlueFlash, + anmiationNameConst.signalBlueFlash + states.code, LampEnum.blueLamp, 0 ); @@ -167,13 +221,12 @@ export class LampMainBody extends JlGraphic { this.addAnimation(blueFlashA); blueFlashA.resume(); } else if (states.whiteOpen) { - this.lamps[0].createLamp(LampEnum.whiteLamp); - this.lamps[1].visible = false; + this.paintLamp([LampEnum.whiteLamp], 1); } else if (states.whiteFlash) { - let whiteFlashA = this.animation(anmiationNameConst.signalWhiteFlash); + let whiteFlashA = this.animation(anmiationNameConst.signalWhiteFlash + states.code); if (!whiteFlashA) { whiteFlashA = this.createFlashAnmiation( - anmiationNameConst.signalWhiteFlash, + anmiationNameConst.signalWhiteFlash + states.code, LampEnum.whiteLamp, 0 ); @@ -181,16 +234,15 @@ export class LampMainBody extends JlGraphic { this.addAnimation(whiteFlashA); whiteFlashA.resume(); } else if (states.callon) { - this.lamps[0].createLamp(LampEnum.redLamp); - this.lamps[1].createLamp(LampEnum.yellowLamp); + this.paintLamp([LampEnum.redLamp, LampEnum.yellowLamp]); } else if (states.yellowYellow) { - this.lamps[0].createLamp(LampEnum.yellowLamp); - this.lamps[1].createLamp(LampEnum.yellowLamp); + this.paintLamp([LampEnum.yellowLamp, LampEnum.yellowLamp]); } else if (states.yellowGreen) { - this.lamps[0].createLamp(LampEnum.yellowLamp); - this.lamps[1].createLamp(LampEnum.greenLamp); + this.paintLamp([LampEnum.yellowLamp, LampEnum.greenLamp]); } else if (states.lampFailure) { - this.lamps[0].createLamp(LampEnum.redLamp); + this.paintLamp([LampEnum.redLamp]); + } else { + this.paintLamp([]); } } createFlashAnmiation( @@ -198,18 +250,17 @@ export class LampMainBody extends JlGraphic { color: string, lampIndex: number ): GraphicAnimation { - const bgColor = '0X' + this.getCanvas().backgroundColor.substring(1); const flashAnmiation = GraphicAnimation.init({ name: name, run: (dt: number) => { this.deltaTime += dt; if (this.deltaTime > 60) { + const colors = ['', '', '']; this.deltaTime = 0; - this.lamps[lampIndex].createLamp(color); + colors[lampIndex] = color; + this.paintLamp(colors); } else if (this.deltaTime > 30) { - this.lamps.forEach((lamp) => { - lamp.createLamp(bgColor); - }); + this.paintLamp([]); } }, });