Phaser Reels

export class MainScene extends Phaser.Scene
{

    private reelXPositions = [51, 415, 779, 1143, 1507];
    private reelYpositon = 197;

     public staticSymbols: string[] = ["symbol0", "symbol1", "symbol2", "symbol3", "symbol4", "symbol5", "symbol6", "symbol7", "symbol8", "symbol9"];
     private symbolAnims: Phaser.GameObjects.Video[];
     private symbolSize = new Phaser.Math.Vector2(726, 1102);

    private reels: Reel[];

    preload(): void
    {

         // load static symbols
            for (let i = 0; i < 10; i++)
         {
                this.load.image(this.staticSymbols[i], skindata.staticsymbols[i]);
    }

  }

create(): void
  {
    this.input.on("pointerup", this.onPointer, this);

    this.reels = new Array();
    for (let i = 0; i < 5; i++)
    {
      this.reels.push(new Reel(this, this.reelXPositions[i], this.reelYpositon, i, this.symbolSize.y));
    }
}


private onPointer(pointer: any)
  {
    console.log("pointer up");

    for (let i = 0; i < 1; i++)
    {
      if (this.reels[i].currentState == ReelState.Stopped)
      {
        this.reels[i].currentState = ReelState.SpinningUp;
      }
      else if (this.reels[i].currentState == ReelState.SpinningUp)
      {
        this.reels[i].currentState = ReelState.SpinningDown;
      }

    }

  }

public update(_time: number, delta: number)
  {
    // console.log("update");

    for (let i = 0; i < 5; i++)
    {
      this.reels[i].update(_time, delta);
    }

  }


}




export class Reel extends Phaser.GameObjects.Container
{

    private _mainScene: MainScene = null;


    private symbol1: Phaser.GameObjects.Image;
    private symbol2: Phaser.GameObjects.Image;




constructor(scene: MainScene, x: number, y: number, id: number, symbolheight: number)
    {
        super(scene, 0, 0);
        this._mainScene = scene;
        this.reelIndex = id;
        this.symbolHeight = symbolheight;
        this.reelXposition = x;
        this.reelYposition = y;

        this.symbol1Index = scene.GetRandomActiveSymbol();
        this.symbol2Index = scene.GetRandomActiveSymbol();

        this.symbol1 = scene.add.image(x, y, scene.staticSymbols[this.symbol1Index]).setOrigin(0, 0).setScale(this.basesymbolscale);
        this.symbol2 = scene.add.image(x, y - (symbolheight * this.basesymbolscale), scene.staticSymbols[this.symbol2Index]).setOrigin(0, 0).setScale(this.basesymbolscale);

        // this.targetSymbol = Phaser.Math.RND.integerInRange(0, 4);
        this.targetSymbol = 0;
    }

public update(_time: number, delta: number)
    {
        // if(this.reelIndex == 0)
            // console.log("reel update " + this.reelIndex);
        // console.log("time: " + _time);
        // console.log("delta: " + delta);
        let deltaseconds = delta / 1000;
        // console.log("deltaseconds: " + deltaseconds);
        let correctsymbol = false;

        switch (this.currentState)
        {
            case ReelState.SpinningUp:
                    if (this.velocity.y < this.maxvelocity.y)
                    {
                        this.velocity.x += this.accelFactor.x * deltaseconds;
                        this.velocity.y += (this.accelFactor.y * deltaseconds);
                    }
                    else
                    {
                        this.velocity.y = this.maxvelocity.y;
                    }
                break;
            case ReelState.Spinning:
                // not much to do here
                break;
            case ReelState.SpinningDown:
                this.velocity.x -= this.decelFactor.x * deltaseconds;
                this.velocity.y -= this.decelFactor.y * deltaseconds;
                if (this.velocity.y < this.stoppingSpeed.y)
                {
                    this.velocity.y = this.stoppingSpeed.y;
                    // state = 3;
                    this.currentState = ReelState.Stopping;
                }
                break;
            case ReelState.Stopping:
                if (this.symbol2Index == this.targetSymbol)
                {
                    correctsymbol = true;
                }
                break;
            case ReelState.Bouncing:
                break;
            case ReelState.Stopped:
                // this.velocity.y = 0;
                break;
        }

        this.symbol1.y += (this.velocity.y * deltaseconds);
        this.symbol2.y += (this.velocity.y * deltaseconds);

        if (this.symbol1.y >= (this.reelYposition + (this.symbolHeight * this.basesymbolscale)))
        {
            if (this.currentState === ReelState.Bouncing)
            {
                if (this.symbol1.y >= (this.reelYposition + this.bounceDistance.y))
                {
                    this.velocity.y *= -1;
                    console.log("reel " + this.reelIndex + " bounce done, returning");
                    this.currentState = ReelState.BounceReturning;
                }
            }
            else if (this.currentState === ReelState.BounceReturning)
            {
                if (this.symbol1.y <= this.reelYposition)
                {
                    this.symbol1.y = this.reelYposition;
                    this.symbol2.y = this.symbol1.y - (this.symbolHeight * this.basesymbolscale);
                    this.currentState = ReelState.Stopped;
                    console.log("reel " + this.reelIndex + " bounce returned, stopping");
                }
            }
            else
            {
                this.symbol1Index = this.symbol2Index;
                this.symbol2Index = this._mainScene.GetRandomActiveSymbol();
                this.symbol1.y -= this.symbolHeight * this.basesymbolscale;
                this.symbol2.y = this.symbol1.y - (this.symbolHeight * this.basesymbolscale);
                this.symbol1.setTexture(this._mainScene.staticSymbols[this.symbol1Index]);
                this.symbol2.setTexture(this._mainScene.staticSymbols[this.symbol2Index]);

                if (this.currentState === ReelState.Stopping)
                {
                    if (correctsymbol)
                    {
                        console.log("reel " + this.reelIndex + " symbol correct, bouncing");
                        this.currentState = ReelState.Bouncing;
                    }
                }
            }
        }



    }
}