Changed url for the flags to CDN

marcokreeft87 · Dec 25, 2022 · d26390f · d26390f
1 parent 959266c
commit d26390f
Show file tree

Hide file tree

Showing 9 changed files with 20 additions and 21 deletions.
diff --git a/formulaone-card.js b/formulaone-card.js
diff --git a/formulaone-card.js.gz b/formulaone-card.js.gz
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "formulaone-card",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "Frontend card for hass-formulaoneapi",
   "main": "index.js",
   "scripts": {

diff --git a/src/cards/driver-standings.ts b/src/cards/driver-standings.ts
@@ -21,17 +21,16 @@ export default class DriverStandings extends BaseCard {
     }  
 
     getCountryFlag = (nationality: string) => {
-        const country = countries.filter(x => x.Nationality === nationality)[0].Country;
-        const countryDashed = country.replace(" ","-");
+        const country = countries.filter(x => x.Nationality === nationality)[0];
 
-        return getCountryFlagUrl(countryDashed);
+        return getCountryFlagUrl(country.Code);
     }
 
     renderStandingRow(standing: DriverStanding): HTMLTemplateResult {
         return html`
             <tr>
                 <td class="width-40 text-center">${standing.position}</td>
-                <td>${(this.config.standings?.show_flag ? html`<img height="10" src="${this.getCountryFlag(standing.Driver.nationality)}">&nbsp;` : '')}${standing.Driver.code}</td>
+                <td>${(this.config.standings?.show_flag ? html`<img height="10" width="20" src="${this.getCountryFlag(standing.Driver.nationality)}">&nbsp;` : '')}${standing.Driver.code}</td>
                 <td>${getDriverName(standing.Driver, this.config)}</td>
                 ${(this.config.standings?.show_team ? html`<td>${standing.Constructors[0].name}</td>` : '')}
                 <td class="width-60 text-center">${standing.points}</td>

diff --git a/src/cards/last-result.ts b/src/cards/last-result.ts
@@ -39,7 +39,7 @@ export default class LastResult extends BaseCard {
         const imageHtml = html`<img width="100%" src="https://www.formula1.com/content/dam/fom-website/2018-redesign-assets/Circuit%20maps%2016x9/${circuitName}_Circuit.png.transform/7col/image.png">`;
         const imageWithLinkHtml = this.config.image_clickable ? html`<a target="_new" href="${data.Circuit.url}">${imageHtml}</a>` : imageHtml;
 
-        return html`<h2><img height="25" src="${getCountryFlagUrl(countryDashed)}">&nbsp;  ${data.round} :  ${data.raceName}</h2>${imageWithLinkHtml}<br> `
+        return html`<h2><img height="25" src="${getCountryFlagUrl(data.Circuit.Location.country)}">&nbsp;  ${data.round} :  ${data.raceName}</h2>${imageWithLinkHtml}<br> `
     }
 
     render() : HTMLTemplateResult {

diff --git a/src/cards/next-race.ts b/src/cards/next-race.ts
@@ -35,7 +35,7 @@ export default class NextRace extends BaseCard {
         const imageHtml = html`<img width="100%" src="https://www.formula1.com/content/dam/fom-website/2018-redesign-assets/Circuit%20maps%2016x9/${circuitName}_Circuit.png.transform/7col/image.png">`;
         const imageWithLinkHtml = this.config.image_clickable ? html`<a target="_new" href="${this.next_race.Circuit.url}">${imageHtml}</a>` : imageHtml;
 
-        return html`<h2><img height="25" src="${getCountryFlagUrl(countryDashed)}">&nbsp;  ${this.next_race.round} :  ${this.next_race.raceName}</h2>${imageWithLinkHtml}<br> `
+        return html`<h2><img height="25" src="${getCountryFlagUrl(this.next_race.Circuit.Location.country)}">&nbsp;  ${this.next_race.round} :  ${this.next_race.raceName}</h2>${imageWithLinkHtml}<br> `
     }
 
     renderSeasonEnded(): HTMLTemplateResult {

diff --git a/src/data/countries.json b/src/data/countries.json
diff --git a/src/utils.ts b/src/utils.ts
@@ -24,16 +24,16 @@ export const checkConfig = (config: FormulaOneCardConfig) => {
     }
 };
 
-export const getCountryFlagUrl = (countryDashed: string) => {
-    const exceptions = [{ countryDashed: 'USA', name: 'United-States-of-America'}, { countryDashed: 'UAE', name: 'United-Arab-Emirates'}];
+export const getCountryFlagUrl = (countryCode: string) => {
+    const exceptions = [{ countryCode: 'USA', corrected: 'US'}, { countryCode: 'UAE', corrected: 'AE'}];
 
-    const exception = exceptions.filter(exception => exception.countryDashed == countryDashed);
+    const exception = exceptions.filter(exception => exception.countryCode == countryCode);
     if(exception.length > 0)
     {
-        countryDashed = exception[0].name; 
+        countryCode = exception[0].corrected; 
     }
 
-    return `https://www.countries-ofthe-world.com/flags-normal/flag-of-${countryDashed}.png`;
+    return `https://flagcdn.com/w40/${countryCode.toLowerCase()}.png`;
 }
 
 export const getCircuitName = (circuitName: string) => {