From 15b2c67fa6aea033ee0665826852e050ce0d262a Mon Sep 17 00:00:00 2001
From: James Ketrenos <james_gitlab@ketrenos.com>
Date: Tue, 21 Apr 2020 20:46:58 -0700
Subject: [PATCH] Board loading from server

Signed-off-by: James Ketrenos <james_gitlab@ketrenos.com>
---
 src/Board.js | 122 ++++++++++++++-------------------------------------
 1 file changed, 32 insertions(+), 90 deletions(-)

diff --git a/src/Board.js b/src/Board.js
index 194ad3c..1d7f319 100755
--- a/src/Board.js
+++ b/src/Board.js
@@ -19,45 +19,7 @@ const hexagonRatio = 1.1547005,
   } ];
 
 const Tiles = (board) => {
-  const tiles = [ {
-    type: "wood", y: 0. / 4.
-  }, {
-    type: "wood", y: 1. / 4.
-  }, {
-    type: "wood", y: 2. / 4.
-  }, {
-    type: "wood", y: 3. / 4.
-  }, {
-    type: "wheat", y: 0. / 4.
-  }, {
-    type: "wheat", y: 1. / 4.
-  }, {
-    type: "wheat", y: 2. / 4.
-  }, {
-    type: "wheat", y: 3. / 4.
-  }, {
-    type: "stone", y: 0. / 4.
-  }, {
-    type: "stone", y: 1. / 4.
-  }, {
-    type: "stone", y: 2. / 4.
-  }, {
-    type: "sheep", y: 0. / 4.
-  }, {
-    type: "sheep", y: 1. / 4.
-  }, {
-    type: "sheep", y: 2. / 4.
-  }, {
-    type: "sheep", y: 3. / 4.
-  }, {
-    type: "brick", y: 0. / 4.
-  }, {
-    type: "brick", y: 1. / 4.
-  }, {
-    type: "brick", y: 2. / 4.
-  }, {
-    type: "robber", y: 0
-  } ];
+  const tiles = board.game.tiles;
 
   [ "robber", "brick", "wood", "sheep", "stone", "wheat" ].forEach((type) => {
     const image = new Image(),
@@ -87,28 +49,6 @@ const Pips = (board) => {
   const image = new Image(),
     file = 'pip-numbers.png';
 
-  let pips = [
-    { roll:  7, pips: 0, y: 3. / 6., x: 0. / 6. },
-    { roll:  5, pips: 4, y: 0. / 6., x: 0. / 6. },
-    { roll:  2, pips: 1, y: 0. / 6., x: 1. / 6. },
-    { roll:  6, pips: 5, y: 0. / 6., x: 2. / 6. },
-    { roll:  3, pips: 2, y: 0. / 6., x: 3. / 6. },
-    { roll:  8, pips: 5, y: 0. / 6., x: 4. / 6. },
-    { roll: 10, pips: 3, y: 0. / 6., x: 5. / 6. },
-    { roll:  9, pips: 4, y: 1. / 6., x: 0. / 6. },
-    { roll: 12, pips: 1, y: 1. / 6., x: 1. / 6. },
-    { roll: 11, pips: 2, y: 1. / 6., x: 2. / 6. },
-    { roll:  4, pips: 3, y: 1. / 6., x: 3. / 6. },
-    { roll:  8, pips: 5, y: 1. / 6., x: 4. / 6. },
-    { roll: 10, pips: 3, y: 1. / 6., x: 5. / 6. },
-    { roll:  9, pips: 4, y: 2. / 6., x: 0. / 6. },
-    { roll:  4, pips: 3, y: 2. / 6., x: 1. / 6. },
-    { roll:  5, pips: 4, y: 2. / 6., x: 2. / 6. },
-    { roll:  6, pips: 6, y: 2. / 6., x: 3. / 6. },
-    { roll:  3, pips: 2, y: 2. / 6., x: 4. / 6. },
-    { roll: 11, pips: 2, y: 2. / 6., x: 5. / 6. }
-  ];
-  
   image.addEventListener("load", (event) => {
     console.log(`Done loading ${file}`);
     window.requestAnimationFrame(board.drawFrame);
@@ -120,7 +60,7 @@ const Pips = (board) => {
 
   return {
     image: image,
-    pips: pips
+    pips: board.game.pips
   };
 };
 
@@ -255,35 +195,37 @@ class Board extends React.Component {
     this.mouse = { x: 0, y: 0 };
     this.radius = 0.317;
 
-    this.pips = Pips(this);
-    this.tiles = Tiles(this);
-    this.table = Table(this);
-
-    this.closest = {
-      info: {},
-      tile: null,
-      road: null,
-      tradeToken: null,
-      settlement: null
-    };
-
-    this.borders = [ {
-      file: 'borders-1.6.png', left: "sheep", right: "bank"
-    }, { 
-      file: 'borders-2.1.png', center: "sheep"
-    }, { 
-      file: 'borders-3.2.png', left: "wheat", right: "bank"
-    }, { 
-      file: 'borders-4.3.png', center: "wood"
-    }, { 
-      file: 'borders-5.4.png', left: "sheep", right: "bank"
-    }, { 
-      file: 'borders-6.5.png', center: "bank"
-    } ].map((file) => {
-      return Border(this, file);
+    window.fetch("api/v1/games", {
+      method: 'POST',
+      cache: 'no-cache',
+      credentials: 'same-origin',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+//      body: JSON.stringify(data) // body data type must match "Content-Type" header
+    }).then((res) => {
+      return res.json();
+    }).then((game) => {
+      console.log(JSON.stringify(game, null, 2));
+      this.game = game;
+      this.pips = Pips(this);
+      this.tiles = Tiles(this);
+      this.table = Table(this);
+  
+      this.closest = {
+        info: {},
+        tile: null,
+        road: null,
+        tradeToken: null,
+        settlement: null
+      };
+  
+      this.borders = this.game.borders.map((file) => {
+        return Border(this, file);
+      });
+    }).catch((error) => {
+      console.error(error);
     });
-
-    this.randomize();
   }
 
   randomize() {