Add attackShield functionality, and win screen

public/board.js

@@ -35,6 +35,7 @@ const maxShield = 4;
 
 let inspectCard = null;
 let attackingCard = null;
+let gameWin = 0;
 
 // Gonna need lots of refactoring, and sorting
 class Board{
@@ -67,9 +68,31 @@ class Board{
 
 		this.drawPlayerNames('Nathan', 'Evil Nathan');
 
+		if(gameWin){
+			this.drawWin();
+		}
+
 		this.drawInspectedCard();
 	}
 
+	drawWin(){
+		var winBoard = new Shape({
+			name: name,
+			x: 0,
+			y: canvas.height/2 - (canvas.height/4)/2,
+			width: canvas.width,
+			height: canvas.height/4,
+			fillStyle: '#CCC',
+			strokeStyle: '#00EEAA' 
+		});
+		winBoard.draw();
+
+		ctx.fillStyle = '#000';
+		ctx.font = "bold 50pt Arial";
+		ctx.fillText('WINNER', 200, 300);
+		ctx.font = "10pt Arial";
+	}
+
 	drawPlayerNames(playerName, opponentName = false){
 		// Player Name
 		ctx.fillText(playerName, 50, canvas.height - 50);
@@ -400,12 +423,13 @@ class Board{
 		this.drawBoard();
 	}
 	// Do the attack
-	makeAttack(index){
+	makeAttack(index, array = null){
+		if(array == null){ array = opponentBoard; }
 		// If card attacked
 		// Compare attackingCard and defendingCard	
-		let defendingCard = opponentBoard[index];
+		let defendingCard = array[index];
 		if(defendingCard.atk <= attackingCard[0].atk){
-			opponentBoard.splice(index, 1);
+			array.splice(index, 1);
 			// Need to push to grave, etc. here in future too
 		}
 		if(attackingCard[0].atk <= defendingCard.atk){
@@ -419,6 +443,9 @@ class Board{
 	}
 	endAttack(){
 		attackingCard = null;
+		if(opponentShield.length <= 0){
+			gameWin = 1;
+		}
 		this.drawBoard();
 	}
 
@@ -534,7 +561,7 @@ canvas.addEventListener('click', function(event) {
 	// is being done, attack needs to be made, inspecting card.
 	// Prevents user from doing other actions until completed or cancelled event
 	let specialEvent = false;
-	if(inspectCard !== null || attackingCard !== null){
+	if(inspectCard !== null || attackingCard !== null || gameWin){
 		specialEvent = true;
 	}
 
@@ -627,6 +654,18 @@ canvas.addEventListener('click', function(event) {
 			board.drawBoard();
 		}
 	});
+	// # OPPONENT SHIELD
+	opponentShield.forEach(function(card, index){
+		let clickable = card.clickable;
+
+		if(clickableCheck(x,y,clickable)){
+			// Check if card if getting attacked
+			if(attackingCard !== null){
+				board.makeAttack(index, opponentShield);
+			}
+			board.drawBoard();
+		}
+	});
 
 }, false);