Betting Entertainment Tools

Widgets Demo

Widget Rotator

In this example, we are rotating Live Match Tracker widget by changing matchId every three seconds. When "Remove widget" button is clicked, widget is removed from the page by using removeWidget method.

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>Widget Rotator</title>
        <style>
            .sr-widget {
                width: 620px;
            }
        </style>
    </head>
    <body>
        <div class="sr-widget"></div>

        <button onclick="endThisThing()">REMOVE WIDGET</button>

        <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 matchIds = [match_id_1_here, match_id_2_here, match_id_3_here];
            let ix = 0;
            let interval;

            function addOrUpdateWidget(callback) {
                SIR('addWidget', '.sr-widget', 'match.lmtPlus', { matchId: matchIds[ix]}, callback);

                if (++ix >= matchIds.length) { ix = 0; }
            }


            addOrUpdateWidget(function() {
                interval = setInterval(addOrUpdateWidget, 3000);
            })

            function endThisThing() {
                clearInterval(interval);
                // SIR('removeWidget', '.sr-widget');
                // it also accepts dom element:
                SIR('removeWidget', document.querySelector('.sr-widget'));
            }
        </script>
    </body>
</html>