small fixes while reviewing code

.gitignore

@@ -1,11 +1,10 @@
 /target
 **/*.rs.bk
 
-node_modules
-fontawesome
-package-lock.json
-
 Cargo.lock
 **/*.sqlite3
 **/.env
 
+package-lock.json
+fontawesome
+

lootalot_db/src/lib.rs

@@ -4,10 +4,8 @@
 //! This module wraps all needed database operations.
 //! It exports a public API for integration with various clients (REST Api, CLI, ...)
 extern crate dotenv;
-#[macro_use]
+#[macro_use] extern crate diesel;
-extern crate diesel;
+#[macro_use] extern crate serde_derive;
-#[macro_use]
-extern crate serde_derive;
 
 use diesel::prelude::*;
 use diesel::query_dsl::RunQueryDsl;
@@ -23,40 +21,9 @@ pub type Pool = r2d2::Pool<ConnectionManager<DbConnection>>;
 /// The result of a query on DB
 pub type QueryResult<T> = Result<T, diesel::result::Error>;
 /// The result of an action provided by DbApi
-pub type ActionResult<R> = QueryResult<ActionStatus<R>>;
+pub type ActionResult<R> = Result<R, diesel::result::Error>;
 
-/// Return status of an API Action
-#[derive(Serialize, Debug)]
-pub struct ActionStatus<R: serde::Serialize> {
-    /// Has the action made changes ?
-    pub executed: bool,
-    /// Response payload
-    pub response: R,
-}
 
-impl ActionStatus<()> {
-    fn was_updated(updated_lines: usize) -> Self {
-        match updated_lines {
-            1 => Self::ok(),
-            _ => Self::nop(),
-        }
-    }
-    fn ok() -> ActionStatus<()> {
-        Self {
-            executed: true,
-            response: (),
-        }
-    }
-}
-
-impl<T: Default + serde::Serialize> ActionStatus<T> {
-    fn nop() -> ActionStatus<T> {
-        Self {
-            executed: false,
-            response: Default::default(),
-        }
-    }
-}
 /// A wrapper providing an API over the database
 /// It offers a convenient way to deal with connection.
 ///
@@ -75,7 +42,7 @@ impl<T: Default + serde::Serialize> ActionStatus<T> {
 ///  x       .sell_loot([players], [excluded_item_ids]) -> Success status (bool, player_share)
 ///  // Claims should be resolved after a certain delay
 ///  x       .set_claims_timeout()
-///  x       .resolve_claims()
+///  v       .resolve_claims()
 ///  v       .add_player(player_data)
 /// ```
 ///
@@ -159,56 +126,57 @@ impl<'q> AsPlayer<'q> {
     /// # Panics
     ///
     /// This currently panics if player wealth fails to be updated, as this is
-    /// a serious error. TODO: handle deletion of bought item in case of wealth update failure.
+    /// a serious error.
-    pub fn buy<'a>(self, name: &'a str, price: i32) -> ActionResult<Option<(i32, i32, i32, i32)>> {
+    pub fn buy<'a>(self, name: &'a str, price: i32) -> ActionResult<(i32, i32, i32, i32)> {
-        let new_item = models::item::NewLoot::to_player(self.id, (name, price));
+        self.conn.transaction(|| {
-        diesel::insert_into(schema::looted::table)
+            let new_item = models::item::NewLoot::to_player(self.id, (name, price));
-            .values(&new_item)
+            let _item_added = diesel::insert_into(schema::looted::table)
-            .execute(self.conn)
+                .values(&new_item)
-            .and_then(|r| match r {
+                .execute(self.conn)
-                1 => Ok(self.update_wealth(-(price as f32)).unwrap()),
+                .map(|rows_updated| match rows_updated {
-                _ => Ok(ActionStatus::nop()),
+                    1 => (),
-            })
+                    _ => panic!("RuntimeError: Buy made no changes at all"),
+                })?;
+            self.update_wealth(-(price as f32))
+        })
+
     }
     /// Sell an item from this player chest
     ///
     /// # Panics
     ///
     /// This currently panics if player wealth fails to be updated, as this is
-    /// a serious error. TODO: handle restoring of sold item in case of wealth update failure.
+    /// a serious error.
     pub fn sell(
         self,
         loot_id: i32,
-        _price_mod: Option<f32>,
+        price_mod: Option<f32>,
-    ) -> ActionResult<Option<(i32, i32, i32, i32)>> {
+    ) -> ActionResult<(i32, i32, i32, i32)> {
-        // Check that the item belongs to player
+        self.conn.transaction(|| {
-        let exists_and_owned: bool =
+            use schema::looted::dsl::*;
-            diesel::select(models::Loot::owns(self.id, loot_id)).get_result(self.conn)?;
+            let loot = looted
-        if !exists_and_owned {
+                .find(loot_id)
-            return Ok(ActionStatus::nop());
+                .first::<models::Loot>(self.conn)?;
-        }
+            if loot.owner != self.id {
-        use schema::looted::dsl::*;
+                // If the item does not belong to player,
-        let loot_value = looted
+                // it can't be what we're looking for
-            .find(loot_id)
+                return Err(diesel::result::Error::NotFound);
-            .select(base_price)
+            }
-            .first::<i32>(self.conn)?;
+            let mut sell_value = (loot.base_price / 2) as f32;
-        let sell_value = (loot_value / 2) as f32;
+            if let Some(modifier) = price_mod {
-        diesel::delete(looted.find(loot_id))
+                sell_value *= modifier;
-            .execute(self.conn)
+            }
-            .and_then(|r| match r {
+            let _deleted = diesel::delete(looted.find(loot_id))
-                // On deletion, update this player wealth
+                .execute(self.conn)?;
-                1 => Ok(self.update_wealth(sell_value).unwrap()),
+            self.update_wealth(sell_value)
-                _ => Ok(ActionStatus {
+        })
-                    executed: false,
+
-                    response: None,
-                }),
-            })
     }
 
     /// Adds the value in gold to the player's wealth.
     ///
     /// Value can be negative to substract wealth.
-    pub fn update_wealth(self, value_in_gp: f32) -> ActionResult<Option<(i32, i32, i32, i32)>> {
+    pub fn update_wealth(self, value_in_gp: f32) -> ActionResult<(i32, i32, i32, i32)> {
         use schema::players::dsl::*;
         let current_wealth = players
             .find(self.id)
@@ -225,24 +193,24 @@ impl<'q> AsPlayer<'q> {
             .set(&updated_wealth)
             .execute(self.conn)
             .map(|r| match r {
-                1 => ActionStatus {
+                1 => diff,
-                    executed: true,
+                _ => panic!("RuntimeError: UpdateWealth did no changes at all!"),
-                    response: Some(diff),
-                },
-                _ => ActionStatus::nop(),
             })
     }
     /// Put a claim on a specific item
     pub fn claim(self, item: i32) -> ActionResult<()> {
         let exists: bool = diesel::select(models::Loot::exists(item)).get_result(self.conn)?;
         if !exists {
-            return Ok(ActionStatus::nop());
+            return Err(diesel::result::Error::NotFound);
         };
         let claim = models::claim::NewClaim::new(self.id, item);
         diesel::insert_into(schema::claims::table)
             .values(&claim)
             .execute(self.conn)
-            .map(ActionStatus::was_updated)
+            .map(|rows_updated| match rows_updated {
+                1 => (),
+                _ => panic!("RuntimeError: Claim did no change at all!"),
+            })
     }
     /// Withdraw claim
     pub fn unclaim(self, item: i32) -> ActionResult<()> {
@@ -251,9 +219,13 @@ impl<'q> AsPlayer<'q> {
             claims
                 .filter(loot_id.eq(item))
                 .filter(player_id.eq(self.id)),
-        )
+            )
-        .execute(self.conn)
+            .execute(self.conn)
-        .map(ActionStatus::was_updated)
+            .and_then(|rows_updated| match rows_updated {
+                1 => Ok(()),
+                0 => Err(diesel::result::Error::NotFound),
+                _ => panic!("RuntimeError: UnclaimItem did not make expected changes"),
+            })
     }
 }
 
@@ -264,22 +236,25 @@ impl<'q> AsAdmin<'q> {
     /// Adds a player to the database
     ///
     /// Takes the player name and starting wealth (in gold value).
-    pub fn add_player(self, name: String, start_wealth: f32) -> ActionResult<()> {
+    pub fn add_player(self, name: &str, start_wealth: f32) -> ActionResult<()> {
         diesel::insert_into(schema::players::table)
-            .values(&models::player::NewPlayer::create(&name, start_wealth))
+            .values(&models::player::NewPlayer::create(name, start_wealth))
             .execute(self.0)
-            .map(ActionStatus::was_updated)
+            .map(|rows_updated| match rows_updated {
+                1 => (),
+                _ => panic!("RuntimeError: UnclaimItem did not make expected changes"),
+            })
     }
 
     /// Adds a list of items to the group loot
-    pub fn add_loot<'a>(self, items: Vec<(&'a str, i32)>) -> ActionResult<()> {
+    pub fn add_loot(self, items: Vec<(&str, i32)>) -> ActionResult<()> {
         for item_desc in items.into_iter() {
             let new_item = models::item::NewLoot::to_group(item_desc);
             diesel::insert_into(schema::looted::table)
                 .values(&new_item)
                 .execute(self.0)?;
         }
-        Ok(ActionStatus::ok())
+        Ok(())
     }
 
     /// Resolve all pending claims and dispatch claimed items.
@@ -293,10 +268,32 @@ impl<'q> AsAdmin<'q> {
             .grouped_by(&loot);
         // For each claimed item
         let data = loot.into_iter().zip(claims).collect::<Vec<_>>();
-        dbg!(data);
+        dbg!(&data);
-        // If mutiples claims -> find highest resolve, give to this player
+
-        // If only one claim -> give to claiming
+        for (loot, claims) in data {
-        Ok(ActionStatus::nop())
+            match claims.len() {
+                1 => {
+                    let claim = claims.get(0).unwrap();
+                    let player_id = claim.player_id;
+                    self.0.transaction(|| {
+                        use schema::looted::dsl::*;
+                        diesel::update(looted.find(claim.loot_id))
+                            .set(owner_id.eq(player_id))
+                            .execute(self.0)?;
+                        diesel::delete(schema::claims::table.find(claim.id))
+                            .execute(self.0)?;
+                        {
+                            use schema::players::dsl::*;
+                            diesel::update(players.find(player_id))
+                                .set(debt.eq(debt + (loot.base_price / 2)))
+                                .execute(self.0)
+                        }
+                    })?;
+                },
+                _ => (),
+            }
+        }
+        Ok(())
     }
 }
 
@@ -326,7 +323,7 @@ mod tests {
     /// When migrations are run, a special player with id 0 and name "Groupe"
     /// must be created.
     #[test]
-    fn test_group_is_autocreated() {
+    fn global_group_is_autocreated() {
         let conn = test_connection();
         let players = DbApi::with_conn(&conn).fetch_players().unwrap();
         assert_eq!(players.len(), 1);
@@ -338,20 +335,19 @@ mod tests {
     /// When a player updates wealth, a difference is returned by API.
     /// Added to the previous amount of coins, it should equal the updated weath.
     #[test]
-    fn test_player_updates_wealth() {
+    fn as_player_updates_wealth() {
         let conn = test_connection();
         DbApi::with_conn(&conn)
             .as_admin()
-            .add_player("PlayerName".to_string(), 403.21)
+            .add_player("PlayerName", 403.21)
             .unwrap();
         let diff = DbApi::with_conn(&conn)
             .as_player(1)
             .update_wealth(-401.21)
-            .unwrap()
+            .ok();
-            .response
-            .unwrap();
         // Check the returned diff
-        assert_eq!(diff, (-1, -2, -1, -4));
+        assert_eq!(diff, Some((-1, -2, -1, -4)));
+        let diff = diff.unwrap();
         let players = DbApi::with_conn(&conn).fetch_players().unwrap();
         let player = players.get(1).unwrap();
         // Check that we can add old value to return diff to get resulting value
@@ -362,13 +358,12 @@ mod tests {
     }
 
     #[test]
-    fn test_admin_add_player() {
+    fn as_admin_add_player() {
         let conn = test_connection();
         let result = DbApi::with_conn(&conn)
             .as_admin()
-            .add_player("PlayerName".to_string(), 403.21)
+            .add_player("PlayerName", 403.21);
-            .unwrap();
+        assert_eq!(result.is_ok(), true);
-        assert_eq!(result.executed, true);
         let players = DbApi::with_conn(&conn).fetch_players().unwrap();
         assert_eq!(players.len(), 2);
         let new_player = players.get(1).unwrap();
@@ -380,56 +375,80 @@ mod tests {
     }
 
     #[test]
-    fn test_admin_resolve_claims() {
+    fn as_admin_resolve_claims() {
         let conn = test_connection();
         let claims = DbApi::with_conn(&conn).fetch_claims().unwrap();
         assert_eq!(claims.len(), 0);
-        assert_eq!(true, false); // Failing as test is not complete
+
+        // Add items
+        assert_eq!(DbApi::with_conn(&conn).as_admin().add_loot(vec![
+            ("Épée", 40),
+            ("Arc",  40),
+        ]).is_ok(), true);
+        // Add players
+        DbApi::with_conn(&conn).as_admin().add_player("Player1", 0.0).unwrap();
+        DbApi::with_conn(&conn).as_admin().add_player("Player2", 0.0).unwrap();
+        // Put claims on one different item each
+        DbApi::with_conn(&conn).as_player(1).claim(1).unwrap();
+        DbApi::with_conn(&conn).as_player(2).claim(2).unwrap();
+        let result = DbApi::with_conn(&conn).as_admin().resolve_claims();
+        assert_eq!(result.is_ok(), true);
+        // Check that both players received an item
+        let players = DbApi::with_conn(&conn).fetch_players().unwrap();
+        for &i in [1, 2].into_iter() {
+            assert_eq!(DbApi::with_conn(&conn).as_player(i).loot().unwrap().len(), 1);
+            let player = players.get(i as usize).unwrap();
+            assert_eq!(player.debt, 20);
+        }
     }
 
     #[test]
-    fn test_player_claim_item() {
+    fn as_player_claim_item() {
         let conn = test_connection();
         DbApi::with_conn(&conn)
             .as_admin()
-            .add_player("Player".to_string(), 0.0)
+            .add_player("Player", 0.0)
             .unwrap();
         DbApi::with_conn(&conn)
             .as_admin()
             .add_loot(vec![("Épée", 25)])
             .unwrap();
         // Claim an existing item
-        let result = DbApi::with_conn(&conn).as_player(1).claim(1).unwrap();
+        let result = DbApi::with_conn(&conn).as_player(1).claim(1);
-        assert_eq!(result.executed, true);
+        assert_eq!(result.is_ok(), true);
         let claims = DbApi::with_conn(&conn).fetch_claims().unwrap();
         assert_eq!(claims.len(), 1);
         let claim = claims.get(0).unwrap();
         assert_eq!(claim.player_id, 1);
         assert_eq!(claim.loot_id, 1);
         // Claim an inexistant item
-        let result = DbApi::with_conn(&conn).as_player(1).claim(2).unwrap();
+        let result = DbApi::with_conn(&conn).as_player(1).claim(2);
-        assert_eq!(result.executed, false);
+        assert_eq!(result.is_ok(), false);
     }
 
     #[test]
-    fn test_player_unclaim_item() {
+    fn as_player_unclaim_item() {
         let conn = test_connection();
         DbApi::with_conn(&conn)
             .as_admin()
-            .add_player("Player".to_string(), 0.0)
+            .add_player("Player", 0.0)
             .unwrap();
         DbApi::with_conn(&conn)
             .as_admin()
             .add_loot(vec![("Épée", 25)])
             .unwrap();
         // Claim an existing item
-        let result = DbApi::with_conn(&conn).as_player(1).claim(1).unwrap();
+        let result = DbApi::with_conn(&conn).as_player(1).claim(1);
-        assert_eq!(result.executed, true);
+        assert_eq!(result.is_ok(), true);
-        let result = DbApi::with_conn(&conn).as_player(1).unclaim(1).unwrap();
+        // Claiming twice is an error
-        assert_eq!(result.executed, true);
+        let result = DbApi::with_conn(&conn).as_player(1).claim(1);
-        // Check that unclaimed items will not be unclaimed...
+        assert_eq!(result.is_ok(), false);
-        let result = DbApi::with_conn(&conn).as_player(1).unclaim(1).unwrap();
+        // Unclaiming and item
-        assert_eq!(result.executed, false);
+        let result = DbApi::with_conn(&conn).as_player(1).unclaim(1);
+        assert_eq!(result.is_ok(), true);
+        // Check that not claimed items will not be unclaimed...
+        let result = DbApi::with_conn(&conn).as_player(1).unclaim(1);
+        assert_eq!(result.is_ok(), false);
         let claims = DbApi::with_conn(&conn).fetch_claims().unwrap();
         assert_eq!(claims.len(), 0);
     }
@@ -438,20 +457,19 @@ mod tests {
     ///
     /// Checks that player's chest and wealth are updated.
     /// Checks that items are sold at half their value.
+    /// Checks that a player cannot sell item he does not own.
     #[test]
-    fn test_buy_sell_simple() {
+    fn as_player_simple_buy_sell() {
         let conn = test_connection();
         DbApi::with_conn(&conn)
             .as_admin()
-            .add_player("Player".to_string(), 1000.0)
+            .add_player("Player", 1000.0)
             .unwrap();
         // Buy an item
         let bought = DbApi::with_conn(&conn)
             .as_player(1)
-            .buy("Sword", 800)
+            .buy("Sword", 800);
-            .unwrap();
+        assert_eq!(bought.ok(), Some((0, 0, 0, -8))); // Returns diff of player wealth ?
-        assert_eq!(bought.executed, true); // Was updated ?
-        assert_eq!(bought.response, Some((0, 0, 0, -8))); // Returns diff of player wealth ?
         let chest = DbApi::with_conn(&conn).as_player(1).loot().unwrap();
         assert_eq!(chest.len(), 1);
         let loot = chest.get(0).unwrap();
@@ -460,13 +478,12 @@ mod tests {
         let players = DbApi::with_conn(&conn).fetch_players().unwrap();
         let player = players.get(1).unwrap();
         assert_eq!(player.pp, 2);
+        // A player cannot sell loot from an other's chest
+        let result = DbApi::with_conn(&conn).as_player(0).sell(loot.id, None);
+        assert_eq!(result.is_ok(), false);
         // Sell back
-        let sold = DbApi::with_conn(&conn)
+        let sold = DbApi::with_conn(&conn).as_player(1).sell(loot.id, None);
-            .as_player(1)
+        assert_eq!(sold.ok(), Some((0, 0, 0, 4)));
-            .sell(loot.id, None)
-            .unwrap();
-        assert_eq!(sold.executed, true);
-        assert_eq!(sold.response, Some((0, 0, 0, 4)));
         let chest = DbApi::with_conn(&conn).as_player(1).loot().unwrap();
         assert_eq!(chest.len(), 0);
         let players = DbApi::with_conn(&conn).fetch_players().unwrap();
@@ -475,7 +492,7 @@ mod tests {
     }
 
     #[test]
-    fn test_admin_add_loot() {
+    fn as_admin_add_loot() {
         let conn = test_connection();
         assert_eq!(
             0,
@@ -484,9 +501,8 @@ mod tests {
         let loot_to_add = vec![("Cape d'invisibilité", 8000), ("Arc long", 25)];
         let result = DbApi::with_conn(&conn)
             .as_admin()
-            .add_loot(loot_to_add.clone())
+            .add_loot(loot_to_add.clone());
-            .unwrap();
+        assert_eq!(result.is_ok(), true);
-        assert_eq!(result.executed, true);
         let looted = DbApi::with_conn(&conn).as_player(0).loot().unwrap();
         assert_eq!(looted.len(), 2);
         // NB: Not a problem now, but this adds constraints of items being

lootalot_db/src/models/item.rs

@@ -35,8 +35,8 @@ type OwnedLoot = Filter<looted::table, WithOwner>;
 pub(crate) struct Loot {
     id: i32,
     name: String,
-    base_price: i32,
+    pub(crate) base_price: i32,
-    owner: i32,
+    pub(crate) owner: i32,
 }
 
 impl Loot {

lootalot_front/babel.config.js

@@ -2,7 +2,6 @@ module.exports = {
   presets: [
     '@vue/app'
   ],
-  "presets": [["env", { "modules": false }]],
   "env": {
     "test": {
       "presets": [["env", { "targets": { "node": "current" } }]]

lootalot_front/package.json

@@ -21,6 +21,7 @@
     "@vue/cli-plugin-eslint": "^3.8.0",
     "@vue/cli-service": "^3.8.0",
     "@vue/test-utils": "^1.0.0-beta.29",
+    "babel-core": "^6.26.3",
     "babel-eslint": "^10.0.1",
     "babel-jest": "^24.8.0",
     "babel-preset-env": "^1.7.0",

lootalot_front/src/App.vue

@@ -1,11 +1,6 @@
 <template>
-  <main id="app" class="section">
+  <main id="app" class="container">
-  <section id="content" class="columns is-desktop">
     <Player></Player>
-    <div class="column">
-      <Chest :player="0" v-if="state.initiated"></Chest>
-    </div>
-  </section>
   </main>
 </template>
 

lootalot_front/src/AppStorage.js

@@ -116,17 +116,14 @@ export const AppStorage = {
     },
     updatePlayerWealth (goldValue) {
         return Api.updateWealth(this.state.player_id, goldValue)
-          .then(done => {
+          .then(response  => {
-            if (done.executed) {
               // Update player wealth
-              var diff = done.response;
+              var diff = response;
               if (this.debug) console.log('updatePlayerWealth', diff)
               this.state.player_list[this.state.player_id].cp += diff[0];
               this.state.player_list[this.state.player_id].sp += diff[1];
               this.state.player_list[this.state.player_id].gp += diff[2];
               this.state.player_list[this.state.player_id].pp += diff[3];
-            }
-            return done.executed;
           });
     },
     // Put a claim on an item from group chest.
@@ -134,12 +131,8 @@ export const AppStorage = {
         const playerId = this.state.player_id
         Api.putClaim(playerId, itemId)
            .then(done => {
-              if (done.executed) {
+              // Update cliend-side state
-                // Update cliend-side state
+              this.state.player_claims[playerId].push(itemId);
-                this.state.player_claims[playerId].push(itemId);
-              } else {
-                if (this.debug) console.log("API responded with 'false'")
-              }
            });
     },
     // Withdraws a claim.
@@ -147,16 +140,12 @@ export const AppStorage = {
         const playerId = this.state.player_id
         Api.unClaim(playerId, itemId)
           .then(done => {
-              if (done.executed) {
                 var idx = this.state.player_claims[playerId].indexOf(itemId);
                 if (idx > -1) {
                     this.state.player_claims[playerId].splice(idx, 1);
                 } else {
                     if (this.debug) console.log("cancel a non-existent request")
                 }
-              } else {
-                if (this.debug) console.log("API responded with 'false'")
-              }
           });
     }
 }

lootalot_front/src/components/Chest.vue

@@ -1,88 +1,50 @@
 <template>
-  <div class="container is-paddingless">
+  <table class="table is-fullwidth is-striped">
-    <div v-if="mainControlsDisplayed" 
+    <thead>
-         class="columns is-mobile is-vcentered"
+      <tr>
-      >
+        <th>{{ player == 0 ? 'Coffre de groupe' : 'Objets'}}</th>
-      <div class="column is-narrow">
+        <th v-if="canGrab"></th>
-        <span class="icon is-large">
+        <th v-if="canSell">
-          <i class="fas fa-2x fa-dragon"></i>
+          <div class="buttons is-right">
-          </span>
+            <button class="button" :class="is_selling ? 'is-danger' : 'is-warning'"
-        </div>
+              @click="is_selling = !is_selling">
-      <div class="column has-text-left">
+              <span class="icon"><i class="fas fa-coins"></i></span>
-        <h1 class="title">Coffre de groupe</h1>
+              <p v-if="!is_selling">Vendre</p>
-        </div>
+              <p v-else>{{ totalSellValue ? totalSellValue : 'Annuler' }}</p>
-      <div class="column" v-show="canAdd">
-        <div v-show="mainControlsDisplayed" class="buttons is-right">
-          <button v-if="canAdd" 
-            class="button is-inverted is-info"
-            @click="is_adding = true"
-            >
-            <span class="icon">
-              <i class="fas fa-box-open"></i>
-            </span>
-            <p>Nouveau loot</p>
-            </button>
-          <button class="button is-inverted is-primary">
-            <span class="icon">
-              <i class="fas fa-coins"></i>
-              </span>
-            <p>Tout vendre</p>
             </button>
+            <PercentInput v-show="is_selling"></PercentInput>
           </div>
-        </div>
+        </th>
-      </div>
+      </tr>
-    <Loot v-if="is_adding" @done="is_adding = false"></Loot>
+    </thead>
-    <table v-else class="table is-fullwidth is-striped" >
+    <tbody v-if="app_state.initiated">
-      <thead>
+      <template v-for="(item, idx) in content">
-        <tr>
+        <tr :key="`row-${idx}`">
-          <th>Objets de {{ player }}</th>
+          <td>
-          <th v-if="canGrab"></th>
+            <strong>{{item.name}}</strong>
-          <th v-if="canSell">
+          </td>
-            <div class="buttons is-right">
+          <td v-if="canGrab">
-              <button class="button" 
+            <Request :item="item.id"></Request>
-                  :class="is_selling ? 'is-danger' :  'is-warning'"
+          </td>
-                  @click="is_selling = !is_selling"
+          <td v-if="canSell">
-                >
+            <div class="field is-grouped is-pulled-right" v-show="is_selling">
-                <span class="icon">
+              <div class="control">
-                  <i class="fas fa-coins"></i>
+                <label class="label">
-                </span>
+                  <input type="checkbox"
-                <p v-if="!is_selling">
+                      id="`item-${idx}`"
-                  Vendre</p>
+                      :value="item.id"
-                <p v-else>
+                      v-model="sell_selected">
-                  {{ totalSellValue ? totalSellValue : 'Annuler' }}</p>
+                    {{item.base_price / 2}} GP
-                </button>
+                </label>
-                <PercentInput v-show="is_selling">
-                  </PercentInput>
               </div>
-            </th>
+              <PercentInput></PercentInput>
-          </tr>
+            </div>
-        </thead>
+          </td>
-      <tbody>
+        </tr>
-        <template v-for="(item, idx) in content">
+      </template>
-          <tr :key="`row-${idx}`">
+    </tbody>
-            <td>{{item.name}}</td>
+    <p v-else>Loading...</p>
-            <td v-if="canGrab">
+  </table>
-              <Request :item="item.id"></Request>
-              </td>
-            <td v-if="canSell">
-              <div class="field is-grouped is-pulled-right" v-show="is_selling">
-                <div class="control">
-                  <label class="label">
-                    <input type="checkbox" 
-                        id="`item-${idx}`" 
-                        :value="item.id"
-                        v-model="sell_selected">
-                      {{item.base_price / 2}} GP
-                    </label>
-                  </div>
-                <PercentInput></PercentInput>
-                </div>
-              </td>
-            </tr>
-          </template>
-        </tbody>
-      </table>
-    </div>
 </template>
 
 <script>
@@ -154,11 +116,6 @@
                 return (this.app_state.player_id == 0 
                     && this.player == 0);
             },
-            // The main controls are only displayed on group chest
-            mainControlsDisplayed () {
-                return (this.player == 0 
-                     && !this.is_adding);
-            }
         },
     }
 </script>

lootalot_front/src/components/ItemInput.vue

@@ -4,7 +4,7 @@
     <div class="control is-expanded" 
         :class="{'is-loading': is_loading }">
       <input type="text" 
-        v-model="search"
+        v-model="item_name"
         @input="autoCompletion" 
         class="input" 
        :class="{'is-danger': no_results, 
@@ -12,6 +12,11 @@
         autocomplete="on">
         </input>
       </div>
+    <div class="control">
+      <input type="text" class="input"
+        :class="{'is-danger': !item_price}"
+        v-model.number="item_price"></input>
+    </div>
     <div class="control">
       <button class="button is-primary"
         :disabled="no_results"
@@ -23,7 +28,7 @@
       <div class="dropdown-menu">
         <div class="dropdown-content">
             <a v-for="(result,i) in results" :key="i"
-              @click="setResult(result.name)"
+              @click="setResult(result)"
               class="dropdown-item"
               >
               {{ result.name }}
@@ -35,18 +40,15 @@
 </template>
 
 <script>
-    // List of items for autocomplete
+
-    const MOCK_ITEMS = [
-        {id: 35, name: "Cape d'invisibilité", sell_value: 30000}, 
-        {id: 8, name: "Arc long", sell_value: 10}, 
-    ];
- 
     export default {
+        props: ["source"],
         data () {
             return {
                 is_loading: false,
                 no_results: false,
-                search: '',
+                item_name: '',
+                item_price: '',
                 results: [],
                 auto_open: false,
             };
@@ -55,13 +57,13 @@
             autoCompletion (ev) {
                 // TODO: a lot happens here that
                 //       need to be clarified
-                if (this.search == '') {
+                if (this.item_name == '') {
                     this.auto_open = false;
                     this.results = [];
                     this.no_results = false;
                 } else {
-                    this.results = MOCK_ITEMS.filter(item => {
+                    this.results = this.source.filter(item => {
-                        return item.name.includes(this.search);
+                        return item.name.includes(this.item_name);
                     });
                     // Update status 
                     if (this.results.length == 0) {
@@ -73,12 +75,17 @@
                 }
             },
             setResult(result) {
-                this.search = result;
+                this.item_name = result.name;
+                this.item_price = result.sell_value;
                 this.auto_open = false;
             },
             addItem () {
-                this.$emit("addItem", this.search);        
+                this.$emit("addItem", {
-                this.search = '';
+                   name: this.item_name,
+                   sell_value: this.item_price
+                });        
+                this.item_name = '';
+                this.item_price = '';
                 this.results = [];
                 this.no_results = false;
                 this.auto_open = false;

lootalot_front/src/components/Loot.vue

@@ -1,32 +1,29 @@
 <template>
-    <div class="card is-shadowless">
+  <div>
-        <div class="card-header">
+  <p class="heading has-text-left is-size-5">
-          <p class="card-header-title">
+    Nouveau loot - {{ looted.length }} objet(s)</p>
-            Nouveau loot - {{ looted.length }} objet(s)</p>
+  <ItemInput @addItem="onAddItem" :source="inventory"></ItemInput>
-          </div>
+  <p v-for="(item, idx) in looted" :key="idx"
-        <div class="card-content">
+     class="has-text-left is-size-5">
-          <ItemInput @addItem="onAddItem"></ItemInput>
+    {{ item.name }} ({{ item.sell_value }}po)
-          <p v-for="(item, idx) in looted" :key="idx"
+  </p>
-             class="has-text-left is-size-5">
+  </div>
-            {{ item }}
-          </p>
-          </div>
-        <div class="card-footer">
-          <div class="card-footer-item buttons is-center">
-            <a class="button is-primary">Confirmer</a>
-            <a @click="onClose" class="button is-danger">Annuler</a>
-            </div>
-          </div>
-      </div>
 </template>
 
 <script>
     import ItemInput from './ItemInput.vue'
-
+    // List of items for autocomplete
+    const MOCK_ITEMS = [
+        {id: 35, name: "Cape d'invisibilité", sell_value: 30000}, 
+        {id: 8, name: "Arc long", sell_value: 10}, 
+        {id: 9, name: "Arc court", sell_value: 10}, 
+    ];
+ 
     export default {
         components: { ItemInput },
         data () { return {
             looted: [],
+            inventory: MOCK_ITEMS,
         }; 
         },
         methods: {

lootalot_front/src/components/NumberInput.vue

@@ -1,27 +0,0 @@
-<template>
-    <input type="text" 
-        class="input" 
-        :class="{'is-danger': has_error}"
-        :value="value"
-        @input="checkError"
-    ></input>
-</template>
-
-<script>
-    export default {
-        props: ["value"],
-        data () {
-            return { has_error: false};
-        },
-        methods: {
-            checkError (ev) {
-                const newValue = ev.target.value;
-                this.has_error = isNaN(newValue);
-	        this.$emit(
-	            'input',
-	            this.has_error ? 0 : Number(newValue)
-	        );
-            }
-        },
-    }
-</script>

lootalot_front/src/components/PercentInput.vue

@@ -1,20 +1,18 @@
 <template>
-        <div class="field has-addons">
+  <div class="field has-addons">
-          <div v-show="is_opened" class="control has-icons-left">
+    <div v-show="is_opened" class="control has-icons-left">
-            <input class="input is-small" type="number" size="3" min=-50 max=50 step=5>
+      <input class="input is-small" type="number" size="3" min=-50 max=50 step=5>
-            <span class="icon is-small is-left">
+      <span class="icon is-small is-left">
-              <i class="fas fa-percent"></i>
+        <i class="fas fa-percent"></i>
-            </span>
+      </span>
-          </div>
+    </div>
-          <div class="control">
+    <div class="control">
-            <button class="button is-small is-outlined"
+      <button class="button is-small is-outlined" @click="is_opened = !is_opened">
-              @click="is_opened = !is_opened"
+        <small v-if="!is_opened">Mod.</small>
-            >
+        <span v-else class="icon"><i class="fas fa-times-circle"></i></span>
-              <small v-if="!is_opened">Mod.</small>
+      </button>
-              <span v-else class="icon"><i class="fas fa-times-circle"></i></span>
+    </div>
-            </button>
+  </div>
-          </div>
-        </div>
 </template>
 
 <script>

lootalot_front/src/components/Player.vue

@@ -1,51 +1,53 @@
 <template>
-  <div class="column is-one-third-desktop">
+  <div class="">
-    <div id="sidebar" class="card">
+  <nav class="navbar is-info">
-      <header id="sidebar-heading" class="card-header">
+    <div class="navbar-brand">
-        <p class="card-header-title">
+      <p class="navbar-item is-size-4" @click="show_wealth = !show_wealth">{{ app_state.initiated ? player.name : "..." }}</p>
-          {{ app_state.initiated ? player.name : "..." }}</p>
+      <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
-        <div class="dropdown is-right"
+	  <span aria-hidden="true"></span>
-            :class="{ 'is-active': show_dropdown }">
+	  <span aria-hidden="true"></span>
-          <div class="dropdown-trigger" ref="dropdown_btn">
+	  <span aria-hidden="true"></span>
-            <a id="change_player" class="card-header-icon"
+	</a>
-               @click="show_dropdown = !show_dropdown"
+    </div>
-               aria-haspopup="true" aria-controls="dropdown-menu">
+    <div id="menu" class="navbar-menu">
-              <span class="icon is-small">
+      <div class="navbar-start" v-if="!playerIsGroup">
-                <i class="fas fa-exchange-alt"></i>
+     	  <a class="navbar-item" @click="switchPlayerChestVisibility">
-              </span>
+     	    {{ app_state.show_player_chest ? 'Coffre de groupe' : 'Mon coffre' }}</a>
-            </a>
+      </div>
-          </div>
+      <div class="navbar-end">
-          <div class="dropdown-menu" id="dropdown-menu" role="menu"
+      <div class="navbar-item has-dropdown is-hoverable">
-            v-closable="{ exclude: ['dropdown_btn'], handler: 'closeDropdown', visible: show_dropdown }">
+        <a class="navbar-link">Autres</a>
-            <div class="dropdown-content" v-if="app_state.initiated">
+        <div class="navbar-dropdown is-right">
-              <a v-for="(p,i) in app_state.player_list" :key="i"
+          <a class="navbar-item">History of Loot</a>
-                 @click="setActivePlayer(i)" 
+          <hr class="navbar-divider">
-                 href="#" class="dropdown-item">
+          <div class="navbar-item heading">Changer</div>
-                {{ p.name }}</a>
+          <a v-for="(p,i) in app_state.player_list" :key="i"
-              </div>
+           @click="setActivePlayer(i)"
-            </div>
+           href="#" class="navbar-item">
-          </div>
+           {{ p.name }}</a>
-        </header>
+	</div>
-      <div class="card-content">
-      <Wealth :wealth="wealth" :debt="player.debt"></Wealth>
-      <div class="box is-shadowless" v-show="!playerIsGroup">
-      	 <div class="columns is-vcentered" @click="switchPlayerChestVisibility">
-      	   <div class="column is-one-fifth">
-		<span class="icon is-large">
-		<i class="fas fa-2x fa-box"></i>
-		</span>
-	   </div>
-	   <div class="column if-four-fifth has-text-left">
-	     <p class="is-size-3">Coffre</p>
-	   </div>
-	 </div>
       </div>
-	 <Chest :player="app_state.player_id"
-	   v-show="app_state.show_player_chest">
-	   </Chest>
-      <a href="#" class="button is-link is-fullwidth is-hidden" disabled>Historique</a>
       </div>
     </div>
+  </nav>
+  <section class="box is-shadowless" v-if="show_wealth">
+    <Wealth :wealth="wealth" :debt="player.debt"></Wealth>
+  </section>
+  <section class="card">
+    <div class="card-content">
+      <Loot v-if="is_adding"></Loot>
+      <Chest v-else :player="shownChest"></Chest>
+    </div>
+    <div class="card-footer" v-if="shownChest == player.id">
+      <template v-if="is_adding">
+        <a class="card-footer-item">Confirmer</a>
+        <a class="card-footer-item" @click="toggleAdding">Annuler</a>
+      </template>
+      <a v-else class="card-footer-item" @click="toggleAdding">
+        + {{ playerIsGroup ? 'Nouveau loot' : 'Acheter' }}
+      </a>
+    </div>
+  </section>
   </div>
 </template>
 
@@ -53,31 +55,17 @@
     import { AppStorage } from '../AppStorage'
     import Chest from './Chest.vue'
     import Wealth from './Wealth.vue'
+    import Loot from './Loot.vue'
     /*
     The Player control board.
-    To test :
-        - Player name is displayed
-        - Player's wealth is displayed -> Inside Wealth component
-        - Dropdown:
-            - The first item is the group
-            - Opened by activator
-            - Closed when clicked outside
-            - Click on item does switch active player
-        - Switch player :
-            - Name is updated when player_id is updated
-            - Wealth is updated -> Inside Wealth component
-        - Chest button controls Chest visibility
-            
     */
-    let handleOutsideClick;
     export default {
-        components: { Chest, Wealth },
+        components: { Chest, Wealth, Loot },
         data () {
             return {
                 app_state: AppStorage.state,
-                show_dropdown: false,
+                is_adding: false,
-                edit_wealth: false,
+                show_wealth: true,
-                handleOutsideClick: null,
             };
         },
         computed: {
@@ -90,19 +78,27 @@
             	if (!this.app_state.initiated) {
             	    return ["-", "-", "-", "-"];
             	} else {
-		    const cp = this.player.cp
+                    const cp = this.player.cp
-		    const sp = this.player.sp
+                    const sp = this.player.sp
-		    const gp = this.player.gp
+                    const gp = this.player.gp
-		    const pp = this.player.pp
+                    const pp = this.player.pp
-		    return [cp, sp, gp, pp];
+                    return [cp, sp, gp, pp];
-		}
+                }
             },
             // Check if the active player is the special 'Group' player
             playerIsGroup () {
                 return this.app_state.player_id == 0;
+            },
+            shownChest () {
+           	return this.app_state.show_player_chest
+           	    ? this.app_state.player_id
+           	    : 0;
             }
         },
         methods: {
+            toggleAdding () {
+               this.is_adding = !this.is_adding; 
+            },
             switchPlayerChestVisibility () {
                 AppStorage.switchPlayerChestVisibility();
             },
@@ -120,43 +116,6 @@
                 this.show_dropdown = false
             }
         },
-        directives: {
-            'closable': {
-                bind: function(el, binding, vnode) { 
-                    handleOutsideClick = (e) => {
-                        e.stopPropagation();
-                        const { exclude, handler } = binding.value;
-                        let excludedElClicked = false;
-                        exclude.forEach(refName => {
-                            if (!excludedElClicked) {
-                                const elt = vnode.context.$refs[refName];
-                                excludedElClicked = elt.contains(e.target);
-                            }
-                        });
-                    
-                        if (!excludedElClicked) {
-                            console.log('outsideCloseDropdown');
-                            vnode.context[handler]()
-                        }
-                    };
-                },
-                // Bind custom handler only when dropdown is visible
-                update: function(el, binding, vnode, _) {
-                    const { visible } = binding.value;
-                    if (visible) {
-                        document.addEventListener('click', handleOutsideClick);
-                        document.addEventListener('touchstart', handleOutsideClick);
-                    } else {
-                        document.removeEventListener('click', handleOutsideClick);
-                        document.removeEventListener('touchstart', handleOutsideClick);
-                    }
-                },
-                unbind: function() { console.log("unbind"); 
-                    document.removeEventListener('click', handleOutsideClick);
-                    document.removeEventListener('touchstart', handleOutsideClick);
-                }
-            }
-        }
     }
 </script>
 

lootalot_front/src/components/Request.vue

@@ -2,25 +2,22 @@
   <div class="buttons is-right" >
     <template v-if="isInConflict">
       <button class="button is-success" 
-            @click="cancelRequest"
+        @click="cancelRequest">
-        >
+        <span class="icon is-small">
-          <span class="icon is-small">
+          <i class="fas fa-hand-peace"></i>
-            <i class="fas fa-hand-peace"></i>
+        </span>
-          </span>
+      </button>
-        </button>
+      <button class="button is-danger" 
-        <button class="button is-danger" 
+        @click="hardenRequest">
-            @click="hardenRequest"
+        <span class="icon is-small">
-          >
+          <i class="fas fa-hand-middle-finger"></i>
-          <span class="icon is-small">
+        </span>
-            <i class="fas fa-hand-middle-finger"></i>
+      </button>
-          </span>
-        </button>
     </template>
     <button class="button is-primary" 
-        @click="putRequest"
+      @click="putRequest"
-        :class="{'is-outlined': isRequested}"
+      :class="{'is-small': isRequested}"
-        :disabled="isRequested"
+      :disabled="isRequested">
-    >
       <span class="icon is-small">
         <i class="fas fa-praying-hands"></i>
       </span>
@@ -33,20 +30,18 @@
     export default {
         props: ["item"],
         data () { 
-            return {
+            return AppStorage.state;
-                state: AppStorage.state,
-            };
         },
         computed: {
             // Check if item is requested by active player
             isRequested () {
-                const reqs = this.state.player_claims[this.state.player_id];
+                const reqs = this.player_claims[this.player_id];
                 return reqs.includes(this.item);
             },
             // Check if item is requested by multiple players including active one
             isInConflict () {
-                const reqs = this.state.player_claims;
+                const reqs = this.player_claims;
-                const playerId = this.state.player_id;
+                const playerId = this.player_id;
                 var reqByPlayer = false;
                 var reqByOther = false;
                 for (var key in reqs) {

lootalot_front/src/components/Wealth.vue

@@ -1,57 +1,53 @@
 <template>
-  <div class="box is-shadowless">
+  <section class="level is-mobile">
-    <nav class="columns is-mobile is-multiline is-vcentered">
+    <div class="level-left">
-      <div class="column">
+      <div class="level-item">
 	<span class="icon is-large"
 	  @click="edit = !edit">
 	  <i class="fas fa-2x fa-piggy-bank"></i>
 	  </span>
-	<p v-if="debt" class="has-text-danger">-{{ debt }}gp </p>
+      </div>
-	</div>
+    <template v-if="edit">
-      <div class="column has-text-info">
+      <div class="level-item">
-        <p class="heading">PP</p>
+    	<input class="input" type="number" step="0.01" v-model="edit_value"></input>
-        <p class="is-size-4">{{ wealth[3] }}</p>
+      </div>
-      	</div>
+      <div class="level-item">
-      <div class="column has-text-warning">
+        <button class="button is-danger" @click="updateWealth()">
-        <p class="heading">PO</p>
+          Modifier
-        <p class="is-size-4">{{ wealth[2] }}</p>
-      	</div>
-      <div class="column has-text-grey">
-        <p class="heading">PA</p>
-        <p class="is-size-4">{{ wealth[1] }}</p>
-        </div>
-      <div class="column has-text-grey">
-        <p class="heading">PC</p>
-        <p class="is-size-4">{{ wealth[0] }}</p>
-        </div>
-      </nav>
-    <div v-if="edit"> <!-- or v-show ? -->
-    <nav class="columns is-mobile">
-      <div class="column">
-    	<NumberInput v-model="edit_value"></NumberInput>
-    	</div>
-      <div class="column is-2">
-        <button class="button is-outlined is-fullwidth is-danger"
-            @click="updateWealth('minus')">
-          <span class="icon"><i class="fas fa-2x fa-minus"></i></span>
         </button>
-        </div>
+      </div>
-      <div class="column is-2">
+    </template>
-        <button class="button is-outlined is-primary is-fullwidth"
+    <template v-else>
-            @click="updateWealth('plus')">
+      <div class="level-item ">
-          <span class="icon"><i class="fas fa-2x fa-plus"></i></span>
+       <p class="is-size-4">{{ wealth[3] }}</p>
-        </button>
+       <p class="heading">PP</p>
-        </div>
+      </div>
-      </nav>
+     <div class="level-item ">
+       <p class="is-size-4">{{ wealth[2] }}</p>
+       <p class="heading">PO</p>
+     	</div>
+     <div class="level-item ">
+       <p class="is-size-4">{{ wealth[1] }}</p>
+       <p class="heading">PA</p>
+       </div>
+     <div class="level-item ">
+       <p class="is-size-4">{{ wealth[0] }}</p>
+       <p class="heading">PC</p>
+       </div>
+    </template>
     </div>
-  </div>
+    <div class="level-right" v-if="debt">
+      <div class="level-item">
+        <p class="heading is-size-4 has-text-danger">Dette: {{ debt }}gp </p>
+      </div>
+    </div>
+    </div>
+  </section>
 </template>
 
 <script>
     import { AppStorage } from '../AppStorage.js'
-    import NumberInput from './NumberInput.vue'
     export default {
-        components: { NumberInput },
         props: ["wealth", "debt"],
         data () { 
             return {
@@ -60,28 +56,9 @@
             }; 
         },
         methods: {
-            updateWealth (op) {
+            updateWealth () {
-            	var goldValue;
+                AppStorage.updatePlayerWealth(this.edit_value)
-            	switch (op) {
+                    .then(_ => this.resetValues());
-            	  case 'plus':
-            	    goldValue = this.edit_value;
-            	    break;
-            	  case 'minus':
-            	    goldValue = -this.edit_value;
-            	    break;
-            	  default:
-            	    console.log("Error, bad operator !", op);
-            	    return;
-            	}
-                AppStorage.updatePlayerWealth(goldValue)
-                    .then(done => {
-                   	if (done) {
-		            this.$emit('updated');
-		            this.resetValues();
-		        } else {
-		            console.log('correct errors');
-		        }
-                    });
             },
             resetValues () {
             	this.edit = false;

src/server.rs

@@ -112,7 +112,7 @@ pub(crate) fn serve() -> std::io::Result<()> {
                         web::get().to_async(
                             move |pool: AppPool, data: web::Path<(String, f32)>| {
                                 db_call(pool, move |api| {
-                                    api.as_admin().add_player(data.0.clone(), data.1)
+                                    api.as_admin().add_player(&data.0, data.1)
                                 })
                             },
                         ),