Add basic colours back into the game (via server)

cardGen.js

@@ -319,7 +319,7 @@ function requestDeck(itemData = null){
 			// Adding to get everything sorted in one!
 			cardStatus[itemCount] = null;
 			cardFace[itemCount] = 0; // Face down by default (in deck)
-			cardColours[itemCount] = []; // TODO;
+			cardColours[itemCount] = cardData[itemCount].colourRequirements; // TODO;
 			// From cardData set the base attack, and current (same when deckbuild)
 			let atk = cardData[itemCount].atk;
 			cardAttack[itemCount] = [atk, atk]; // Base, Current
@@ -373,6 +373,7 @@ function requestDeck(itemData = null){
 
 function buildCards(cards, cardClasses, cardColourRequirements){
 
+	console.log(cardColourRequirements);
 	const dPromise = new Promise((resolve, reject) => {
 
 		builtCards = {};
@@ -386,7 +387,7 @@ function buildCards(cards, cardClasses, cardColourRequirements){
 				name: card.cardName,
 				colour: [],
 				cost: card.cardCost,
-				costReq: [],
+				colourRequirements: [],
 				type: card.cardType,
 				atk: card.cardAttack,
 				rarity: card.cardRarity,
@@ -421,6 +422,20 @@ function buildCards(cards, cardClasses, cardColourRequirements){
 
 		});
 
+		// Do the same for cardColourRequirements (if cardIds match)
+		cardColourRequirements.forEach((colourReq) => {
+
+			// Check the card exists (it should always, but don't want jank)
+			if(colourReq.cardId in builtCards){
+				// Add the colours to the class array (cards can have multiple)
+				builtCards[colourReq.cardId].colourRequirements.push(colourReq.colourId, colourReq.cost);
+
+				// TODO: As an array [classId, className] then 
+				// card.classes[x][0] can be compared as numeric in code
+			}
+
+		});
+
 		resolve(builtCards);
 
 	});

public/board.js

@@ -8,6 +8,13 @@ const cardHeight = 120;
 const cardArt = new Image();
 const cardBackArt = new Image();
 
+// Colours
+const COLOUR = {
+	'white':	1,
+	'blue':		2,
+	'red':		3,
+};
+
 // Counters to keep track of players, and boardElements, may be changed in future
 // But once game starts, will be const anyway, so shouldn't need passing
 let players 		= 2; // Player, Opponent for now, but will be up to 6 players for 5v1 boss raids?
@@ -141,9 +148,9 @@ class Board{
 		let fill = null;
 		if(boardElement[itemKey] != 'realDeck'){ // TODO: Change these to isset checks instead...
 			let colourId = cardData[itemKey].colour;
-			if(colourId == 0){ fill = '#EEE'; }
-			else if(colourId == 1){ fill = '#0033EE'; }
-			else if(colourId == 2){ fill = '#ED344A'; }
+			if(colourId == COLOUR.white){ fill = '#EEE'; }
+			else if(colourId == COLOUR.blue){ fill = '#0033EE'; }
+			else if(colourId == COLOUR.red){ fill = '#ED344A'; }
 		}else{
 			fill = '#B0B0B0';
 		}
@@ -840,22 +847,26 @@ function loadBoard(data) {
 	// TODO: JANK IN, CHANGE CODE TO USE NEW ARRAY!!
 	// Temp jank, set colour to first colour req.
 	for(let i = 0; i < itemCount; i++){
-		if(cardData[i] !== undefined){ // i may not have carddata, as realDeck
-			cardData[i].colour = 0;//cardData[itemCount].colour[0];
+		console.log(itemCount);
+		console.log(cardColours[itemCount]);
+		// after && to check if there is a colourReq record in cardColours
+		if(cardData[i] !== undefined && i in cardColours){ // i may not have carddata, as realDeck
+			console.log(i);
+			cardData[i].colour = cardColours[i][0];
 			// Set the artwork (this would be done front-end I think)
 			cardSprite[i] = [0,0];
 			// Temp sprite set based on colour TODO: Change to set correct sprite from DB
 			switch (cardData[i].colour){
-				case 0: // White
+				case COLOUR.white: // White
 					cardSprite[i] = [0,0];
 					break;
-				case 1: // Blue
+				case COLOUR.blue: // Blue
 					cardSprite[i] = [0,1];
 					break;
-				case 2: // Red
+				case COLOUR.red: // Red
 					cardSprite[i] = [1,0];
 					break;
-				case 3: // Green
+				case COLOUR.green: // Green
 					cardSprite[i] = [1,1];
 					break;
 				default: