updates frontend to use DB api

lootalot_front/src/AppStorage.js

@@ -1,45 +1,84 @@
 
-const PLAYER_LIST = [
-            {id: 0, name: "Groupe", wealth: [0,0,0,0], debt: 0},
-            {id: 1, name: "Lomion", wealth: [0,0,0,0], debt: 0},
-            {id: 4, name: "Oilosse", wealth: [0,0,0,0], debt: 0},
-            {id: 3, name: "Fefi", wealth: [0,0,0,0], debt: 0},
-        ];
 
-const __fetchPlayerList = function() {
-    return fetch("http://localhost:8088/players")
-      .then(r => r.json())
+const Api = {
+  fetchPlayerList () {
+      return fetch("http://localhost:8088/players")
+          .then(r => r.json())
+          .catch(e => console.error("Fetch error ", e));
+  },
+  fetchClaims () {
+      return fetch("http://localhost:8088/claims")
+          .then(r => r.json())
+          .catch(e => console.error("Fetch error ", e));
+  },
+  fetchLoot (playerId) {
+      const url = "http://localhost:8088/loot/" + playerId;
+      return fetch(url)
+       	  .then(r => r.json())
+       	  .catch(e => console.error("Fetch error", e));
+  },
+  putClaim (playerId, itemId) {
+        console.log('newRequest from', playerId, 'on', itemId);
+        return true;
+  },
+  unClaim (playerId, itemId) {
+        console.log('cancelRequest of', playerId, 'on', itemId);
+        return true;
+  },
+  updateWealth (playerId, goldValue) {
+        console.log('Update wealth', goldValue);
+        return true;
+  }
 };
 
+
 export const AppStorage = {
     debug: true,
     state: {
         player_id: 0,
-        player_list: [],
-        show_player_chest: false,
+        player_list: {},
+        player_loot: {},
         requests: {}, 
+        initiated: false,
+        show_player_chest: false,
     },
     // Initiate the state
     initStorage (playerId) {
-        if (this.debug) console.log('Initiate with player : ', playerId)
+        if (this.debug) console.log('Initiates with player : ', playerId)
         this.state.player_id = playerId;
-        return Promise.all([
-          fetch("http://localhost:8088/players")
-            .then(r => r.json()),
-          ])
-          .then(data => {
-            console.log("initiate ", data);
-            this.initPlayerList(data[0]);
-          })
-          .catch(e => console.log("Fetch error ", e));
-
+        // Fetch initial data
+        return Promise
+            .all([ Api.fetchPlayerList(), Api.fetchClaims(), ])
+            .then(data => {
+                const [players, claims] = data;
+                this.initPlayerList(players);
+                console.log("claims", claims);
+            });
     },
     initPlayerList(data) {
         for (var idx in data) {
-          var p = data[idx];
-          this.state.player_list.push(p);
-          this.state.requests[p.id] = [5,];
+          var playerDesc = data[idx];
+          const playerId = Number(playerDesc.id);
+          if (this.debug) console.log("Creates", playerId, playerDesc.name)
+          this.state.player_list[playerId] = playerDesc;
+          this.state.player_loot[playerId] = [];
+          this.state.requests[playerId] = [];
         }
+        // Hack for now !!
+        // Fetch all players loot and wait to set initiated to true
+        var promises = [];
+        for (var idx in data) {
+          const playerId = data[idx].id;
+          var promise = Api.fetchLoot(playerId)
+             .then(data => data.forEach(
+                item => {
+                  if (this.debug) console.log("add looted item", item, playerId)
+                  this.state.player_loot[playerId].push(item)
+                }
+             ));
+          promises.push(promise);
+        }
+        Promise.all(promises).then(_ => this.state.initiated = true);
     },
     // Player actions
     // Sets a new active player by id
@@ -56,18 +95,27 @@ export const AppStorage = {
     // Put a claim on an item from group chest.
     putRequest (itemId) {
         const playerId = this.state.player_id
-        if (this.debug) console.log('newRequest from', playerId, 'on', itemId)
-        this.state.requests[playerId].push(itemId);
+        const done = Api.putClaim(playerId, itemId);
+        if (done) {
+          // Update cliend-side state
+          this.state.requests[playerId].push(itemId);
+        } else {
+          if (this.debug) console.log("API responded with 'false'")
+        }
     },
     // Withdraws a claim.
     cancelRequest(itemId) {
         const playerId = this.state.player_id
-        if (this.debug) console.log('cancelRequest of', playerId, 'on', itemId)
-        var idx = this.state.requests[playerId].indexOf(itemId);
-        if (idx > -1) {
-            this.state.requests[playerId].splice(idx, 1);
+        const done = Api.unClaim(playerId, itemId);
+        if (done) {
+          var idx = this.state.requests[playerId].indexOf(itemId);
+          if (idx > -1) {
+              this.state.requests[playerId].splice(idx, 1);
+          } else {
+              if (this.debug) console.log("cancel a non-existent request")
+          }
         } else {
-            if (this.debug) console.log("cancel a non-existent request")
+          if (this.debug) console.log("API responded with 'false'")
         }
     }
 }