From c78ad56a7f9306fe06b3abd3ab7d0a81b2ad3f36 Mon Sep 17 00:00:00 2001
From: Valentin Kaelin <kalanehd@gmail.com>
Date: Fri, 8 Nov 2019 15:39:56 +0100
Subject: [PATCH] feat: start adding global statistics about summoner's games

---
 client/src/assets/css/base.css                |   9 +
 client/src/components/Match/Match.vue         |   6 +-
 client/src/components/SVGContainer.vue        |   1 +
 .../src/components/Summoner/SummonerMates.vue |  15 +-
 .../src/components/Summoner/SummonerStats.vue | 184 ++++++++++++++++++
 client/src/data/data.js                       |  59 +++++-
 client/src/helpers/summoner.js                |   3 +-
 client/src/main.js                            |  10 +
 client/src/store/modules/summoner.js          |   1 +
 client/src/views/Summoner.vue                 |   3 +
 client/tailwind.config.js                     |   1 +
 .../Controllers/Http/SummonerController.js    |  68 +++++++
 server/app/Transformers/MatchTransformer.js   |   5 +-
 13 files changed, 345 insertions(+), 20 deletions(-)
 create mode 100644 client/src/components/Summoner/SummonerStats.vue

diff --git a/client/src/assets/css/base.css b/client/src/assets/css/base.css
index f950284..c40c309 100644
--- a/client/src/assets/css/base.css
+++ b/client/src/assets/css/base.css
@@ -45,3 +45,12 @@ button:focus {
 .text-overflow {
   text-overflow: ellipsis;
 }
+
+.heading {
+  background: linear-gradient(
+    to top,
+    rgb(34, 92, 155) 0%,
+    rgb(34, 92, 135) 100%
+  );
+  box-shadow: rgba(235, 248, 255, 0.1) 0px -1px inset;
+}
diff --git a/client/src/components/Match/Match.vue b/client/src/components/Match/Match.vue
index 4b144e7..eef0c7a 100644
--- a/client/src/components/Match/Match.vue
+++ b/client/src/components/Match/Match.vue
@@ -61,7 +61,7 @@
 
             <div
               class="h-6 flex items-end text-sm text-white font-extrabold leading-none"
-            >{{ data.gamemode }}</div>
+            >{{ data.gamemode.name }}</div>
           </div>
         </div>
 
@@ -100,7 +100,7 @@
             <div class="flex items-center">
               <img src="@/assets/img/icons/KillParticipation.svg" alt="KillParticipation" />
               <div class="ml-1 kp text-sm font-bold">
-                {{ data.stats.kp }}
+                {{ data.stats.kp|percent }}
                 <!-- <span class="font-normal">kp</span> -->
               </div>
             </div>
@@ -139,7 +139,7 @@
           </div>
           <div class="ml-auto flex flex-col items-center justify-center">
             <img class="w-5 h-5" src="@/assets/img/icons/Stopwatch.svg" alt="Stopwatch" />
-            <div class="text-lg text-teal-400 font-medium">{{ data.time }}</div>
+            <div class="text-lg text-teal-400 font-medium">{{ data.time|secToTime }}</div>
             <div class="text-xs text-white font-medium">{{ data.date }}</div>
           </div>
         </div>
diff --git a/client/src/components/SVGContainer.vue b/client/src/components/SVGContainer.vue
index b5b0bdb..8193ebc 100644
--- a/client/src/components/SVGContainer.vue
+++ b/client/src/components/SVGContainer.vue
@@ -1,5 +1,6 @@
 <template>
   <svg xmlns="http://www.w3.org/2000/svg" class="hidden">
+    <symbol id="info" class="stroke-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></symbol>
     <symbol id="award" class="fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path fill="currentColor" d="M97.12 362.63c-8.69-8.69-4.16-6.24-25.12-11.85-9.51-2.55-17.87-7.45-25.43-13.32L1.2 448.7c-4.39 10.77 3.81 22.47 15.43 22.03l52.69-2.01L105.56 507c8 8.44 22.04 5.81 26.43-4.96l52.05-127.62c-10.84 6.04-22.87 9.58-35.31 9.58-19.5 0-37.82-7.59-51.61-21.37zM382.8 448.7l-45.37-111.24c-7.56 5.88-15.92 10.77-25.43 13.32-21.07 5.64-16.45 3.18-25.12 11.85-13.79 13.78-32.12 21.37-51.62 21.37-12.44 0-24.47-3.55-35.31-9.58L252 502.04c4.39 10.77 18.44 13.4 26.43 4.96l36.25-38.28 52.69 2.01c11.62.44 19.82-11.27 15.43-22.03zM263 340c15.28-15.55 17.03-14.21 38.79-20.14 13.89-3.79 24.75-14.84 28.47-28.98 7.48-28.4 5.54-24.97 25.95-45.75 10.17-10.35 14.14-25.44 10.42-39.58-7.47-28.38-7.48-24.42 0-52.83 3.72-14.14-.25-29.23-10.42-39.58-20.41-20.78-18.47-17.36-25.95-45.75-3.72-14.14-14.58-25.19-28.47-28.98-27.88-7.61-24.52-5.62-44.95-26.41-10.17-10.35-25-14.4-38.89-10.61-27.87 7.6-23.98 7.61-51.9 0-13.89-3.79-28.72.25-38.89 10.61-20.41 20.78-17.05 18.8-44.94 26.41-13.89 3.79-24.75 14.84-28.47 28.98-7.47 28.39-5.54 24.97-25.95 45.75-10.17 10.35-14.15 25.44-10.42 39.58 7.47 28.36 7.48 24.4 0 52.82-3.72 14.14.25 29.23 10.42 39.59 20.41 20.78 18.47 17.35 25.95 45.75 3.72 14.14 14.58 25.19 28.47 28.98C104.6 325.96 106.27 325 121 340c13.23 13.47 33.84 15.88 49.74 5.82a39.676 39.676 0 0 1 42.53 0c15.89 10.06 36.5 7.65 49.73-5.82zM97.66 175.96c0-53.03 42.24-96.02 94.34-96.02s94.34 42.99 94.34 96.02-42.24 96.02-94.34 96.02-94.34-42.99-94.34-96.02z"></path></symbol>
     <symbol id="gold" class="fill-current" viewBox="0 0 15 15" fill="fill-current"><title>gold</title><path d="M14 5.63324C14 3.57057 11.7157 1.8999 8.89286 1.8999C6.07 1.8999 3.78571 3.57057 3.78571 5.63324C3.7765 5.76685 3.7765 5.90095 3.78571 6.03457C2.12357 6.65057 1 7.90124 1 9.36657C1 11.4292 3.28429 13.0999 6.10714 13.0999C8.93 13.0999 11.2143 11.4292 11.2143 9.36657C11.2235 9.23295 11.2235 9.09885 11.2143 8.96524C12.8486 8.34924 14 7.08924 14 5.63324ZM6.10714 11.3172C4.315 11.3172 2.85714 10.2999 2.85714 8.94657C2.90787 8.55215 3.06303 8.17865 3.3064 7.86507C3.54978 7.55149 3.87244 7.30934 4.24071 7.1639C4.77538 7.8881 5.47991 8.46817 6.29158 8.85247C7.10324 9.23677 7.99686 9.41338 8.89286 9.36657H9.30143C9.03214 10.4679 7.71357 11.3172 6.10714 11.3172Z" /></symbol>
     <symbol id="rank-silver" viewBox="0 0 32 32"><title>rank-silver</title><path fill="#80989d" d="M16 6.667c0 0 0.986 1.479 2.534 3.165-0.781-0.321-1.637-0.498-2.534-0.498s-1.753 0.177-2.534 0.498c1.548-1.686 2.534-3.165 2.534-3.165z"></path><path fill="#80989d" d="M22.667 16c0-2.22-1.085-4.186-2.753-5.398 1.976-0.343 6.753-1.935 6.753-1.935 0 1.761-1.034 6.626-4.013 7.761 0.009-0.141 0.013-0.284 0.013-0.428z"></path><path fill="#80989d" d="M19.308 21.789c1.752-1.003 3.005-2.78 3.295-4.864 1.185 0.187 2.73 0.408 2.73 0.408s-1.135 3.406-6.025 4.456z"></path><path fill="#80989d" d="M16 22.667c0.617 0 1.215-0.084 1.782-0.241-0.406 0.781-1.282 2.407-1.782 2.907-0.5-0.5-1.376-2.127-1.782-2.907 0.567 0.157 1.165 0.241 1.782 0.241z"></path><path fill="#80989d" d="M9.392 16.89c0.28 2.1 1.537 3.89 3.3 4.899-4.89-1.050-6.025-4.456-6.025-4.456s1.554-0.25 2.726-0.444z"></path><path fill="#80989d" d="M9.333 16c0 0.129 0.004 0.258 0.011 0.386-2.977-1.324-4.011-6.91-4.011-7.719 0 0 4.777 1.592 6.753 1.935-1.669 1.212-2.753 3.178-2.753 5.398z"></path><path fill="#80989d" d="M20 16c0 2.209-1.791 4-4 4s-4-1.791-4-4c0-2.209 1.791-4 4-4s4 1.791 4 4z"></path></symbol>
diff --git a/client/src/components/Summoner/SummonerMates.vue b/client/src/components/Summoner/SummonerMates.vue
index a856c86..1f28b27 100644
--- a/client/src/components/Summoner/SummonerMates.vue
+++ b/client/src/components/Summoner/SummonerMates.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-blue-800 rounded-lg">
+  <div class="mt-4 bg-blue-800 rounded-lg">
     <div class="pb-2">
       <div class="flex items-center justify-center py-4 heading rounded-t-lg text-blue-200">
         <svg
@@ -37,7 +37,7 @@
         </svg>
       </div>
       <div v-if="hasMates" class="px-4 py-2 text-sm text-left">
-        <div class="flex font-bold text-base text-teal-400">
+        <div class="flex font-bold text-base text-blue-400">
           <div class="w-2/4">Summoner</div>
           <div class="w-1/4">W / L</div>
           <div class="w-1/4">Winrate</div>
@@ -123,14 +123,3 @@ export default {
   }
 }
 </script>
-
-<style scoped>
-.heading {
-  background: linear-gradient(
-    to top,
-    rgb(34, 92, 155) 0%,
-    rgb(34, 92, 135) 100%
-  );
-  box-shadow: rgba(235, 248, 255, 0.1) 0px -1px inset;
-}
-</style>
diff --git a/client/src/components/Summoner/SummonerStats.vue b/client/src/components/Summoner/SummonerStats.vue
new file mode 100644
index 0000000..ed2d2a4
--- /dev/null
+++ b/client/src/components/Summoner/SummonerStats.vue
@@ -0,0 +1,184 @@
+<template>
+  <div class="bg-blue-800 rounded-lg">
+    <div class="pb-2">
+      <div class="relative flex justify-center py-4 heading rounded-t-lg text-blue-200">
+        <svg
+          class="w-6 h-6"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        >
+          <line x1="18" y1="20" x2="18" y2="10" />
+          <line x1="12" y1="20" x2="12" y2="4" />
+          <line x1="6" y1="20" x2="6" y2="14" />
+        </svg>
+        <span class="mx-4 text-lg font-bold uppercase">STATS</span>
+        <svg
+          class="w-6 h-6"
+          style="transform: scaleX(-1);"
+          xmlns="http://www.w3.org/2000/svg"
+          viewBox="0 0 24 24"
+          fill="none"
+          stroke="currentColor"
+          stroke-width="2"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+        >
+          <line x1="18" y1="20" x2="18" y2="10" />
+          <line x1="12" y1="20" x2="12" y2="4" />
+          <line x1="6" y1="20" x2="6" y2="14" />
+        </svg>
+        <div class="absolute right-0 top-0 mt-3 mr-2">
+          <Dropdown>
+            <template v-slot:trigger>
+              <svg class="w-4 h-4 cursor-pointer">
+                <use xlink:href="#info" />
+              </svg>
+            </template>
+            <template v-slot:default>
+              <div class="px-2 text-white text-center text-sm select-none">
+                <div>Stats based on</div>
+                <div>
+                  <span class="text-teal-400 font-bold">{{ globalStats.count }}</span> matches
+                </div>
+                <div class="mt-2 leading-tight text-xs text-blue-100 font-normal italic">
+                  Load more matches
+                  <br />and refresh the page
+                  <br />to have better results.
+                </div>
+              </div>
+            </template>
+          </Dropdown>
+        </div>
+      </div>
+      <div class="py-2 text-sm text-center">
+        <div class="px-4 flex items-baseline font-bold text-sm text-blue-300 uppercase">
+          <div class="w-1/4 text-left text-base text-blue-400">Stat</div>
+          <div class="w-1/4">Total</div>
+          <div class="w-1/4">Per min</div>
+          <div class="w-1/4">Avg</div>
+        </div>
+        <ul class="mt-1 text-gray-100">
+          <li
+            v-for="(stat, name, index) in globalStatsKeys"
+            :key="index"
+            :class="{'bg-blue-760': index % 2 !== 0}"
+            class="flex justify-between items-center px-4 py-1 leading-tight"
+          >
+            <div class="w-1/4 text-left">{{ name }}</div>
+            <div class="w-1/4">{{ stat }}</div>
+            <div class="w-1/4">{{ (stat / (globalStats.time / 60)).toFixed(2) }}</div>
+            <div class="w-1/4">{{ (stat / globalStats.count).toFixed(2) }}</div>
+          </li>
+          <li class="flex justify-between items-center px-4 py-1 bg-blue-760 leading-tight">
+            <div class="w-1/4 text-left whitespace-no-wrap">kill participation</div>
+            <div class="w-1/4">{{ globalStats.kp|percent }}</div>
+          </li>
+        </ul>
+        <template v-if="leagueStatsByType('Ranked').length">
+          <div class="mt-3 px-4 flex items-baseline font-bold text-sm text-blue-300 uppercase">
+            <div class="w-2/4 text-left text-base text-blue-400">Ranked Stats</div>
+            <div class="w-1/4">Winrate</div>
+            <div class="w-1/4">Record</div>
+          </div>
+          <ul class="mt-1 text-gray-100">
+            <li
+              v-for="(league, index) in leagueStatsByType('Ranked')"
+              :key="index"
+              :class="{'bg-blue-760': index % 2 !== 0}"
+              class="flex justify-between items-center px-4 py-1 leading-tight"
+            >
+              <div class="w-2/4 text-left">{{ `${league.type} ${league.name.toLowerCase()}` }}</div>
+              <div
+                :class="calculateWinrate(league.wins, league.count).color"
+                class="w-1/4"
+              >{{ calculateWinrate(league.wins, league.count).winrate|percent }}</div>
+              <div class="w-1/4">
+                <span class="text-green-400 font-bold">{{ league.wins }}</span>
+                <span class="mx-1 text-gray-400 font-bold">-</span>
+                <span class="text-gray-200 font-bold">{{ league.losses }}</span>
+              </div>
+            </li>
+          </ul>
+        </template>
+        <template v-if="leagueStatsByType('Normal').length">
+          <div class="mt-3 px-4 flex items-baseline font-bold text-sm text-blue-300 uppercase">
+            <div class="w-2/4 text-left text-base text-blue-400">Normal Stats</div>
+            <div class="w-1/4">Winrate</div>
+            <div class="w-1/4">Record</div>
+          </div>
+          <ul class="mt-1 text-gray-100">
+            <li
+              v-for="(league, index) in leagueStatsByType('Normal')"
+              :key="index"
+              :class="{'bg-blue-750': index % 2 !== 0}"
+              class="flex justify-between items-center px-4 py-1 leading-tight"
+            >
+              <div class="w-2/4 text-left">{{ `${league.type} ${league.name.toLowerCase()}` }}</div>
+              <div
+                :class="calculateWinrate(league.wins, league.count).color"
+                class="w-1/4"
+              >{{ calculateWinrate(league.wins, league.count).winrate|percent }}</div>
+              <div class="w-1/4">
+                <span class="text-green-400 font-bold">{{ league.wins }}</span>
+                <span class="mx-1 text-gray-400 font-bold">-</span>
+                <span class="text-gray-200 font-bold">{{ league.losses }}</span>
+              </div>
+            </li>
+          </ul>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import Dropdown from '@/components/Dropdown.vue'
+import { gameModes } from '@/data/data.js'
+
+export default {
+  components: {
+    Dropdown,
+  },
+
+  computed: {
+    globalStats() {
+      return this.stats.find(s => s._id === null)
+    },
+    globalStatsKeys() {
+      // eslint-disable-next-line no-unused-vars
+      const { _id, wins, losses, count, time, kp, ...rest } = this.globalStats
+      return rest
+    },
+    leagueStats() {
+      return this.stats.filter(s => s._id !== null)
+    },
+    ...mapState({
+      stats: state => state.summoner.infos.stats
+    }),
+  },
+
+  methods: {
+    calculateWinrate(wins, count) {
+      const winrate = wins / count * 100
+      const color = winrate >= 50 ? 'text-green-400' : 'text-red-400'
+      return {
+        winrate,
+        color
+      }
+    },
+    leagueStatsByType(typeName) {
+      return this.leagueStats
+        .map(l => {
+          return { ...l, ...gameModes[l._id] }
+        })
+        .filter(l => l.type === typeName)
+    }
+  }
+}
+</script>
diff --git a/client/src/data/data.js b/client/src/data/data.js
index 61ecedf..b15c96a 100644
--- a/client/src/data/data.js
+++ b/client/src/data/data.js
@@ -1,3 +1,60 @@
 export const maps = { 10: 'The Twisted Treeline', 11: "Summoner's Rift", 12: 'Howling Abyss' }
 
-export const gameModes = { 900: 'Ultra Rapide Fire', 450: 'ARAM', 400: 'DRAFT 5vs5', 420: 'Solo/Duo', 430: 'BLIND 5v5', 440: 'FLEX 5vs5', 460: 'BLIND 3vs3', 470: 'FLEX 3vs3', 800: '3v3 Co-op vs. AI (Intermediate)', 810: '3v3 Co-op vs. AI (Intro)', 820: '3v3 Co-op vs. AI (Beginner)', 830: 'Co-op vs. AI (Intro)', 840: 'Co-op vs. AI (Beginner)', 850: 'Co-op vs. AI (Intermediate)' }
+export const gameModes = {
+  900: {
+    type: 'Normal',
+    name: 'URF',
+  },
+  450: {
+    type: 'Normal',
+    name: 'ARAM',
+  },
+  400: {
+    type: 'Normal',
+    name: 'DRAFT 5vs5',
+  },
+  420: {
+    type: 'Ranked',
+    name: 'Solo/Duo',
+  },
+  430: {
+    type: 'Normal',
+    name: 'BLIND 5v5',
+  },
+  440: {
+    type: 'Ranked',
+    name: 'FLEX 5vs5',
+  },
+  460: {
+    type: 'Normal',
+    name: 'BLIND 3vs3',
+  },
+  470: {
+    type: 'Ranked',
+    name: 'FLEX 3vs3',
+  },
+  800: {
+    type: 'Bot',
+    name: '3v3 Co-op vs. AI (Intermediate)',
+  },
+  810: {
+    type: 'Bot',
+    name: '3v3 Co-op vs. AI (Intro)',
+  },
+  820: {
+    type: 'Bot',
+    name: '3v3 Co-op vs. AI (Beginner)',
+  },
+  830: {
+    type: 'Bot',
+    name: 'Co-op vs. AI (Intro)',
+  },
+  840: {
+    type: 'Bot',
+    name: 'Co-op vs. AI (Beginner)',
+  },
+  850: {
+    type: 'Bot',
+    name: 'Co-op vs. AI (Intermediate)',
+  }
+}
diff --git a/client/src/helpers/summoner.js b/client/src/helpers/summoner.js
index 1b9687d..19cdb09 100644
--- a/client/src/helpers/summoner.js
+++ b/client/src/helpers/summoner.js
@@ -100,7 +100,8 @@ export function createSummonerData(RiotData) {
     matchList: RiotData.allMatches,
     matches: createMatchData(RiotData.matchesDetails),
     mates: createMatesData(RiotData.mates),
-    playing: RiotData.playing
+    playing: RiotData.playing,
+    stats: RiotData.stats,
   }
 }
 
diff --git a/client/src/main.js b/client/src/main.js
index c2fc828..53b6892 100644
--- a/client/src/main.js
+++ b/client/src/main.js
@@ -10,6 +10,16 @@ import store from './store'
 Vue.config.productionTip = false
 Vue.use(VueAxios)
 
+Vue.filter('secToTime', (sec) => {
+  const min = Math.floor(sec / 60)
+  const newSec = sec - min * 60
+  return min + 'm' + (newSec < 10 ? '0' + newSec : newSec) + 's'
+})
+
+Vue.filter('percent', (value) => {
+  return `${+value.toFixed(2)}%`
+})
+
 new Vue({
   router,
   store,
diff --git a/client/src/store/modules/summoner.js b/client/src/store/modules/summoner.js
index 9e4b25f..8860aa9 100644
--- a/client/src/store/modules/summoner.js
+++ b/client/src/store/modules/summoner.js
@@ -41,6 +41,7 @@ export const mutations = {
     state.infos.matchIndex = infos.matches.length
     state.infos.mates = infos.mates
     state.infos.playing = infos.playing
+    state.infos.stats = infos.stats
     state.status = 'found'
   },
   SUMMONER_NOT_FOUND(state) {
diff --git a/client/src/views/Summoner.vue b/client/src/views/Summoner.vue
index e9dfa71..5fec7e6 100644
--- a/client/src/views/Summoner.vue
+++ b/client/src/views/Summoner.vue
@@ -62,6 +62,7 @@
 
           <div class="mt-12 text-center flex">
             <div class="mt-4 w-3/12">
+              <SummonerStats />
               <SummonerMates />
             </div>
             <ul class="w-9/12 text-gray-900">
@@ -111,6 +112,7 @@ import SearchForm from '@/components/SearchForm.vue'
 import SummonerLoader from '@/components/Summoner/SummonerLoader.vue'
 import SummonerMates from '@/components/Summoner/SummonerMates.vue'
 import SummonerRanked from '@/components/Summoner/SummonerRanked.vue'
+import SummonerStats from '@/components/Summoner/SummonerStats.vue'
 
 export default {
   components: {
@@ -123,6 +125,7 @@ export default {
     SummonerLoader,
     SummonerMates,
     SummonerRanked,
+    SummonerStats,
   },
 
   computed: {
diff --git a/client/tailwind.config.js b/client/tailwind.config.js
index 1b7cecc..dd53b0c 100644
--- a/client/tailwind.config.js
+++ b/client/tailwind.config.js
@@ -90,6 +90,7 @@ module.exports = {
         500: '#4299e1',
         600: '#3182ce',
         700: '#2b6cb0',
+        760: '#2C5C94',
         800: '#2c5282',
         900: '#2a4365',
         1000: '#17314f'
diff --git a/server/app/Controllers/Http/SummonerController.js b/server/app/Controllers/Http/SummonerController.js
index c942d2e..b08ffab 100644
--- a/server/app/Controllers/Http/SummonerController.js
+++ b/server/app/Controllers/Http/SummonerController.js
@@ -3,6 +3,7 @@
 const Jax = use('Jax')
 const MatchHelper = use('App/Helpers/MatchHelper')
 const Summoner = use('App/Models/Summoner')
+const Match = use('App/Models/Match')
 
 class SummonerController {
   /**
@@ -62,6 +63,73 @@ class SummonerController {
       // PATCH VERSION
       finalJSON.version = Jax.DDragon.Version
 
+      // STATS
+      console.time('STATS')
+      const gamemodeStats = await Match.query().aggregate([
+        {
+          $match: {
+            summoner_puuid: account.puuid
+          }
+        },
+        {
+          $group: {
+            _id: "$gamemode",
+            count: { $sum: 1 },
+            wins: {
+              $sum: {
+                $cond: [
+                  { $eq: ["$result", "Win"] }, 1, 0
+                ]
+              }
+            },
+            losses: {
+              $sum: {
+                $cond: [
+                  { $eq: ["$result", "Fail"] }, 1, 0
+                ]
+              }
+            }
+          }
+        }
+      ])
+
+      const globalStats = await Match.query().aggregate([
+        {
+          $match: {
+            summoner_puuid: account.puuid
+          }
+        },
+        {
+          $group: {
+            _id: null,
+            count: { $sum: 1 },
+            time: { $sum: "$time" },
+            wins: {
+              $sum: {
+                $cond: [
+                  { $eq: ["$result", "Win"] }, 1, 0
+                ]
+              }
+            },
+            losses: {
+              $sum: {
+                $cond: [
+                  { $eq: ["$result", "Fail"] }, 1, 0
+                ]
+              }
+            },
+            kills: { $sum: "$stats.kills" },
+            deaths: { $sum: "$stats.deaths" },
+            assists: { $sum: "$stats.assists" },
+            minions: { $sum: "$stats.minions" },
+            vision: { $sum: "$stats.vision" },
+            kp: { $avg: "$stats.kp" },
+          }
+        }
+      ])
+      finalJSON.stats = [...globalStats, ...gamemodeStats]
+      console.timeEnd('STATS')
+
       // SAVE IN DB
       await summonerDB.save()
     } catch (error) {
diff --git a/server/app/Transformers/MatchTransformer.js b/server/app/Transformers/MatchTransformer.js
index 6c63b4f..65cfb96 100644
--- a/server/app/Transformers/MatchTransformer.js
+++ b/server/app/Transformers/MatchTransformer.js
@@ -13,7 +13,8 @@ class MatchTransformer {
     const map = this.match.mapId
     const gamemode = this.match.queueId
     const date = this.match.gameCreation
-    const time = this.MatchHelper.secToTime(this.match.gameDuration)
+    // const time = this.MatchHelper.secToTime(this.match.gameDuration)
+    const time = this.match.gameDuration
 
     return {
       map,
@@ -76,7 +77,7 @@ class MatchTransformer {
         return prev + current.stats.kills
       }, 0)
 
-      stats.kp = totalKills === 0 ? '0%' : +((stats.kills + stats.assists) * 100 / totalKills).toFixed(1) + '%'
+      stats.kp = totalKills === 0 ? 0 : +((stats.kills + stats.assists) * 100 / totalKills).toFixed(1)
     }