put the pokemon key into html and ended var attributions

.vscode/settings.json

+{
+    "git.ignoreLimitWarning": true
+}
\ No newline at end of file

backend/.gitignore

@@ -25,6 +25,7 @@ speed-measure-plugin*.json
 
 # IDE - VSCode
 .vscode/*
+.vscode/
 !.vscode/settings.json
 !.vscode/tasks.json
 !.vscode/launch.json

backend/app/methods/JSONmanip.js

 var _ = require('underscore');
 
-exports.filterJSON = function (data, type){
+exports.filterJSON = function(data, type) {
     var moveNom = "movesPoss";
-    if(type) moveNom = "movesUtil";
+    if (type) moveNom = "movesUtil";
     var dataSet = new Set();
     var filteredData = [];
     var i = -1;
     Object.keys(data).forEach(function(key) {
-      var switcher = false;
-      var temp = {};
-      var move = {};
-      Object.keys(data[key]).forEach(function(key2) {
-        if(key2 == "id_move") switcher = true;
-        if(switcher) move[key2] = data[key][key2];
-        else {temp[key2] = data[key][key2]; };
-      });
-      temp[moveNom] = [];
-      if(dataSet.has(data[key]["id_pokemon"])) filteredData[i][moveNom].push(move);
-      else {i++;filteredData.push(temp); dataSet.add(data[key]["id_pokemon"]); filteredData[i][moveNom].push(move);}
+        var switcher = false;
+        var temp = {};
+        var move = {};
+        Object.keys(data[key]).forEach(function(key2) {
+            if (key2 == "id_move") switcher = true;
+            if (switcher) move[key2] = data[key][key2];
+            else { temp[key2] = data[key][key2]; };
+        });
+        temp[moveNom] = [];
+        if (dataSet.has(data[key]["id_pokemon"])) filteredData[i][moveNom].push(move);
+        else {
+            i++;
+            filteredData.push(temp);
+            dataSet.add(data[key]["id_pokemon"]);
+            filteredData[i][moveNom].push(move);
+        }
     });
     return filteredData;
 }
 
-exports.filterJSONCombat = function (data){
-    var separatorsNames = ["types", "stats", "moves"];
-    var separators = ["id_type", "id", "id_move"];
+exports.filterJSONCombat = function(data) {
+    var separatorsNames = ["types", "stats", "base_stats", "moves"];
+    var separators = ["id_type", "id", "baseStat_id", "id_move"];
     var dataSet = new Set();
     var filteredData = [];
     var i = -1;
@@ -33,10 +38,11 @@ exports.filterJSONCombat = function (data){
         var tempArray = {};
         var typesContainer = {};
         var statsContainer = {};
+        var baseStatsContainer = {};
         var movesContainer = {};
         Object.keys(data[key]).forEach(function(key2) {
-            if(separators.includes(key2)) switcher++;
-            switch(switcher) {
+            if (separators.includes(key2)) switcher++;
+            switch (switcher) {
                 case 1:
                     typesContainer[key2] = data[key][key2];
                     break;
@@ -44,6 +50,9 @@ exports.filterJSONCombat = function (data){
                     statsContainer[key2] = data[key][key2];
                     break;
                 case 3:
+                    baseStatsContainer[key2] = data[key][key2];
+                    break;
+                case 4:
                     movesContainer[key2] = data[key][key2];
                     break;
                 default:
@@ -53,31 +62,38 @@ exports.filterJSONCombat = function (data){
         });
         //tempArray[moveNom] = [];
         separatorsNames.forEach(sep => tempArray[sep] = [])
-        if(dataSet.has(data[key]["id_pokemon"])) {
+        if (dataSet.has(data[key]["id_pokemon"])) {
             //filteredData[i][moveNom].push(subContainer)
             filteredData[i][separatorsNames[0]].push(typesContainer);
             filteredData[i][separatorsNames[1]].push(statsContainer);
-            filteredData[i][separatorsNames[2]].push(movesContainer);
+            filteredData[i][separatorsNames[2]].push(baseStatsContainer);
+            filteredData[i][separatorsNames[3]].push(movesContainer);
         } else {
             i++;
             filteredData.push(tempArray);
             dataSet.add(data[key]["id_pokemon"]);
             filteredData[i][separatorsNames[0]].push(typesContainer);
             filteredData[i][separatorsNames[1]].push(statsContainer);
-            filteredData[i][separatorsNames[2]].push(movesContainer);
+            filteredData[i][separatorsNames[2]].push(baseStatsContainer);
+            filteredData[i][separatorsNames[3]].push(movesContainer);
         }
     });
-    filteredData.forEach(pokemon => {pokemon.types = arrUnique(pokemon.types); pokemon.moves = arrUnique(pokemon.moves); pokemon.stats = arrUnique(pokemon.stats);});
+    filteredData.forEach(pokemon => {
+        pokemon.types = arrUnique(pokemon.types);
+        pokemon.moves = arrUnique(pokemon.moves);
+        pokemon.stats = arrUnique(pokemon.stats);
+        pokemon.base_stats = arrUnique(pokemon.base_stats);
+    });
     return filteredData;
 }
 
-exports.fuseJSON = function (dataUtil, dataPoss){
+exports.fuseJSON = function(dataUtil, dataPoss) {
     var fusedJSON = dataUtil;
     Object.keys(fusedJSON).forEach(function(key) {
         var tempTab = fusedJSON[key]["movesUtil"];
-        tempTab = tempTab.filter(value =>{
+        tempTab = tempTab.filter(value => {
             var contain = false;
-            dataPoss[key]["movesPoss"].forEach(value2 => {if(value.id_move == value2.id_move)contain = true});
+            dataPoss[key]["movesPoss"].forEach(value2 => { if (value.id_move == value2.id_move) contain = true });
             return !contain;
         });
         fusedJSON[key]["movesUtil"] = tempTab;
@@ -86,7 +102,7 @@ exports.fuseJSON = function (dataUtil, dataPoss){
     return fusedJSON;
 }
 
-exports.test = function (){
+exports.test = function() {
     return true;
 }
 
@@ -97,7 +113,7 @@ function arrUnique(arr) {
         cleaned.forEach(function(itm2) {
             if (_.isEqual(itm, itm2)) unique = false;
         });
-        if (unique)  cleaned.push(itm);
+        if (unique) cleaned.push(itm);
     });
     return cleaned;
 }
\ No newline at end of file

backend/app/models/partie.model.js

@@ -46,7 +46,7 @@ Partie.accept = (id_partie, result) => {
     sql.beginTransaction(function(errTransaction) {
         if (errTransaction) { throw err; }
         sql.query('UPDATE partie SET nbTours=1 WHERE id_partie=?', id_partie, function(err, res) {
-            if (err) { 
+            if (err) {
                 console.log("error: ", err);
                 sql.rollback(function() {
                     throw err;
@@ -56,16 +56,16 @@ Partie.accept = (id_partie, result) => {
             }
             //INSERT INTO etatPoke (hp, def, atk, active, id_partie, id_team) SELECT p.base_hp, p.base_defense, p.base_attack, 0, 3, team.id_team FROM pokemon as p, partie as pa, team, joueur WHERE pa.id_partie = 3 AND joueur.id_joueur=pa.id_joueur1 AND team.id_joueur=joueur.id_joueur AND p.id_pokemon=team.id_pokemon AND team.courant = 1;
             sql.query('INSERT INTO etatPoke (active, id_partie, id_team) SELECT 0, ?, team.id_team FROM pokemon as p, partie as pa, team, joueur WHERE pa.id_partie = ? AND (joueur.id_joueur=pa.id_joueur1 OR joueur.id_joueur=pa.id_joueur2) AND team.id_joueur=joueur.id_joueur AND p.id_pokemon=team.id_pokemon AND team.courant = 1;', [id_partie, id_partie], function(err, result) {
-                if (err) { 
+                if (err) {
                     console.log("error: ", err);
                     sql.rollback(function() {
                         throw err;
                     });
                     result(err, null);
                     return;
-                } 
+                }
                 sql.query('INSERT INTO etatStats (id_etat, stat_id, stat_value, effort) SELECT ep.id_etat ,s.stat_id, s.base_stat, s.effort FROM etatPoke as ep, team as t, pokemon as p, stats as s WHERE ep.id_partie = ? AND ep.id_team=t.id_team AND t.id_pokemon=p.id_pokemon AND s.pokemon_id=p.id_pokemon;', [id_partie], function(err, result) {
-                    if (err) { 
+                    if (err) {
                         console.log("error: ", err);
                         sql.rollback(function() {
                             throw err;
@@ -73,9 +73,9 @@ Partie.accept = (id_partie, result) => {
                         result(err, null);
                         return;
                     }
-                
+
                     sql.query('INSERT INTO etatMove (id_etat, id_move, pp) SELECT ep.id_etat, mp.id_move, m.pp FROM etatPoke as ep, movePoss as mp, move as m, team, partie WHERE partie.id_partie = ? AND ep.id_partie = partie.id_partie AND ep.id_team=team.id_team AND mp.id_team=team.id_team AND mp.id_move=m.id_move;', [id_partie], function(err, result) {
-                        if (err) { 
+                        if (err) {
                             console.log("error: ", err);
                             sql.rollback(function() {
                                 throw err;
@@ -84,21 +84,21 @@ Partie.accept = (id_partie, result) => {
                             return;
                         }
                         sql.commit(function(err) {
-                        if (err) { 
-                            console.log("error: ", err);
-                            sql.rollback(function() {
-                                throw err;
-                            });
-                            result(err, null);
-                            return;
-                        }
-                        console.log('Transaction Complete !!!!');
-                        //sql.end();
+                            if (err) {
+                                console.log("error: ", err);
+                                sql.rollback(function() {
+                                    throw err;
+                                });
+                                result(err, null);
+                                return;
+                            }
+                            console.log('Transaction Complete !!!!');
+                            //sql.end();
                         });
                     });
                 });
             });
-            result(null, {res: true, id: res.insertId});
+            result(null, { res: true, id: res.insertId });
         });
     });
     // sql.query("UPDATE partie SET nbTours=1 WHERE id_partie=?", [id_partie], (err, res) => {
@@ -111,8 +111,8 @@ Partie.accept = (id_partie, result) => {
     // });
 };
 
-Partie.getCombatTeam = (id_partie, id_joueur, result) =>{
-    sql.query("SELECT DISTINCT p.id_pokemon, p.pokeName, ep.active, typePoke.id_type, typePoke.nomType as typeNom, gs.id, gs.identifier as statName, es.stat_value, es.effort, m.id_move, m.identifier, m.power, m.accuracy, typeMove.id_type as m_id_type, typeMove.nomType, em.pp FROM etatPoke as ep, etatStats as es, etatMove as em, team as t, joueur as j, pokemon as p, move as m, genState as gs, type as typePoke, type as typeMove, pokemon_type as pty WHERE ep.id_partie=? AND ep.id_team=t.id_team AND t.id_joueur=? AND ep.id_etat=es.id_etat AND ep.id_etat=em.id_etat AND t.id_pokemon=p.id_pokemon AND m.id_move=em.id_move AND gs.id=es.stat_id AND p.id_pokemon=pty.pokemon_id AND pty.type_id=typePoke.id_type AND m.type_id=typeMove.id_type", [id_partie, id_joueur], (err, res) => {
+Partie.getCombatTeam = (id_partie, id_joueur, result) => {
+    sql.query("SELECT DISTINCT p.id_pokemon, p.pokeName, ep.active, typePoke.id_type, typePoke.nomType as typeNom, gs.id, gs.identifier as statName, es.stat_value, es.effort, s.stat_id as baseStat_id, gsBase.identifier as baseStatName, s.base_stat, m.id_move, m.identifier, m.power, m.accuracy, typeMove.id_type as m_id_type, typeMove.nomType, em.pp FROM etatPoke as ep, etatStats as es, etatMove as em, team as t, joueur as j, pokemon as p, move as m, genState as gs, type as typePoke, type as typeMove, pokemon_type as pty, stats as s, genState as gsBase WHERE ep.id_partie=? AND ep.id_team=t.id_team AND t.id_joueur=? AND ep.id_etat=es.id_etat AND ep.id_etat=em.id_etat AND t.id_pokemon=p.id_pokemon AND m.id_move=em.id_move AND gs.id=es.stat_id AND p.id_pokemon=pty.pokemon_id AND pty.type_id=typePoke.id_type AND m.type_id=typeMove.id_type AND p.id_pokemon=s.pokemon_id AND gsBase.id=s.stat_id ORDER BY p.id_pokemon", [id_partie, id_joueur], (err, res) => {
         if (err) {
             console.log("error: ", err);
             result(err, null);
@@ -120,9 +120,7 @@ Partie.getCombatTeam = (id_partie, id_joueur, result) =>{
         }
 
         if (res.length) {
-            console.log("found EVERYTHING: ", res);
             var filteredData = JSONmanip.filterJSONCombat(res);
-            console.log(filteredData);
             result(null, filteredData);
             return;
         }

frontend/src/app/battle/battle.component.css

-
-  
-  .main-container{
+.main-container {
     display: flex;
     flex-direction: column;
     height: 100vh;
-  }
+}
 
-  .game {
+.game {
     position: relative;
     background-image: url('http://bit.ly/pokemonbg');
     background-size: 100% 100%;
@@ -16,71 +14,71 @@
     height: 70%;
     display: flex;
     flex-direction: column;
-  }
-  
-  .opponent {
+}
+
+.opponent {
     position: relative;
     height: 50%;
     display: flex;
     align-items: center;
     justify-content: space-evenly;
-  }
-  
-  .opponent .stats {
+}
+
+.opponent .stats {
     display: flex;
     flex-direction: column;
     width: 40%;
-  }
+}
 
-  .opponent .stats .row1{
+.opponent .stats .row1 {
     display: flex;
     justify-content: space-between;
-  }
-
+}
 
-  .health-box {
+.health-box {
     background-color: #ccc;
-    position: relative;;
+    position: relative;
+    ;
     height: 1.5rem;
     width: 90%;
     margin: 0 auto;
     border: solid 1px #aaa;
-  }
-  
-  .health-bar {
+}
+
+.health-bar {
     transition: width .5s ease;
     background-color: #007f00;
     position: absolute;
     height: 100%;
     width: 100%;
-  }
-  
-  .health-bar-red {
+}
+
+.health-bar-red {
     transition: width 2s ease;
     position: absolute;
     height: 100%;
     width: 100%;
     background-color: #cc0000;
-  }
-  
-  .health-bar-blue {
+}
+
+.health-bar-blue {
     transition: width .5s ease;
     position: absolute;
     height: 100%;
     width: 100%;
     background-color: #3bd3df;
-  }
-  
-  .health-bar-text {
+}
+
+.health-bar-text {
     position: relative;
     bottom: 80px;
-  }
-  
-  .opponent .pokemon {
-      width: 20%;
-  }
-  
-  .box {
+}
+
+.opponent .pokemon {
+    width: 20%;
+}
+
+.box {
     padding: 2%;
     background: #333;
     border: 3px solid black;
@@ -89,22 +87,24 @@
     color: #fff;
     height: 30%;
     /*width: 784px;*/
-  }
-  
-  .box .message {
+}
+
+.box .message {
     position: relative;
     float: left;
     font-size: 24px;
     width: 50%;
-  }
-  .box .continue {
+}
+
+.box .continue {
     position: absolute;
     margin-top: 30px;
     float: left;
     width: 25%;
     height: 100%;
-  }
-  .box .continue  button {
+}
+
+.box .continue button {
     position: relative;
     float: left;
     background: #666;
@@ -117,25 +117,26 @@
     margin: 4px;
     padding: 16px;
     outline: none !important;
-  }
-  .box .continue button:hover {
+}
+
+.box .continue button:hover {
     background: #777;
     border-color: #999;
-  }
-  
-  .box .continue button:active {
+}
+
+.box .continue button:active {
     background: #555;
     border-color: #666;
-  }
-  
-  .box .actions {
+}
+
+.box .actions {
     position: relative;
     float: left;
     width: 50%;
     height: 100%;
-  }
-  
-  .box .actions button {
+}
+
+.box .actions button {
     position: relative;
     float: left;
     background: #666;
@@ -150,53 +151,62 @@
     width: calc(50% - 8px);
     height: calc(50% - 8px);
     outline: none !important;
-  }
-  
-  .box .actions button:hover {
+}
+
+.box .actions button:hover {
     background: #777;
     border-color: #999;
-  }
-  
-  .box .actions button:active {
+}
+
+.box .actions button:active {
     background: #555;
     border-color: #666;
-  }
-  .stats {
+}
+
+.stats {
     background: #111;
     border: 2px solid black;
     border-radius: 8px;
     color: white;
     padding: 12px;
-  }
-  
-  .stats .pokeballs {
+}
+
+.stats .pokeballs {
     position: relative;
     display: inline-block;
     vertical-align: middle;
-  }
-  
-  .stats .pokeballs .pokeball {
+}
+
+.stats .pokeballs .pokeball {
     position: relative;
     float: left;
-    background-image: url('http://bit.ly/pokeballimg');
     background-size: 100% 100%;
     width: 25px;
     height: 25px;
-  }
-  
-  .stats .hp-count:before {
+}
+
+.pokeballKo {
+    background-image: url('http://bit.ly/pokeballimg');
+    -webkit-filter: grayscale(100%);
+    filter: grayscale(100%);
+}
+
+.pokeballAlive {
+    background-image: url('http://bit.ly/pokeballimg');
+}
+
+.stats .hp-count:before {
     content: 'HP: '
-  }
-  
-  .stats .hp-count {
+}
+
+.stats .hp-count {
     float: right;
-  }
-  
-  
-  .stats .name {
+}
+
+.stats .name {
     font-weight: bold;
-  }
-  
-  .stats .level:before {
+}
+
+.stats .level:before {
     content: "LVL"
-  }
\ No newline at end of file
+}
\ No newline at end of file

frontend/src/app/battle/battle.component.html

@@ -30,44 +30,37 @@
             <img class="pokemon" src="https://projectpokemon.org/images/normal-sprite/charizard.gif" alt="A sprite of charizard" />
         </div>
         <div class="opponent">
-            <img class="pokemon" src="https://projectpokemon.org/images/sprites-models/normal-back/blastoise.gif" alt="A sprite of charizard" />
+            <img class="pokemon" src="https://projectpokemon.org/images/sprites-models/normal-back/{{curPoke.pokeName}}.gif" onerror="" alt="A sprite of {{curPoke.pokeName}}" />
             <div class="stats">
                 <div class="row1">
                     <div>
                         <span class="name">
-                            Blastoise
+                            {{curPoke.pokeName}}
                         </span>
                         <span class="level">
-                            86
+                            50
                         </span>
                     </div>
-                    <div id="apHP" class="hp-count">{{curHealthSelf}}</div>
+                    <div id="apHP" class="hp-count">{{affichageHp}}</div>
                 </div>
                 <div class="health-box">
-                    <div class="health-bar-red" [style.width.%]="curHealthSelf"></div>
-                    <div class="health-bar" [style.width.%]="curHealthSelf"></div>
+                    <div class="health-bar-red" [style.width.%]="affichageHp"></div>
+                    <div class="health-bar" [style.width.%]="affichageHp"></div>
                     <div class="health-bar-text"></div>
                 </div>
                 <div class="top">
                     <div class="pokeballs">
-                        <div class="pokeball"></div>
-                        <div class="pokeball"></div>
-                        <div class="pokeball"></div>
-                        <div class="pokeball"></div>
-                        <div class="pokeball"></div>
+                        <div [ngClass]="poke.stats[0].stat_value>0 ? 'pokeball pokeballAlive' : 'pokeball pokeballKo'" *ngFor="let poke of selfTeam"></div>
                     </div>
                 </div>
             </div>
         </div>
         <div class="box">
             <div id="message" class="message">
-                What should Blastoise do?
+                What should {{curPoke.pokeName}} do?
             </div>
             <div class="actions">
-                <button (click)="toggle()">Water Cannon</button>
-                <button (click)="typeAdv()">Water Pulse</button>
-                <button onclick="surf()">Surf</button>
-                <button onclick="tackle()">Tackle</button>
+                <button (click)="typeAdv(move.m_id_type)" *ngFor="let move of curPoke.moves">{{move.identifier}}</button>
             </div>
             <div class="continue">
             </div>

frontend/src/app/battle/battle.component.ts

@@ -10,37 +10,46 @@ import { ActivatedRoute } from '@angular/router';
 })
 export class BattleComponent implements OnInit {
   isOpen = true;
-  maxHealth = 100;
-  curHealthSelf = 100;
+  maxHealth: number;
+  curHealthSelf: number;
   curHealthOpp = 100;
   pseudo: string;
   uid: any;
   log: boolean;
   level = 50;
   Power = 60;
-  atk = 100;
-  def = 97;
-  typeMoi = 11;
+  atk: number;
+  def: number;
+  typeMoi: number;
+  typeMove: number;
   typeToi = 10;
   effet: any;
   private sub: any;
   private id_partie: number;
-  selfTeam: any;
-  curPoke: any;