Add switch boardElement, and draw loop for ECS

public/board.js

@@ -45,6 +45,9 @@ let opponentShield =	[];
 let playerMana =	[];
 let opponentManaZone =	[];
 
+// To disable drawing each time something changes
+let drawEachEvent	= true;
+
 let deckCount = 60;
 let deckCountOpponent = 60;
 
@@ -68,7 +71,10 @@ class Board{
 		ctx.fillStyle = '#000';
 	}
 
-	drawBoard(){
+	drawBoard(force = false){
+		if(drawEachEvent == false && force == false){
+			return 0;
+		}
 		// Reset board
 		ctx.clearRect(0, 0, canvas.width, canvas.height);
 		// Room Name
@@ -147,6 +153,9 @@ class Board{
 				// Draw Elements
 				// Loop each item left, and draw if element is currently looped. board,mana,etc.
 				if(itemKey in boardElement && boardElement[itemKey] == element){
+					if(boardElement[itemKey] == 'hand' && player[itemKey] == 0){
+						console.log('PLAYER HAND');
+					}
 					// Get the player the item belongs to
 					let itemPlayer = player[itemKey];
 					console.log('Element: '+element+', Player: '+itemPlayer);
@@ -452,8 +461,91 @@ class Board{
 
 	drawCards(){}
 
+	addFromBoardElement(playerFrom, fromPosition, elementFrom, elementTo, toPosition=null, playerTo=null){
+		if(playerTo == null){
+			playerTo	= playerFrom;
+		}
+
+		// Move itemKey fromPosition in elementFrom to toPosition in elementTo
+		// Can also switch item between players
+
+		for(let itemKey = 0; itemKey < item.length; itemKey++){
+			// Get the item from the element
+			if(itemKey in boardElement && boardElement[itemKey] == elementFrom){
+				// Check if item belongs to playerFrom
+				if(itemKey in player && player[itemKey] == playerFrom){
+
+					// Get item based on fromPosition listPosition
+					if(listPosition[itemKey] == fromPosition){
+						// Check if a toPostion supplied (likely won't be, dunno if I'll do this)
+						if(toPosition == null){
+							// Get the new position of item based on new boardElement
+							toPosition = getCurrentPositionAndLength(elementTo, playerTo)[0]+1
+							//console.log(toPosition);
+						}
+						//console.log('itemKey: '+itemKey+' fromPosition: '+fromPosition+' elementFrom: '+elementFrom+' toPosition: '+toPosition+' playerFrom: '+playerFrom+' playerTo: '+playerTo);
+						listPosition[itemKey] = toPosition;
+
+						// Move from elementFrom to elementTo
+						//console.log('elementTo: '+elementTo);
+						//console.log(boardElement[itemKey]);
+						boardElement[itemKey] = elementTo;
+						//console.log(itemKey);
+						//console.log(boardElement[itemKey]);
+
+						// Move down(0) the positions of elementFrom, from fromPosition for player
+						this.moveElementPositions(0, elementFrom, fromPosition, playerFrom);
+						this.drawBoard();
+						return 1; // Got a loop that calls a loop, and checks the new values atm, so this keeps counting down
+
+					}
+				}
+			}
+		}
+	}
+	moveElementPositions(direction, elementFrom, fromPosition, playerFrom){
+
+		// Move the positions directionally 1 for elementFrom from fromPosition
+		//console.log(listPosition);
+		//console.log('Direction: '+direction+' elementFrom: '+elementFrom+' fromPosition: '+fromPosition+' player: '+playerId);
+
+		// Loop the elementFrom, and move positions for anything after
+		// item taken from position 34, 35..60 need to be moved down to 34..59
+		// For each item
+		for(let itemKey = 0; itemKey < item.length; itemKey++){
+			// If boardElement is elementFrom
+			if(itemKey in boardElement && boardElement[itemKey] == elementFrom){
+				// And from the playerFrom (id)
+				if(itemKey in player && player[itemKey] == playerFrom){
+					//console.log(elementFrom);
+					//console.log(boardElement[itemKey]);
+					//console.log(listPosition[itemKey]);
+					//console.log(itemKey);
+					if(listPosition[itemKey] > fromPosition){
+					//console.log('position: '+listPosition[itemKey]+' fromPosition: '+fromPosition);
+						// Move items up, i.e. added to top of deck
+						if(direction){
+							listPosition[itemKey]++;
+						}
+						// Move items down, i.e. taken from top of deck
+						listPosition[itemKey]--;
+					}
+
+				}
+			}
+		}
+		//console.log(listPosition);
+
+	}
 	// Draw a card, traditional TCG
 	drawACard(cardsToDraw = 1){
+
+		for(let draw = 0; draw < cardsToDraw; draw++){
+			// Move from player0, position 0 (top) of deck, to hand
+			this.addFromBoardElement(0, 0, 'deck', 'hand', null, null);
+		}
+
+		if(false){
 		// For loop so that animations will play each time (when they exist)
 		for(let draw = 0; draw < cardsToDraw; draw++){
 			if(playerHand.length >= maxHandSize){
@@ -470,8 +562,16 @@ class Board{
 			playerHand.push(cardDrawn);
 			this.drawBoard();
 		}
+		}
 	}
+
 	drawACardOpponent(cardsToDraw = 1){
+		for(let draw = 0; draw < cardsToDraw; draw++){
+			// Move from player0, position 0 (top) of deck, to hand
+			this.addFromBoardElement(1, 0, 'deck', 'hand', null, null);
+		}
+
+		if(false){
 		for(let draw = 0; draw < cardsToDraw; draw++){
 			if(opponentHand.length >= maxHandSize){
 				alert('Hand full '+opponentHand.length+'/'+maxHandSize);
@@ -486,6 +586,7 @@ class Board{
 			opponentHand.push(cardDrawn);
 			this.drawBoard();
 		}
+		}
 	}
 
 
@@ -832,13 +933,15 @@ let board = new Board;
 board.playCardToBoardFromDeckOpponent();
 board.playCardToBoardFromDeckOpponent();
 
-board.drawBoard();
+//board.drawBoard();
 
 board.playShield(4);
 board.playShieldOpponent(4);
 
+board.drawBoard(true);
 board.drawACard(3);
 
+
 canvas.addEventListener('contextmenu', function(event) {
 	event.preventDefault();
 
@@ -1154,16 +1257,35 @@ function calculateItemSizePosition(itemKey){
 	let itemListPositionNext = itemListPositionLength[0];
 	let itemListLength = itemListPositionLength[1];
 
-	// TODO:Padding probably will differ between elements
 	let cardPadding = 10;
+	let positionX	= 0;
+	let positionY	= 0;
+	let width	= 0;
+	let height	= 0;
+
 	let i = listPosition[itemKey];
-	//console.log('cardName: '+cardData[itemKey].name+', i/listPosition: '+i+', listPosition Length: '+itemListLength);
+	console.log('cardName: '+cardData[itemKey].name+' listPosition/i: '+i);
 
-	// TODO:X/Y W/H 100% differs based on the element
-	let positionX	= canvas.width/2 - (cardWidth * (itemListLength - i) - (cardPadding * i));
-	let positionY = cardHeight + 30;
-	let width	= cardWidth;
-	let height	= cardHeight;
+	if(itemPlayer == 1 && itemElement == 'board'){
+		positionX	= canvas.width/2 - (cardWidth * (itemListLength - i) - (cardPadding * i));
+		positionY	= cardHeight + 30;
+		width		= cardWidth;
+		height		= cardHeight;
+	}
+	if(itemPlayer == 1 && itemElement == 'hand'){
+		positionX 	= canvas.width/2 - (cardWidth * (itemListLength - (i+1)) - (cardPadding * (i+1)));
+		positionY 	= 20;
+		width		= cardWidth;
+		height		= cardHeight;
+	}
+	if(itemPlayer == 0 && itemElement == 'hand'){
+		positionX	= canvas.width/2 - (cardWidth * (itemListLength - (i+1)) - (cardPadding * (i+1)));
+		positionY	= canvas.height-cardWidth*1.5-20;
+		width		= cardWidth;
+		height		= cardHeight;
+	}
+
+	//console.log('cardName: '+cardData[itemKey].name+', i/listPosition: '+i+', listPosition Length: '+itemListLength);
 
 	// Set the size/position of the item
 	size[itemKey]		= [width, height];