UNPKG

@recras/online-booking-js

Version:

JS library for easy integration of Recras online booking and voucher sales

44 lines (40 loc) 1.85 kB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Recras Online Booking integration demo</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" href="./demo.css"> </head> <body> <main> <a href="index.html">&laquo; Back to demo index</a> <h1>Online Booking</h1> <div id="onlinebooking"></div> </main> </body> <script src="onlinebooking.js"></script> <script> const recrasOptions = { recras_hostname: 'demo.recras.nl', // Required element: document.getElementById('onlinebooking'), // Required locale: 'nl_NL', // Optional, default is nl_NL. Valid values are de_DE, en_GB, nl_NL, sv_SE //package_id: 7, // Optional, this will skip the package selection step for online booking package_id: [7, 26, 29], // Optional, this will only show these packages instead of all of them previewTimes: false, redirect_url: 'https://www.onionbooking.com/', // Optional, but recommended //productAmounts: {"592":"12","593":"6","594":"12","595":"6","596":"12","597":"6","bookingsize":"18"}, /*productAmounts: { // Optional, this will pre-fill the amounts form 660: 2, },*/ //date: '2020-06-02', // Optional, this will pre-fill the date if it's available for the selected products //time: '11:15', // Optional, this will pre-fill the time if it's available for the selected date analytics: true, // Optional, will look for Google Analytics v3 or v4 on the page to use }; let bookingOptions = new RecrasOptions(recrasOptions); new RecrasBooking(bookingOptions); document.addEventListener('Recras:Booking:PackageChanged', (e) => { console.log('Custom event logged', e); }); </script> </html>