BetBooster Widget

Modified on Mon, 10 Apr 2023 at 08:03 AM

How do we start?

It’s simple. Follow the instructions below and if you have any questions, our team would be glad to assist on our support channels.

The widget is based on a ‘Web-component’ and can be integrated into any web-app (desktop, retail, tablet, or mobile). (Web Component is a suite of different technologies allowing you to create reusable custom elements - with their functionality encapsulated away from the rest of your code - and utilize them in your web apps)

Please take into consideration that our team will need access to your staging environment during the testing phase to validate and adjust the integration.

The integration requires you to add three lines of code to your front-end. The body, where you want to place the widget, should have:

<betbooster-widget demo=”1” home="homeTeam" away="awayTeam" date="dd/MM/yyyy HH:mm" sport="sport" apiKey=”apiKey” lang=”lang” originhome=”origin team name” originaway=”origin team away” originleague=”origin league name”></betbooster-widget>

Please note 1: The inserted hour is UTC time. Any hour within the ~6 hours window would suffice for the mappings. Matches can be requested even days before first kick-off.

Please note 2: the part of “demo=1” will be removed once both parties complete the integration

Calling to the product’s script:

Prod :
<script src="https://betbooster-widget.lvision.io/v3/prod/bundle-es5.js” defer></script>

Staging :
<script src="https://betbooster-widget.lvision.io/v3/staging/bundle-es5.js” defer></script>

And the last line, in the header: <base href="/">

BetBooster-widget attributes

Parameters	Type	Optional / Required	Description
home	String	required	Name of home team / player
away	String	required	Name of away team / player
date	String	required	“dd/MM/yyyy hh:mm” format. (UTC time)
sport	String	required	Basketball / Ice Hockey etc.
apiKey	String	required	Provided by LSports*
lang	String	optional	Please follow this list: http://www.lingoes.net/en/translator/langcode.htm(English set as default)
originhome	String	required	Home team’s name as the customer wishes to display it after translation
originaway	String	required	Away team’s name as the customer wishes to display it after translation
originleague	String	required	League’s name as the customer wishes to display it after translation
layout	String	optional	A selected design to apply on the widget

* Unauthorized domains will be blocked

Please note 3: required parameters should be transferred in English as the default option

Once the web-component is initialized with the relevant attributes, we will automatically map the event and return the relevant tips.

Custom Design

Every customer can design the widget independently by overwriting our existing CSS classes with the “!important” flag. The Default design will be identified as “undefined”, however, a selection of potential designs is available by inserting the attribute layout=”1” / layout=”2” or layout=”3” into the script.

Additional design changes for customers' choosing:
1. Product name - Set your chosen title at the attribute

title="YOUR_TITLE_INSTEAD_BetBooster"

2. Pixel Scales Width and Height can be adjusted by changing your div element that wraps the widget

Bet-Slip integration

Similar to the first phase of integration, we do 95% of the work. Before starting the integration, both parties will agree on the best modules to use. A complete FAQ document will be attached when the integration kicks off.

The process goes as follows: We map all supported markets. An escaped JSON is built in order to contain data regarding the markets & odds. User selections are handled to sync UI/UX on all fronts (widget, web, Bet-Slip). Then we proceed to develop a function that will add selection into Bet-Slip

BetMarkets JSON includes the following data:

Parameters	Type	Optional / Required	Description
marketId	string	Required	The Id of the market
MarketName	string	Required	The name of the market
bets	string	Required	Which selections the user chose to add to BetSlip
line	string	Required	The median line for that market
betslip / outcomeID	string	Required	The Id of the selection
IsSelected	boolean string	Required	Bet selected or not (true / false)
displayName	string	Optional	The name of the market, as the customer presents it on its own translation
betName	string	Required	The bet name in English. used for Mappings.
odds	string	Required	odds in your format.

For instance:

[ 
  { 
   "id": 155, 
   "name": "Match Winner", 
   "bets": [ 
                { 
                    "outcomeID / betslip": "8736234",  "name": "1", 
                    "displayName": "Real Madrid", 
                    "odds": 1.70, 
                    "isSelected": 1 
                },
                { 
                     "outcomeID / betslip": "8736235",  "name": "X", 
                     "displayName": "Draw", 
                     "odds": 2.32, 
                     "isSelected": 0 
                 }, 
                 { 
                     "outcomeID / betslip": "8736236",  "name": "2", 
                     "displayName": "Barcelona", 
                     "odds": 1.62, 
                     "isSelected": 0 
                  } 
              ] 
   }, 
]