✨ Ajoute le feu d'artifice et améliore le mobile

js/main.js

@@ -1,6 +1,6 @@
-
-let width = window.innerWidth * window.devicePixelRatio;
-let height = window.innerHeight * window.devicePixelRatio;
+let width = window.innerWidth;
+let height = window.innerHeight;
+let ratio = window.devicePixelRatio;
 let config = {
 	title: "Happy 2021!",
 	url: "http://shikiryu.ovh/new_year_2021",
@@ -31,25 +31,67 @@ let colors = ['bleu', 'rouge', 'vert'];
 
 function preload() {
 	that = this;
-	this.scale.scaleMode = Phaser.Scale.ScaleManager.SHOW_ALL;
-	this.scale.pageAlignHorizontally = true;
-	this.scale.pageAlignVertically = true;
-	this.load.audio('shoot', [ 'sound/shoot.ogg', 'sound/shoot.mp3' ]);
-	this.load.audio('win', [ 'sound/win.ogg', 'sound/win.mp3' ]);
+	this.load.audio('shoot', ['sound/shoot.ogg', 'sound/shoot.mp3']);
+	this.load.audio('win', ['sound/win.ogg', 'sound/win.mp3']);
 	this.load.image('target', 'img/target.png');
 	this.load.image('bleu', 'img/virus-bleu.png');
 	this.load.image('rouge', 'img/virus-rouge.png');
 	this.load.image('vert', 'img/virus-vert.png');
+	this.load.image('spark0', 'img/blue.png');
+	this.load.image('spark1', 'img/red.png');
 }
 
 function killVirus(player, virus) {
 	virus.visible = false;
 	--enemiesCount;
-	enemiesText.setText('virus restant : '+enemiesCount);
+	enemiesText.setText('virus restant : ' + enemiesCount);
 	if (enemiesCount === 0) {
 		enemiesText.visible = false;
-		that.add.text(width/2-200, height/2-50, 'Bonne annnée 2021 !', { fontSize: '32px', fill: '#000' });
-		that.add.text(width/2-50, height/2, 'Si possible, sans virus', { fontSize: '14px', fill: '#000' });
+		let p0 = new Phaser.Math.Vector2(width/2 - 300, height / 2);
+		let p1 = new Phaser.Math.Vector2(width/2 - 300, 200);
+		let p2 = new Phaser.Math.Vector2(width/2 + 300, 200);
+		let p3 = new Phaser.Math.Vector2(width/2 + 300, height / 2);
+		
+		let curve = new Phaser.Curves.CubicBezier(p0, p1, p2, p3);
+		
+		let max = 28;
+		let points = [];
+		let tangents = [];
+		
+		for (let c = 0; c <= max; c++) {
+			let t = curve.getUtoTmapping(c / max);
+			
+			points.push(curve.getPoint(t));
+			tangents.push(curve.getTangent(t));
+		}
+		
+		let tempVec = new Phaser.Math.Vector2();
+		
+		let spark0 = that.add.particles('spark0');
+		let spark1 = that.add.particles('spark1');
+		
+		for (let i = 0; i < points.length; i++) {
+			let p = points[i];
+			
+			tempVec.copy(tangents[i]).normalizeRightHand().scale(-32).add(p);
+			
+			let angle = Phaser.Math.RadToDeg(Phaser.Math.Angle.BetweenPoints(p, tempVec));
+			
+			let particles = (i % 2 === 0) ? spark0 : spark1;
+			
+			particles.createEmitter({
+				x: tempVec.x,
+				y: tempVec.y,
+				angle: angle,
+				speed: {min: -100, max: 500},
+				gravityY: 200,
+				scale: {start: 0.4, end: 0.1},
+				lifespan: 800,
+				blendMode: 'SCREEN'
+			});
+		}
+		that.add.text(width / 2 - 200, height / 2 - 50, 'Bonne annnée 2021 !', {fontSize: '32px', fill: '#000'});
+		that.add.text(width / 2 - 50, height / 2, 'Si possible, sans virus', {fontSize: '14px', fill: '#000'});
 		win.play();
 	}
 }
@@ -66,16 +108,16 @@ function create() {
 	graphics.fillGradientStyle(0x3d6d7d, 0x3d6d7d, 0x9addf3, 0x9addf3, 1);
 	graphics.fillRect(0, 0, width, height);
 	
-	enemiesText = this.add.text(40, 40, 'virus restant : '+maxEnemies, { fontSize: '32px', fill: '#000' });
+	enemiesText = this.add.text(40, 40, 'virus restant : ' + maxEnemies, {fontSize: '32px', fill: '#000'});
 	
 	viruses = new Array(maxEnemies).fill(null).map(
-		function() {
+		function () {
 			let color = colors[Math.floor(Math.random() * colors.length)];
 			return that.add.image(getRandomInt(width), getRandomInt(height), color);
 		}
 	);
 	
-	rect = Phaser.Geom.Rectangle.Clone(this.cameras.main);
+	rect = new Phaser.Geom.Rectangle(0, 0, width, height);
 	
 	target = this.add.image(400, 300, 'target');
 	
@@ -96,8 +138,8 @@ function create() {
 			let virusY = virus.y;
 			if (
 				virus.visible &&
-				pointerX >= virusX - 94 && pointerX <= virusX + 94 &&
-				pointerY >= virusY - 94 && pointerY <= virusY + 94
+				pointerX >= virusX - 94 / ratio && pointerX <= virusX + 94 / ratio &&
+				pointerY >= virusY - 94 / ratio && pointerY <= virusY + 94 / ratio
 			) {
 				killVirus(null, virus);
 				break;
@@ -133,5 +175,5 @@ function update() {
 		
 	});
 	
-	Phaser.Actions.WrapInRectangle(viruses, rect, 72);
+	Phaser.Actions.WrapInRectangle(viruses, rect);
 }