Flag and team (#20)

* Option to show flag and team in driver standings
marcokreeft87 · Nov 1, 2022 · f7e0ec2 · f7e0ec2
1 parent 6ec8427
commit f7e0ec2
Show file tree

Hide file tree

Showing 9 changed files with 84 additions and 34 deletions.
diff --git a/README.md b/README.md
@@ -40,8 +40,9 @@ or added by clicking the "Add to lovelace" button on the HACS dashboard after in
 | date_locale       | string        |                                     | Override the locale used for the date and time formatting   |
 | image_clickable   | boolean       | `false`                             | Click on image leads to wikipedia, or not   |
 | show_carnumber    | boolean       | `false`                             | Show the number of the car   |
-| location_clickable    | boolean       | `false`                             | Click on the location leads to wikipedia   |
-| previous_race    | enum       |                           |   Hide/strikethrough or make the past races italic options are (hide, strikethrough or italic) |
+| location_clickable| boolean       | `false`                             | Click on the location leads to wikipedia   |
+| previous_race     | enum          |                           |   Hide/strikethrough or make the past races italic options are (hide, strikethrough or italic) |
+| standings         | object        |                                     | Configuration for the driver standings card     |
 
 ```
 type: custom:formulaone-card
@@ -72,6 +73,19 @@ title: Driver Standings
 ```
 ![image](https://user-images.githubusercontent.com/10223677/194120796-28532a9d-a62d-44bb-8cb8-403bfa434a8b.png)
 
+This card can also show the flags and team names of the driver:
+
+```
+type: custom:formulaone-card
+card_type: driver_standings
+sensor: sensor.formula_one_sensor_drivers
+title: Driver Standings
+standings:
+  show_flag: true
+  show_team: true
+  
+```
+
 ```
 type: custom:formulaone-card
 card_type: schedule

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.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "formulaone-card",
-  "version": "0.1.2",
+  "version": "0.1.3",
   "description": "Frontend card for hass-formulaoneapi",
   "main": "index.js",
   "scripts": {

diff --git a/src/cards/driver-standings.ts b/src/cards/driver-standings.ts
@@ -1,21 +1,31 @@
 import { HomeAssistant } from "custom-card-helpers";
 import { html, HTMLTemplateResult } from "lit-html";
 import { DriverStanding, FormulaOneCardConfig } from "../types/formulaone-card-types";
-import { getDriverName } from "../utils";
+import { getCountryFlagUrl, getDriverName } from "../utils";
 import { BaseCard } from "./base-card";
+import * as countries from '../data/countries.json';
 
 export default class DriverStandings extends BaseCard {
 
     constructor(sensor: string, hass: HomeAssistant, config: FormulaOneCardConfig) {
         super(sensor, hass, config);
     }    
 
+    getCountryFlag = (nationality: string) => {
+        console.log(nationality, countries.filter(x => x.Nationality === nationality).length);
+        const country = countries.filter(x => x.Nationality === nationality)[0].Country;
+        const countryDashed = country.replace(" ","-");
+
+        return getCountryFlagUrl(countryDashed);
+    }
+
     renderStandingRow(standing: DriverStanding): HTMLTemplateResult {
         return html`
             <tr>
-                <td class="width-50 text-center">${standing.position}</td>
-                <td>${standing.Driver.code}</td>
+                <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>${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>
                 <td class="text-center">${standing.wins}</td>
             </tr>`;
@@ -33,7 +43,8 @@ export default class DriverStandings extends BaseCard {
             <thead>
             <tr>
                 <th class="width-50" colspan="2">&nbsp;</th>
-                <th>Driver</th>
+                <th>Driver</th>                
+                ${(this.config.standings?.show_team ? html`<th>Team</th>` : '')}
                 <th class="width-60 text-center">Pts</th>
                 <th class="text-center">Wins</th>
             </tr>

diff --git a/src/data/countries.json b/src/data/countries.json
@@ -0,0 +1 @@
+[{"Code":"AD","Country":"Andorra","ISO":"53","Nationality":"Andorian"},{"Code":"AE","Country":"United Arab Emirates","ISO":"126","Nationality":"Emirian"},{"Code":"AF","Country":"Afghanistan","ISO":"133","Nationality":"Afghani"},{"Code":"AI","Country":"Anguilla","ISO":"55","Nationality":"Anguillan"},{"Code":"AM","Country":"Armenia","ISO":"58","Nationality":"Armenian"},{"Code":"AO","Country":"Angola","ISO":"54","Nationality":"Angolian"},{"Code":"AQ","Country":"Antarctica","ISO":"55","Nationality":"Antarctic"},{"Code":"AR","Country":"Argentina","ISO":"57","Nationality":"Argentine"},{"Code":"AS","Country":"Austria","ISO":"3","Nationality":"Austrian"},{"Code":"AU","Country":"Australia","ISO":"2","Nationality":"Australian"},{"Code":"AW","Country":"Aruba","ISO":"59","Nationality":"Arubian"},{"Code":"BA","Country":"Bangladesh","ISO":"45","Nationality":"Bangladeshi"},{"Code":"BB","Country":"Barbados","ISO":"63","Nationality":"Barbadian"},{"Code":"BE","Country":"Belgium","ISO":"4","Nationality":"Belgian"},{"Code":"BH","Country":"Bahrain","ISO":"62","Nationality":"Bahrainian"},{"Code":"BM","Country":"Bermuda","ISO":"67","Nationality":"Bermuda"},{"Code":"BO","Country":"Bolivia","ISO":"69","Nationality":"Bolivian"},{"Code":"BR","Country":"Brazil","ISO":"43","Nationality":"Brazilian"},{"Code":"BS","Country":"Bahamas","ISO":"61","Nationality":"Bahameese"},{"Code":"BT","Country":"Bhutan","ISO":"68","Nationality":"Bhutanese"},{"Code":"BU","Country":"Bulgaria","ISO":"44","Nationality":"Bulgarian"},{"Code":"BY","Country":"Belarus","ISO":"64","Nationality":"Belarusian"},{"Code":"BZ","Country":"Belize","ISO":"65","Nationality":"Belizean"},{"Code":"CA","Country":"Canada","ISO":"6","Nationality":"Canadian"},{"Code":"CG","Country":"Congo","ISO":"72","Nationality":"Congolese"},{"Code":"CH","Country":"China","ISO":"51","Nationality":"Chinese"},{"Code":"CH","Country":"Switzerland","ISO":"35","Nationality":"Swiss"},{"Code":"CL","Country":"Chile","ISO":"71","Nationality":"Chilean"},{"Code":"CM","Country":"Cambodia","ISO":"5","Nationality":"Cambodian"},{"Code":"CM","Country":"Cameroon","ISO":"70","Nationality":"Cameroonian"},{"Code":"CO","Country":"Columbia","ISO":"46","Nationality":"Columbian"},{"Code":"CR","Country":"Czech Republic","ISO":"50","Nationality":"Czech"},{"Code":"CR","Country":"Costa Rica","ISO":"73","Nationality":"Costa Rican"},{"Code":"CU","Country":"Cuba","ISO":"75","Nationality":"Cuban"},{"Code":"CY","Country":"Cyprus","ISO":"76","Nationality":"Cypriot"},{"Code":"DE","Country":"Germany","ISO":"10","Nationality":"German"},{"Code":"DK","Country":"Denmark","ISO":"7","Nationality":"Danish"},{"Code":"DM","Country":"Dominica","ISO":"77","Nationality":"Dominican"},{"Code":"EC","Country":"Ecuador","ISO":"78","Nationality":"Ecuadorean"},{"Code":"EE","Country":"Estonia","ISO":"79","Nationality":"Estonian"},{"Code":"EG","Country":"Egypt","ISO":"8","Nationality":"Egyptian"},{"Code":"ET","Country":"Ethiopia","ISO":"80","Nationality":"Ethiopian"},{"Code":"FI","Country":"Finland","ISO":"82","Nationality":"Finnish"},{"Code":"FJ","Country":"Fiji","ISO":"81","Nationality":"Fijian"},{"Code":"FR","Country":"France","ISO":"9","Nationality":"French"},{"Code":"GB","Country":"United Kingdom","ISO":"39","Nationality":"British"},{"Code":"GE","Country":"Georgia","ISO":"83","Nationality":"Georgian"},{"Code":"GH","Country":"Ghana","ISO":"84","Nationality":"Ghanaian"},{"Code":"GN","Country":"Guinea","ISO":"86","Nationality":"Guinean"},{"Code":"GR","Country":"Greece","ISO":"11","Nationality":"Greek"},{"Code":"GY","Country":"Guyana","ISO":"87","Nationality":"Guyanese"},{"Code":"HK","Country":"Hong Kong","ISO":"13","Nationality":"Chinese"},{"Code":"HR","Country":"Croatia","ISO":"74","Nationality":"Croatian"},{"Code":"HU","Country":"Hungary","ISO":"14","Nationality":"Hungarian"},{"Code":"ID","Country":"Indonesia","ISO":"16","Nationality":"Indonesian"},{"Code":"IE","Country":"Ireland","ISO":"90","Nationality":"Irish"},{"Code":"IN","Country":"India","ISO":"15","Nationality":"Indian"},{"Code":"IQ","Country":"Iraq","ISO":"89","Nationality":"Iraqi"},{"Code":"IR","Country":"Iran","ISO":"17","Nationality":"Iranian"},{"Code":"IS","Country":"Israel","ISO":"18","Nationality":"Israeli"},{"Code":"IS","Country":"Iceland","ISO":"88","Nationality":"Icelander"},{"Code":"IT","Country":"Italy","ISO":"19","Nationality":"Italian"},{"Code":"JM","Country":"Jamaica","ISO":"91","Nationality":"Jamaican"},{"Code":"JO","Country":"Jordan","ISO":"92","Nationality":"Jordanian"},{"Code":"JP","Country":"Japan","ISO":"20","Nationality":"Japanese"},{"Code":"KE","Country":"Kenya","ISO":"94","Nationality":"Kenyan"},{"Code":"KO","Country":"Korea","ISO":"21","Nationality":"Korean"},{"Code":"KW","Country":"Kuwait","ISO":"95","Nationality":"Kuwaiti"},{"Code":"KZ","Country":"Kazakhstan","ISO":"134","Nationality":"Kazakhstani"},{"Code":"KZ","Country":"Kazakhstan","ISO":"93","Nationality":"Kazakhstani"},{"Code":"LB","Country":"Lebanon","ISO":"96","Nationality":"Lebanese"},{"Code":"LK","Country":"Sri Lanka","ISO":"33","Nationality":"Sri Lankan"},{"Code":"LT","Country":"Lithuania","ISO":"97","Nationality":"Lithuanian"},{"Code":"LU","Country":"Luxembourg","ISO":"98","Nationality":"Luxembourger"},{"Code":"MA","Country":"Morocco","ISO":"104","Nationality":"Moroccan"},{"Code":"MC","Country":"Monaco","ISO":"102","Nationality":"Monegasque"},{"Code":"ME","Country":"Mexico","ISO":"47","Nationality":"Mexican"},{"Code":"MM","Country":"Myanmar","ISO":"105","Nationality":"Mayanmarese"},{"Code":"MN","Country":"Mongolia","ISO":"103","Nationality":"Mongolian"},{"Code":"MO","Country":"Macau","ISO":"42","Nationality":"Macau"},{"Code":"MU","Country":"Mauritius","ISO":"100","Nationality":"Mauritian"},{"Code":"MV","Country":"Maldives","ISO":"99","Nationality":"Maldivan"},{"Code":"MY","Country":"Malaysia","ISO":"22","Nationality":"Malaysian"},{"Code":"NA","Country":"Namibia","ISO":"106","Nationality":"Namibian"},{"Code":"NG","Country":"Nigeria","ISO":"108","Nationality":"Nigerian"},{"Code":"NL","Country":"Netherlands","ISO":"12","Nationality":"Dutch"},{"Code":"NO","Country":"Norway","ISO":"24","Nationality":"Norwegian"},{"Code":"NP","Country":"Nepal","ISO":"107","Nationality":"Nepalese"},{"Code":"NZ","Country":"New Zealand","ISO":"23","Nationality":"New Zealander"},{"Code":"OM","Country":"Oman","ISO":"109","Nationality":"Omani"},{"Code":"PA","Country":"Panama","ISO":"110","Nationality":"Panamanian"},{"Code":"PE","Country":"Peru","ISO":"112","Nationality":"Peruvian"},{"Code":"PH","Country":"Philippines","ISO":"27","Nationality":"Filipino"},{"Code":"PK","Country":"Pakistan","ISO":"26","Nationality":"Pakistani"},{"Code":"PO","Country":"Poland","ISO":"28","Nationality":"Polish"},{"Code":"PT","Country":"Portugal","ISO":"113","Nationality":"Portugees"},{"Code":"PY","Country":"Paraguay","ISO":"111","Nationality":"Paraguayan"},{"Code":"QA","Country":"Qatar","ISO":"115","Nationality":"Qatari"},{"Code":"RO","Country":"Romania","ISO":"48","Nationality":"Romanian"},{"Code":"RU","Country":"Russia","ISO":"29","Nationality":"Russian"},{"Code":"SA","Country":"Saudi Arabia","ISO":"116","Nationality":"Saudi Arabian"},{"Code":"SC","Country":"Seychelles","ISO":"119","Nationality":"Seychellois"},{"Code":"SE","Country":"Sweden","ISO":"34","Nationality":"Swedish"},{"Code":"SG","Country":"Singapore","ISO":"30","Nationality":"Singaporean"},{"Code":"SK","Country":"Slovakia","ISO":"120","Nationality":"Slovakian"},{"Code":"SN","Country":"Senegal","ISO":"117","Nationality":"Senegalese"},{"Code":"SO","Country":"Somalia","ISO":"121","Nationality":"Somali"},{"Code":"SP","Country":"Spain","ISO":"32","Nationality":"Spanish"},{"Code":"TH","Country":"Thailand","ISO":"37","Nationality":"Thai"},{"Code":"TN","Country":"Tunisia","ISO":"123","Nationality":"Tunisian"},{"Code":"TR","Country":"Turkey","ISO":"38","Nationality":"Turkish"},{"Code":"TW","Country":"Taiwan","ISO":"36","Nationality":"Taiwanese"},{"Code":"TZ","Country":"Tanzania","ISO":"122","Nationality":"Tanzanian"},{"Code":"UA","Country":"Ukraine","ISO":"125","Nationality":"Ukrainian"},{"Code":"UG","Country":"Uganda","ISO":"124","Nationality":"Ugandan"},{"Code":"US","Country":"United States of America","ISO":"40","Nationality":"American"},{"Code":"UY","Country":"Uruguay","ISO":"127","Nationality":"Uruguayan"},{"Code":"UZ","Country":"Uzbekistan","ISO":"128","Nationality":"Uzbekistani"},{"Code":"VE","Country":"Venezuela","ISO":"49","Nationality":"Venezuelan"},{"Code":"VN","Country":"Vietnam","ISO":"1","Nationality":"Vietnamese"},{"Code":"YE","Country":"Yemen","ISO":"130","Nationality":"Yemeni"},{"Code":"ZA","Country":"South Africa","ISO":"31","Nationality":"South African"},{"Code":"ZM","Country":"Zambia","ISO":"131","Nationality":"Zambian"},{"Code":"ZW","Country":"Zimbabwe","ISO":"132","Nationality":"Zimbabwean"}]
diff --git a/src/styles.ts b/src/styles.ts
@@ -24,7 +24,7 @@ export const style = css`
         text-align: center;
     }
     .width-40 {
-        width: 50px;
+        width: 40px;
     }
     .width-50 {
         width: 50px;

diff --git a/src/types/formulaone-card-types.ts b/src/types/formulaone-card-types.ts
@@ -12,6 +12,12 @@ export interface FormulaOneCardConfig extends LovelaceCardConfig {
     show_carnumber?: boolean;
     location_clickable?: boolean;
     previous_race?: PreviousRaceDisplay;
+    standings?: StandingDisplayOptions;
+}
+
+export interface StandingDisplayOptions {
+    show_team?: boolean;
+    show_flag?: boolean;
 }
 
 export enum PreviousRaceDisplay {