Real-Time Sports Scores w/ TeamTracker and TeamTracker-Card (Beta)

Apologies for my lack of specificity. I’m using the team tracker card and looking for a more compact version of the team tracker card when the game is in progress. A compact version that is the same size as pre or post would be great!

I would think everything should scale. Like putting it into a custom:layout-card with 4 columns or maybe even 5

Thanks for the thought, unfortunately the current “in game” card has too much data to scale into a “compact” form, see example below:

My preference is to have a “minimal in game” card based on the current “in game” card that cuts off everything after the inning. this would give me the minimum info on the event. same idea for basketball and football.

I tried to add a Pull Request but got denied as i’m not a contributor.

That is not displaying anything that you could not make in a separate card/set of cards. All the data is in the teamtracker sensor.

Like I use declutter and card_mod for color changes when in the red zone. Also have light scenes and TTS announcements on game start and TDs.

Totally understand I could do it myself. Putting the idea out there in case others could find value in the idea.

I do like it. Given that I built the other part without a “installed” sensor (Sports Standings and Scores) I could build out something.

Maybe something like this?

image

Not sure Hits, Errors are available as they are not in the regular card, score certainly, team certainly, logo certainly, inning yes.

Here is everything that should be available (no game in process yet):

attribution: Data provided by ESPN
sport: baseball
league: MLB
league_logo: https://a.espncdn.com/i/teamlogos/leagues/500/mlb.png
team_abbr: DET
opponent_abbr: KC
event_name: KC @ DET
date: 2023-09-28T19:30Z
kickoff_in: in 2 hours
venue: Comerica Park
location: Detroit, Michigan
tv_network: null
odds: DET -110
overunder: 7.5
team_name: Tigers
team_id: 6
team_record: 74-83
team_rank: null
team_homeaway: home
team_logo: https://a.espncdn.com/i/teamlogos/mlb/500/scoreboard/det.png
team_colors: #002d5c, #ff6600
team_score: 0
team_win_probability: null
team_winner: null
team_timeouts: null
opponent_name: Royals
opponent_id: 7
opponent_record: 54-103
opponent_rank: null
opponent_homeaway: away
opponent_logo: https://a.espncdn.com/i/teamlogos/mlb/500/scoreboard/kc.png
opponent_colors: #004687, #7ab2dd
opponent_score: 0
opponent_win_probability: null
opponent_winner: null
opponent_timeouts: null
quarter: 1
clock: 9/28 - 3:30 PM EDT
possession: null
last_play: null
down_distance_text: null
outs: null
balls: null
strikes: null
on_first: null
on_second: null
on_third: null
team_shots_on_target: null
team_total_shots: null
opponent_shots_on_target: null
opponent_total_shots: null
team_sets_won: null
opponent_sets_won: null
last_update: 2023-09-28 09:49:13-07:00
api_message: Cached data
icon: mdi:baseball
friendly_name: Detroit Tigers

Or what about just some simple card_mod on the existing card?

type: custom:teamtracker-card
entity: sensor.detroit_tigers
card_mod:
  style:
    .logo 
      {max-width:30px!important;}
    .card
      {width:60%}
    .name
      {font-size:1.2em;height:1em;}
    .gameday
      {font-size:1em;height:1em;}
    .gamedate
      {font-size:1em;height:1em;}
    .gametime
      {font-size:1em;height:1em;}
    .pre-row1, .pre-row2, .pre-row3 
      {font-size:1em;height:1em;}

With and without image (needs edit on card widths but you get the idea)

Or this … hide components you do not want …

type: custom:teamtracker-card
entity: sensor.detroit_tigers
card_mod:
  style: >-
    .logo {max-width:30px!important;} .card {width:60%} .name
    {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;} .gamedate
    {font-size:1em;height:1em;} .gametime {font-size:1em;height:1em;} .pre-row1,
    .pre-row2, .pre-row3 {font-size:1em;height:1em;} .score {font-size:1.5em;}
    .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2,
    .last-play, .bar-wrapper {display:none;}

Pulling everything together in a panel/grid:

views:
  - title: Panel Playground
    icon: mdi:toy-brick-marker
    type: panel
    badges: []
    cards:
      - square: true
        type: grid
        cards:
          - type: custom:teamtracker-card
            entity: sensor.detroit_tigers
            card_mod:
              style: >-
                .logo {max-width:30px!important;} .name
                {font-size:1.2em;height:1em;} .gameday
                {font-size:1em;height:1em;} .gamedate
                {font-size:1em;height:1em;} .gametime
                {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
                {font-size:1em;height:1em;} .score {font-size:1.5em;}
                .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1,
                .line2, .last-play, .bar-wrapper {display:none;}
          - type: custom:teamtracker-card
            entity: sensor.detroit_tigers
            card_mod:
              style: >-
                .logo {max-width:30px!important;} .name
                {font-size:1.2em;height:1em;} .gameday
                {font-size:1em;height:1em;} .gamedate
                {font-size:1em;height:1em;} .gametime
                {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
                {font-size:1em;height:1em;} .score {font-size:1.5em;}
                .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1,
                .line2, .last-play, .bar-wrapper {display:none;}
          - type: custom:teamtracker-card
            entity: sensor.detroit_tigers
            card_mod:
              style: >-
                .logo {max-width:30px!important;} .name
                {font-size:1.2em;height:1em;} .gameday
                {font-size:1em;height:1em;} .gamedate
                {font-size:1em;height:1em;} .gametime
                {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
                {font-size:1em;height:1em;} .score {font-size:1.5em;}
                .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1,
                .line2, .last-play, .bar-wrapper {display:none;}
          - type: custom:teamtracker-card
            entity: sensor.detroit_tigers
            card_mod:
              style: >-
                .logo {max-width:30px!important;} .name
                {font-size:1.2em;height:1em;} .gameday
                {font-size:1em;height:1em;} .gamedate
                {font-size:1em;height:1em;} .gametime
                {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
                {font-size:1em;height:1em;} .score {font-size:1.5em;}
                .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1,
                .line2, .last-play, .bar-wrapper {display:none;}
          - type: custom:teamtracker-card
            entity: sensor.detroit_tigers
            card_mod:
              style: >-
                .logo {max-width:30px!important;} .name
                {font-size:1.2em;height:1em;} .gameday
                {font-size:1em;height:1em;} .gamedate
                {font-size:1em;height:1em;} .gametime
                {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
                {font-size:1em;height:1em;} .score {font-size:1.5em;}
                .play-clock {font-size: 1.2em;} .in-row1, .in-row2, .line1,
                .line2, .last-play, .bar-wrapper {display:none;}
        columns: 5
title: Panel Playground

Mixing it up a bit with some in-game …

It could easily be shrunk more and also needs set height on cards for grid view … or better custom:layout-card so that cards snap to fit from phone/pad/computer view.

views:
  - title: Panel Playground
    icon: mdi:toy-brick-marker
    type: custom:masonry-layout
    layout:
      max_cols: 5
    badges: []
    cards:
      - type: custom:teamtracker-card
        entity: sensor.detroit_tigers
        card_mod:
          style: >-
            .logo {max-width:30px!important;} .name
            {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;}
            .gamedate {font-size:1em;height:1em;} .gametime
            {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
            {font-size:1em;height:1em;} .score {font-size:1.5em;} .play-clock
            {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2, .last-play,
            .bar-wrapper {display:none;}
      - type: custom:teamtracker-card
        entity: sensor.minnesota_twins
        card_mod:
          style: >-
            .logo {max-width:30px!important;} .name
            {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;}
            .gamedate {font-size:1em;height:1em;} .gametime
            {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
            {font-size:1em;height:1em;} .score {font-size:1.5em;} .play-clock
            {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2, .last-play,
            .bar-wrapper {display:none;}
      - type: custom:teamtracker-card
        entity: sensor.detroit_tigers
        card_mod:
          style: >-
            .logo {max-width:30px!important;} .name
            {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;}
            .gamedate {font-size:1em;height:1em;} .gametime
            {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
            {font-size:1em;height:1em;} .score {font-size:1.5em;} .play-clock
            {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2, .last-play,
            .bar-wrapper {display:none;}
      - type: custom:teamtracker-card
        entity: sensor.chicago_white_sox
        card_mod:
          style: >-
            .logo {max-width:30px!important;} .name
            {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;}
            .gamedate {font-size:1em;height:1em;} .gametime
            {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
            {font-size:1em;height:1em;} .score {font-size:1.5em;} .play-clock
            {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2, .last-play,
            .bar-wrapper {display:none;}
      - type: custom:teamtracker-card
        entity: sensor.detroit_tigers
        card_mod:
          style: >-
            .logo {max-width:30px!important;} .name
            {font-size:1.2em;height:1em;} .gameday {font-size:1em;height:1em;}
            .gamedate {font-size:1em;height:1em;} .gametime
            {font-size:1em;height:1em;} .pre-row1, .pre-row2, .pre-row3
            {font-size:1em;height:1em;} .score {font-size:1.5em;} .play-clock
            {font-size: 1.2em;} .in-row1, .in-row2, .line1, .line2, .last-play,
            .bar-wrapper {display:none;}
title: Panel Playground

Gives you this on computer:

This on phone:

This on iPad:

That is as far as I will go but you have all the blocks here to make what you want just using card-mod.
I will admit that this helped me a bit as I always wanted to scale down the card for my wallpanel displays

3 Likes

I tweaked the card a while ago specifically to increase it’s compatibility with card-mod. You should be able to mod whatever component or card-level setting you want.

If you can’t, let me know and I’ll make the changes to allow it. I decided it’s a lot easier to increase compatibility w/ card-mod than to add a ton of options trying to anticipate what someone might want.

3 Likes

Hello,

I am just getting started on Home Assistant and I am having problems setting up this card. I downloaded the card from HACs but I don’t have a sensor.team_tracker in my entities. I am only seeing update.team_tracker_card_update.

When I go to set up this card it says this entity is missing. Is there something that I did wrong?

Have you installed the Card and the Integration from HACS (and then setup the Integration to track a team)? It’s the Integration that provides the sensor, the card then displays it…

Best have a good read through this to get you up and running properly…

kann mir einer helfen die deutsche 2 bundesliga rein zu bekommen ? danke schonmal ist ein echt top gemacht

- platform: teamtracker
  league_id: XXX
  team_id: KIE
  sport_path: soccer
  league_path: ger.2
  name: holstein-kiel

Hi,

I’ve been using a much older version of the ha-teamtracker-card. I made tweaks to the card to fit it on my dashboard, so I haven’t updated from HACS in a long time. I noticed the newest version of the card is much different with different with multiple files for in, pre, post, etc. Where mine only has ha-teamtracker-card.js

Recently my card stopped working and can’t figure out why. The newest version does work. I assume something broke the old version with an update. Does anyone have any advice to get the earliest version of this component with one js file working again?

Thanks :slight_smile:

Not 100% sure what you need, but the Releases page on GitHub should have older versions

in welche datei kommt der code ?
ist es eigendlich möglich das die partien automatisch neu erstellt werden nach einem spiel tag ?
habe eine tabbele drin die stimmt aber nicht das torverhältnis passt nicht und die punkte auch nicht

First of all thank you @vasqued2 and all others involved for this great project! Easy to integrate and to setup well documented.

One tiny thing that bothers me is that in case your team hasn’t any matches in the upcoming days and therefore tracker state is NOT_FOUND, the espn leaves the state attributes more or less null and the lovelace card just shows some minimal information and the (in my case ungly) league logo.

Of course there are several ways to keep the card from showing in this case (i.e. conditional card), but on my sports panel i wanted them to also show the information that there isn’t any game soon.

Anyway since the card only displays the espn ID and the league logo (at least for soccer) i decided to change the state attributes when the team_tracker state is NOT_FOUND.

I use python script Home Assistant Entities Script to change the attributes for league_logo to team logo and team_abbr to Team Name by automation each time the integration updates the tracker.

Just in case someone has a similar request maybe this information helps to achieve your goal.

automation:

- id: set_logo_tracker_vfl
  alias: Tracker Logo VFL to VFL
  mode: single
  trigger:
    - platform: state
      entity_id:
        - sensor.team_tracker_vfl
      attribute: last_update
  condition:
    - condition: state
      entity_id: sensor.team_tracker_vfl
      state: NOT_FOUND  
  action:
    - service: python_script.hass_entities
      data:
        action: set_state_attributes
        entity_id: sensor.team_tracker_vfl
        state: NOT_FOUND
        attributes:
          - league_logo: https://a.espncdn.com/combiner/i?img=/i/teamlogos/soccer/500/7013.png
          - team_name: VFL
          - team_abbr: VFL

Result:

3 Likes

Into your configuration.yaml but also possible in the integartion panel.

Thanks for the response.

When I download the earliest version from HACS (v0.62), I restart home assistant, clear cache, open and close browser. The teamtracker card does not load after.

If I use the newest version it works fine.

No problem if I can’t use the earlier version, I’ll find a work around :slight_smile:

Am getting out of my depth here but would guess it’s an issue with your Resources settings for your Dashboards. In HA go to Settings > Dashboards then overflow/“three dots menu” and Resources and you’ll see what you’ve added already.

Probably the newest/latest card’s “resource” is in there as you’ve had this installed so the older version you’ve loaded doesn’t register…
Open to someone wiser than me inputting but think what you need to do is either…remove the existing resource entry, refresh and then re add it and refresh again (see Manual Install Instructions for card) OR edit the existing resource entry changing the reference after the ‘?’ so HA recognises a new/changed card…

Good suggestion @Gav_in

I’ve tried removing and then manually adding the resource in a different location other than HACS folder.

I’ve tried changing the HACS resource with “?v=2” appended at the end.

Unfortunately no luck and the same result as before :frowning:

It’s weird that days before the older version of the card was working and stopped working without me even touching home assistant.