Betting Entertainment Tools

Widgets Demo

Examples

Basic Integration

The basic integration of the Bet Concierge widget is straightforward. There are 2 required properties that need to be passed to the widget: matchId and jwt.

Example: 

<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'
   });

   const sportradarMatchId = 50955863;
   const userJWT = 'eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiO...';

   // Bet Concierge Widget
   SIR('addWidget', '.sr-bc-widget', 'betConcierge', {matchId: sportradarMatchId, jwt: userJWT});
</script>
<div class="bc-wrapper">
   <div class="sr-bc-widget"></div>
</div>

Button Integration

This is example of how to integrate the Bet Concierge widget with a button. The button can be used to open and the Bet Concierge widget.

Example: 

<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'
   });

     let isBetConciergeOpened = false;

     function toggleBetConcierge() {
       const container = document.getElementById("bet_concierge-widget");
       const openWidgetButton = document.getElementById("open-widget-button");
       isBetConciergeOpened = !isBetConciergeOpened;
       container.style.display = isBetConciergeOpened ? "block" : "none";
       openWidgetButton.style.display = isBetConciergeOpened ? "none" : "block";
     }

     function onAction({ type }) {
       console.log("action:", type);
       if (type === "Close") toggleBetConcierge();
       if (type === "Error") document.getElementById("open-widget-button").disabled = true;
     }

     document.addEventListener("DOMContentLoaded", () => {
       document.getElementById("bet_concierge-widget").style.display = "none";
     });

     const handleBetConciergeOpen = toggleBetConcierge;

   const sportradarMatchId = 50955863;
   const userJWT = 'eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiO...';

   // Bet Concierge Widget
   SIR('addWidget', '.sr-widget-bet_concierge', 'betConcierge', {matchId: sportradarMatchId, jwt: userJWT, onAction});
</script>

<div class="bc-wrapper">
   <button id="open-widget-button" onclick="handleBetConciergeOpen()">
       Open AI Chat
   </button>
   <div class="sr-widget-bet_concierge"></div>
</div>