Betting Entertainment Tools

Widgets Demo

Swipe Bet Widget (with extended properties)

Parameters
Name Type Attributes Default Description
props object
user string | number

The id of the user.
buttonTitle string 'Swipe Bet'

Displayed text in the button.
productTitle string 'SWIPE BET'

The name in the header. If set value to false, no title will be displayed.
headerIcon string

URL to a custom icon.
buttonIcon string | false

URL for custom icon. If set value to false, no icon will be displayed. If no value is set, the default swipe icon will be displayed.
maxSelectionsMultiMode number 12

The number of maximum selections for multi mode in Bet Slip.
maxSelectionsSingleMode number 12

The number of maximum selections for single mode in Bet Slip.
isMobile boolean false

Mobile view of the widget.
betSlipMode Array.<('multi'|'single')> Array<'multi'>

Bet mode selector.
outcomeNamePosition 'start' | 'end' | 'top' | 'bottom' 'start'

Positioning of outcome name.
filters object

Filters property is an object where you can set recommendation type, sports and time.
filters.sport object

Object with sport options.
filters.sport.available Array.<(string|number)>

Sportradar sports
filters.time object

Object with time options.
filters.time.available 'live' | 'not_started'

Specifies the availability status of an event based on its start time. The value can be either live or not_started. If this option is not provided, it will not be used as a filter criteria.
filters.time.range number

Retrieves events based on the specified time range, in hours. Must be between 0 and 72.
disableLazyLoad string false

When set to true, this prop disables the lazy loading feature for the widget, causing it to be loaded immediately upon page load instead of waiting for user interaction.
sportsMapping object

Map your sport ids with Sportradar ones in case you are not using Sportradar sport ids (available sports).

{
     "your_sport_id_football": "sportradar_sport_id_football",
     "your_sport_id_X": "sportradar_sport_id_Y",
     "your_sport_id_B": "sportradar_sport_id_A",
     ...
}
branding object

Customization options. Currently supports customization of sports icons. Valid structure is:

sports: {
    icons: { // custom icons for sports
        1: 'path_to_image_file', // `1` is sport id.
        2: 'path_to_image_file',
        5: 'path_to_image_file',
        20: 'path_to_image_file',
    }
}
customJerseys object

Use this property to load custom jerseys. You can set up custom jersey images (home/away) for each team within specific tournament You can also set up default jerseys (home/away) for each tournament in case if the team jersey is missing. Recommended image size is 180px x 180px. Valid structure is:


customJerseys: {
      1: { // `1` is sport id.
          11: { // `11` is tournamnet id.
              teams: {
                  333: { // `333` is team id.
                      home: 'path_to_image_file',
                      away: 'path_to_image_file'
                  },
                  444: {
                      home: 'path_to_image_file',
                      away: 'path_to_image_file'
                  }
              },
              default: { // `default` will be used when no team is found inside tournament.
                  home: 'path_to_image_file',
                  away: 'path_to_image_file'
              }
          }
      }
}
onItemClick OnItemClick Widgets.BetRecommendation.Integration.OnItemClick

Set a callback function to be executed upon specific actions within the widget.

Available targets:

  • externalOutcome
  • betSlipMode
  • goToBetSlip

For more details, refer to OnItemClick.
debug boolean

When set to true, logs adapter schema errors.
Examples

#1

<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.sir.sportradar.com/sportradar/widgetloader","SIR", {
        language: 'en'
    });

    SIR('registerAdapter', '{ADAPTER_NAME}');

    SIR('addWidget', '#sr-widget', 'betRecommendation.swipeBet');
</script>
<div id="sr-widget"></div>

#2

<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.sir.sportradar.com/sportradar/widgetloader","SIR", {
        language: 'en'
    });

    SIR('registerAdapter', '{ADAPTER_NAME}');

    SIR('addWidget', '#sr-widget', 'betRecommendation.swipeBet', {
         buttonTitle: 'Bet now',
         branding: {
             sports: {
                 icons: { // custom icons for sports
                     1: 'path_to_image_file',
                     2: 'path_to_image_file',
                     5: 'path_to_image_file',
                     20: 'path_to_image_file'
                 }
             }
         },
         onItemClick: function(target, data) {
             console.log(target, data);
         }
    });
</script>
<div id="sr-widget"></div>