#Help with TeamTracker sport API standings

1 messages · Page 1 of 1 (latest)

coarse meteor
#

I recreated this for EPL but I dont understand API and how to do the same for the other leagues

next tundra
#

Were you able to get the Integration to work? I tried installing it to see if I could help but it is not showing up in Integrations after installing via HACS.

next tundra
#

I got it working. Did not have to do anything with the API. Just had to ensure that I installed Team Tracker along with the Team Tracker Card.
NFL sensors are probably going to return NOT_FOUND because it is not in-season.
Here's one that I made for NHL.

image.png
coarse meteor
#

Thank you for responding. I got that working and the EPL league standings working. What I’m struggling with is getting any other league standings working

next tundra
coarse meteor
#

yes and I am able to change the table with the different variables from EPL. My issue is I cannot recreate it from mlb api data. both from ESPN

#

it looks like its set up the same way but Im new to JSON and api so im struggling to figure this out

next tundra
#

The only thing I notice without actually trying to get the sensor work myself is your link has seasontype=2&while the example does not. Not sure if that makes a difference or not but the data does appear to be different when browsing between the two links in Firefox.

coarse meteor
#

I believe that is because mlb is out of season right now. However, comparing the EPL and MLB api side by side they are slightly different because MLB has “children” with the divisions, where as EPLs 20 teams all just fall under the “stats” array. Sorry if I’m using any terms incorrectly, I’ve spent a lot of time reading and learning JSON for the first time

#

I think I need to figure out how to deal with children

coarse meteor
#

I figured it out fyi. I had to add an attribute to my config file. I can share how if anyone runs into the same issue

next tundra
#

@spice wharf, @Fabs has been working with the teamtracker. He might be able to help you out.

spice wharf
#

Thank you !!

next tundra
#

I installed it too just to check it out but didn't work with it too much.

spice wharf
#

I'm trying to make 2 dashboards the tracked team score and the other the opponents score and I cannot figure it out

next tundra
#

So I looked at the entity/team that I configured and I see the entity has attributes for team_score and opponent_score.
Do you have a screenshot of what you've tried already so I can get an idea of your goal? (Or a rudimentary sketch in MS Paint?)

spice wharf
#

So i'm very new to this but this is what I tried

#

My goal is to put 2 monitors one on each side of my tv and have the scores of the single team displayed on each side

#

I could be going the complete wrong direction with this

next tundra
#

I don't think the teamtracker-card is going to do what you want. But that's okay because I don't think it would take much to be able to design your own custom card.

#

It is certainly still doable.

#

Do you have an example of what each screen should show?

spice wharf
#

ok but how would i reference the team tracker attribute

#

Each screen would be team logo and name and under that score

#

I see everything I need in the Attributes section i just dont know how to reference them

next tundra
#

So, in a super basic form, using a custom:button-card, ```yaml
type: custom:button-card
entity: sensor.team_tracker_blue_jackets
name: '[[[ return entity.attributes.team_name ]]]'
show_entity_picture: true
entity_picture: '[[[ return entity.attributes.team_logo ]]]'
show_state: true
state_display: '[[[ return "Score: " + entity.attributes.team_score ]]]'

image.png
spice wharf
#

This is absolutely perfect

#

Maybe im not smart where would ui-lovelace.yaml be ?

next tundra
#

Where are you seeing that referenced? Don't use that method. Use the HACS installation method: Link

spice wharf
#

in installing button card

#

i installed via hacs

#

nevermind i'm off today

#

Forgot to reload...

next tundra
#

You can apply Styling to everything and design it more how you want (colors, fonts, font sizes, etc.)

#

Then, you could consider Layout options (maybe have the logo take up half of the right side of the screen with the text on the right and bigger.

spice wharf
#

I cannot thank you enough for pointing me in the right direction

#

And basically writing it all out for me

next tundra
#

Like I mentioned, that code was in the simplest form. There's a lot that you can do with this card; it's just a matter of figured out how to get it done.

#

You can also add custom_fields and add more sensor data to each team's card/screen (odds, record, and so on.)

#

I don't think, however, that you would be able to make like real-time scoring or possession data (like you see on TV) because of the delay between seeing it on TV, the data going to ESPN, the integration updating, and so forth. It may not give you the results that you would want to see.

spice wharf
#

I just want almost like a scoreboard

#

I already have it set up to turn on a smart outlet for a goal light and play the goal song

#

do you run a tablet dashboard ?

next tundra
#

I have 2 Amazon Fire 10 HDs, 2 Fire 8 HDs, and a 24" ViewSonic touch-screen.

#

If the automation for the lighting works well enough for you then I imagine you can probably incorporate some of the concepts into the team cards, too.

spice wharf
#

Just a few tablets

next tundra
#

Yup.

#

team_colors: #002d62, #e31937 and opponent_colors: #dd1a32, #b79257 could be useful in designing your card...

# 
styles:
  name:
    - color: '[[[ return entity.attributes.team_colors[0] ]]]'
  state: 
    - color: '[[[ return entity.attributes.team_colors[1] ]]]'
  card:
    - background-color: white```~~I would have to play with it a bit more to figure out how to get it to slice the individual colors from the attribute properly.~~
EDIT: Updated colors to use the team_colors attribute.
image.png
spice wharf
#

i appreciate all the help so far

#

Are you using a plugin for tablet mode ?

next tundra
spice wharf
#

perfect thank you so much

next tundra
#

Figured out how to return the team colors. Updated code above.

spice wharf
#

this is awesome thank you so much

#

this is where I'm at type: custom:button-card
entity: sensor.islandersscoretracker
name: '[[[ return entity.attributes.opponent_name ]]]'
show_entity_picture: true
entity_picture: '[[[ return entity.attributes.opponent_logo ]]]'
show_state: true
state_display: '[[[ return "Score: " + entity.attributes.opponent_score ]]]'
styles:
name:
- color: '[[[ return entity.attributes.opponent_colors[0] ]]]'
- font-size: 40px
state:
- color: '[[[ return entity.attributes.opponent_colors[1] ]]]'
- font-size: 30px

next tundra
#

I am kind of at the same point. Except I'm trying to remove the Score: 0 because the game has not started and have it show In 3 minutes. 😎

#

Got it. yaml show_state: true state_display: | [[[ if (new Date().getTime() >= new Date(entity.attributes.date).getTime()) return "Score: " + entity.attributes.team_score else return entity.attributes.kickoff_in ]]]Unfortunately, the game literally just started as I was getting this to work, but I think I got it right.
EDIT: I made this way more complicated than it needs to be. The state of the entity will be PRE before the game starts. IN = during and POST = after.

spice wharf
#

Well it works.

#

Just not the way we wanted it.

next tundra
#

I'm guessing you want the sidebar and header hidden. That's what Kiosk Mode is for.

spice wharf
#

No I mean the islanders sucking.

next tundra
#

Revised to show two forms of the start time if the entity state is "PRE".```yaml

Home Card

state_display: '[[[ return (entity.state.toLowerCase() !== "pre") ? "Score: " + entity.attributes.team_score : entity.attributes.kickoff_in ]]]'

Opponent Card

state_display: '[[[ return (entity.state.toLowerCase() !== "pre") ? "Score: " + entity.attributes.opponent_score : new Date(entity.attributes.date).toLocaleTimeString([], { timeStyle: "short", hour12: true }) ]]]'

image.png
spice wharf
#

@next tundra can you point me in the direction to find in the API who scored the last goal ?

next tundra
#

I don't really know how to interact with the API. My suggestion would be to open an Issue and see if maybe that could be something that could be added or maybe someone on GH would be able to point you in a better direction which would be specific to that API.

spice wharf
#

Thanks for all your help

next tundra
#

@regal crown Tagging you in this thread. Some stuff that we were working with to make our own TeamTracker cards.

regal crown
regal crown
#

Here is an initial scoreboard I made today from the sensors in TeamTracker, Stack-in-Card and custom:button-card. It needs work on formatting and having scores appear based on when games are scheduled. For example, I would like the Texas - Colorado State game to appear only on game day, but I haven't figured that out yet. Suggestions appreciated. Working well so far.

image.png
regal crown
#

Here is the same scoreboard with the TeamTracker cards. I like this better, but I would like it to be more compact, especially vertically. Maybe smaller or no icons. I've got to work on it. The idea is to have a compact scoreboard with all my teams where the team only appears on gameday. This would make it appropriate for the main or home page. Suggestions welcome.

image.png
next tundra
regal crown
#

I don't do this often. How do I get it so it properly formats when shared. Just cut and paste didn't seem to work.

next tundra
#

I was trying to get the bot to share links of where to post but I cannot remember how to trigger it.
https://dpaste.org/ (select YAML for the language, and consider picking a longer expiry)
http://pastie.org/ (select YAML for the language)
https://paste.debian.net/ (you guessed it, select YAML as the language)

lone agateBOT
#

Please use a code share site to share code or logs, for example:

Please don't use Pastebin, since it can randomly add spaces to the main view. Please also don't share text as images since it makes it harder for people to help you. Remember that others may have colour blindness, impaired vision, etc.

#

To format your text as code, enter three backticks on the first line, press Enter for a new line, paste your code, press Enter again for another new line, and lastly three more backticks.
```yaml
example: here
```
Don't forget you can edit your post rather than repeatedly posting the same thing.

regal crown
# 
type: custom:stack-in-card
title: null
mode: vertical
keep:
  background: true
  box_shadow: true
  margin: true
  outer_padding: true
  border: true
  border_radius: true
cards:
  - type: custom:teamtracker-card
    entity: sensor.astros
    name:
      - - []
    show_state: true
    state_display: >-
      [[[ return entity.attributes.team_name + "      " +
      entity.attributes.team_score + " - " + entity.attributes.opponent_name +
      "     " + entity.attributes.opponent_score ]]]
  - type: custom:teamtracker-card
    entity: sensor.dallas_cowboys
    name:
      - - []
    show_state: true
    state_display: >-
      [[[ return entity.attributes.team_name + "      " +
      entity.attributes.team_score + " - " + entity.attributes.opponent_name +
      "     " + entity.attributes.opponent_score ]]]
#

Finally. The rest of the teams are the same.

next tundra
#

I don't think we can make much modification to the actual TeamTracker card. We can, however, make the custom:button-card show what we want it to show. Part of my plan involves developing this as a "generic" card that can be easily reused. Let's start with this (starting at Line 11 of the code you posted above): ```yaml
cards:

  • type: custom:button-card
    entity: sensor.team_tracker_cowboys
    show_name: false
    show_icon: false
    show_state: true
    state_display: |
    [[[ return ${entity.attributes.team_name} - ${entity.attributes.team_score} &nbsp &nbsp ${entity.attributes.opponent_name} - ${entity.attributes.opponent_score} ]]]
#

Actually, scratch that. Let's do Phase 2 before Phase 1. We're going to use auto entities for that.

next tundra
#

This is the start of getting auto entities set up. In its current form, this should find and display all of the entities for the TeamTracker integration that do not have a NOT_FOUND state (not in season).

# 
type: custom:auto-entities
card:
  type: vertical-stack
card_param: cards
filter:
  include:
    - domain: sensor
      integration: teamtracker
      options:
        type: custom:teamtracker-card
  exclude:
    - state: 'NOT_FOUND'
else:
  type: markdown
  content: >-
    <ha-alert alert-type="info">No games found</ha-alert>
sort:
  method: name
  reverse: false
  numeric: false
show_empty: true```
next tundra
#

I was able to apply a little bit of card_mod to make the icons smaller, reduced the padding to make the card a little slimmer and removed the border (just because).
(This would go under Line 10 in the code above, inline with the t in type:.) yaml card_mod: style: | .team .logo { height: 3em; } .card { padding: 0.5em; } ha-card { border: none; }

image.png
regal crown
regal crown
#

I really like the smaller size and it may work well, but I can't get it to work for me. I saw no difference and got no errors. Do I have to install card_mod? Am I doing something wrong? (I tried aligning with both the "Type:" above and below it. Got no errors either way.):

type: custom:stack-in-card
title: null
mode: vertical
keep:
  background: true
  box_shadow: true
  margin: true
  outer_padding: true
  border: true
  border_radius: true
card_mod:
  style: |
    .team .logo {
      height: 3em;
    }
    .card {
      padding: 0.5em;
    }
    ha-card {
      border: none;
    }
cards:
  - type: custom:teamtracker-card
    entity: sensor.astros
    name:
      - - []
    show_state: true
    state_display: >-
      [[[ return entity.attributes.team_name + "      " +
      entity.attributes.team_score + " - " + entity.attributes.opponent_name +
      "     " + entity.attributes.opponent_score ]]]
next tundra
#

Sorry I left, but it was well past my bedtime.
I figured that was the case given your choice of Longhorn avatar and sports teams. (Assuming you're in the Austin/SA area.)
Do I have to install card_mod?
card_mod is a separate add-in; you can find it in HACS. (Ensure you refresh your browser and/or clear its cache.)
I tried aligning with both the "Type:" above and below it.
YAML is very particular about indentation. In your code above, the card_mod portion is being applied to the custom:stack-in-card. By moving it down and indenting the code snippet, it can be applied to the custom:teamtracker-card. (Even if your were to paste it at the very end of the code but use your current indentation, it would be applied to the stack-in-card.)

cards:
  - type: custom:teamtracker-card
    entity: sensor.astros
    //[... shortened ...]
    card_mod:
      style: |
        .team .logo {
          height: 3em;
        }
        //[... shortened ...]
regal crown
regal crown
#

@next tundra Works much better now that I have installed card_mod! 😆 I reduced the logos to 2. Looks good and uses just over 50% of the screen real estate of the original. I would like to reduce the size of the fonts of the score, clock/status ("Final - Aug 17") and below the line, but this is much better and very useable. I appreciate your time and effort. Thanks.

image.png
regal crown
#

Here is my new SEC page. I plan to put a Standings card in the blank area.

image.png
next tundra
#

Houston actually, but good deduction.
I considered adding Houston to the list but figured 2 out of 3 was good enough. I was stationed at Fort Hood. I've lived in Killeen, Copperas Cove, Temple, Austin and Elgin.
I would like to reduce the size of the fonts of the score, clock/status ("Final - Aug 17") and below the line
I inspected the card a bit more to try to make adjustments to the areas you mentioned. I found some options (but, this may lead to some problems in the future that might take a bit more tinkering to handle properly.) The sensor I am using is currently PRE so I don't have scores. But, it looks like setting font-size in .card will catch a lot of the text. To target all three lines of the bottom section, you can use .bottom-clickable. I also found .gameday, .gamedate, and .gametime. This is my current card_mod:

#

(I collapsed some of the sections to reduce the number of lines used. It serves no purposes other than asthetics. ```yaml
card_mod:
style: |
ha-card { border: none; }
.card {
padding: 0.5em;
font-size: 1.2em !important;
}
.team .logo {height: 3em; }
.bottom-clickable {
font-weight: 300;
font-size: 0.6em;
}
.team-bg { width: 45%; left: -12%; }
.opponent-bg { width: 45%; right: -12%; }
.gameday { font-size: 1.2em; }
.gamedate { font-size: 1.2em; }
.gametime { font-size: 1.2em; }

#

Looking at the code of the card, however, the Dev created different "templates" depending on the state of the sensor (PRE, POST, IN, and NOT_FOUND). This gives a bit more insight to the underlying code and styling. Looking at render_in.js, we can see the names used for the div styling. The issue is some of the modifications may not apply to different states. It may take some tinkering with to ensure everything works properly. Using Dev Tools and setting the state of the sensor may be useful for testing, but, I have a feeling, you'll really need to tinker while the sensor is in a specific state to ensure all the attributes are available. (To modify the IN game style, you'll probably need to do it while the game is playing.)

regal crown
regal crown
regal crown
# next tundra Looking at the code of the card, however, the Dev created different "templates" ...

I spent a little time on it using the Java Script and got this, which is compact and I like a lot. I may not need the stack-card with it.

type: custom:teamtracker-card
entity: sensor.ncaa_texas_football
card_mod:
  style: >
    ha-card { border: none; }
    .card {
      padding: 0.5em;
      font-size: 1.2em !important;
    }
    .logo {height: 2em; }
    .bottom-clickable {
      font-weight: 350;
      font-size: 0.6em;
    }
    .team-bg { width: 45%; left: -10%; }
    .opponent-bg { width: 45%; right: -10%; }
    .gameday { font-size: 1.1em; }
    .gamedate { font-size: 1.0em; }
    .gametime { font-size: 1.0em; }
    .record { font-size:0.9em; height: 1.0em; }
    .pre-row1 { font-weight: 500; font-size: 1.1em; height: 1.2em; margin: 6px 0
    2px; }
    .pre-row2 { font-weight: 500; font-size: 1.1em; height: 1.2em; margin: 6px 0
    2px; }
    .pre-row3 { font-weight: 500; font-size: 1.1em; height: 1.2em; margin: 6px 0
    2px; }
    .in-row1 { font-size: 1em; height: 1em; margin: 6px 0 2px; }
    .in-row2 { font-size: 1em; height: 1em; margin: 6px 0 2px; }
image.png
#

Thanks a lot. You have been a huge help. I think you're right about the In-game and Post-game. I added some In-game line, but you can't see the result until it is In-game. An Astro's In-game should be easy to find. NFL plays this weekend again.

next tundra
#

Guessing generally doesn't work. Especially with this card as it has a lot going on inside of it. Most of the stock cards follow the same syntax, but with custom cards, the Dev can do whatever they want. What you've been working with here isn't JavaScript but more CSS. Card_mod modifies the CSS elements that create the styling/appearance. I'm not the greatest at understanding it but I can pick out some of the easier things. I use Firefox and I Inspect the page. I right-click just below the card, select Inspect, then I use the Pick an element from the page button at the far left or SHIFT+CTRL+C. I'll hover around the portion of the screen I'm trying to look at (which will get highlighted) and then left click. The left portion of the window shows a bunch of "stuff" and the structure of the CSS, center is where I find the good stuff (attributes) to attempt to modify. (I don't know the proper terms here but that's what I'm going with.) How to Use Inspect Element in Chrome, Safari, & Firefox shows how to Inspect pages.

#

Besides dealing with PRE, POST and IN states, the next problem I foresee if duplicating all that code for each team you're tracking. Two options:

  • Use the auto entities card and let it generate the cards for you for all the entities found in the TeamTracker integration (mentioned above: #1216135528274071612 message) In theory, the Auto Entities card can also sort the generated cards based on gametime. Something to consider here.
  • Use the Decluttering card to create a template that will greatly minimize the repetitive code.
    Either option will get the job done. Auto Entities might be more of a pain to set-up but should have good results. The key here is to have a single spot where you can make a single change and not have to do it across each of the dozen or so cards that you currently have.
#

Also, .record { font-size:0.9em; height: 1.0em; } may not be applying the 0.9em as the font-size because there is not a space after the colon.

regal crown
# next tundra Also, `.record { font-size:0.9em; height: 1.0em; }` may not be applying the 0.9e...

I've worked on the Baseball in-game and this is the result. I don't like the white lines, because in the stack card it confuses where one team stops and the next begins, so I removed them. I also didn't need the probability, so I removed it to save space. This is a stack-card showing it with and without the new changes. I'm getting closer to what I want. I would like to brighten the borders slightly for each sub-card, but haven't figured that out yet.

image.png
next tundra
regal crown
next tundra
#

More than likely it is an issue with the data/game. Only changes we have done is to styling and nothing related to how the card functions. Have you looked at the entities that are problematic during a game to see what data they have? I'm assuming the break in communication is the data coming into ESPN's API. If it doesn't have data, you won't have data.

regal crown
next tundra
#

Yeah. Think of the kid that would have to hang the scores on the scoreboard at a baseball game. Runner makes it home, kid updates the scoreboard. If the kid falls asleep and the runner makes it home, the scoreboard is not updated. Somewhere, some metaphorical kid must have fallen asleep.