1

In the Tetris clone I'm making, I'm only working with single blocks right now and I have been trying to stack blocks in a few rows. Here is the code for the blocks

if (this.active == false){
    this.cube = Math.floor((Math.random()* 7));
    this.testblock = this.physics.add.sprite(608, 32, this.blocks[this.cube]);
    this.testblock.body.immovable = true;
    this.testblock.body.allowGravity = false;
    //this.testblock.body.setGravityY(-100);
    this.physics.add.collider(this.walls, this.testblock);
    this.physics.add.collider(this.p1, this.testblock);
    this.activeBlock = this.testblock;
    this.active = true;
}

this.activeBlock.y = this.activeBlock.y + 0.5;

if(Phaser.Input.Keyboard.JustDown(this.keyE)){
    console.log(this.activeBlock.y);
}

if(Phaser.Input.Keyboard.JustDown(this.keyA) && this.activeBlock.x != 352) {
    this.activeBlock.x = this.activeBlock.x - 64;
}

if(Phaser.Input.Keyboard.JustDown(this.keyD) && this.activeBlock.x != 928) {
    this.activeBlock.x = this.activeBlock.x + 64;
}

if (this.activeBlock.y == 416){
    if(this.activeBlock.x == 352 && this.row4[0] != null){
        this.row5[0] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 416 && this.row4[1] != null){
        this.row5[1] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 480 && this.row4[2] != null){
        this.row5[2] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 544 && this.row4[3] != null){
        this.row5[3] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 608 && this.row4[4] != null){
        this.row5[4] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 672 && this.row4[5] != null){
        this.row5[5] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 736 && this.row4[6] != null){
        this.row5[6] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 800 && this.row4[7] != null){
        this.row5[7] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 864 && this.row4[8] != null){
        this.row5[8] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 928 && this.row4[9] != null){
        this.row5[9] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
}


if (this.activeBlock.y == 480){
    if(this.activeBlock.x == 352 && this.row3[0] != null){
        this.row4[0] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 416 && this.row3[1] != null){
        this.row4[1] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 480 && this.row3[2] != null){
        this.row4[2] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 544 && this.row3[3] != null){
        this.row4[3] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 608 && this.row3[4] != null){
        this.row4[4] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 672 && this.row3[5] != null){
        this.row4[5] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 736 && this.row3[6] != null){
        this.row4[6] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 800 && this.row3[7] != null){
        this.row4[7] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 864 && this.row3[8] != null){
        this.row4[8] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 928 && this.row3[9] != null){
        this.row4[9] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
}

if (this.activeBlock.y == 544){
    if(this.activeBlock.x == 352 && this.row2[0] != null){
        this.row3[0] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 416 && this.row2[1] != null){
        this.row3[1] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 480 && this.row2[2] != null){
        this.row3[2] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 544 && this.row2[3] != null){
        this.row3[3] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 608 && this.row2[4] != null){
        this.row3[4] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 672 && this.row2[5] != null){
        this.row3[5] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 736 && this.row2[6] != null){
        this.row3[6] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 800 && this.row2[7] != null){
        this.row3[7] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 864 && this.row2[8] != null){
        this.row3[8] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 928 && this.row2[9] != null){
        this.row3[9] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
}

if (this.activeBlock.y == 608){
    if(this.activeBlock.x == 352 && this.row1[0] != null){
        this.row2[0] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 416 && this.row1[1] != null){
        this.row2[1] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 480 && this.row1[2] != null){
        this.row2[2] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 544 && this.row1[3] != null){
        this.row2[3] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 608 && this.row1[4] != null){
        this.row2[4] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 672 && this.row1[5] != null){
        this.row2[5] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 736 && this.row1[6] != null){
        this.row2[6] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 800 && this.row1[7] != null){
        this.row2[7] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 864 && this.row1[8] != null){
        this.row2[8] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 928 && this.row1[9] != null){
        this.row2[9] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
}

if (this.activeBlock.y == 672){
    if(this.activeBlock.x == 352){
        this.row1[0] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 416){
        this.row1[1] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 480){
        this.row1[2] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 544){
        this.row1[3] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 608){
        this.row1[4] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 672){
        this.row1[5] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 736){
        this.row1[6] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 800){
        this.row1[7] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 864){
        this.row1[8] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
    else if(this.activeBlock.x == 928){
        this.row1[9] = this.activeBlock;
        this.activeBlock = null;
        this.active = false;
    }
}

I've only programmed these first five rows for testing. The first block is landing just fine, but the game freezes when the second block lands. When checking inspection mode, the error message reads Cannot read properties of null (reading 'y') and for some reason the line that triggers it is

if (this.activeBlock.y == 672)

This is supposed to trigger the landing process of the first row, which already has a block in its space at that point. It's as if the line that triggers the landing process of the second row is never triggered.

I'm certain the block passes over the y coordinate, 608, that triggers landing in the second row. And I'm pretty sure nothing is setting the active block to null again along the way. Can someone tell where things went wrong?

winner_joiner
  • 12,173
  • 4
  • 36
  • 61
EmptyStone
  • 235
  • 1
  • 7
  • 1
    You should look for patterns of duplicated (or nearly duplicated) blocks of code in your program and replace it with code that describes the pattern. If you find yourself cutting and repeatedly pasting code with your text editor, then doing manual changes on constants, array indices, or variable names, you've missed an opportunity to let the computer do that work for you. You should write your program in a way that expresses the intent of your program in a more concise way where you don't have to repeat yourself with [copy and paste](https://en.wikipedia.org/wiki/Copy-and-paste_programming). – Wyck Nov 20 '22 at 07:04
  • @EmptyStone Is this specific problem / question solved? – winner_joiner Nov 22 '22 at 11:36

1 Answers1

3

The main issue is easy to solve/fix (but it is hard to say, if this fixes all possible bugs, due to the specific coding style used), seeing your code and reading your explanations, leads me to I believe, that the first falling Cube is being placed in this if-Block:

if (this.activeBlock.y == 608){
   ...
   this.activeBlock = null; // "this" is the cause
   ...
}

in here the this.activeBlock is set to null. So after the this.activeBlock is reset, the next test of if (this.activeBlock.y == 672) throws the mentioned error, not after creation of the second block.

Solution use else if or/and adding an extra check before accessing the property of this.activeBlock, like this if (this.activeBlock && this.activeBlock.y == 672). (ofcourse for ALL if(this.activeBlock.y ...) statements)

Tipp: Checking / validating is better, than knowing/assuming the current values (humans are flawed).

btw.: It is good/best practice to check, if an object exists (is not null), before accessing its properties.

winner_joiner
  • 12,173
  • 4
  • 36
  • 61