Fix: change smoke animation sprite to particle effect

src/game/mouse/grilled_meat/game.js

@@ -91,7 +91,6 @@ var Game = {
 		this.speechBubble.hideSpeechBubble();
 
 
-
 		// bottom ui
 		var screenBottomUI = new ScreenBottomUI();
 		screenBottomUI.printLeftTextWithAppHighestRecord(sessionStorageManager.getAppHighestRecord());

src/game/mouse/grilled_meat/loading.js

@@ -43,7 +43,8 @@ var Loading = {
 		game.load.image('meatBurn2', '../../../resources/image/object/grilled_meat/meat2_burn.png');
 		game.load.image('meatBurn3', '../../../resources/image/object/grilled_meat/meat3_burn.png');
 
-		game.load.image('smoke', '../../../resources/image/object/grilled_meat/smoke.png');
+		// game.load.image('smoke', '../../../resources/image/object/grilled_meat/smoke.png');
+		game.load.image('smoke', '../../../resources/image/ui/smoke.png');
 
 		game.load.image('speech_bubble_angry', '../../../resources/image/ui/speech_bubble_angry.png');
 		game.load.image('speech_bubble_happy', '../../../resources/image/ui/speech_bubble_happy.png');

src/game/mouse/grilled_meat/meat.js

@@ -1,6 +1,3 @@
-var MEAT_FRONT	= 0;
-var MEAT_BACK	= 1;
-
 var ANGLE_NONE	= 0;
 var ANGLE_FRONT	= 30;
 var ANGLE_BACK	= -30;
@@ -12,13 +9,13 @@ var COOK_TIME_BURN		= 400;
 
 Meat = function(mainGame) {
 	this.mainGame = mainGame;
-	this.cookingSide = MEAT_BACK;
+	this.cookingSide = Meat.MEAT_NONE;
 	this.cookingTime = [];
 	this.cookingGrade = [];
-	this.cookingTime[MEAT_BACK] = 0;
+	this.cookingTime[Meat.MEAT_BACK] = 0;
-	this.cookingTime[MEAT_FRONT] = 0;
+	this.cookingTime[Meat.MEAT_FRONT] = 0;
-	this.cookingGrade[MEAT_BACK] = Meat.DONENESS_RARE;
+	this.cookingGrade[Meat.MEAT_BACK] = Meat.DONENESS_RARE;
-	this.cookingGrade[MEAT_FRONT] = Meat.DONENESS_RARE;
+	this.cookingGrade[Meat.MEAT_FRONT] = Meat.DONENESS_RARE;
 
 
 	this.isActivated = true;
@@ -40,6 +37,10 @@ Meat = function(mainGame) {
 	// this.events.onDragStart.add(this.onDragStart, this);
 	// this.events.onDragStop.add(this.onDragStop, this);
 
+	this.whiteSmokeParticle = new Smoke(Meat.DONENESS_RARE, 0, 0);
+	this.redSmokeParticle = new Smoke(Meat.DONENESS_WELLDONE, 0, 0);
+	this.blackSmokeParticle = new Smoke(Meat.DONENESS_BURN_BLACK, 0, 0);
+
 	game.add.existing(this);
 }
 
@@ -56,7 +57,7 @@ Meat.prototype.update = function() {
 	} else
 		this.scale.set(0.4 + 0.3);
 
-	// if(this.isOnHeatPlate == true) {
+
 	if(this.isOnHeatPlate == true && game.input.mousePointer.isUp == true) {
 		this.cooking();
 	}
@@ -64,27 +65,32 @@ Meat.prototype.update = function() {
 
 
 Meat.prototype.onDown = function(sprite, pointer) {
+	// console.log("-------------------------");
 	// console.log("onDown : " + pointer.x + ", " + pointer.y);
 
 	this.downPositionX = Math.floor(sprite.x);
 	this.downPositionY = Math.floor(sprite.y);
+
+	this.stopCook();
 }
 
 Meat.prototype.onUp = function(sprite, pointer) {
+	// console.log("-------------------------");
 	// console.log("onUp : " + pointer.x + ", " + pointer.y);
 
 	var upPositionX = Math.floor(sprite.x);
 	var upPositionY = Math.floor(sprite.y);
 
+	// console.log("downPositionX : + " + this.downPositionX + ", downPositY : " + this.downPositionY);
+	// console.log("upPositionX : + " + upPositionX + ", upPositionY : " + upPositionY);
 	if(this.isInClickArea(this.downPositionX, this.downPositionY, upPositionX, upPositionY) == true)
 		this.onClickListener();
 	else {
 		this.onDragStopListener();
-		// console.log("downPositionX : + " + this.downPositionX + ", downPositY : " + this.downPositionY);
-		// console.log("upPositionX : + " + upPositionX + ", upPositionY : " + upPositionY);
 	}
 }
 
+
 /*
 Meat.prototype.onDragStart = function(sprite, pointer) {
 	// console.log("onDragStart : " + pointer.x + ", " + pointer.y);
@@ -121,6 +127,8 @@ Meat.prototype.isInClickArea = function(downX, downY, upX, upY) {
 }
 
 Meat.prototype.onClickListener = function(pointer) {
+	// console.log("onClickListener");
+
 	if(this.mainGame.isOverHeatPlate(this.x, this.y, this.width, this.height) == true) {
 		if(this.isFront() == true)
 			this.flipToBack()
@@ -129,7 +137,8 @@ Meat.prototype.onClickListener = function(pointer) {
 
 		// console.log("flip cooking side : " + this.cookingSide);
 
-		this.animateSmoke(Meat.DONENESS_NONE);
+		// this.stopAnimateSmoke();
+		this.startCook();
 	}
 }
 
@@ -158,21 +167,22 @@ Meat.prototype.setScale = function(size) {
 
 
 Meat.prototype.isFront = function() {
-	if(this.cookingSide == MEAT_BACK)
+	if(this.cookingSide == Meat.MEAT_BACK)
 		return true;
 
 	return false;
 }
 
 Meat.prototype.flipToFront = function() {
-	this.cookingSide = MEAT_BACK;
+	this.cookingSide = Meat.MEAT_BACK;
+	// console.log("flipToFront : " + this.cookingSide);
 
 	this.angle = ANGLE_FRONT;
 	// console.log("flipToFront");
-	// console.log("back : " + this.getMeatGradeBySide(MEAT_BACK) + ", front : " + this.getMeatGradeBySide(MEAT_FRONT));
+	// console.log("back : " + this.getMeatGradeBySide(Meat.MEAT_BACK) + ", front : " + this.getMeatGradeBySide(Meat.MEAT_FRONT));
-	if(this.getMeatGradeBySide(MEAT_FRONT) == Meat.DONENESS_BURN_BLACK) {
+	if(this.getMeatGradeBySide(Meat.MEAT_FRONT) == Meat.DONENESS_BURN_BLACK) {
 		this.loadTexture('meatBurn1');
-	} else if(this.getMeatGradeBySide(MEAT_FRONT) == Meat.DONENESS_WELLDONE) {
+	} else if(this.getMeatGradeBySide(Meat.MEAT_FRONT) == Meat.DONENESS_WELLDONE) {
 		this.loadTexture('meatWellDone1');
 	} else {
 		this.loadTexture('meat1');
@@ -180,14 +190,15 @@ Meat.prototype.flipToFront = function() {
 }
 
 Meat.prototype.flipToBack = function() {
-	this.cookingSide = MEAT_FRONT;
+	this.cookingSide = Meat.MEAT_FRONT;
+	// console.log("flipToBack : " + this.cookingSide);
 
 	this.angle = ANGLE_BACK;
 	// console.log("flipToBack");
-	// console.log("back : " + this.getMeatGradeBySide(MEAT_BACK) + ", front : " + this.getMeatGradeBySide(MEAT_FRONT));
+	// console.log("back : " + this.getMeatGradeBySide(Meat.MEAT_BACK) + ", front : " + this.getMeatGradeBySide(Meat.MEAT_FRONT));
-	if(this.getMeatGradeBySide(MEAT_BACK) == Meat.DONENESS_BURN_BLACK) {
+	if(this.getMeatGradeBySide(Meat.MEAT_BACK) == Meat.DONENESS_BURN_BLACK) {
 		this.loadTexture('meatBurn1');
-	} else if(this.getMeatGradeBySide(MEAT_BACK) == Meat.DONENESS_WELLDONE) {
+	} else if(this.getMeatGradeBySide(Meat.MEAT_BACK) == Meat.DONENESS_WELLDONE) {
 		this.loadTexture('meatWellDone1');
 	} else {
 		this.loadTexture('meat1');
@@ -207,19 +218,25 @@ Meat.prototype.hide = function() {
 Meat.prototype.startCook = function() {
 	this.isStartCook = true;
 	this.isOnHeatPlate = true;
+	// console.log("this.isOnHeatPlate : " + this.isOnHeatPlate);
 
-	this.flipToFront();
+	// console.log("startCook : " + this.cookingSide);
-	this.animateSmoke(Meat.DONENESS_NONE);
+	if(this.cookingSide == Meat.MEAT_NONE)
+		this.flipToFront();
+
+	this.startAnimateSmoke();
 }
 
 Meat.prototype.stopCook = function() {
 	this.isOnHeatPlate = false;
+	// console.log("this.isOnHeatPlate : " + this.isOnHeatPlate);
+	this.stopAnimateSmoke();
 }
 
 Meat.prototype.getMeatGrade = function() {
-	if(this.cookingGrade[MEAT_FRONT] == Meat.DONENESS_WELLDONE && this.cookingGrade[MEAT_BACK] == Meat.DONENESS_WELLDONE)
+	if(this.cookingGrade[Meat.MEAT_FRONT] == Meat.DONENESS_WELLDONE && this.cookingGrade[Meat.MEAT_BACK] == Meat.DONENESS_WELLDONE)
 		return Meat.DONENESS_WELLDONE;
-	else if(this.cookingGrade[MEAT_FRONT] == Meat.DONENESS_BURN_BLACK || this.cookingGrade[MEAT_BACK] == Meat.DONENESS_BURN_BLACK)
+	else if(this.cookingGrade[Meat.MEAT_FRONT] == Meat.DONENESS_BURN_BLACK || this.cookingGrade[Meat.MEAT_BACK] == Meat.DONENESS_BURN_BLACK)
 		return Meat.DONENESS_BURN_BLACK;
 	else
 		return Meat.DONENESS_RARE;
@@ -240,11 +257,11 @@ Meat.prototype.setActive = function(isActivated, x, y, meat_type) {
 		return;
 	}
 
-	this.cookingSide = MEAT_BACK;
+	this.cookingSide = Meat.MEAT_NONE;
-	this.cookingTime[MEAT_BACK] = 0;
+	this.cookingTime[Meat.MEAT_BACK] = 0;
-	this.cookingTime[MEAT_FRONT] = 0;
+	this.cookingTime[Meat.MEAT_FRONT] = 0;
-	this.cookingGrade[MEAT_BACK] = Meat.DONENESS_RARE;
+	this.cookingGrade[Meat.MEAT_BACK] = Meat.DONENESS_RARE;
-	this.cookingGrade[MEAT_FRONT] = Meat.DONENESS_RARE;
+	this.cookingGrade[Meat.MEAT_FRONT] = Meat.DONENESS_RARE;
 
 	this.x = x;
 	this.y = y;
@@ -255,43 +272,73 @@ Meat.prototype.setActive = function(isActivated, x, y, meat_type) {
 
 Meat.prototype.cooking = function() {
 	this.cookingTime[this.cookingSide] += 1;
-	// console.log("back : " + this.cookingTime[MEAT_BACK] + ", front : " + this.cookingTime[MEAT_FRONT]);
+	// console.log("back : " + this.cookingTime[Meat.MEAT_BACK] + ", front : " + this.cookingTime[Meat.MEAT_FRONT]);
 
-	if(this.cookingTime[MEAT_BACK] > COOK_TIME_BURN) {
+	if(this.cookingTime[Meat.MEAT_BACK] > COOK_TIME_BURN) {
-		if(this.getMeatGradeBySide(MEAT_BACK) != Meat.DONENESS_BURN_BLACK) {
+		if(this.getMeatGradeBySide(Meat.MEAT_BACK) != Meat.DONENESS_BURN_BLACK) {
-			this.cookingGrade[MEAT_BACK] = Meat.DONENESS_BURN_BLACK;
+			this.cookingGrade[Meat.MEAT_BACK] = Meat.DONENESS_BURN_BLACK;
-			this.animateSmoke(Meat.DONENESS_BURN_BLACK);
+			this.changeAnimateSmokeColor(Meat.DONENESS_BURN_BLACK);
 		}
-	} else if(this.cookingTime[MEAT_BACK] > COOK_TIME_WELLDONE) {
+	} else if(this.cookingTime[Meat.MEAT_BACK] > COOK_TIME_WELLDONE) {
-		if(this.getMeatGradeBySide(MEAT_BACK) != Meat.DONENESS_WELLDONE) {
+		if(this.getMeatGradeBySide(Meat.MEAT_BACK) != Meat.DONENESS_WELLDONE) {
-			this.cookingGrade[MEAT_BACK] = Meat.DONENESS_WELLDONE;
+			this.cookingGrade[Meat.MEAT_BACK] = Meat.DONENESS_WELLDONE;
-			this.animateSmoke(Meat.DONENESS_WELLDONE);
+			this.changeAnimateSmokeColor(Meat.DONENESS_WELLDONE);
 		}
 	}
 
-	if(this.cookingTime[MEAT_FRONT] > COOK_TIME_BURN) {
+	if(this.cookingTime[Meat.MEAT_FRONT] > COOK_TIME_BURN) {
-		if(this.getMeatGradeBySide(MEAT_FRONT) != Meat.DONENESS_BURN_BLACK) {
+		if(this.getMeatGradeBySide(Meat.MEAT_FRONT) != Meat.DONENESS_BURN_BLACK) {
-			this.cookingGrade[MEAT_FRONT] = Meat.DONENESS_BURN_BLACK;
+			this.cookingGrade[Meat.MEAT_FRONT] = Meat.DONENESS_BURN_BLACK;
-			this.animateSmoke(Meat.DONENESS_BURN_BLACK);
+			this.changeAnimateSmokeColor(Meat.DONENESS_BURN_BLACK);
 		}
-	} else if(this.cookingTime[MEAT_FRONT] > COOK_TIME_WELLDONE) {
+	} else if(this.cookingTime[Meat.MEAT_FRONT] > COOK_TIME_WELLDONE) {
-		if(this.getMeatGradeBySide(MEAT_FRONT) != Meat.DONENESS_WELLDONE) {
+		if(this.getMeatGradeBySide(Meat.MEAT_FRONT) != Meat.DONENESS_WELLDONE) {
-			this.cookingGrade[MEAT_FRONT] = Meat.DONENESS_WELLDONE;
+			this.cookingGrade[Meat.MEAT_FRONT] = Meat.DONENESS_WELLDONE;
-			this.animateSmoke(Meat.DONENESS_WELLDONE);
+			this.changeAnimateSmokeColor(Meat.DONENESS_WELLDONE);
 		}
 	}
 }
 
 Meat.prototype.animateSmoke = function(type) {
-	var smokeEffect = new Smoke(game, this.x + game.rnd.integerInRange(-50, 0), this.y);
+}
 
-	if(type == Meat.DONENESS_WELLDONE)
+Meat.prototype.stopAnimateSmoke = function() {
-		smokeEffect.tint = 0xff3333;
+	this.whiteSmokeParticle.stop();
-	else if(type == Meat.DONENESS_BURN_BLACK)
+	this.redSmokeParticle.stop();
-		smokeEffect.tint = 0x333333;
+	this.blackSmokeParticle.stop();
+}
+
+Meat.prototype.startAnimateSmoke = function() {
+	var cookingSideGrade = this.cookingGrade[this.cookingSide];
+	this.changeAnimateSmokeColor(cookingSideGrade);
 
 }
 
+Meat.prototype.changeAnimateSmokeColor = function(type) {
+	// console.log("changeAnimateSmokeColor : " + type);
+	this.stopAnimateSmoke();
+
+	switch(type) {
+		case Meat.DONENESS_RARE:
+		this.whiteSmokeParticle.start(this.x, this.y);
+		break;
+
+		case Meat.DONENESS_WELLDONE:
+		this.redSmokeParticle.start(this.x, this.y);
+		break;
+
+		case Meat.DONENESS_BURN_BLACK:
+		this.blackSmokeParticle.start(this.x, this.y);
+		break;
+	}
+}
+
+
+Meat.MEAT_NONE	= 0;
+Meat.MEAT_FRONT	= 1;
+Meat.MEAT_BACK	= 2;
+
+
 
 Meat.DONENESS_RARE			= 0;
 Meat.DONENESS_WELLDONE		= 1;

src/game/mouse/grilled_meat/smoke.js

@@ -1,37 +1,44 @@
-var SMOKE_START_OFFSET_Y		= 200;
+Smoke = function(type, x, y) {
-var SMOKE_SPEED					= 1;
+	this.emitter = game.add.emitter(x, y, 50);
+	// this.emitter = game.add.emitter(game.world.centerX, 500, 200);
+	this.emitter.makeParticles("smoke");
 
-/////////////////////////////
+	this.emitter.width = 50;
-// PlusScore Class
+	this.emitter.height = 50;
+	this.emitter.setRotation(0, 0);
+	this.emitter.setAlpha(0.3, 0.8);
+	// this.emitter.setScale(0.5, 1);
+	this.emitter.gravity = -300;
+	this.emitter.start(false, 1000, 100);
+	this.stop();
 
-Smoke = function(game, x, y) {
+	this.changeColor(type);
-	Phaser.Sprite.call(this, game, x, y - SMOKE_START_OFFSET_Y, 'smoke');
-
-	// this.anchor.set(0.5);
-	this.scale.set(0.5);
-	// console.log(this);
-	// this.addColor("#ffffff", 0);
-	// this.setStyle(textStyle);
-
-	this.inputEnabled = false;
-	game.time.events.add(Phaser.Timer.SECOND * 1, this.fadePlusScore, this);
-	game.time.events.add(Phaser.Timer.SECOND * 2, this.destroySelf, this);
-
-	game.add.existing(this);
 }
 
-Smoke.prototype = Object.create(Phaser.Sprite.prototype);
+Smoke.prototype.changeColor = function(type) {
-Smoke.prototype.constructor = Smoke;
+	var color = 0xf0f0ed;
-Smoke.prototype.update = function() {
+
-	this.y -= SMOKE_SPEED;
+	if(type == Meat.DONENESS_WELLDONE)
+		color = 0xb06060;
+	else if(type == Meat.DONENESS_BURN_BLACK)
+		color = 0x333333;
+
+	this.emitter.forEach(
+		function(particle) {
+			particle.tint = color;
+		}
+	);
 }
 
-Smoke.prototype.fadePlusScore = function() {
+Smoke.prototype.start = function(x, y) {
-	game.add.tween(this).to( { alpha: 0 }, 1000, Phaser.Easing.Linear.None, true);
+	this.emitter.x = x;	// + game.rnd.integerInRange(-10, 10);
+	this.emitter.y = y + Smoke.OFFSET_POS_Y;
+	this.emitter.on = true;
 }
 
-Smoke.prototype.destroySelf = function() {
+Smoke.prototype.stop = function() {
-	this.destroy();
+	this.emitter.on = false;
 }
 
 
+Smoke.OFFSET_POS_Y		= -20;