show if new maps not parsed & new map icon for unparsed matches

src/utils/DateTime.js

@@ -52,3 +52,9 @@ export const FormatVacDate = (date, match) => {
     return ''
   }
 }
+
+export const MatchNotParsedTime = (match) => {
+  const matchDate = DateTime.fromSeconds(match || 0)
+
+  return matchDate.diffNow().as('hours') >= -2;
+}

src/utils/index.js

@@ -1,4 +1,4 @@
-import {FormatDate, FormatDuration, FormatFullDate, FormatFullDuration, FormatVacDate} from "./DateTime";
+import {FormatDate, FormatDuration, FormatFullDate, FormatFullDuration, FormatVacDate, MatchNotParsedTime} from "./DateTime";
 import {GoToLink, GoToMatch, GoToPlayer} from "./GoTo";
 import {SaveLastVisitedToLocalStorage} from "./LocalStorage";
 import {GetHLTV_1} from "./HLTV";
@@ -19,6 +19,7 @@ import {
 } from "./Utils";
 
 export {
+  MatchNotParsedTime,
   FormatDate,
   FormatFullDuration,
   FormatFullDate,

src/views/Player.vue

@@ -146,10 +146,14 @@
               <td class="td-map text-center">
                 <i v-if="match.parsed" class="far fa-chart-bar parsed" style="cursor: help"
                    title="Demo has been parsed for additional data"></i>
-                <img :alt="match.map ? match.map : 'Map not found'"
+                <i v-if="!match.parsed && MatchNotParsedTime(match.date)" class="fas fa-hourglass-half not-yet-parsed" style="cursor: help"
+                   title="Match has not been parsed yet"></i>
+                <img v-if="match.map"
+                     :alt="match.map ? match.map : 'Map not found'"
                      :src="match.map !== '' ? require('../assets/images/map_icons/map_icon_' + match.map + '.svg') : require('../assets/images/map_icons/map_icon_lobby_mapveto.svg')"
                      :title="match.map"
                      class="map-icon">
+                <i v-else title="Match not parsed" class="far fa-question-circle map-not-found"></i>
               </td>
               <td class="td-rank text-center">
                 <img
@@ -328,6 +332,7 @@ import {
   setTitle,
   sortObjectValue,
   TrackMe,
+  MatchNotParsedTime
 } from "../utils";
 import {FOOTER_HEIGHT, NAV_HEIGHT} from "@/constants";
 
@@ -391,8 +396,15 @@ export default {
         id: store.state.playerDetails.vanity_url || ''
       })
 
-      if (store.state.playerDetails.matches)
+      if (store.state.playerDetails.matches) {
-        await LoadImage(data.matches[0].map ? data.matches[0].map : 'random')
+        if (data.matches[0].map) {
+          await LoadImage(data.matches[0].map)
+        } else if (!data.matches[0].map && MatchNotParsedTime(data.matches[0].date) && data.matches[1].map) {
+          await LoadImage(data.matches[1].map)
+        } else {
+          await LoadImage('random')
+        }
+      }
 
       let player = {
         'steamid64': store.state.playerDetails.steamid64,
@@ -555,6 +567,7 @@ export default {
       FormatVacDate,
       FixMapName,
       GoToPlayer,
+      MatchNotParsedTime,
       setMoreMatches,
       setDmgGraphWidth
     }
@@ -855,6 +868,22 @@ table {
         font-size: 1.7rem;
       }
 
+      .not-yet-parsed {
+        position: absolute;
+        left: 10px;
+        bottom: 25px;
+        color: darkgrey;
+        font-size: 1.7rem;
+      }
+
+      .map-not-found {
+        position: absolute;
+        top: 13px;
+        left: 53px;
+        font-size: 3.2rem;
+        color: var(--bs-warning);
+      }
+
       img {
         width: 60px;
         height: auto;
@@ -1044,6 +1073,11 @@ table {
       left: .3rem !important;
     }
 
+    .not-yet-parsed {
+      position: absolute;
+      left: .3rem !important;
+    }
+
     img {
       width: 40px !important;
       height: auto;