Skip to content

Commit

Permalink
More comment and documentation in the code :)
Browse files Browse the repository at this point in the history
  • Loading branch information
@RobinBoers
RobinBoers committed Jul 26, 2021
1 parent 43d5581 commit 3bad3b9
Show file tree
Hide file tree
Showing 3 changed files with 85 additions and 23 deletions.
37 changes: 22 additions & 15 deletions src/scenes/endScene.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,16 +13,18 @@ export class endScene extends Phaser.Scene {
oldSkins = null

init(data) {
this.winner = data[0];
this.skin = data[1];
this.oldSkins = data[2];
this.level = data[3];
this.winner = data[0]; //
this.skin = data[1]; // skin the winner used
this.oldSkins = data[2]; // skins prev selected, remembered for the next round
this.level = data[3]; // level prev selected, remembered for the next round
}

create() {

// Cool fade-in effect
this.cameras.main.fadeIn(CST.UI.FADEDURATION, 0, 0, 0)

// Create animations
for (var x = 1; x < 5; x++) {

let skins = CST.SKINS;
Expand Down Expand Up @@ -55,15 +57,18 @@ export class endScene extends Phaser.Scene {
}
}

// Add background
this.add.image(0, 0, 'title_bg_still').setOrigin(0).setDepth(0).setScale(CST.UI.BACKGROUNDSCALE);

// this.background = this.add.tileSprite(0, 0, 3200, 600, 'title_bg').setOrigin(0);

// this.add.text(20, this.game.renderer.height * 0.1, `Player ${this.winner} has won!`, { font: '30px Courier', fill: '#000' });

// Add box
let playerBox = this.add.graphics();
playerBox.fillStyle(CST.UI.CARDCOLOR, 1.0);

// Boxshadow
let boxShadow = this.add.graphics();
boxShadow.fillStyle(0x000000, 1.0);

Expand All @@ -72,20 +77,28 @@ export class endScene extends Phaser.Scene {
playerBox.fillRect(this.game.renderer.width / 2.57 - 20, this.game.renderer.height * 0.2, this.game.renderer.width / 4, 250).setDepth(1);
boxShadow.fillRect(this.game.renderer.width / 2.57 - 20 + offset, offset + this.game.renderer.height * 0.2, this.game.renderer.width / 4, 250).setDepth(0);

// Add text (WINNER!)
this.add.text(this.game.renderer.width / 2.57 - 20 + 55, this.game.renderer.height * 0.2 + 210, 'WINNER!', { font: '20px Courier', color: CST.UI.TEXTCOLOR }).setDepth(2);

// Another line, because the sprite itself doesnt
// have a bottom
let playerSpriteBottom = this.add.graphics();
playerSpriteBottom.fillStyle(0xffffff, 1.0);

// Add sprite
let player = this.add.sprite(this.game.renderer.width / 2.57 - 20 + 100, this.game.renderer.height * 0.2 + 110, this.skin).setDepth(2).setScale(3.2);

// Play animation
player.anims.play(this.skin, true);

// Add the line at the bottom
playerSpriteBottom.setDepth(4);
playerSpriteBottom.fillRect(this.game.renderer.width / 2.57 - 20 + 41, this.game.renderer.height * 0.2 + 163, 120, 3.2)

// Text at the bottom
this.add.text(this.game.renderer.width / 2.57, this.game.renderer.height * 0.8, 'Press start', { font: '24px Courier', color: CST.UI.TEXTCOLOR });

// Music (not used)
this.sound.pauseOnBlur = false;
// let titleMusic = this.sound.add('title_music', {
// loop: true
Expand All @@ -95,22 +108,16 @@ export class endScene extends Phaser.Scene {

this.input.gamepad.on("down", (pad, button) => {

if (button.index === 9 || button.index == 0) {
// If the player clicks start, A or B,
// go back to menu (and that will redirect to player select)
if (button.index === 9 || button.index == 0 || button.index == 1) {

this.cameras.main.fadeOut(CST.UI.FADEDURATION, 0, 0, 0)
// this.sound.play('btn_hover');

// setTimeout(200, () => {
this.sound.play('btn_click');
// })
this.scene.start(CST.SCENES.PLAYERSELECT, ["Open player select.", this.oldSkins, this.level]);

}

})

this.cameras.main.once(Phaser.Cameras.Scene2D.Events.FADE_OUT_COMPLETE, () => {
this.scene.start(CST.SCENES.PLAYERSELECT, ["Open player select.", this.oldSkins, this.level]);
})
});

}
}
47 changes: 41 additions & 6 deletions src/scenes/playerSelectScene.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -175,7 +175,7 @@ export class playerSelectScene extends Phaser.Scene {
}

// if (pad.index == 0) {
// When player1 hits the back button
// When player1 hits the back button (or B)
if (button.index === 8 || button.index == 1) {

// Stop title screen music (otherwise it will play twice)
Expand All @@ -194,7 +194,7 @@ export class playerSelectScene extends Phaser.Scene {
this.scene.start(CST.SCENES.MODE, ["Back to mode select. Exit player select."]);
}

// When player 1 hits the start button
// When player 1 hits the start button (or A)
if ((button.index === 9 || button.index == 0) && this.joinedPlayersNum > 1) {

// Stop music
Expand Down Expand Up @@ -252,10 +252,13 @@ export class playerSelectScene extends Phaser.Scene {
if(button.index == 3) {
this.sound.play('btn_hover');

let maxLevels = 2;
// How many levels there are to pick from
let maxLevels = 3;

this.currentLevel = Math.floor(Math.random() * (maxLevels - 0 + 1) + 0);
// Pick random level
this.currentLevel = Math.floor(Math.random() * ((maxLevels - 1) - 0 + 1) + 0);

// Set level based on currentLevel
if(this.currentLevel == 0) {
this.level = "city"
} else if(this.currentLevel == 1) {
Expand All @@ -264,6 +267,7 @@ export class playerSelectScene extends Phaser.Scene {
this.level = "factory"
}

// Hide which level is selected
this.add.image(95, 460, 'city_scene').setScale(.15).setOrigin(0, 0)
this.add.image(105 + 1 * (this.game.renderer.width / 4), 460, 'forest_scene').setScale(.15).setOrigin(0, 0)
this.add.image(115 + 2 * (this.game.renderer.width / 4), 460, 'factory_scene').setScale(.15).setOrigin(0, 0)
Expand All @@ -275,20 +279,30 @@ export class playerSelectScene extends Phaser.Scene {
}

update() {
// Update background
this.background.tilePositionX += CST.UI.BACKGROUNDSPEED;

// fireTimer is a delay for the controller input
// bacause it will otherwise select stuff on warp speed
this.fireTimer += 1;

// Cycle trough all connected gamepads (max 4)
for(let i = 0;i < 5;i++) {

// Get current gamepad
let gamepad = this.input.gamepad.gamepads[i];

// If the gamepad exists,
// detect input
if(gamepad) {

// Only if the controller has analog input
if(gamepad.axes.length >= 2) {

// Change selected level
// Value of horizontal axes
let axisH = gamepad.axes[0].getValue();

// Change selected level
if (axisH < -0.8 && this.fireTimer > this.fireDelay) {

this.fireTimer = 0;
Expand Down Expand Up @@ -316,9 +330,10 @@ export class playerSelectScene extends Phaser.Scene {

} // right

// Select skin (down)
// Value of vertical axes
let axisV = gamepad.axes[1].getValue();

// Select skin (down)
if (axisV > 0.8 && this.fireTimer > this.fireDelay && this.joinedPlayers[i] === true) {

this.fireTimer = 0;
Expand Down Expand Up @@ -372,6 +387,8 @@ export class playerSelectScene extends Phaser.Scene {
}
}

// Function to update images of the levels
// and hightlight the one currently selected
refreshLevels() {
if(this.currentLevel == 0) {
// this.add.image(80, 460, 'default_scene_sel').setScale(.15).setOrigin(0, 0)
Expand All @@ -397,22 +414,33 @@ export class playerSelectScene extends Phaser.Scene {
}
}

// Function that runs when a
// player joins the game
// (i is the id of the gamepad the player is using)
joinPlayer(i) {

// Increase count of joinedPlayers
this.joinedPlayersNum += 1;

// Give the player a skin
let skin = this.skindex[this.currentSkin[i]];
let playerSkin = skin + (i + 1);

// Add skins to players array
this.players[i] = skin;

// Save that the player with this id is joined
// by adding it to an array
this.joinedPlayers[i] = true;

// Play sound
this.sound.play('btn_hover');

// Add box
let playerBox = this.add.graphics();
playerBox.fillStyle(CST.UI.CARDCOLOR, 1.0);

// Boxschadow
let boxShadow = this.add.graphics();
boxShadow.fillStyle(0x000000, 1.0);

Expand All @@ -422,18 +450,25 @@ export class playerSelectScene extends Phaser.Scene {

boxShadow.fillRect((i + 1) * 20 + i * (this.game.renderer.width / 4 - 30) + offset, offset + this.game.renderer.height * 0.2, this.game.renderer.width / 4 - 20, 240).setDepth(0);

// Add text (Player + player num)
this.add.text((i + 1) * 20 +i * (this.game.renderer.width / 4 - 30) + 37, this.game.renderer.height * 0.2 + 200, 'Player ' + (i + 1), { font: '20px Courier', color: CST.UI.TEXTCOLOR }).setDepth(2);

// Add little line at the bottom, because
// the skins itself dont have a bottom
let playerSpriteBottom = this.add.graphics();
playerSpriteBottom.fillStyle(0xffffff, 1.0);

// Add skins itself
this.playerSprites[i] = this.add.sprite((i + 1) * 20 + i * (this.game.renderer.width / 4 - 30) + 90, this.game.renderer.height * 0.2 + 100, playerSkin).setDepth(2).setScale(3.2);

// Remove placeholder image (with the button down)
this.placeholders[i].setVisible(false);

// Add the line itself and move it to the foreground
playerSpriteBottom.setDepth(4);
playerSpriteBottom.fillRect((i + 1) * 20 + i * (this.game.renderer.width / 4 - 30) + 31, this.game.renderer.height * 0.2 + 153, 120, 3.2)

// Play animation
this.playerSprites[i].anims.play(skin + '_idle' + (i + 1), true);
}

Expand Down
24 changes: 22 additions & 2 deletions src/scenes/settingsScene.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,16 +40,21 @@ export class settingsScene extends Phaser.Scene {

create() {

// Cool fade-in effect
this.cameras.main.fadeIn(CST.UI.FADEDURATION, 0, 0, 0)

// Add background to scene
this.background = this.add.tileSprite(0, 0, 3200, 600, 'title_bg').setOrigin(0);

// Add title at the top of the screen
this.add.image(this.game.renderer.width / 2, this.game.renderer.height * 0.1 + 20, 'settings').setScale(2);

// Spawn text for the options itself
for(let i = 0;i<this.options.length;i++) {
this.optionText[i] = this.add.text(200, this.game.renderer.height * 0.1*i + 165, this.optionNames[i] + ": " + this.options[i], { font: '24px Courier', color: CST.UI.TEXTCOLOR });
this.optionText[i] = this.add.text(200, this.game.renderer.height * 0.1*i + 150, this.optionNames[i] + ": " + this.options[i], { font: '24px Courier', color: CST.UI.TEXTCOLOR });
}

// Update options text for the first time
this.updateOptions();

this.input.gamepad.on("down", (pad, button) => {
Expand Down Expand Up @@ -134,17 +139,27 @@ export class settingsScene extends Phaser.Scene {
}

update() {
// Update background
this.background.tilePositionX += CST.UI.BACKGROUNDSPEED;

// fireTimer is a delay for the controller input
// bacause it will otherwise select stuff on warp speed
this.fireTimer += 1;

// Cycle trough all connected gamepads (max 4)
for(let i = 0;i < 5;i++) {

// Get current gamepad
let gamepad = this.input.gamepad.gamepads[i];

// If the gamepad exists,
// detect input
if(gamepad) {

// Only if the controller has analog input
if(gamepad.axes.length >= 2) {

// Value of horizontal axes
let axisH = gamepad.axes[0].getValue();

// Change option (to left)
Expand Down Expand Up @@ -189,9 +204,10 @@ export class settingsScene extends Phaser.Scene {

if(this.fireTimer > this.fireDelay) {

// Select option (down)
// Value of the vertical axes
let axisV = gamepad.axes[1].getValue();

// Select option (down)
if (axisV > 0.8) {

this.fireTimer = 0;
Expand Down Expand Up @@ -220,9 +236,13 @@ export class settingsScene extends Phaser.Scene {
}

updateOptions() {
// Cycle trough all options
for(let i = 0;i<this.options.length;i++) {
// Update text with current value
this.optionText[i].text = this.optionNames[i] + ": " + this.options[i];

// If selected, make the text bigger,
// otherwise, return to default size
if(i == this.currentOption) {
this.optionText[i].setScale(1.5);
} else {
Expand Down

0 comments on commit 3bad3b9

Please sign in to comment.