信号机实现逻辑调整

src/graphics/signal/Lamp.ts

@@ -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();
-  }
-}

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.removeChildren(0);
-    this.lampPost = new Graphics();
+    // 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 = [];
+    // this.lamps = [];
-    for (let i = 0; i < this.lampNum; i++) {
+    // for (let i = 0; i < this.lampNum; i++) {
-      const lamp = new Lamp();
+    //   const lamp = new Lamp();
-      this.addChild(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);
+      const color = colors[i] ? colors[i] : LampEnum.closeLamp;
-      this.lamps.push(lamp);
+      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) => {
+    this.paintLamp([LampEnum.blueLamp, LampEnum.blueLamp, LampEnum.blueLamp]);
-      lamp.createLamp(LampEnum.blueLamp);
-      lamp.logicModeClear();
-    });
   }
   doRepaint() {
     // this.paint(this.lampNum, this.mirror, this.states);
   }
   stopAnmiation() {
-    const redFlashA = this.animation(anmiationNameConst.signaRedFlash);
+    const redFlashA = this.animation(anmiationNameConst.signaRedFlash + this.states?.code);
-    const greenFlashA = this.animation(anmiationNameConst.signalGreenFlash);
+    const greenFlashA = this.animation(anmiationNameConst.signalGreenFlash + this.states?.code);
-    const blueFlashA = this.animation(anmiationNameConst.signalBlueFlash);
+    const blueFlashA = this.animation(anmiationNameConst.signalBlueFlash + this.states?.code);
-    const yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash);
+    const yellowFlashA = this.animation(anmiationNameConst.signalYellowFlash + this.states?.code);
-    const whiteFlashA = this.animation(anmiationNameConst.signalWhiteFlash);
+    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.paintLamp([LampEnum.whiteLamp], 1);
-      this.lamps[1].visible = false;
     } 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.paintLamp([LampEnum.redLamp, LampEnum.yellowLamp]);
-      this.lamps[1].createLamp(LampEnum.yellowLamp);
     } else if (states.yellowYellow) {
-      this.lamps[0].createLamp(LampEnum.yellowLamp);
+      this.paintLamp([LampEnum.yellowLamp, LampEnum.yellowLamp]);
-      this.lamps[1].createLamp(LampEnum.yellowLamp);
     } else if (states.yellowGreen) {
-      this.lamps[0].createLamp(LampEnum.yellowLamp);
+      this.paintLamp([LampEnum.yellowLamp, LampEnum.greenLamp]);
-      this.lamps[1].createLamp(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) => {
+          this.paintLamp([]);
-            lamp.createLamp(bgColor);
-          });
         }
       },
     });