added parsed check to scoreboard, added team color vars + team-colors in damage-chart

scss/custom.scss

@@ -3,10 +3,6 @@
 
 // Default variable overrides
 $font-family-base: 'Roboto';
-//$primary: #292c34;
-//$secondary: #23262d;
-//$body-bg: #2e3139;
-//$blue: #4a90e2;
 $body-color: white;
 
 $primary: #888f98;
@@ -27,4 +23,13 @@ $success: #609926;
 
 // Bootstrap
 @import "../node_modules/bootstrap/scss/bootstrap";
-@import "../node_modules/@fortawesome/fontawesome-free/css/all.css";
+@import "../node_modules/@fortawesome/fontawesome-free/css/all.css";
+
+:root {
+  // CSGO COLORS
+  --csgo-Orange: #FE9A28;
+  --csgo-Blue: #5BA7FE;
+  --csgo-Yellow: #F7F52F;
+  --csgo-Purple: #A01BEF;
+  --csgo-Green: #04B462;
+}

src/components/DamageChart.vue

@@ -46,11 +46,21 @@ export default {
       let arr = []
       if (team === 1) {
         for (let i = 0; i < 5; i++) {
-          arr.push(truncate(stats[i].player.name, 10))
+          arr.push({
+            value: truncate(stats[i].player.name, 10),
+            textStyle: {
+              color: 'white'
+            }
+          })
         }
       } else {
         for (let i = 5; i < stats.length; i++) {
-          arr.push(truncate(stats[i].player.name, 10))
+          arr.push({
+            value: truncate(stats[i].player.name, 10),
+            textStyle: {
+              color: 'white'
+            }
+          })
         }
       }
       arr.reverse()
@@ -76,11 +86,21 @@ export default {
       let arr = []
       if (team === 1) {
         for (let i = 0; i < 5; i++) {
-          arr.push(checkStatEmpty(stats[i].extended.dmg.enemy))
+          arr.push({
+            value: checkStatEmpty(stats[i].extended.dmg.enemy),
+            itemStyle: {
+              color: getComputedStyle(document.documentElement).getPropertyValue(`--csgo-${stats[i].extended.color}`)
+            }
+          })
         }
       } else {
         for (let i = 5; i < stats.length; i++) {
-          arr.push(checkStatEmpty(stats[i].extended.dmg.enemy))
+          arr.push({
+            value: checkStatEmpty(stats[i].extended.dmg.enemy),
+            itemStyle: {
+              color: getComputedStyle(document.documentElement).getPropertyValue(`--csgo-${stats[i].extended.color}`)
+            }
+          })
         }
       }
       arr.reverse()
@@ -139,7 +159,6 @@ export default {
             name: 'Enemy',
             type: 'bar',
             stack: 'Total',
-            color: ['orange'],
             label: {
               show: true,
               position: 'inside'

src/components/ScoreTeam.vue

@@ -13,7 +13,7 @@
         <th class="player__deaths">D</th>
         <th class="player__diff cursor__help" title="Kill death difference">+/-</th>
         <th class="player__kd">K/D</th>
-        <th class="player__adr cursor__help" title="Average damage per round">ADR</th>
+        <th class="player__adr cursor__help" title="Average damage per round" v-if="props.parsed">ADR</th>
         <th class="player__hs cursor__help" title="Percentage of kills with a headshot">HS%</th>
         <th class="player__rating cursor__help" title="Estimated HLTV Rating 1.0">Rating</th>
         <th class="player__mvp cursor__help" title="Most valuable player">MVP</th>
@@ -42,6 +42,7 @@
             :rounds_played="props.rounds_played"
             :color="player.extended?.color"
             :tracked="player.player.tracked"
+            :parsed="props.parsed"
         />
       </tr>
       </tbody>
@@ -81,6 +82,11 @@ export default {
       required: true,
       default: 0
     },
+    parsed: {
+      type: Boolean,
+      required: true,
+      default: false
+    }
   },
   setup(props) {
     return {props}

src/components/ScoreTeamPlayer.vue

@@ -28,7 +28,7 @@
   <td class="player__kd">
     {{ (props.kills > 0 && props.deaths > 0) ? (props.kills / props.deaths).toFixed(2) : (props.kills > 0 && props.deaths === 0) ? props.kills : 0.00 }}
   </td>
-  <td class="player__adr">
+  <td class="player__adr" v-if="props.parsed">
     {{ (props.dmg / props.rounds_played).toFixed(2) }}
   </td>
   <td class="player__hs">
@@ -147,6 +147,11 @@ export default {
       type: Boolean,
       required: true,
       default: false
+    },
+    parsed: {
+      type: Boolean,
+      required: true,
+      default: false
     }
   },
   setup(props) {
@@ -160,19 +165,19 @@ export default {
   outline: 3px solid;
 }
 .team-color-Orange {
-  outline-color: #FE9A28;
+  outline-color: var(--csgo-orange);
 }
 .team-color-Blue {
-  outline-color: #5BA7FE;
+  outline-color: var(--csgo-blue);
 }
 .team-color-Yellow {
-  outline-color: #F7F52F;
+  outline-color: var(--csgo-yellow);
 }
 .team-color-Purple {
-  outline-color: #A01BEF;
+  outline-color: var(--csgo-purple);
 }
 .team-color-Green {
-  outline-color: #04B462;
+  outline-color: var(--csgo-green);
 }
 .team-color-Grey {
   outline: none;

src/views/Match.vue

@@ -37,13 +37,13 @@
       <ul class="list-unstyled d-flex m-auto">
         <li class="list-item scoreboard active" @click.prevent="ActivateScoreInfo('scoreboard')">Scoreboard</li>
         <li :class="!data.matchDetails.parsed ? 'disabled' : ''" class="list-item flashes"
-            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('flashes') : null">Flashes
+            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('flashes') : null" :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''">Flashes
         </li>
         <li :class="!data.matchDetails.parsed ? 'disabled' : ''" class="list-item utility"
-            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('utility') : null">Utility
+            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('utility') : null" :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''">Utility
         </li>
         <li :class="!data.matchDetails.parsed ? 'disabled' : ''" class="list-item damage"
-            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('damage') : null">Damage
+            @click.prevent="data.matchDetails.parsed ? ActivateScoreInfo('damage') : null" :title="!data.matchDetails.parsed ? 'This demo has not been parsed' : ''">Damage
         </li>
       </ul>
     </div>
@@ -54,12 +54,12 @@
           :rounds="data.matchDetails.max_rounds ? data.matchDetails.max_rounds : data.score[data.matchDetails.match_result - 1] === 16 ? 30 : data.score[data.matchDetails.match_result - 1] === 15 ? 30 : 16"
           :rounds_played="data.score.reduce((a, b) => a + b)"
           :score="data.score[0]"
-          :stats="data.stats" :team_id="1"/>
+          :stats="data.stats" :team_id="1" :parsed="data.matchDetails.parsed" />
       <ScoreTeam
           :rounds="data.matchDetails.max_rounds ? data.matchDetails.max_rounds : data.score.reduce((a, b) => a + b) >= 16 ? 30 : 16"
           :rounds_played="data.score.reduce((a, b) => a + b)"
           :score="data.score[1]"
-          :stats="data.stats" :team_id="2"/>
+          :stats="data.stats" :team_id="2" :parsed="data.matchDetails.parsed" />
     </div>
 
     <div id="flashes">

src/views/Player.vue

@@ -198,7 +198,7 @@ import {
   FormatDuration,
   FormatFullDate,
   FormatFullDuration,
-  GetHLTV_1,
+  GetHLTV_1, GoToLink,
   GoToMatch,
   LoadImage,
   SaveLastVisitedToLocalStorage
@@ -262,7 +262,7 @@ export default {
 
             LoadImage(data.matches[0].map ? data.matches[0].map : 'random')
 
-            console.log(response.data)
+            // console.log(response.data)
 
             let player = {
               'steamid64': response.data.steamid64,
@@ -274,7 +274,10 @@ export default {
             document.title = `${response.data.name} | csgoWTF`
           })
           .catch((e) => {
-            console.log(e);
+            if (e.response.status === 404) {
+              GoToLink('/')
+            }
+            // console.log(e.response.status, e.response.statusText);
           });
     }