complete move logic, with boundaries and current card options

dist/main.css

@@ -136,7 +136,7 @@ body {
   display: flex;
   justify-content: center;
   align-items: center;
-  border: 1px solid black;
+  /* border: 1px solid black; */
   border-radius: 4px;
   position: absolute;
 }
@@ -147,13 +147,28 @@ body {
   backface-visibility: hidden;
   font-family: "Comforter", cursive;
   font-size: 1.5rem;
-  background-image: linear-gradient(to bottom left, #3C8CE7 10%, #00EAFF 115%);
+  /* background-image: linear-gradient(to bottom left, #3C8CE7 10%,  #00EAFF 115%);
+  color: #FFF; */
+}
+
+.player-row .move-card .front {
+  background-image: linear-gradient(to bottom left, #0099f7 10%, #81eff9 100%);
+  color: #FFF;
+}
+
+.opponent-row .move-card .front {
+  background-image: linear-gradient(to bottom left, #f8a7a6 0%, #ce0502 100%);
+  color: #FFF;
+}
+
+.on-deck-row .move-card .front {
+  background-image: linear-gradient(to top, #0099f7, #f11712);
   color: #FFF;
 }
 
 .back {
   /* background: #EEEE; */
-  background-image: linear-gradient(to bottom, #bdc3c7 50%, #7d8082 110%);
+  background-image: linear-gradient(to bottom, #d7d7c0 50%, #a5a599 110%);
   z-index: 1;
   transform: rotateX(180deg);
 }

src/scripts/board.js

@@ -25,19 +25,19 @@ export default class Board {
     return true;
   }
 
-
+  isEmpty(pos) {
+    // if (!this.validPos(pos)) {
+    //   return false;
+    //   // throw new Error('That position is not valid');
+    // }
+    return (this.grid[pos[0]][pos[1]] === null);  // t or f
+  }
+
   getPiece(pos) {
     return this.grid[pos[0]][pos[1]];
     // check empty elsewhere? 
   }
-
-  isEmpty(pos) {
-    if (!this.validPos(pos)) {
-      throw new Error('That position is not valid');
-    }
-    return (this.grid[pos[0]][pos[1]] === null);  // t or f
-  }
-
+
   placePiece(pos, piece) {
     if (this.isEmpty(pos)) {
       return (this.grid[pos[0]][pos[1]] = piece);
@@ -70,6 +70,7 @@ export default class Board {
     const pawnB5 = new Piece('student', 'blue');
 
     this.placePiece([0, 0], pawnB1);
+
     this.placePiece([0, 1], pawnB2);
     this.placePiece([0, 2], pawnB3);
     this.placePiece([0, 3], pawnB4);

src/scripts/game.js

@@ -15,20 +15,29 @@ export default class Game {
     window.deck = this.deck;
     window.players = this.players;
     window.player = this.player;
+    window.otherPlayer = this.otherPlayer
+    // doesn't update at window w/o "game."
   }
 
   get currentPlayer() {
     return this.players[this.currentPlayerIdx];
   }
   // getter, accessed like a property
 
+  get otherPlayer() {
+    return this.players[((this.currentPlayerIdx + 1) % 2)]
+  }
+
   swapTurn() {
     this.currentPlayerIdx = (this.currentPlayerIdx + 1) % 2;
-    // ensures always 0 or 1  -working!
+    this.player = this.currentPlayer;
+    window.player = this.player;
+    // ensures always 0 or 1  - Works!
   }
 
   dealCard() {
-    this.currentPlayer.dealCard(this.deck.deal());  // calling itself?
+    let card = this.deck.deal()
+    this.currentPlayer.dealCard(card);  // calling itself?
     this.swapTurn(); // deals to each player until 4 cards dealt
   }
 
@@ -40,34 +49,37 @@ export default class Game {
     this.activeGame = true;
   }
 
-  possibleMoves(card, startPos) {
+  possibleMoves(card, startPos) {  // all possible
     if (this.currentPlayerIdx === 0) {
-      this.blueMoves(card, startPos);
+      return this.blueMoves(card, startPos);
     } else {
-      this.redMoves(card, startPos);
+      return this.redMoves(card, startPos);
     }
   }
 
-  oppMoves(moveArr) {  // flips opponent possible pos 
-    let newMoves = [];
-    let moves = moveArr.slice(1);
-    console.log(moves);
-
-    for (let i = 0; i < moves.length; i++) {
-      let subArr = [];
-      for (let j = 0; j < moves[0].length; j++) {
-        let ele = moves[i][j];
-        if (ele === 0) {
-          subArr.push(ele);
-        } else {
-          subArr.push(moves[i][j] * -1);
+  allowedMoves(card, startPos) {  // limited actual!
+    if (!this.board.validPos(startPos)) return false;
+    let allMoves = this.possibleMoves(card, startPos)
+    let realMoves = []
+    for (let i = 0; i < allMoves.length; i++) {
+      debugger
+      if (this.board.validPos(allMoves[i])) {
+        if (this.board.isEmpty(allMoves[i])) {
+          //highlight green?
+          realMoves.push(allMoves[i]);
+          debugger
+        } else if ((this.board.getPiece(allMoves[i])).color !== this.player.color) {
+        //highlight gold?
+        debugger
+        realMoves.push(allMoves[i]);
         }
       }
-      newMoves.push(subArr);
     }
-    return newMoves;
+    return realMoves;
   }
 
+
+
 
   blueMoves(card, startPos) {  // need startPos from click!
     console.log("Blueee");
@@ -90,25 +102,45 @@ export default class Game {
     }
   }
 
+  oppMoves(moves) {  // flips opponent possible pos 
+    let newMoves = [];
+    console.log(moves);
+    console.log("in oppMoves");
+
+    for (let i = 0; i < moves.length; i++) {
+      let subArr = [];
+      for (let j = 0; j < moves[0].length; j++) {
+        let ele = moves[i][j];
+        if (ele === 0) {
+          subArr.push(ele);
+        } else {
+          subArr.push(moves[i][j] * -1);
+        }
+      }
+      newMoves.push(subArr);
+    }
+    return newMoves;
+  }
+
   redMoves(card, startPos) {
     for (let i = 0; i < this.player.hand.length; i++) {  //error here?
 
       // if (this.deck.currentCards[i][0] === card) {  // string!
       if (this.player.hand[i].includes(card)) {
         console.log("ok");
         let moves = this.player.hand[i].slice(1);
+        let movesRev = (this.oppMoves(moves));
         let possiblePos = [];
-        for (let j = 0; j < moves.length; j++) {
-          let row = startPos[0] + moves[j][0];
-          let col = startPos[1] + moves[j][1];
+        for (let j = 0; j < movesRev.length; j++) {
+          let row = startPos[0] + movesRev[j][0];
+          let col = startPos[1] + movesRev[j][1];
           possiblePos.push([row, col]);
         }
         return possiblePos;
       } else {
         console.log("Card is not in your hand");  
       }
     }
-    console.log("Reedddd");
   }
 
 
@@ -117,6 +149,7 @@ export default class Game {
 }
 
 
+
 // consider adding a KEY:value list of variables like pawn, master, or player 
 // also where to keep card objects?
 

src/styles/cards.css

@@ -19,7 +19,7 @@
   display: flex;
   justify-content: center;
   align-items: center;
-  border: 1px solid black;
+  /* border: 1px solid black; */
   border-radius: 4px;
   position: absolute;
 
@@ -31,14 +31,32 @@
   backface-visibility: hidden;
   font-family: 'Comforter', cursive;
   font-size: 1.5rem;
-  background-image: linear-gradient(to bottom left, #3C8CE7 10%,  #00EAFF 115%);
-  color: #FFF;
+  /* background-image: linear-gradient(to bottom left, #3C8CE7 10%,  #00EAFF 115%);
+  color: #FFF; */
 
 }
 
+.player-row .move-card .front {
+  background-image: linear-gradient(to bottom left, #0099f7 10%,  #81eff9 100%);
+  color: #FFF;
+}
+
+.opponent-row .move-card .front {
+  background-image: linear-gradient(to bottom left, #f8a7a6 0%, #ce0502 100%);
+  color: #FFF;
+
+}
+
+.on-deck-row .move-card .front {
+  background-image: linear-gradient(to top, #0099f7, #f11712);
+  color: #FFF;
+
+}
+
+
 .back {
   /* background: #EEEE; */
-  background-image: linear-gradient(to bottom, #bdc3c7 50%,  #7d8082 110%);
+  background-image: linear-gradient(to bottom, #d7d7c0 50%,  #a5a599 110%);
   z-index: 1;
   transform: rotateX(180deg);
 }

testRunner.js

@@ -1,3 +1,13 @@
+let game1 = new Game();
+game1.board.setBoard();
+game1.start();
+game1.swapTurn()
+
+
+
+
+
+
 const tiger = ["Tiger", [-1, 0], [2, 0]];
 
 function oppMoves(moveArr) {