Score Ticker
us.common.scoreTicker provides a condensed ticker of daily matchups. The user has the ability to view previous and upcoming dates, as well as all other leagues and sports currently offered.
There are two options for generating the Score Ticker widget.
Option 1
Without matchId
, sport
or uniqueTournamentId
props being set, the widget attempts to find and auto-select sports with live games.
If there are multiple sports that are live at one time, the widget follows this order of operations: NFL playoffs, NBA playoffs, NCAAF playoffs, NCAAB NCAA tournament, MLB playoffs, NHL playoffs, NFL pro bowl, NBA All-Star game, MLB All-Star game, NHL All-Star game, NFL regular season, NBA regular season, NCAAF regular season, NCAAB regular season, MLB regular season, NHL regular season, Premier League, Champions League, La Liga, Bundesliga, MLS playoffs, MLS regular season, Serie A, Ligue 1, Europa League, NCAAB NIT, NCAAB CBI, NCAAB CIT, NFL preseason, NBA preseason, MLB spring training, NHL preseason, NBA summer league.
The widget picks from the allowedSports
prop, if set. Otherwise, it picks from all supported sports. For soccer it further picks from the allowedUniqueTournaments
prop, if set. Otherwise, it picks from all supported unique tournaments.
Failing to find a live sport, and with the considerNearest
prop set to true, the widget will select a sport with the soonest upcoming game.
Failing to find a live sport or an upcoming game with the considerNearest
prop, the widget falls back to the NFL Score Ticker for the current day.
The widget automatically reselects live games, or the soonest upcoming sport, to follow status changes that occur over time.
Once a user selects another sport using the sport selector, the widget will stop automatically reselecting games and sports until the widget is reloaded.
Option 2
If matchId
, sport
or uniqueTournamentId
props are set, the widget will initialize with that sport. Auto-selecting sport is turned off in this scenario.
Parameters
Name | Type | Argument | Default | Description |
matchId |
number | optional | Match ID. Has priority over sport . |
|
sport |
number | string | optional | nfl | A name (string) or ID (number) of the sport that will initially be displayed. Supported: soccer (1 ), nba (2 ), mlb (3 ), nhl (4 ), nfl (5 ), ncaaf (6 ), ncaab (7 ). |
allowedSports |
array | string | optional | 'spread' | Array or comma-separated string of allowed sports (names or ids) to chose from sport selector or sport prop. Also denotes live/nearest sport auto-selecting feature and sport selector items order. If sport prop default is not on the list its default changes to first allowed sport. Supported: soccer (1 ), nba (2 ), mlb (3 ), nhl (4 ), nfl (5 ), ncaaf (6 ), ncaab (7 ). In case of one sport (with the exception of soccer - see allowedUniqueTournaments ), the sport toggle ability is removed and a sport label is displayed instead of the sport selector. |
uniqueTournamentId |
number | optional | Unique tournament ID (Soccer). Supported: 17 (EPL), 242 (MLS), 7 (UCL), 679 (UEL), 8 (LaLiga), 23 (Serie A), 35 (BundesLiga), 34 (Ligue 1). Has no effect in combination with other supported sports. |
|
allowedUniqueTournaments |
array | string | optional | Array or comma-separated string of allowed soccer unique tournaments IDs to choose from sport selector or uniqueTournamentId prop. Also impacts live/nearest auto-selecting feature and sport selector soccer items order. Supported: 17 (EPL), 242 (MLS), 7 (UCL), 679 (UEL), 8 (LaLiga), 23 (Serie A), 35 (BundesLiga), 34 (Ligue 1). In case of only soccer and one soccer unique tournament, the sport toggle ability is removed and a selected soccer unique tournament label is displayed instead of the sport selector. If not set, all supported soccer unique tournaments are allowed. |
|
prevDays |
number | optional | 1 | Number of previous days to select from the date control. |
nextDays |
number | optional | 1 | Number of upcoming days to select from the date control. |
flipOnEndDay |
boolean | optional | Forces to flip to the next day at day's end. If a sport has games being played on consecutive days (e.g. Monday and Tuesday), the ticker will automatically flip to Tuesday's games at the end of the current day/start of the next day. If, however, a sport has games separated by a day (e.g. Monday and Wednesday), then the flipOnEndDay prop can be set to "true" and force the ticker to flip at the end of Monday/start of Tuesday. If set to "false" or left as the default option, the ticker would not flip to the next set of games until the end of Tuesday/start of Wednesday. As a rule, NFL and NCAAF are not affected by this prop's functionality. These two sports are set to flip based on weekly timers. NFL is set to flip to the next week at 5 a.m. UTC on Wednesdays, while NCAAF is set to flip to the next week at 5 a.m. UTC on Tuesdays. If there are live games from the previous week still taking place at those times, the week flip will be delayed until the conclusion of those games. |
|
dayFlipUTCHours |
number | optional | Integer between 0 and 23. Forces flipping to current day's games at a specified time based on UTC time zone, but not before start of the current day (in local time). Although the time is set according to UTC, it will effect end users according to their local time zone. Example: if the current date is 1/19/22, a value of 20 will set flipping at 12:00 for a user in PST time zone, 15:00 for EST and 21:00 for CET. However, using a value of 6 will set flipping at 0:00 PST (rather than 1/18/22 22:00 PST), 1:00 EST and 7:00 CET. dayFlipUTCHours has priority over dayFlipHoursBefore . |
|
dayFlipHoursBefore |
number | optional | Integer between 0 and 23. Forces flipping to current day's games a specific number of hours before the scheduled time of the first match, but not before the start of the current day (in local time). Example: if the first game of the day is at 7:30pm EST, a value of 7 would leave last night's games displayed until 12:30pm EST. | |
mergeLive |
boolean | optional | Displays all live games no matter when they were originally scheduled/started. Any games that were scheduled the day before and continued past midnight will be moved to the previous day (their original displayed day) as soon as they are finished. | |
considerNearest |
boolean | optional | true | Auto-selects the sport with the soonest game if there are currently no live games. |
hasHorizontalSelectors |
number | optional | Renders horizontal selectors instead of dropdowns. Typical use case: the HTML Inline Frame element. | |
h80 |
boolean | optional | Sets the widget fixed height at 80px. Typical use case: the HTML Inline Frame element. | |
h90 |
boolean | optional | Sets the widget fixed height at 90px. Typical use case: the HTML Inline Frame element. | |
layout |
string | optional | 'normal' | Sets the type of layout. Valid values are normal and compact . normal breaks the navigation and match list for mobile breakpoint (480px) in 2 lines; compact layout keeps the sport selector and match list for mobile breakpoint in one line, omitting the date selector. The Compact layout also has different paddings and widths, and uses a carrot icon instead of hamburger icon for the sport selector. |
disableSportDropdown |
boolean | optional | If true hides the sports dropdown/label and takes away from the user the ability to change sport/unique tournament. In the case of a disabled sport selector and unset sport and uniqueTournamentId props, the widget will operate in auto-selecting mode indefinitely. |
|
onItemClick |
function | optional | Function/event handler. Possible target items are match and us-sport . When the target is match it means a match has been clicked or touched and it emits various match values: matchId , sportId , usSport , realCategoryId , seasonId , tournamentId, uniqueTournamentId , awayTeamUid , homeTeamUid , matchStatus . When the target is us-sport it means a different sport (or a different soccer league) has been selected in the score ticker, and it emits usSport and uniqueTournamentId values. Valid matchStatus values are: pre , live , post . The usSport value is a numerical sport ID, it can contains the same IDs as the sport prop. Example below. |
Examples
<div class="sr-widget" data-sr-widget="us.common.scoreTicker" data-sr-sport="soccer" data-sr-unique-tournament-id="8"></div>
<script type="application/javascript" src="https://widgets.media.sportradar.com/YOUR_CLIENT_ALIAS/widgetloader" data-sr-language="en_us" async></script>
<script>
(function(a,b,c,d,e,f,g,h,i){a[e]||(i=a[e]=function(){(a[e].q=a[e].q||[]).push(arguments)},i.l=1*new Date,i.o=f,
g=b.createElement(c),h=b.getElementsByTagName(c)[0],g.async=1,g.src=d,g.setAttribute("n",e),h.parentNode.insertBefore(g,h)
)})(window,document,"script","https://widgets.media.sportradar.com/YOUR_CLIENT_ALIAS/widgetloader","SIR", {
language: 'en_us'
});
SIR('addWidget', '#sr-widget', 'us.common.scoreTicker', {matchId: 17132773});
</script>
<div id="sr-widget"></div>
<script>
(function(a,b,c,d,e,f,g,h,i){a[e]||(i=a[e]=function(){(a[e].q=a[e].q||[]).push(arguments)},i.l=1*new Date,i.o=f,
g=b.createElement(c),h=b.getElementsByTagName(c)[0],g.async=1,g.src=d,g.setAttribute("n",e),h.parentNode.insertBefore(g,h)
)})(window,document,"script","https://widgets.media.sportradar.com/YOUR_CLIENT_ALIAS/widgetloader","SIR", {
language: 'en_us'
});
SIR('addWidget', '#sr-widget', 'us.common.scoreTicker', {onItemClick: function(target, obj){alert(target+':'+JSON.stringify(obj));}});
</script>
<div id="sr-widget"></div>
match: {"matchId":27506858,"seasonId":79153,"tournamentId":10561,"uniqueTournamentId":132,"realCategoryId":15,"sportId":2,"awayTeamUid":3417,"homeTeamUid":3414,"matchStatus":"post","usSport":2};</script>
Updated almost 2 years ago