Add: AlienTimer

src/game/lib/score_text.js

@@ -7,7 +7,7 @@ class ScoreText extends Phaser.Text {
 		this.inputEnabled = false;
 
 		var grd = this.context.createLinearGradient(0, 0, 0, this.height);
-		grd.addColorStop(0, '#8ED6FF');   
+		grd.addColorStop(0, '#8ED6FF');
 		grd.addColorStop(1, '#004CB3');
 		this.fill = grd;
 		// this.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);

src/game/mouse/space_invaders/alien.js

@@ -10,6 +10,9 @@ class Alien extends Phaser.Sprite {
 		this.initialX = initialX;
 		this.initialY = initialY;
 
+		this.tweenScaleUp = null;
+		this.tweenScaleDown = null;
+
 		this.onGoOnstageFunction = onGoOnstageFunction;
 		this.onFiredFunction = onFiredFunction;
 		this.onEscapedFunction = onEscapedFunction;
@@ -55,6 +58,14 @@ class Alien extends Phaser.Sprite {
 	}
 
 
+	stop() {
+		this.setActive(false);
+		this.removeTween();
+
+		// if(this.isOnWaitingRoom !== true)
+		// 	this.scale.set(0);
+	}
+
 	setActive(isActivated) {
 		this.isActivated = isActivated;
 
@@ -66,16 +77,14 @@ class Alien extends Phaser.Sprite {
 	}
 
 	removeTween() {
-		if(typeof this.tweenScaleUp !== "undefined") {
+		if(this.tweenScaleUp !== null) {
 			this.tweenScaleUp.stop();
 			this.tweenScaleUp = null;
 		}
-		if(typeof this.tweenScaleDown !== "undefined") {
+		if(this.tweenScaleDown !== null) {
 			this.tweenScaleDown.stop();
 			this.tweenScaleDown = null;
 		}
-
-		this.scale.set(Alien.ONSTAGE_MIN_SCALE);
 	}
 
 	goWaitingRoom() {
@@ -117,6 +126,7 @@ class Alien extends Phaser.Sprite {
 		// }
 
 		this.tint = 0xffffff;
+		this.scale.set(Alien.ONSTAGE_MIN_SCALE);
 
 		// start scale tween animation
 		this.removeTween();

src/game/mouse/space_invaders/alien_timer.js

@@ -0,0 +1,99 @@
+class AlienTimer {
+
+	constructor(aliens) {
+		this.aliens = aliens;
+		this.activatedAlienIndex = 0;
+
+		let posX = this.aliens[0].x;
+		let posY = this.aliens[0].y - AlienTimer.MOVE_UP_AMOUNT_PX;
+		this.timerText = game.add.text(posX, posY, "30", AlienTimer.DEFAULT_TEXT_FONT);
+		this.timerText.anchor.set(0.5);
+
+		var grd = this.timerText.context.createLinearGradient(0, 0, 0, this.timerText.height);
+		grd.addColorStop(0, '#FFD68E');
+		grd.addColorStop(1, '#B34C00');
+		this.timerText.fill = grd;
+		// this.setShadow(3, 3, 'rgba(0, 0, 0, 0.5)', 2);
+		this.timerText.stroke = '#000';
+		this.timerText.strokeThickness = 5;
+
+		this.timerEvent = null;
+		this.timeInterval = AlienTimer.DEFAULT_TIME_GAP_SEC;
+		this.timeLeft = this.timeInterval;
+	}
+
+	start() {
+		this.enableTimerOn(this.getActivatedAlien());
+		// this.getActivatedAlien().setActive(true);
+		this.timerText.text = this.timeLeft.toString();
+		if(this.timerEvent === null)
+			this.timerEvent = game.time.events.loop(Phaser.Timer.SECOND, this.updateTimer, this);
+	}
+
+	pause() {
+	}
+
+	stop() {
+		if(this.timerEvent)
+			this.removeTimer();
+		this.timerText.text = "";
+
+		for(let i = 0; i < this.aliens.length; i++)
+			this.aliens[i].stop();
+	}
+
+	next() {
+		this.timeLeft = this.timeInterval;
+		this.timerText.text = this.timeLeft.toString();
+
+		this.activatedAlienIndex++;
+		if(this.activatedAlienIndex >= this.aliens.length) {
+			this.timerText.text = "";
+			this.removeTimer();
+			return null;
+		}
+
+		this.enableTimerOn(this.getActivatedAlien());
+	}
+
+	getActivatedAlien() {
+		return this.aliens[this.activatedAlienIndex];
+	}
+
+	enableTimerOn(alien) {
+		alien.setActive(true);
+		this.timerText.x = alien.x;
+	}
+
+	disableTimerOn(alien) {
+		alien.setActive(false);
+		this.timerText.text = "";
+	}
+
+	updateTimer() {
+		this.timeLeft--;
+		if(this.timeLeft == 0) {
+			this.timeLeft = this.timeInterval;
+
+			this.getActivatedAlien().goOnstage();
+		} else {
+			this.timerText.text = this.timeLeft.toString();
+		}
+	}
+
+	removeTimer() {
+		game.time.events.remove(this.timerEvent);
+		this.timerEvent = null;
+	}
+
+}
+
+AlienTimer.DEFAULT_TEXT_FONT		= {
+	font: "bold 30px Arial",
+	boundsAlignH: "center",		// left, center. right
+	boundsAlignV: "middle", 	// top, middle, bottom
+	fill: "#fff"
+};
+
+AlienTimer.DEFAULT_TIME_GAP_SEC		= 10;
+AlienTimer.MOVE_UP_AMOUNT_PX		= 60;

src/game/mouse/space_invaders/define_variables.js

@@ -1,2 +1,2 @@
 let scoreManager = new ScoreManager();
-let heartManager = new HeartManager();
+let heartManager = new HeartManager();

src/game/mouse/space_invaders/game.js

@@ -6,15 +6,23 @@ class Game {
 	create() {
 		this.game.stage.backgroundColor = '#4d4d4d';
 
-		this.initListeners();
-
 		// top
 		let backButton = new BackButton( () => {
 			location.href = '../../web/client/menu_app.html';
 		});
 
 		let scoreBoard = new ScoreBoard();
+		scoreManager.addOnChangeScoreListener( score => {
+			scoreBoard.printScore(NumberUtil.numberWithCommas(score));
+		});
+		scoreManager.addOnChangeHighScoreListener( highScore => {
+			screenBottom.printBottomLeftText("최고 기록 : " + NumberUtil.numberWithCommas(highScore));
+		});
+
 		let heartGauge = new HeartGauge(heartManager);
+		heartManager.addOnChangeGameOverListener(
+			() => { this.gameOver(); }
+		);
 		heartGauge.start();
 
 		let fullscreenButton = new FullscreenButton(this.game);
@@ -27,17 +35,20 @@ class Game {
 
 
 		// contents
-		this.activatedAlienIndex = 0;
+		// this.activatedAlienIndex = 0;
 		this.aliens = [];
 		for(let i = 0; i < 10; i++) {
 			let alien = new Alien(150 + 80 * i, 150,
 				() => { this.activateNextAlien(); },	// onGoOnstage
-				this.onAlienFired, this.onAlienEscaped);
+				this.onAlienFired, this.onAlienEscaped
+			);
 			alien.goWaitingRoom();
 			alien.setActive(false);
 			this.aliens.push(alien);
 		}
 
+		this.alienTimer = new AlienTimer(this.aliens);
+
 
 		// bottom
 		let screenBottom = new ScreenBottom(game);
@@ -54,18 +65,6 @@ class Game {
 	}
 
 	initListeners() {
-		scoreManager.addOnChangeScoreListener( score => {
-			console.log("onChangeScore : " + score);
-			scoreBoard.printScore(NumberUtil.numberWithCommas(score));
-		});
-		scoreManager.addOnChangeHighScoreListener( highScore => {
-			console.log("onChangeHighScore : " + highScore);
-			screenBottom.printBottomLeftText("최고 기록 : " + NumberUtil.numberWithCommas(highScore));
-		});
-
-		heartManager.addOnChangeGameOverListener(
-			() => { this.gameOver(); }
-		);
 	}
 
 	/*
@@ -101,19 +100,21 @@ class Game {
 
 	startGame() {
 		// activate first alien
-		this.activateNextAlien();
+		this.alienTimer.start();
+		// this.activateNextAlien();
 	}
 
 	gameOver() {
-		console.log("gameOver");
+		this.alienTimer.stop();
 	}
 
 	activateNextAlien() {
-		if(this.activatedAlienIndex === this.aliens.length)
-			return;
+		this.alienTimer.next();
+		// if(this.activatedAlienIndex === this.aliens.length)
+		// 	return;
 
-		this.aliens[this.activatedAlienIndex].setActive(true);
-		this.activatedAlienIndex++;
+		// this.aliens[this.activatedAlienIndex].setActive(true);
+		// this.activatedAlienIndex++;
 	}
 
 	onAlienFired(sprite) {

src/web/client/space_invaders.html

@@ -32,6 +32,7 @@
 		<script src="../../game/mouse/space_invaders/define_variables.js"></script>
 		<script src="../../game/mouse/space_invaders/loading.js"></script>
 		<script src="../../game/mouse/space_invaders/alien.js"></script>
+		<script src="../../game/mouse/space_invaders/alien_timer.js"></script>
 		<script src="../../game/mouse/space_invaders/game.js"></script>
 		<script src="../../game/mouse/space_invaders/main.js"></script>