Fixed overloading avatars

syabana2 · Jan 30, 2021 · 4e05b1b · 4e05b1b
1 parent 7cf3c97
commit 4e05b1b
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 44 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,7 +1,7 @@
 import React from 'react';
 import Layout from './HUD/Layout/Layout';
 import api, { port, isDev } from './api/api';
-import { getAvatarURL } from './api/avatars';
+import { loadAvatarURL } from './api/avatars';
 import ActionManager, { ConfigManager } from './api/actionManager';
 
 import CSGOGSI, { CSGO, PlayerExtension } from "csgogsi-socket";
@@ -26,7 +26,7 @@ class App extends React.Component<any, { match: Match | null, game: CSGO | null,
 	verifyPlayers = async (game: CSGO) => {
 		const steamids = game.players.map(player => player.steamid);
 		steamids.forEach(steamid => {
-			getAvatarURL(steamid);
+			loadAvatarURL(steamid);
 		})
 
 		if (steamids.every(steamid => this.state.steamids.includes(steamid))) {

diff --git a/src/HUD/PlayerOverview/PlayerOverview.tsx b/src/HUD/PlayerOverview/PlayerOverview.tsx
@@ -52,9 +52,10 @@ export default class PlayerOverview extends React.Component<IProps> {
         const data = this.getData();
         if(!player || !veto || !veto.rounds || !data) return null;
         let url = null;
-        const avatarData = avatars.find(avatar => avatar.steamid === player.steamid);
-        if(avatarData && (avatarData.custom || avatarData.steam)){
-            url = avatarData.custom || avatarData.steam;
+        // const avatarData = avatars.find(avatar => avatar.steamid === player.steamid);
+        const avatarData = avatars[player.steamid];
+        if(avatarData && avatarData.url){
+            url = avatarData.url;
         }
         const countryName = player.country ? getCountry(player.country) : null;
         let side = '';

diff --git a/src/HUD/Players/Avatar.tsx b/src/HUD/Players/Avatar.tsx
@@ -28,8 +28,9 @@ export default class Avatar extends React.Component<IProps, IState> {
   }
   render(){
     const { enableCams } = this.state;
-    const url = avatars.filter(avatar => avatar.steamid === this.props.steamid)[0];
-    if(!url || (!url.steam.length && !url.custom.length)){
+    //const url = avatars.filter(avatar => avatar.steamid === this.props.steamid)[0];
+    const avatarData = avatars[this.props.steamid];
+    if(!avatarData || !avatarData.url){
         return '';
     }
     const slot = this.props.slot === 0 ? 10 : this.props.slot || 1;
@@ -41,7 +42,7 @@ export default class Avatar extends React.Component<IProps, IState> {
             this.props.showCam ? <div  id="cameraFeed" style={{ display: enableCams ? 'block' : 'none'}}><iframe style={{top: `${topPosition}px`, left: `${leftPosition}px`}} src={isDev ? `http://localhost:${port}/rmtp.html` : '/rmtp.html'} title="Camera feed" /></div> : null
           }
           {
-            this.props.showSkull ? <Skull height={this.props.height} width={this.props.width} /> : <img src={(url.custom || url.steam)} height={this.props.height} width={this.props.width} alt={'Avatar'} />
+            this.props.showSkull ? <Skull height={this.props.height} width={this.props.width} /> : <img src={avatarData.url} height={this.props.height} width={this.props.width} alt={'Avatar'} />
           }
 
       </div>

diff --git a/src/api/avatars.ts b/src/api/avatars.ts
@@ -1,41 +1,24 @@
 import api from './api';
-interface AvatarObject {
-    steamid: string,
-    done: boolean,
-    loading: boolean,
-    custom: string,
-    steam: string
+interface AvatarLoader {
+    loader: Promise<string>,
+    url: string,
 }
 
-export const avatars: AvatarObject[] = [];
+export const avatars: { [key: string]: AvatarLoader } = {};
 
-export const getAvatarURL = async (steamid: string) =>{
-    const avatar = avatars.filter(avatar => avatar.steamid === steamid)[0];
-    if(avatar && (avatar.loading || avatar.done)){
-        return;
+export const loadAvatarURL = (steamid: string) => {
+    if(!steamid) return;
+    if(avatars[steamid]) return avatars[steamid].url;
+    avatars[steamid] = {
+        url: '',
+        loader: new Promise((resolve) => {
+            api.players.getAvatarURLs(steamid).then(result => {
+                avatars[steamid].url = result.custom || result.custom;
+                resolve(result.custom || result.custom);
+            }).catch(() => {
+                delete avatars[steamid];
+                resolve('');
+            });
+        })
     }
-    avatars.push({steamid, done: false, loading: true, custom: '', steam: ''})
-
-    try {
-        const response = await api.players.getAvatarURLs(steamid);
-        if(response.steam.length || response.custom.length){
-            for(let i = 0; i < avatars.length; i++) {
-                if(avatars[i].steamid === steamid){
-                    avatars[i].done = true;
-                    avatars[i].loading = false;
-                    avatars[i].steam = response.steam;
-                    avatars[i].custom = response.custom;
-                }
-            }
-        }
-    } catch {
-        for(let i = 0; i < avatars.length; i++) {
-            if(avatars[i].steamid === steamid){
-                avatars[i].done = true;
-                avatars[i].loading = false;
-            }
-        }
-    }
-
-    return;
-}
+}