@recras/online-booking-js 1.10.3 → 1.11.0

package/README.md

@@ -1,7 +1,7 @@
 [![Build Status](https://travis-ci.org/Recras/online-booking-js.svg?branch=master)](https://travis-ci.org/Recras/online-booking-js)
 
 # Recras JS Integration Library
-Version: 1.10.3
+Version: 1.11.0
 
 JS library for easy online booking, contact form, and voucher integration
 
@@ -128,7 +128,7 @@ The library sends out a few custom events when certain things change:
 You can use these events for custom actions, such as analytics. For use in code, please refer to 
 the constants in [src/eventHelper.js](src/eventHelper.js).
 
-When Google Analytics integration is enabled, certain events sent to GA include a label and/or value:
+When Google Analytics integration is enabled, certain events are sent to GA. Which events are sent depends on the version of GA you are using. For Universal Analytics (v3) and older, these custom events are sent and they include a label and/or value:
 
 | Event                              | Label                             | Value                               |
 | ---------------------------------- | --------------------------------- |-------------------------------------|
@@ -140,3 +140,8 @@ When Google Analytics integration is enabled, certain events sent to GA include
 | `Recras:Voucher:TemplateChanged`   | N/A                               | Template ID                         |
 | `Recras:Voucher:BuyInProgress`     | Template name                     | Rounded total amount of the order   |
 | `Recras:Voucher:RedirectToPayment` | N/A                               | Rounded total amount of the order   |
+
+For GA4, these events are sent:
+* when a package is selected: `select_content`. The ID of the package is included.
+* when a voucher is selected: `select_content`. The ID of the template is included.
+* when the user is redirected to the payment provider: `begin_checkout`. The total amount as well as all selected items (name, price, quantity) are included.

package/changelog.md

@@ -1,5 +1,9 @@
 # Changelog
 
+## 1.11.0 (2022-04-04)
+* Add support for Google Analytics v4 (GA4)
+* Minified version of the script is now included
+
 ## 1.10.3 (2021-12-16)
 * Change value of "BuyInProgress" events from package/template ID (bookings/vouchers, respectively) to total price
 

package/dist/onlinebooking.js

@@ -46,11 +46,11 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
 
-function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
 
 /*******************************
 *  Recras integration library  *
-*  v 1.10.3                    *
+*  v 1.11.0                    *
 *******************************/
 var RecrasBooking = /*#__PURE__*/function () {
   function RecrasBooking() {
@@ -438,7 +438,10 @@ var RecrasBooking = /*#__PURE__*/function () {
         return Promise.resolve(false);
       } else {
         this.clearAllExceptPackageSelection();
-        this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING, RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED, selectedPackage[0].arrangement, selectedPackage[0].id);
+        this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING, RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED, selectedPackage[0].arrangement, selectedPackage[0].id, {
+          content_type: 'package',
+          item_id: selectedPackage[0].id
+        });
       }
 
       this.selectedPackage = selectedPackage[0];
@@ -1666,10 +1669,52 @@ var RecrasBooking = /*#__PURE__*/function () {
       });
       return attachments;
     }
+  }, {
+    key: "formatGA4Items",
+    value: function formatGA4Items() {
+      var _this28 = this;
+
+      var items = [];
+
+      if (this.bookingSize() > 0) {
+        var pck = this.selectedPackage;
+        items.push({
+          item_name: pck.weergavenaam || pck.arrangement,
+          price: this.bookingSizePrice(pck),
+          quantity: this.bookingSize()
+        });
+      }
+
+      var linesNoBookingSize = this.getLinesNoBookingSize(this.selectedPackage);
+      linesNoBookingSize = linesNoBookingSize.filter(function (line) {
+        var lineEl = _this28.findElement("[data-package-id=\"".concat(line.id, "\"]"));
+
+        if (!lineEl) {
+          return false;
+        }
+
+        if (isNaN(parseInt(lineEl.value))) {
+          return false;
+        }
+
+        return parseInt(lineEl.value) > 0;
+      });
+      linesNoBookingSize = linesNoBookingSize.map(function (line) {
+        var lineEl = _this28.findElement("[data-package-id=\"".concat(line.id, "\"]"));
+
+        return {
+          item_name: line.beschrijving_templated,
+          price: line.product.verkoop,
+          quantity: parseInt(lineEl.value)
+        };
+      });
+      items.push.apply(items, _toConsumableArray(linesNoBookingSize));
+      return items;
+    }
   }, {
     key: "submitBooking",
     value: function submitBooking() {
-      var _this28 = this;
+      var _this29 = this;
 
       var productCounts = this.productCounts().map(function (line) {
         return line.aantal;
@@ -1728,30 +1773,34 @@ var RecrasBooking = /*#__PURE__*/function () {
 
       return this.postJson('onlineboeking/reserveer', bookingParams).then(function (json) {
         if (json.payment_url) {
-          _this28.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING, RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT, null, Math.round(_this28.getTotalPrice()));
+          _this29.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING, RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT, null, Math.round(_this29.getTotalPrice()), {
+            currency: _this29.languageHelper.currency,
+            value: _this29.getTotalPrice(),
+            items: _this29.formatGA4Items()
+          });
 
           window.top.location.href = json.payment_url;
         } else if (json.redirect) {
           window.top.location.href = json.redirect;
         } else if (json.message && json.status) {
-          _this28.findElement('.recras-amountsform').reset();
+          _this29.findElement('.recras-amountsform').reset();
 
-          _this28.findElement('.recras-datetime').reset();
+          _this29.findElement('.recras-datetime').reset();
 
-          _this28.findElement('.recras-contactform').reset();
+          _this29.findElement('.recras-contactform').reset();
 
-          _this28.element.scrollIntoView({
+          _this29.element.scrollIntoView({
             behavior: 'smooth'
           });
 
-          _this28.element.insertAdjacentHTML('afterbegin', "<p class=\"recras-success\">".concat(json.message, "</p>"));
+          _this29.element.insertAdjacentHTML('afterbegin', "<p class=\"recras-success\">".concat(json.message, "</p>"));
         } else {
           console.log(json);
         }
 
-        _this28.loadingIndicatorHide();
+        _this29.loadingIndicatorHide();
 
-        _this28.findElement('.bookPackage').removeAttribute('disabled');
+        _this29.findElement('.bookPackage').removeAttribute('disabled');
       });
     }
   }, {
@@ -1787,7 +1836,7 @@ var RecrasBooking = /*#__PURE__*/function () {
   }, {
     key: "updateProductAmounts",
     value: function updateProductAmounts() {
-      var _this29 = this;
+      var _this30 = this;
 
       this.loadingIndicatorHide();
       this.availableDays = [];
@@ -1797,7 +1846,7 @@ var RecrasBooking = /*#__PURE__*/function () {
       var maxPromise = this.checkMaximumForPackage();
       this.checkBookingSize(this.selectedPackage);
       this.recheckVouchers().then(function () {
-        _this29.showTotalPrice();
+        _this30.showTotalPrice();
       });
       this.showStandardAttachments();
       var datePickerEl = this.findElement('.recras-onlinebooking-date');
@@ -1845,16 +1894,16 @@ var RecrasBooking = /*#__PURE__*/function () {
   }, {
     key: "getAvailableDaysInPeriod",
     value: function getAvailableDaysInPeriod(packageId, startDate, endDate) {
-      var _this30 = this;
+      var _this31 = this;
 
       var datePickerEl = this.findElement('.recras-onlinebooking-date');
       this.getAvailableDays(packageId, startDate, endDate).then(function (availableDays) {
-        _this30.loadingIndicatorHide();
+        _this31.loadingIndicatorHide();
 
         if (datePickerEl.value && availableDays.indexOf(datePickerEl.value) === -1) {
           datePickerEl.value = '';
 
-          _this30.clearTimes();
+          _this31.clearTimes();
         } else {
           datePickerEl.removeAttribute('disabled');
         }
@@ -1949,7 +1998,7 @@ var RecrasCalendarHelper = /*#__PURE__*/function () {
 
 var RecrasContactForm = /*#__PURE__*/function () {
   function RecrasContactForm() {
-    var _this31 = this;
+    var _this32 = this;
 
     var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
@@ -1979,11 +2028,11 @@ var RecrasContactForm = /*#__PURE__*/function () {
     }
 
     this.fetchJson = function (url) {
-      return RecrasHttpHelper.fetchJson(url, _this31.error.bind(_this31));
+      return RecrasHttpHelper.fetchJson(url, _this32.error.bind(_this32));
     };
 
     this.postJson = function (url, data) {
-      return RecrasHttpHelper.postJson(_this31.options.getApiBase() + url, data, _this31.error.bind(_this31));
+      return RecrasHttpHelper.postJson(_this32.options.getApiBase() + url, data, _this32.error.bind(_this32));
     };
 
     RecrasCSSHelper.loadCSS('global');
@@ -2007,7 +2056,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
   _createClass(RecrasContactForm, [{
     key: "checkRequiredCheckboxes",
     value: function checkRequiredCheckboxes() {
-      var _this32 = this;
+      var _this33 = this;
 
       this.removeWarnings();
       var isOkay = true;
@@ -2016,7 +2065,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
         var checked = group.querySelectorAll('input:checked');
 
         if (checked.length === 0) {
-          group.parentNode.querySelector('label').insertAdjacentHTML('beforeend', "<div class=\"recrasError\">".concat(_this32.languageHelper.translate('CONTACT_FORM_CHECKBOX_REQUIRED'), "</div>"));
+          group.parentNode.querySelector('label').insertAdjacentHTML('beforeend', "<div class=\"recrasError\">".concat(_this33.languageHelper.translate('CONTACT_FORM_CHECKBOX_REQUIRED'), "</div>"));
           isOkay = false;
         }
       });
@@ -2057,7 +2106,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
   }, {
     key: "generateForm",
     value: function generateForm() {
-      var _this33 = this;
+      var _this34 = this;
 
       var extraOptions = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
       var waitFor = [];
@@ -2072,21 +2121,21 @@ var RecrasContactForm = /*#__PURE__*/function () {
       }
 
       return Promise.all(waitFor).then(function () {
-        var standalone = _this33.isStandalone(extraOptions);
+        var standalone = _this34.isStandalone(extraOptions);
 
         var validateText = standalone ? 'novalidate' : '';
         var html = "<form class=\"recras-contactform\" ".concat(validateText, ">");
 
         if (extraOptions.voucherQuantitySelector) {
-          html += _this33.quantitySelector(extraOptions.quantityTerm);
+          html += _this34.quantitySelector(extraOptions.quantityTerm);
         }
 
-        _this33.contactFormFields.forEach(function (field, idx) {
-          html += '<div>' + _this33.showField(field, idx) + '</div>';
+        _this34.contactFormFields.forEach(function (field, idx) {
+          html += '<div>' + _this34.showField(field, idx) + '</div>';
         });
 
         if (standalone) {
-          html += _this33.submitButtonHtml();
+          html += _this34.submitButtonHtml();
         }
 
         html += '</form>';
@@ -2121,22 +2170,22 @@ var RecrasContactForm = /*#__PURE__*/function () {
   }, {
     key: "getContactFormFields",
     value: function getContactFormFields() {
-      var _this34 = this;
+      var _this35 = this;
 
       return this.fetchJson(this.options.getApiBase() + 'contactformulieren/' + this.options.getFormId() + '?embed=Velden').then(function (form) {
-        _this34.contactFormFields = form.Velden;
-        _this34.packages = _this34.sortPackages(form.Arrangementen);
-        return _this34.contactFormFields;
+        _this35.contactFormFields = form.Velden;
+        _this35.packages = _this35.sortPackages(form.Arrangementen);
+        return _this35.contactFormFields;
       });
     }
   }, {
     key: "getCountryList",
     value: function getCountryList() {
-      var _this35 = this;
+      var _this36 = this;
 
       return this.fetchJson('https://cdn.rawgit.com/umpirsky/country-list/ddabf3a8/data/' + this.languageHelper.locale + '/country.json').then(function (json) {
-        _this35.countries = json;
-        return _this35.countries;
+        _this36.countries = json;
+        return _this36.countries;
       });
     }
   }, {
@@ -2303,7 +2352,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
   }, {
     key: "showField",
     value: function showField(field, idx) {
-      var _this36 = this;
+      var _this37 = this;
 
       if (field.soort_invoer === 'header') {
         return "<h3>".concat(field.naam, "</h3>");
@@ -2322,7 +2371,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
         case 'contactpersoon.geslacht':
           html = "<select ".concat(fixedAttributes, " autocomplete=\"sex\">");
           Object.keys(this.GENDERS).forEach(function (key) {
-            html += "<option value=\"".concat(key, "\">").concat(_this36.languageHelper.translate(_this36.GENDERS[key]));
+            html += "<option value=\"".concat(key, "\">").concat(_this37.languageHelper.translate(_this37.GENDERS[key]));
           });
           html += '</select>';
           return label + html;
@@ -2378,8 +2427,8 @@ var RecrasContactForm = /*#__PURE__*/function () {
         case 'contact.landcode':
           html = "<select ".concat(fixedAttributes, " autocomplete=\"country\">");
           Object.keys(this.countries).forEach(function (code) {
-            var selectedText = code.toUpperCase() === _this36.options.getDefaultCountry() ? 'selected' : '';
-            html += "<option value=\"".concat(code, "\" ").concat(selectedText, ">").concat(_this36.countries[code]);
+            var selectedText = code.toUpperCase() === _this37.options.getDefaultCountry() ? 'selected' : '';
+            html += "<option value=\"".concat(code, "\" ").concat(selectedText, ">").concat(_this37.countries[code]);
           });
           html += '</select>';
           return label + html;
@@ -2459,41 +2508,41 @@ var RecrasContactForm = /*#__PURE__*/function () {
   }, {
     key: "showForm",
     value: function showForm() {
-      var _this37 = this;
+      var _this38 = this;
 
       this.loadingIndicatorShow(this.element);
       return this.getContactFormFields().then(function () {
-        return _this37.generateForm({
+        return _this38.generateForm({
           standalone: true
         });
       }).then(function (html) {
-        _this37.appendHtml(html);
+        _this38.appendHtml(html);
 
-        _toConsumableArray(_this37.findElements('.checkboxGroupRequired')).forEach(function (group) {
+        _toConsumableArray(_this38.findElements('.checkboxGroupRequired')).forEach(function (group) {
           _toConsumableArray(group.querySelectorAll('input')).forEach(function (el) {
-            el.addEventListener('change', _this37.checkRequiredCheckboxes.bind(_this37));
+            el.addEventListener('change', _this38.checkRequiredCheckboxes.bind(_this38));
           });
         });
 
-        _this37.findElement('.recras-contactform').addEventListener('submit', _this37.submitForm.bind(_this37));
+        _this38.findElement('.recras-contactform').addEventListener('submit', _this38.submitForm.bind(_this38));
 
-        if (_this37.hasBookingDateField()) {
+        if (_this38.hasBookingDateField()) {
           var pikadayOptions = _extends(RecrasCalendarHelper.defaultOptions(), {
-            field: _this37.findElement('[data-identifier="boeking.datum"]'),
-            i18n: RecrasCalendarHelper.i18n(_this37.languageHelper),
+            field: _this38.findElement('[data-identifier="boeking.datum"]'),
+            i18n: RecrasCalendarHelper.i18n(_this38.languageHelper),
             numberOfMonths: 1
           });
 
           new Pikaday(pikadayOptions);
         }
 
-        if (_this37.hasRelationDateField()) {
-          var fields = _this37.getRelationExtraDateFields();
+        if (_this38.hasRelationDateField()) {
+          var fields = _this38.getRelationExtraDateFields();
 
           var thisYear = new Date().getFullYear();
 
           var _pikadayOptions = _extends(RecrasCalendarHelper.defaultOptions(), {
-            i18n: RecrasCalendarHelper.i18n(_this37.languageHelper),
+            i18n: RecrasCalendarHelper.i18n(_this38.languageHelper),
             numberOfMonths: 1,
             yearRange: [thisYear - 90, thisYear + 10]
           });
@@ -2502,12 +2551,12 @@ var RecrasContactForm = /*#__PURE__*/function () {
 
           for (var _i18 = 0; _i18 < fields.length; _i18++) {
             var field = fields[_i18];
-            _pikadayOptions.field = _this37.findElement("[data-identifier=\"".concat(field.field_identifier, "\"]"));
+            _pikadayOptions.field = _this38.findElement("[data-identifier=\"".concat(field.field_identifier, "\"]"));
             new Pikaday(_pikadayOptions);
           }
         }
 
-        _this37.loadingIndicatorHide();
+        _this38.loadingIndicatorHide();
       });
     }
   }, {
@@ -2557,7 +2606,7 @@ var RecrasContactForm = /*#__PURE__*/function () {
   }, {
     key: "submitForm",
     value: function submitForm(e) {
-      var _this38 = this;
+      var _this39 = this;
 
       e.preventDefault();
       var submitButton = this.findElement('.submitForm');
@@ -2581,24 +2630,24 @@ var RecrasContactForm = /*#__PURE__*/function () {
       submitButton.setAttribute('disabled', 'disabled');
       this.postJson('contactformulieren/' + this.options.getFormId() + '/opslaan', this.generateJson()).then(function (json) {
         if (json.success) {
-          if (_this38.options.getRedirectUrl()) {
-            window.top.location.href = _this38.options.getRedirectUrl();
+          if (_this39.options.getRedirectUrl()) {
+            window.top.location.href = _this39.options.getRedirectUrl();
           } else {
-            _this38.element.scrollIntoView({
+            _this39.element.scrollIntoView({
               behavior: 'smooth'
             });
 
-            _this38.element.insertAdjacentHTML('afterbegin', "<p class=\"recras-success\">".concat(_this38.languageHelper.translate('CONTACT_FORM_SUBMIT_SUCCESS'), "</p>"));
+            _this39.element.insertAdjacentHTML('afterbegin', "<p class=\"recras-success\">".concat(_this39.languageHelper.translate('CONTACT_FORM_SUBMIT_SUCCESS'), "</p>"));
 
             submitButton.parentNode.reset();
           }
         } else {
-          _this38.error(_this38.languageHelper.translate('CONTACT_FORM_SUBMIT_FAILED'));
+          _this39.error(_this39.languageHelper.translate('CONTACT_FORM_SUBMIT_FAILED'));
         }
 
         submitButton.removeAttribute('disabled');
 
-        _this38.loadingIndicatorHide();
+        _this39.loadingIndicatorHide();
       });
       return false;
     }
@@ -2754,11 +2803,31 @@ var RecrasEventHelper = /*#__PURE__*/function () {
     value: function eventEnabled(name) {
       return this.eventsEnabled.includes(name);
     }
+  }, {
+    key: "ga4EventMap",
+    value: function ga4EventMap(action) {
+      var _map;
+
+      var map = (_map = {}, _defineProperty(_map, RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED, 'select_content'), _defineProperty(_map, RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT, 'begin_checkout'), _defineProperty(_map, RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED, 'select_content'), _defineProperty(_map, RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT, 'begin_checkout'), _map);
+
+      if (map[action] === undefined) {
+        return false;
+      }
+
+      return map[action];
+    }
+  }, {
+    key: "isGA4",
+    value: function isGA4() {
+      var fn = window[window.GoogleAnalyticsObject || 'ga'];
+      return fn && fn.h && fn.h.gtm4;
+    }
   }, {
     key: "sendEvent",
     value: function sendEvent(cat, action) {
       var label = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : undefined;
       var value = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : undefined;
+      var ga4Value = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : undefined;
       var event;
 
       try {
@@ -2770,8 +2839,11 @@ var RecrasEventHelper = /*#__PURE__*/function () {
       }
 
       if (this.analyticsEnabled && this.eventEnabled(action)) {
-        if (typeof window.gtag === 'function') {
-          // Global Site Tag - the more modern variant
+        if (this.isGA4() && this.ga4EventMap(action) && ga4Value) {
+          // v4
+          this.sendGA4Event(this.ga4EventMap(action), ga4Value);
+        } else if (typeof window.gtag === 'function') {
+          // Global Site Tag (v3)
           var eventData = {
             event_category: RecrasEventHelper.PREFIX_GLOBAL + ':' + cat
           };
@@ -2786,7 +2858,7 @@ var RecrasEventHelper = /*#__PURE__*/function () {
 
           window.gtag('event', action, eventData);
         } else if (typeof window.ga === 'function') {
-          // "Old" Google Analytics
+          // "Old" Google Analytics (v2) and Tag Manager
           var _eventData = {
             hitType: 'event',
             eventCategory: RecrasEventHelper.PREFIX_GLOBAL + ':' + cat,
@@ -2816,6 +2888,12 @@ var RecrasEventHelper = /*#__PURE__*/function () {
 
       return document.dispatchEvent(event);
     }
+  }, {
+    key: "sendGA4Event",
+    value: function sendGA4Event(action, data) {
+      var fn = window[window.GoogleAnalyticsObject || 'ga'];
+      fn('event', action, data);
+    }
   }, {
     key: "setAnalytics",
     value: function setAnalytics(bool) {
@@ -3348,16 +3426,16 @@ var RecrasLanguageHelper = /*#__PURE__*/function () {
   }, {
     key: "setCurrency",
     value: function setCurrency() {
-      var _this39 = this;
+      var _this40 = this;
 
       var errorHandler = function errorHandler(err) {
-        _this39.currency = 'eur';
+        _this40.currency = 'eur';
 
-        _this39.error(err);
+        _this40.error(err);
       };
 
       return RecrasHttpHelper.fetchJson(this.options.getApiBase() + 'instellingen/currency', errorHandler).then(function (setting) {
-        _this39.currency = setting.waarde;
+        _this40.currency = setting.waarde;
       });
     }
   }, {
@@ -3581,7 +3659,7 @@ _defineProperty(RecrasOptions, "hostnamesDebug", ['nginx:8886', // Local develop
 
 var RecrasVoucher = /*#__PURE__*/function () {
   function RecrasVoucher() {
-    var _this40 = this;
+    var _this41 = this;
 
     var options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
@@ -3600,11 +3678,11 @@ var RecrasVoucher = /*#__PURE__*/function () {
     this.element.classList.add('recras-buy-voucher');
 
     this.fetchJson = function (url) {
-      return RecrasHttpHelper.fetchJson(url, _this40.error);
+      return RecrasHttpHelper.fetchJson(url, _this41.error);
     };
 
     this.postJson = function (url, data) {
-      return RecrasHttpHelper.postJson(_this40.options.getApiBase() + url, data, _this40.error);
+      return RecrasHttpHelper.postJson(_this41.options.getApiBase() + url, data, _this41.error);
     };
 
     RecrasCSSHelper.loadCSS('global');
@@ -3620,12 +3698,12 @@ var RecrasVoucher = /*#__PURE__*/function () {
     }
 
     this.languageHelper.setOptions(options).then(function () {
-      return _this40.getVoucherTemplates();
+      return _this41.getVoucherTemplates();
     }).then(function (templates) {
-      if (_this40.options.getVoucherTemplateId()) {
-        _this40.changeTemplate(_this40.options.getVoucherTemplateId());
+      if (_this41.options.getVoucherTemplateId()) {
+        _this41.changeTemplate(_this41.options.getVoucherTemplateId());
       } else {
-        _this40.showTemplates(templates);
+        _this41.showTemplates(templates);
       }
     });
   }
@@ -3635,10 +3713,19 @@ var RecrasVoucher = /*#__PURE__*/function () {
     value: function appendHtml(msg) {
       this.element.insertAdjacentHTML('beforeend', msg);
     }
+  }, {
+    key: "formatGA4Item",
+    value: function formatGA4Item() {
+      return [{
+        item_name: this.selectedTemplate.name,
+        price: this.selectedTemplate.price,
+        quantity: parseInt(this.findElement('#number-of-vouchers').value)
+      }];
+    }
   }, {
     key: "buyTemplate",
     value: function buyTemplate() {
-      var _this41 = this;
+      var _this42 = this;
 
       var status = this.contactForm.checkRequiredCheckboxes();
 
@@ -3660,14 +3747,18 @@ var RecrasVoucher = /*#__PURE__*/function () {
 
       this.postJson('vouchers/buy', payload).then(function (json) {
         if (json.payment_url) {
-          _this41.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER, RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT, null, Math.round(_this41.totalPrice()));
+          _this42.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER, RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT, null, Math.round(_this42.totalPrice()), {
+            currency: _this42.languageHelper.currency,
+            value: _this42.totalPrice(),
+            items: _this42.formatGA4Item()
+          });
 
           window.top.location.href = json.payment_url;
         } else {
           console.log(json);
         }
 
-        _this41.findElement('.buyTemplate').removeAttribute('disabled');
+        _this42.findElement('.buyTemplate').removeAttribute('disabled');
       });
     }
   }, {
@@ -3678,7 +3769,10 @@ var RecrasVoucher = /*#__PURE__*/function () {
       })[0];
       this.clearAllExceptTemplateSelection();
       this.showContactForm(this.selectedTemplate);
-      this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER, RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED, null, templateID);
+      this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER, RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED, null, templateID, {
+        content_type: 'voucher',
+        item_id: templateID
+      });
     }
   }, {
     key: "clearAll",
@@ -3724,25 +3818,25 @@ var RecrasVoucher = /*#__PURE__*/function () {
   }, {
     key: "getContactForm",
     value: function getContactForm(template) {
-      var _this42 = this;
+      var _this43 = this;
 
       this.options.setOption('form_id', template.contactform_id);
       var contactForm = new RecrasContactForm(this.options);
       return contactForm.getContactFormFields().then(function () {
-        _this42.contactForm = contactForm;
+        _this43.contactForm = contactForm;
         return contactForm;
       });
     }
   }, {
     key: "getVoucherTemplates",
     value: function getVoucherTemplates() {
-      var _this43 = this;
+      var _this44 = this;
 
       return this.fetchJson(this.options.getApiBase() + 'voucher_templates').then(function (templates) {
         templates = templates.filter(function (template) {
           return !!template.contactform_id;
         });
-        _this43.templates = templates;
+        _this44.templates = templates;
         return templates;
       });
     }
@@ -3788,30 +3882,30 @@ var RecrasVoucher = /*#__PURE__*/function () {
   }, {
     key: "showContactForm",
     value: function showContactForm(template) {
-      var _this44 = this;
+      var _this45 = this;
 
       return this.getContactForm(template).then(function (form) {
         return form.generateForm({
           voucherQuantitySelector: true,
-          quantityTerm: _this44.selectedTemplate.quantity_term
+          quantityTerm: _this45.selectedTemplate.quantity_term
         });
       }).then(function (html) {
-        _this44.appendHtml(html);
+        _this45.appendHtml(html);
 
-        _this44.showBuyButton();
+        _this45.showBuyButton();
 
-        _toConsumableArray(_this44.findElements('#number-of-vouchers, [name^="contactformulier"]')).forEach(function (el) {
-          el.addEventListener('change', _this44.maybeDisableBuyButton.bind(_this44));
+        _toConsumableArray(_this45.findElements('#number-of-vouchers, [name^="contactformulier"]')).forEach(function (el) {
+          el.addEventListener('change', _this45.maybeDisableBuyButton.bind(_this45));
         });
       });
     }
   }, {
     key: "showTemplates",
     value: function showTemplates(templates) {
-      var _this45 = this;
+      var _this46 = this;
 
       var templateOptions = templates.map(function (template) {
-        return "<option value=\"".concat(template.id, "\">").concat(template.name, " (").concat(_this45.formatPrice(template.price), ")");
+        return "<option value=\"".concat(template.id, "\">").concat(template.name, " (").concat(_this46.formatPrice(template.price), ")");
       });
       var html = "<select class=\"recrasVoucherTemplates\"><option>".concat(templateOptions.join(''), "</select>");
       this.appendHtml("<div class=\"recras-voucher-templates\">".concat(html, "</div>"));
@@ -3819,7 +3913,7 @@ var RecrasVoucher = /*#__PURE__*/function () {
       voucherSelectEl.addEventListener('change', function () {
         var selectedTemplateId = parseInt(voucherSelectEl.value, 10);
 
-        _this45.changeTemplate(selectedTemplateId);
+        _this46.changeTemplate(selectedTemplateId);
       });
     }
   }, {

package/dist/onlinebooking.min.js

@@ -0,0 +1 @@
+"use strict";function _objectValues(obj){var values=[];var keys=Object.keys(obj);for(var k=0;k<keys.length;k++)values.push(obj[keys[k]]);return values}function _objectEntries(obj){var entries=[];var keys=Object.keys(obj);for(var k=0;k<keys.length;k++)entries.push([keys[k],obj[keys[k]]]);return entries}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true})}else{obj[key]=value}return obj}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key]}}}return target};return _extends.apply(this,arguments)}function _slicedToArray(arr,i){return _arrayWithHoles(arr)||_iterableToArrayLimit(arr,i)||_unsupportedIterableToArray(arr,i)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _iterableToArrayLimit(arr,i){var _i=arr==null?null:typeof Symbol!=="undefined"&&arr[Symbol.iterator]||arr["@@iterator"];if(_i==null)return;var _arr=[];var _n=true;var _d=false;var _s,_e;try{for(_i=_i.call(arr);!(_n=(_s=_i.next()).done);_n=true){_arr.push(_s.value);if(i&&_arr.length===i)break}}catch(err){_d=true;_e=err}finally{try{if(!_n&&_i["return"]!=null)_i["return"]()}finally{if(_d)throw _e}}return _arr}function _arrayWithHoles(arr){if(Array.isArray(arr))return arr}function _toConsumableArray(arr){return _arrayWithoutHoles(arr)||_iterableToArray(arr)||_unsupportedIterableToArray(arr)||_nonIterableSpread()}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _unsupportedIterableToArray(o,minLen){if(!o)return;if(typeof o==="string")return _arrayLikeToArray(o,minLen);var n=Object.prototype.toString.call(o).slice(8,-1);if(n==="Object"&&o.constructor)n=o.constructor.name;if(n==="Map"||n==="Set")return Array.from(o);if(n==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return _arrayLikeToArray(o,minLen)}function _iterableToArray(iter){if(typeof Symbol!=="undefined"&&iter[Symbol.iterator]!=null||iter["@@iterator"]!=null)return Array.from(iter)}function _arrayWithoutHoles(arr){if(Array.isArray(arr))return _arrayLikeToArray(arr)}function _arrayLikeToArray(arr,len){if(len==null||len>arr.length)len=arr.length;for(var i=0,arr2=new Array(len);i<len;i++){arr2[i]=arr[i]}return arr2}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function")}}function _defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor)}}function _createClass(Constructor,protoProps,staticProps){if(protoProps)_defineProperties(Constructor.prototype,protoProps);if(staticProps)_defineProperties(Constructor,staticProps);Object.defineProperty(Constructor,"prototype",{writable:false});return Constructor}var RecrasBooking=function(){function RecrasBooking(){var _this=this;var options=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};_classCallCheck(this,RecrasBooking);this.datePicker=null;this.PAYMENT_DIRECT="mollie";this.PAYMENT_AFTERWARDS="factuur";this.RECRAS_INFINITY=99999;this.languageHelper=new RecrasLanguageHelper;if(!(options instanceof RecrasOptions)){throw new Error(this.languageHelper.translate("ERR_OPTIONS_INVALID"))}this.options=options;this.eventHelper=new RecrasEventHelper;this.eventHelper.setAnalytics(this.options.getAnalytics());this.eventHelper.setEvents(this.options.getAnalyticsEvents());var optionsPromise=this.languageHelper.setOptions(options);this.element=this.options.getElement();this.element.classList.add("recras-onlinebooking");this.fetchJson=function(url){return RecrasHttpHelper.fetchJson(url,_this.error)};this.postJson=function(url,data){return RecrasHttpHelper.postJson(_this.options.getApiBase()+url,data,_this.error.bind(_this))};if(this.options.getLocale()){if(!RecrasLanguageHelper.isValid(this.options.getLocale())){console.warn(this.languageHelper.translate("ERR_INVALID_LOCALE",{LOCALES:RecrasLanguageHelper.validLocales.join(", ")}))}else{this.languageHelper.setLocale(this.options.getLocale())}}if(this.options.getPreFilledAmounts()){if(!this.options.isSinglePackage()){console.warn(this.languageHelper.translate("ERR_AMOUNTS_NO_PACKAGE"))}}if(this.options.getPreFilledDate()){this.prefillDateIfPossible()}if(this.options.getPreFilledTime()){this.prefillTimeIfPossible()}RecrasCSSHelper.loadCSS("global");RecrasCSSHelper.loadCSS("booking");RecrasCSSHelper.loadCSS("pikaday");this.clearAll();this.loadingIndicatorShow(this.element);this.promise=optionsPromise.then(function(){return RecrasCalendarHelper.loadScript()}).then(function(){return _this.getTexts()}).then(function(texts){_this.texts=texts;return _this.getPackages()}).then(function(packages){_this.loadingIndicatorHide();var pck=_this.options.getPackageId();if(_this.options.isSinglePackage()){if(Array.isArray(pck)){pck=pck[0]}return _this.changePackage(pck)}else if(Array.isArray(pck)&&pck.length>1){packages=packages.filter(function(p){return pck.includes(p.id)})}return _this.showPackages(packages)})}_createClass(RecrasBooking,[{key:"prefillDateIfPossible",value:function prefillDateIfPossible(){var date=new Date(this.options.getPreFilledDate());if(isNaN(date.getTime())){console.warn(this.languageHelper.translate("ERR_INVALID_DATE"));return false}if(date<new Date){console.warn(this.languageHelper.translate("ERR_DATE_PAST"));return false}if(!this.options.isSinglePackage()){console.warn(this.languageHelper.translate("ERR_DATE_NO_SINGLE_PACKAGE"));return false}this.prefilledDate=date;return true}},{key:"prefillTimeIfPossible",value:function prefillTimeIfPossible(){var time=this.options.getPreFilledTime();if(!time.match(/^(2[0-3]|[01]?[0-9]):([0-5]?[0-9])$/)){console.warn(this.languageHelper.translate("ERR_INVALID_TIME"));return false}this.prefilledTime=time;return true}},{key:"hasAtLeastOneProduct",value:function hasAtLeastOneProduct(pack){if(this.shouldShowBookingSize(pack)&&this.bookingSize()>0){return true}var hasAtLeastOneProduct=false;for(var _i2=0,_this$getLinesNoBooki2=this.getLinesNoBookingSize(pack);_i2<_this$getLinesNoBooki2.length;_i2++){var line=_this$getLinesNoBooki2[_i2];var lineEl=this.findElement('[data-package-id="'.concat(line.id,'"]'));if(lineEl&&lineEl.value>0){hasAtLeastOneProduct=true}}return hasAtLeastOneProduct}},{key:"amountsValid",value:function amountsValid(pack){for(var _i4=0,_this$getLinesNoBooki4=this.getLinesNoBookingSize(pack);_i4<_this$getLinesNoBooki4.length;_i4++){var line=_this$getLinesNoBooki4[_i4];var lineEl=this.findElement('[data-package-id="'.concat(line.id,'"]'));if(!lineEl){console.warn("Element for line ".concat(line.id," not found"));return false}var aantal=lineEl.value;if(aantal>0&&aantal<line.aantal_personen){return false}if(aantal>0&&line.min&&aantal<line.min){return false}if(line.max&&aantal>line.max){return false}}if(this.shouldShowBookingSize(pack)&&this.bookingSize()>0){if(this.bookingSize()<this.bookingSizeMinimum(pack)||this.bookingSize()>this.bookingSizeMaximum(pack)){return false}}return this.hasAtLeastOneProduct(pack)}},{key:"appendHtml",value:function appendHtml(msg){this.element.insertAdjacentHTML("beforeend",msg)}},{key:"applyVoucher",value:function applyVoucher(packageID,voucherCode){var _this2=this;if(!voucherCode){this.setDiscountStatus(this.languageHelper.translate("VOUCHER_EMPTY"));return Promise.resolve(false)}if(this.appliedVouchers[voucherCode]){this.setDiscountStatus(this.languageHelper.translate("VOUCHER_ALREADY_APPLIED"));return Promise.resolve(false)}if(!this.selectedDate){this.setDiscountStatus(this.languageHelper.translate("DATE_INVALID"));return Promise.resolve(false)}return this.postJson("onlineboeking/controleervoucher",{arrangement_id:packageID,datum:RecrasDateHelper.datePartOnly(this.selectedDate),producten:this.productCounts(),vouchers:[voucherCode]}).then(function(json){var result=json[voucherCode];if(!result.valid){return Promise.resolve(false)}_this2.appliedVouchers[voucherCode]=result.processed;_this2.showTotalPrice();return true})}},{key:"recheckDiscountCode",value:function recheckDiscountCode(){var _this3=this;this.checkDiscountcode(this.selectedPackage.id,RecrasDateHelper.datePartOnly(this.selectedDate),this.discount.code).then(function(status){if(status){_this3.setDiscountStatus(_this3.languageHelper.translate("DISCOUNT_APPLIED"),false)}else{_this3.discount=null;_this3.showTotalPrice();var statusEl=_this3.findElement(".discount-status");if(statusEl){statusEl.parentNode.removeChild(statusEl)}}})}},{key:"recheckVouchers",value:function recheckVouchers(){var voucherCodes=Object.keys(this.appliedVouchers);this.appliedVouchers=[];var promises=[];for(var _i6=0;_i6<voucherCodes.length;_i6++){var voucherCode=voucherCodes[_i6];promises.push(this.applyVoucher(this.selectedPackage.id,voucherCode))}return Promise.all(promises)}},{key:"bookingSize",value:function bookingSize(){var bookingSizeEl=this.findElement(".bookingsize");if(!bookingSizeEl){return 0}var bookingSizeValue=parseInt(bookingSizeEl.value,10);if(isNaN(bookingSizeValue)){return 0}return bookingSizeValue}},{key:"bookingSizeLines",value:function bookingSizeLines(pack){return pack.regels.filter(function(line){return line.onlineboeking_aantalbepalingsmethode==="boekingsgrootte"})}},{key:"bookingSizeMaximum",value:function bookingSizeMaximum(pack){var lines=this.bookingSizeLines(pack).filter(function(line){return line.max});if(lines.length===0){return this.RECRAS_INFINITY}var maxes=lines.map(function(line){return line.max});return Math.min.apply(Math,_toConsumableArray(maxes))}},{key:"bookingSizeLineMinimum",value:function bookingSizeLineMinimum(line){if(line.min){return line.min}if(line.onlineboeking_aantalbepalingsmethode==="vast"){return 0}return line.product.minimum_aantal}},{key:"bookingSizeMinimum",value:function bookingSizeMinimum(pack){var _this4=this;var minSize=0;this.bookingSizeLines(pack).forEach(function(line){minSize=Math.max(minSize,_this4.bookingSizeLineMinimum(line))});return minSize}},{key:"amountFromPersons",value:function amountFromPersons(product,persons){return persons;if(product.aantalbepaling==="vast"){return product.aantal}var fn=product.per_x_personen_afronding==="beneden"?Math.floor:Math.ceil;return product.aantal*fn(persons/product.per_x_personen)}},{key:"bookingSizePrice",value:function bookingSizePrice(pack){var _this5=this;var nrOfPersons=Math.max(pack.aantal_personen,1);var price=0;var lines=this.bookingSizeLines(pack);lines.forEach(function(line){price+=Math.max(_this5.amountFromPersons(line.product,nrOfPersons),line.product.minimum_aantal)*parseFloat(line.product.verkoop)});return price/nrOfPersons}},{key:"filterPackagesFromoptions",value:function filterPackagesFromoptions(packages){var pck=this.options.getPackageId();if(!Array.isArray(pck)){return packages}return packages.filter(function(p){return pck.includes(p.id)})}},{key:"changePackage",value:function changePackage(packageID){var _this6=this;var selectedPackage=this.packages.filter(function(p){return p.id===packageID});this.appliedVouchers={};this.discount=null;if(selectedPackage.length===0){this.selectedPackage=null;this.clearAll();var packages=this.filterPackagesFromoptions(this.packages);this.showPackages(packages);this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_RESET);return Promise.resolve(false)}else{this.clearAllExceptPackageSelection();this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED,selectedPackage[0].arrangement,selectedPackage[0].id,{content_type:"package",item_id:selectedPackage[0].id})}this.selectedPackage=selectedPackage[0];return this.showProducts(this.selectedPackage).then(function(){_this6.nextSectionActive(".recras-package-select",".recras-amountsform");_this6.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_PRODUCTS_SHOWN);if(_this6.options.getAutoScroll()===true){var scrollOptions={behavior:"smooth"};if(!("scrollBehavior"in document.documentElement.style)){scrollOptions=true}_this6.findElement(".recras-amountsform").scrollIntoView(scrollOptions)}_this6.checkDependencies();_this6.loadingIndicatorShow(_this6.findElement(".recras-amountsform"));return _this6.showDateTimeSelection(_this6.selectedPackage)}).then(function(){_this6.loadingIndicatorHide();_this6.showContactForm(_this6.selectedPackage)})}},{key:"checkBookingSize",value:function checkBookingSize(pack){if(!this.shouldShowBookingSize(pack)){return}var bookingSize=this.bookingSize();var bsMaximum=this.bookingSizeMaximum(pack);var bsMinimum=this.bookingSizeMinimum(pack);if(bookingSize<bsMinimum){this.setMinMaxAmountWarning("bookingsize",bsMinimum,"minimum")}else if(bookingSize>bsMaximum){this.setMinMaxAmountWarning("bookingsize",bsMaximum,"maximum")}this.maybeDisableBookButton()}},{key:"checkDependencies",value:function checkDependencies(){var _this7=this;_toConsumableArray(this.findElements(".recras-product-dependency")).forEach(function(el){el.parentNode.removeChild(el)});_toConsumableArray(this.findElements("[data-package-id]")).forEach(function(el){el.classList.remove("recras-input-invalid")});this.requiresProduct=false;this.productCounts().forEach(function(line){if(line.aantal>0){var packageLineID=line.arrangementsregel_id;var product=_this7.findProduct(packageLineID).product;var thisProductRequiresProduct=false;if(!product.vereist_product){console.warn("You are logged in to this particular Recras. Because of API differences between logged-in and logged-out state, required products do not work as expected.")}else{product.vereist_product.forEach(function(vp){if(!_this7.dependencySatisfied(line.aantal,vp)){thisProductRequiresProduct=true;_this7.requiresProduct=true;var requiredAmount=_this7.requiredAmount(line.aantal,vp);var requiredProductName=_this7.getProductByID(vp.vereist_product_id).weergavenaam;var message=_this7.languageHelper.translate("PRODUCT_REQUIRED",{NUM:line.aantal,PRODUCT:product.weergavenaam,REQUIRED_AMOUNT:requiredAmount,REQUIRED_PRODUCT:requiredProductName});_this7.findElement(".recras-amountsform").insertAdjacentHTML("beforeend",'<span class="recras-product-dependency">'.concat(message,"</span>"))}})}if(thisProductRequiresProduct){var productInput=_this7.findElement('[data-package-id="'.concat(packageLineID,'"]'));productInput.classList.add("recras-input-invalid")}}});this.maybeDisableBookButton()}},{key:"checkDiscountAndVoucher",value:function checkDiscountAndVoucher(){var _this8=this;var discountPromise=this.checkDiscountcode(this.selectedPackage.id,RecrasDateHelper.datePartOnly(this.selectedDate),this.findElement("#discountcode").value.trim());var voucherPromise=this.applyVoucher(this.selectedPackage.id,this.findElement("#discountcode").value.trim());Promise.all([discountPromise,voucherPromise]).then(function(_ref){var _ref2=_slicedToArray(_ref,2),discountStatus=_ref2[0],voucherStatus=_ref2[1];if(discountStatus||voucherStatus){var status;if(discountStatus){status="DISCOUNT_APPLIED"}else{status="VOUCHER_APPLIED"}_this8.setDiscountStatus(_this8.languageHelper.translate(status),false);_this8.findElement("#discountcode").value="";_this8.nextSectionActive(".recras-discounts",".recras-contactform")}else{_this8.setDiscountStatus(_this8.languageHelper.translate("DISCOUNT_INVALID"))}})}},{key:"checkDiscountcode",value:function checkDiscountcode(packageID,date,code){var _this9=this;return this.fetchJson(this.options.getApiBase()+"onlineboeking/controleerkortingscode"+"?datum="+date+"&arrangement="+packageID+"&kortingscode="+encodeURIComponent(code)).then(function(discount){if(discount===false){return false}discount.code=code;_this9.discount=discount;_this9.showTotalPrice();return true})}},{key:"checkMaximumForPackage",value:function checkMaximumForPackage(){var _this10=this;var maxPerLine=this.selectedPackage.maximum_aantal_personen_online;if(maxPerLine===null){return Promise.resolve(null)}var showWarning=false;var selectedProducts=this.productCounts();return this.languageHelper.filterTags(this.texts.maximum_aantal_online_boeking_overschreden,this.selectedPackage?this.selectedPackage.id:null).then(function(msg){selectedProducts.forEach(function(p){if(p.aantal>maxPerLine&&!showWarning){var input=_this10.findElement('[data-package-id="'.concat(p.arrangementsregel_id,'"]'));if(!input){input=_this10.findElement("#bookingsize")}if(input){var warningEl=document.createElement("div");warningEl.classList.add("maximum-amount");warningEl.classList.add("recras-full-width");warningEl.innerHTML=msg;input.parentNode.parentNode.insertBefore(warningEl,input.parentNode.nextSibling);input.classList.add("recras-input-invalid")}else{_this10.findElement(".recras-amountsform").insertAdjacentHTML("beforeend",'<span class="maximum-amount">'.concat(msg,"</span>"))}showWarning=true}})})}},{key:"contactFormValid",value:function contactFormValid(){var contactFormIsValid=this.findElement(".recras-contactform").checkValidity();var contactFormRequiredCheckboxes=this.contactForm.checkRequiredCheckboxes();return contactFormIsValid&&contactFormRequiredCheckboxes}},{key:"setMinMaxAmountWarning",value:function setMinMaxAmountWarning(lineID,minAmount){var type=arguments.length>2&&arguments[2]!==undefined?arguments[2]:"minimum";var warnEl=document.createElement("span");warnEl.classList.add(type+"-amount");var lineEl=this.findElement("#".concat(lineID));if(!lineEl){console.warn("Element for line ".concat(lineID," not found"));return false}lineEl.classList.add("recras-input-invalid");var text;if(type==="minimum"){text=this.languageHelper.translate("PRODUCT_MINIMUM",{MINIMUM:minAmount})}else{text=this.languageHelper.translate("PRODUCT_MAXIMUM",{MAXIMUM:minAmount})}warnEl.innerHTML=text;var label=this.findElement('label[for="'.concat(lineID,'"]'));label.parentNode.appendChild(warnEl)}},{key:"checkMinMaxAmounts",value:function checkMinMaxAmounts(){for(var _i8=0,_this$productCounts2=this.productCounts();_i8<_this$productCounts2.length;_i8++){var product=_this$productCounts2[_i8];if(product.aantal<1){continue}var packageLineID=product.arrangementsregel_id;var packageLine=this.findProduct(packageLineID);var input=this.findElement('[data-package-id="'.concat(packageLineID,'"]'));if(!input){continue}if(product.aantal<packageLine.product.minimum_aantal){this.setMinMaxAmountWarning(input.id,packageLine.product.minimum_aantal,"minimum")}else if(product.aantal<packageLine.aantal_personen){this.setMinMaxAmountWarning(input.id,packageLine.aantal_personen,"minimum")}else if(packageLine.min!==undefined&&product.aantal<packageLine.min){this.setMinMaxAmountWarning(input.id,packageLine.min,"minimum")}else if(packageLine.max!==null&&product.aantal>packageLine.max){this.setMinMaxAmountWarning(input.id,packageLine.max,"maximum")}}}},{key:"clearAll",value:function clearAll(){this.clearElements(this.element.children)}},{key:"clearAllExceptPackageSelection",value:function clearAllExceptPackageSelection(){var packageSelect=this.findElement(".recras-package-select");if(packageSelect){packageSelect.classList.remove("recras-completed");packageSelect.classList.add("recras-active")}var elements=document.querySelectorAll("#"+this.element.id+" > *:not(.recras-package-select)");this.clearElements(elements)}},{key:"clearElements",value:function clearElements(elements){if(this.datePicker){this.datePicker.destroy()}this.availableDays=[];_toConsumableArray(elements).forEach(function(el){el.parentNode.removeChild(el)});this.maybeAddLatestErrorElement()}},{key:"dependencySatisfied",value:function dependencySatisfied(hasNow,requiredProduct){for(var _i10=0,_this$productCounts4=this.productCounts();_i10<_this$productCounts4.length;_i10++){var line=_this$productCounts4[_i10];if(line.aantal===0){continue}var product=this.findProduct(line.arrangementsregel_id).product;if(product.id!==parseInt(requiredProduct.vereist_product_id,10)){continue}var requiredAmount=this.requiredAmount(hasNow,requiredProduct);return line.aantal>=requiredAmount}return false}},{key:"error",value:function error(msg){this.loadingIndicatorHide();var bookingErrorsEl=this.findElement("#bookingErrors");if(bookingErrorsEl){bookingErrorsEl.parentNode.appendChild(this.findElement(".latestError"))}this.maybeAddLatestErrorElement();this.findElement(".latestError").innerHTML="<strong>".concat(this.languageHelper.translate("ERR_GENERAL"),"</strong><p>").concat(msg,"</p>")}},{key:"findElement",value:function findElement(querystring){return this.element.querySelector(querystring)}},{key:"findElements",value:function findElements(querystring){return this.element.querySelectorAll(querystring)}},{key:"findProduct",value:function findProduct(packageLineID){return this.selectedPackage.regels.filter(function(line){return line.id===packageLineID})[0]}},{key:"formatPrice",value:function formatPrice(price){return this.languageHelper.formatPrice(price)}},{key:"getAvailableDays",value:function getAvailableDays(packageID,begin,end){var _this11=this;var postData={arrangement_id:packageID,begin:RecrasDateHelper.datePartOnly(begin),eind:RecrasDateHelper.datePartOnly(end),producten:this.productCountsNoBookingSize()};if(this.shouldShowBookingSize(this.selectedPackage)){postData.boekingsgrootte=this.bookingSize()}return this.postJson("onlineboeking/beschikbaredagen",postData).then(function(json){_this11.availableDays=_this11.availableDays.concat(json);return _this11.availableDays})}},{key:"getAvailableTimes",value:function getAvailableTimes(packageID,date){var _this12=this;return this.postJson("onlineboeking/beschikbaretijden",{arrangement_id:packageID,datum:RecrasDateHelper.datePartOnly(date),producten:this.productCounts()}).then(function(json){_this12.availableTimes=json;return _this12.availableTimes})}},{key:"getContactForm",value:function getContactForm(pack){var _this13=this;this.options.setOption("form_id",pack.onlineboeking_contactformulier_id);var contactForm=new RecrasContactForm(this.options);return contactForm.getContactFormFields().then(function(){_this13.contactForm=contactForm;return contactForm})}},{key:"getDiscountPrice",value:function getDiscountPrice(discount){if(!discount){return 0}return discount.percentage/100*this.getSubTotal()*-1}},{key:"getLinesBookingSize",value:function getLinesBookingSize(pack){return pack.regels.filter(function(line){return line.onlineboeking_aantalbepalingsmethode==="boekingsgrootte"})}},{key:"getLinesNoBookingSize",value:function getLinesNoBookingSize(pack){return pack.regels.filter(function(line){return line.onlineboeking_aantalbepalingsmethode!=="boekingsgrootte"})}},{key:"getPackages",value:function getPackages(){var _this14=this;return this.fetchJson(this.options.getApiBase()+"arrangementen").then(function(json){_this14.packages=json;return _this14.packages})}},{key:"getProductByID",value:function getProductByID(id){var products=this.selectedPackage.regels.map(function(r){return r.product});return products.filter(function(p){return p.id===id})[0]}},{key:"getSubTotal",value:function getSubTotal(){var _this15=this;var total=0;this.productCounts().forEach(function(line){var product=_this15.findProduct(line.arrangementsregel_id).product;var aantal=line.aantal;if(isNaN(aantal)){aantal=0}total+=aantal*parseFloat(product.verkoop)});return total}},{key:"getSetting",value:function getSetting(settingName){return this.fetchJson(this.options.getApiBase()+"instellingen/"+settingName)}},{key:"getTexts",value:function getTexts(){var settings=["maximum_aantal_online_boeking_overschreden","online_boeking_betaalkeuze","online_boeking_betaalkeuze_achteraf_titel","online_boeking_betaalkeuze_ideal_titel","online_boeking_step0_text_pre","online_boeking_step0_text_post","online_boeking_step1_text_pre","online_boeking_step1_text_post","online_boeking_step3_text_post"];var promises=[];for(var _i12=0;_i12<settings.length;_i12++){var setting=settings[_i12];promises.push(this.getSetting(setting))}return Promise.all(promises).then(function(settings){var texts={};settings.forEach(function(setting){texts[setting.slug]=setting.waarde});return texts})}},{key:"getTotalPrice",value:function getTotalPrice(){var total=this.getSubTotal();total+=this.getDiscountPrice(this.discount);total+=this.getVouchersPrice();return total}},{key:"getVouchersPrice",value:function getVouchersPrice(){var voucherPrice=0;_objectValues(this.appliedVouchers).forEach(function(voucher){_objectValues(voucher).forEach(function(line){voucherPrice-=line.aantal*line.prijs_per_stuk})});return voucherPrice}},{key:"loadingIndicatorHide",value:function loadingIndicatorHide(){_toConsumableArray(document.querySelectorAll(".recrasLoadingIndicator")).forEach(function(el){el.parentNode.removeChild(el)})}},{key:"loadingIndicatorShow",value:function loadingIndicatorShow(afterEl){if(!afterEl){return}afterEl.insertAdjacentHTML("beforeend",'<span class="recrasLoadingIndicator">'.concat(this.languageHelper.translate("LOADING"),"</span>"))}},{key:"maybeAddLatestErrorElement",value:function maybeAddLatestErrorElement(){var errorEl=this.findElement(".latestError");if(!errorEl){this.appendHtml('<div class="latestError"></div>')}}},{key:"maybeDisableBookButton",value:function maybeDisableBookButton(){var _this16=this;var button=this.findElement(".bookPackage");if(!button){return false}var bookingDisabledReasons=[];if(this.requiresProduct){bookingDisabledReasons.push("BOOKING_DISABLED_REQUIRED_PRODUCT")}if(!this.amountsValid(this.selectedPackage)){bookingDisabledReasons.push("BOOKING_DISABLED_AMOUNTS_INVALID")}if(!this.selectedDate){bookingDisabledReasons.push("BOOKING_DISABLED_INVALID_DATE")}if(!this.selectedTime){bookingDisabledReasons.push("BOOKING_DISABLED_INVALID_TIME")}if(!this.contactFormValid()){bookingDisabledReasons.push("BOOKING_DISABLED_CONTACT_FORM_INVALID")}var agreeEl=this.findElement("#recrasAgreeToAttachments");if(agreeEl&&!agreeEl.checked){bookingDisabledReasons.push("BOOKING_DISABLED_AGREEMENT")}if(bookingDisabledReasons.length>0){var reasonsList=bookingDisabledReasons.map(function(reason){return _this16.languageHelper.translate(reason)}).join("<li>");this.findElement("#bookingErrors").innerHTML="<ul><li>".concat(reasonsList,"</ul>");button.setAttribute("disabled","disabled")}else{this.findElement("#bookingErrors").innerHTML="";button.removeAttribute("disabled")}}},{key:"nextSectionActive",value:function nextSectionActive(completedQuery,activeQuery){if(completedQuery&&this.findElement(completedQuery)){this.findElement(completedQuery).classList.add("recras-completed");this.findElement(completedQuery).classList.remove("recras-active")}if(activeQuery&&this.findElement(activeQuery)){this.findElement(activeQuery).classList.add("recras-active")}}},{key:"normaliseDate",value:function normaliseDate(date,packageStart,bookingStart){var diffSeconds=(date-packageStart)/1e3;var tempDate=new Date(bookingStart.getTime());return new Date(tempDate.setSeconds(tempDate.getSeconds()+diffSeconds))}},{key:"paymentMethods",value:function paymentMethods(pack){var methods=[];if(pack.mag_online_geboekt_worden_direct_betalen){methods.push(this.PAYMENT_DIRECT)}if(pack.mag_online_geboekt_worden_achteraf_betalen){methods.push(this.PAYMENT_AFTERWARDS)}return methods}},{key:"preFillAmounts",value:function preFillAmounts(amounts){var _this17=this;_objectEntries(amounts).forEach(function(idAmount){var el;if(idAmount[0]==="bookingsize"){el=_this17.findElement("#bookingsize")}else{el=_this17.findElement('[data-package-id="'.concat(idAmount[0],'"]'))}if(el){el.value=idAmount[1];_this17.updateProductPrice(el)}});this.updateProductAmounts()}},{key:"previewTimes",value:function previewTimes(){var _this18=this;_toConsumableArray(this.findElements(".time-preview")).forEach(function(el){el.parentNode.removeChild(el)});if(this.selectedTime){var linesWithTime=this.selectedPackage.regels.filter(function(line){return!!line.begin});var linesBegin=linesWithTime.map(function(line){return new Date(line.begin)});var packageStart=new Date(Math.min.apply(Math,_toConsumableArray(linesBegin)));var linesNoBookingSize=this.getLinesNoBookingSize(this.selectedPackage);linesNoBookingSize.forEach(function(line,idx){if(line.begin!==null||line.eind!==null){var normalisedStart=_this18.normaliseDate(new Date(line.begin),packageStart,_this18.selectedDate);var normalisedEnd=_this18.normaliseDate(new Date(line.eind),packageStart,_this18.selectedDate);_this18.findElement('label[for="packageline'.concat(idx,'"]')).insertAdjacentHTML("afterbegin",'<span class="time-preview">'.concat(RecrasDateHelper.timePartOnly(normalisedStart)," – ").concat(RecrasDateHelper.timePartOnly(normalisedEnd),"</span>"))}})}}},{key:"productCountsBookingSize",value:function productCountsBookingSize(){var _this19=this;return this.getLinesBookingSize(this.selectedPackage).map(function(line){return{aantal:_this19.bookingSize(),arrangementsregel_id:line.id}})}},{key:"productCountsNoBookingSize",value:function productCountsNoBookingSize(){return _toConsumableArray(this.findElements('[id^="packageline"]')).map(function(line){return{aantal:isNaN(parseInt(line.value))?0:parseInt(line.value),arrangementsregel_id:parseInt(line.dataset.packageId,10)}})}},{key:"productCounts",value:function productCounts(){var counts=[];counts=counts.concat(this.productCountsNoBookingSize());counts=counts.concat(this.productCountsBookingSize());return counts}},{key:"removeWarnings",value:function removeWarnings(){_toConsumableArray(this.findElements(".booking-error:not(#bookingErrors)")).forEach(function(el){el.parentNode.removeChild(el)});_toConsumableArray(this.findElements(".minimum-amount")).forEach(function(el){el.parentNode.removeChild(el)});_toConsumableArray(this.findElements(".maximum-amount")).forEach(function(el){el.parentNode.removeChild(el)});_toConsumableArray(this.findElements(".recras-input-invalid")).forEach(function(el){el.classList.remove("recras-input-invalid")});_toConsumableArray(this.findElements(".recras-success")).forEach(function(el){el.parentNode.removeChild(el)})}},{key:"requiredAmount",value:function requiredAmount(hasNow,requiredProduct){var requiredFraction=hasNow/requiredProduct.per_x_aantal;if(requiredProduct.afronding==="boven"){requiredFraction=Math.ceil(requiredFraction)}else{requiredFraction=Math.floor(requiredFraction)}return requiredProduct.aantal*requiredFraction}},{key:"resetForm",value:function resetForm(){this.changePackage(null)}},{key:"selectSingleTime",value:function selectSingleTime(){if(this.findElements("#recras-onlinebooking-time option[value]").length!==1){return}this.findElement("#recras-onlinebooking-time option[value]").selected=true;var event;try{event=new Event("change")}catch(e){event=document.createEvent("Event");event.initEvent("change",true,true)}this.findElement("#recras-onlinebooking-time").dispatchEvent(event)}},{key:"setDiscountStatus",value:function setDiscountStatus(statusText){var isError=arguments.length>1&&arguments[1]!==undefined?arguments[1]:true;var statusEl=this.findElement(".discount-status");if(!statusEl){this.element.querySelector(".recras-discounts").insertAdjacentHTML("beforeend",'<span class="discount-status"></span>');statusEl=this.findElement(".discount-status")}if(isError){statusEl.classList.add("booking-error")}else{statusEl.classList.remove("booking-error")}statusEl.innerHTML=statusText}},{key:"setHtml",value:function setHtml(msg){this.element.innerHTML=msg}},{key:"showStandardAttachments",value:function showStandardAttachments(){if(!this.selectedPackage||!this.findElement(".standard-attachments")){return true}var attachments=this.standardAttachments(this.selectedPackage);var attachmentHtml="";if(Object.keys(attachments).length){attachmentHtml+='<p><label><input type="checkbox" id="recrasAgreeToAttachments" required>'.concat(this.languageHelper.translate("AGREE_ATTACHMENTS"),"</label></p>");attachmentHtml+="<ul>";_objectValues(attachments).forEach(function(attachment){attachmentHtml+='<li><a href="'.concat(attachment.filename,'" download target="_blank">').concat(attachment.naam,"</a></li>")});attachmentHtml+="</ul>"}this.findElement(".standard-attachments").innerHTML=attachmentHtml;var agreeEl=this.findElement("#recrasAgreeToAttachments");if(agreeEl){agreeEl.addEventListener("change",this.maybeDisableBookButton.bind(this))}}},{key:"showTotalPrice",value:function showTotalPrice(){_toConsumableArray(this.findElements(".discountLine, .voucherLine, .priceWithDiscount")).forEach(function(el){el.parentNode.removeChild(el)});var html="";if(this.discount){html+='<div class="discountLine"><div>'.concat(this.discount.naam,"</div><div>").concat(this.formatPrice(this.getDiscountPrice(this.discount)),"</div></div>")}if(Object.keys(this.appliedVouchers).length){html+='<div class="voucherLine"><div>'.concat(this.languageHelper.translate("VOUCHERS_DISCOUNT"),"</div><div>").concat(this.formatPrice(this.getVouchersPrice()),"</div></div>")}if(this.discount||Object.keys(this.appliedVouchers).length){html+='<div class="priceWithDiscount"><div>'.concat(this.languageHelper.translate("PRICE_TOTAL_WITH_DISCOUNT"),"</div><div>").concat(this.formatPrice(this.getTotalPrice()),"</div></div>")}var elementToInsertBefore=this.findElement(".recras-amountsform p:last-of-type");if(elementToInsertBefore){elementToInsertBefore.insertAdjacentHTML("beforebegin",html)}var subtotalEl=this.findElement(".priceSubtotal");if(subtotalEl){subtotalEl.innerHTML=this.formatPrice(this.getSubTotal())}}},{key:"sortPackages",value:function sortPackages(packages){return packages.sort(function(a,b){var aName=a.weergavenaam||a.arrangement;var bName=b.weergavenaam||b.arrangement;if(aName<bName){return-1}if(aName>bName){return 1}return 0})}},{key:"shouldShowBookingSize",value:function shouldShowBookingSize(pack){return this.bookingSizeLines(pack).length>0}},{key:"showBookButton",value:function showBookButton(){var _this20=this;var promises=[];var paymentMethods=this.paymentMethods(this.selectedPackage);var paymentText="";var textPostBooking="";if(paymentMethods.indexOf(this.PAYMENT_DIRECT)>-1&&paymentMethods.indexOf(this.PAYMENT_AFTERWARDS)>-1){promises.push(this.languageHelper.filterTags(this.texts.online_boeking_betaalkeuze,this.selectedPackage?this.selectedPackage.id:null));promises.push(this.languageHelper.filterTags(this.texts.online_boeking_betaalkeuze_ideal_titel,this.selectedPackage?this.selectedPackage.id:null));promises.push(this.languageHelper.filterTags(this.texts.online_boeking_betaalkeuze_achteraf_titel,this.selectedPackage?this.selectedPackage.id:null));Promise.all(promises).then(function(msgs){paymentText="<p>".concat(msgs[0],"</p>");paymentText+='<ul>\n                <li><label><input type="radio" name="paymentMethod" checked value="'.concat(_this20.PAYMENT_DIRECT,'"> ').concat(msgs[1],'</label>\n                <li><label><input type="radio" name="paymentMethod" value="').concat(_this20.PAYMENT_AFTERWARDS,'"> ').concat(msgs[2],"</label>\n            </ul>")})}else{promises.push(Promise.resolve(""))}promises.push(this.languageHelper.filterTags(this.texts.online_boeking_step3_text_post,this.selectedPackage?this.selectedPackage.id:null).then(function(msg){textPostBooking=msg}));Promise.all(promises).then(function(){var html='<div class="recras-finalise">\n                <p>'.concat(textPostBooking,'</p>\n                <div class="standard-attachments"></div>\n                ').concat(paymentText,'\n                <button type="submit" class="bookPackage" disabled>').concat(_this20.languageHelper.translate("BUTTON_BOOK_NOW"),'</button>\n                <div class="booking-error" id="bookingErrors"></div>\n            </div>');_this20.appendHtml(html);_this20.findElement(".bookPackage").addEventListener("click",_this20.submitBooking.bind(_this20));_this20.maybeDisableBookButton();_this20.updateProductAmounts()})}},{key:"showDiscountFields",value:function showDiscountFields(){var _this21=this;var existingEl=this.findElement(".recras-discounts");if(existingEl){existingEl.parentNode.removeChild(existingEl)}var html='\n            <form class="recras-discounts">\n                <div>\n                    <label for="discountcode">'.concat(this.languageHelper.translate("DISCOUNT_TITLE"),'</label>\n                    <input type="text" id="discountcode" class="discountcode" maxlength="50" disabled>\n                </div>\n                <button type="submit" class="button-secondary">').concat(this.languageHelper.translate("DISCOUNT_CHECK"),"</button>\n            </form>\n        ");this.findElement(".recras-datetime").insertAdjacentHTML("afterend",html);this.findElement(".recras-discounts").addEventListener("submit",function(e){e.preventDefault();_this21.checkDiscountAndVoucher();return false})}},{key:"showContactForm",value:function showContactForm(pack){var _this22=this;this.loadingIndicatorShow(this.findElement(".recras-datetime"));this.getContactForm(pack).then(function(form){return form.generateForm()}).then(function(html){_this22.appendHtml(html);_this22.loadingIndicatorHide();_this22.showBookButton();_this22.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_CONTACT_FORM_SHOWN);_toConsumableArray(_this22.findElements('[name^="contactformulier"]')).forEach(function(el){el.addEventListener("input",_this22.maybeDisableBookButton.bind(_this22));el.addEventListener("input",function(){if(_this22.contactFormValid()){_this22.nextSectionActive(".recras-contactform",".recras-finalise")}})})})}},{key:"maybeFillTime",value:function maybeFillTime(times){times=times.map(function(time){return RecrasDateHelper.timePartOnly(new Date(time))});this.showTimes(times);this.loadingIndicatorHide();if(!this.prefilledTime){this.selectSingleTime();return}if(times.includes(this.prefilledTime)){this.selectTime(this.prefilledTime);this.selectedDate=RecrasDateHelper.setTimeForDate(this.selectedDate,this.selectedTime);if(this.options.getPreviewTimes()===true){this.previewTimes()}return}this.toggleTimeField("show")}},{key:"calendarOnDateSelect",value:function calendarOnDateSelect(date,packageId){var _this23=this;this.removeWarnings();this.loadingIndicatorShow(this.findElement('label[for="recras-onlinebooking-time"]'));this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_DATE_SELECTED,RecrasDateHelper.datePartOnly(date));this.selectedDate=date;if(this.hasAtLeastOneProduct(this.selectedPackage)){this.getAvailableTimes(packageId,date).then(function(times){return _this23.maybeFillTime(times)})}if(this.discount&&this.discount.code){this.recheckDiscountCode()}this.findElement("#discountcode").removeAttribute("disabled");this.maybeDisableBookButton()}},{key:"calendarOnDraw",value:function calendarOnDraw(pika,packageId){var lastMonthYear=pika.calendars[pika.calendars.length-1];var lastDay=new Date(lastMonthYear.year,lastMonthYear.month,31);var lastAvailableDay=this.availableDays.reduce(function(acc,curVal){return curVal>acc?curVal:acc},"");if(!lastAvailableDay){lastAvailableDay=new Date}else{lastAvailableDay=new Date(lastAvailableDay)}if(lastAvailableDay>lastDay){return}var newEndDate=RecrasDateHelper.clone(lastAvailableDay);newEndDate.setFullYear(lastMonthYear.year);newEndDate.setMonth(lastMonthYear.month+2);this.getAvailableDays(packageId,lastAvailableDay,newEndDate)}},{key:"addDateTimeSelectionHtml",value:function addDateTimeSelectionHtml(){var today=RecrasDateHelper.datePartOnly(new Date);var html='<form class="recras-datetime">\n            <label for="recras-onlinebooking-date">\n                '.concat(this.languageHelper.translate("DATE"),'\n            </label>\n            <input type="text" id="recras-onlinebooking-date" class="recras-onlinebooking-date" min="').concat(today,'" disabled readonly autocomplete="off">\n            <label for="recras-onlinebooking-time">\n                ').concat(this.languageHelper.translate("TIME"),'\n            </label>\n            <select id="recras-onlinebooking-time" class="recras-onlinebooking-time" disabled autocomplete="off"></select>\n        </form>');this.appendHtml(html)}},{key:"selectTime",value:function selectTime(time){this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_TIME_SELECTED);this.selectedTime=time;this.maybeDisableBookButton()}},{key:"showDateTimeSelection",value:function showDateTimeSelection(pack){var _this24=this;this.addDateTimeSelectionHtml();this.showDiscountFields();if(this.prefilledDate){this.toggleDateField("hide");this.calendarOnDateSelect(this.prefilledDate,pack.id)}if(this.prefilledTime){this.toggleTimeField("hide")}if(this.prefilledDate&&this.prefilledTime){this.findElement(".recras-datetime").classList.add("recrasHidden")}if(this.options.getPreFilledAmounts()){this.preFillAmounts(this.options.getPreFilledAmounts())}var pikadayOptions=_extends(RecrasCalendarHelper.defaultOptions(),{disableDayFn:function disableDayFn(day){var dateFmt=RecrasDateHelper.datePartOnly(day);return _this24.availableDays.indexOf(dateFmt)===-1},field:this.findElement(".recras-onlinebooking-date"),i18n:RecrasCalendarHelper.i18n(this.languageHelper),onDraw:function onDraw(pika){return _this24.calendarOnDraw(pika,pack.id)},onSelect:function onSelect(date){return _this24.calendarOnDateSelect(date,pack.id)}});this.datePicker=new Pikaday(pikadayOptions);this.findElement(".recras-onlinebooking-time").addEventListener("change",function(){_this24.selectTime(_this24.findElement(".recras-onlinebooking-time").value);_this24.nextSectionActive(".recras-datetime",".recras-discounts");_this24.nextSectionActive(null,".recras-contactform");_this24.selectedDate=RecrasDateHelper.setTimeForDate(_this24.selectedDate,_this24.selectedTime);if(_this24.options.getPreviewTimes()===true){_this24.previewTimes()}_this24.maybeDisableBookButton()})}},{key:"showPackages",value:function showPackages(packages){var _this25=this;packages=packages.filter(function(p){return p.mag_online});var packagesSorted=this.sortPackages(packages);var packageOptions=packagesSorted.map(function(pack){return'<option value="'.concat(pack.id,'">').concat(pack.weergavenaam||pack.arrangement)});var html='<select class="recras-package-selection"><option>'+packageOptions.join("")+"</select>";var promises=[];promises.push(this.languageHelper.filterTags(this.texts.online_boeking_step0_text_pre,this.selectedPackage?this.selectedPackage.id:null));promises.push(this.languageHelper.filterTags(this.texts.online_boeking_step0_text_post,this.selectedPackage?this.selectedPackage.id:null));return Promise.all(promises).then(function(msgs){_this25.appendHtml('<div class="recras-package-select recras-active"><p>'.concat(msgs[0],"</p>").concat(html,"<p>\n").concat(msgs[1],"</p></div>"));_this25.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_PACKAGES_SHOWN);var packageSelectEl=_this25.findElement(".recras-package-selection");packageSelectEl.addEventListener("change",function(){var selectedPackageId=parseInt(packageSelectEl.value,10);_this25.changePackage(selectedPackageId)})})}},{key:"showProducts",value:function showProducts(pack){var _this26=this;var promises=[];promises.push(this.languageHelper.filterTags(this.texts.online_boeking_step1_text_pre,this.selectedPackage?this.selectedPackage.id:null));promises.push(this.languageHelper.filterTags(this.texts.online_boeking_step1_text_post,this.selectedPackage?this.selectedPackage.id:null));return Promise.all(promises).then(function(msgs){var html='<form class="recras-amountsform" onsubmit="return false">';html+="<p>".concat(msgs[0],"</p>");html+='<div class="recras-heading">\n                <div>&nbsp;</div>\n                <div>'.concat(_this26.languageHelper.translate("HEADING_QUANTITY"),'</div>\n                <div class="recras-price">').concat(_this26.languageHelper.translate("HEADING_PRICE"),"</div>\n            </div>");if(_this26.shouldShowBookingSize(pack)){html+="<div>";html+='<div><label for="bookingsize">'.concat(pack.weergavenaam||pack.arrangement,"</label></div>");html+='<input type="number" id="bookingsize" class="bookingsize" min="'.concat(_this26.bookingSizeMinimum(pack),'" max="').concat(_this26.bookingSizeMaximum(pack),'" placeholder="0" data-price="').concat(_this26.bookingSizePrice(pack),'">');html+='<div class="recras-price recrasUnitPrice">'.concat(_this26.formatPrice(_this26.bookingSizePrice(pack)),"</div>");html+="</div>"}var linesNoBookingSize=_this26.getLinesNoBookingSize(pack);linesNoBookingSize.forEach(function(line,idx){html+="<div><div>";html+='<label for="packageline'.concat(idx,'">').concat(line.beschrijving_templated,"</label>");var maxAttr=line.max?'max="'.concat(line.max,'"'):"";html+='</div><input id="packageline'.concat(idx,'" type="number" min="0" ').concat(maxAttr,' placeholder="0" data-package-id="').concat(line.id,'" data-price="').concat(line.product.verkoop,'">');html+='<div class="recras-price recrasUnitPrice">'.concat(_this26.formatPrice(line.product.verkoop),"</div>");html+="</div>"});html+='<div class="priceWithoutDiscount">\n                <div>'.concat(_this26.languageHelper.translate("PRICE_TOTAL"),'</div>\n                <div></div>\n                <div class="priceSubtotal"></div>\n            </div>');html+="<p>".concat(msgs[1],"</p>");html+="</form>";_this26.appendHtml(html);_toConsumableArray(_this26.findElements('[id^="packageline"], .bookingsize')).forEach(function(el){el.addEventListener("input",_this26.updateProductAmounts.bind(_this26));el.addEventListener("input",_this26.updateProductPrice.bind(_this26,el))})})}},{key:"showTimes",value:function showTimes(times){var html="<option>";times.forEach(function(time){html+='<option value="'.concat(time,'">').concat(time)});this.findElement(".recras-onlinebooking-time").innerHTML=html;this.findElement(".recras-onlinebooking-time").removeAttribute("disabled");if(times.length===0){this.findElement(".recras-datetime").insertAdjacentHTML("afterend",'<div class="booking-error">'.concat(this.languageHelper.translate("ERR_NO_TIMES_FOR_DATE"),"</div>"))}}},{key:"clearTimes",value:function clearTimes(){this.findElement(".recras-onlinebooking-time").innerHTML="";this.findElement(".recras-onlinebooking-time").setAttribute("disabled","disabled")}},{key:"standardAttachments",value:function standardAttachments(){var _this27=this;var attachments={};if(!this.selectedPackage.onlineboeking_standaardbijlagen_meesturen){return attachments}this.productCounts().forEach(function(line){if(line.aantal>0){var product=_this27.findProduct(line.arrangementsregel_id).product;if(product.standaardbijlagen){product.standaardbijlagen.forEach(function(attachment){attachments[attachment.id]=attachment})}}});return attachments}},{key:"formatGA4Items",value:function formatGA4Items(){var _this28=this;var items=[];if(this.bookingSize()>0){var pck=this.selectedPackage;items.push({item_name:pck.weergavenaam||pck.arrangement,price:this.bookingSizePrice(pck),quantity:this.bookingSize()})}var linesNoBookingSize=this.getLinesNoBookingSize(this.selectedPackage);linesNoBookingSize=linesNoBookingSize.filter(function(line){var lineEl=_this28.findElement('[data-package-id="'.concat(line.id,'"]'));if(!lineEl){return false}if(isNaN(parseInt(lineEl.value))){return false}return parseInt(lineEl.value)>0});linesNoBookingSize=linesNoBookingSize.map(function(line){var lineEl=_this28.findElement('[data-package-id="'.concat(line.id,'"]'));return{item_name:line.beschrijving_templated,price:line.product.verkoop,quantity:parseInt(lineEl.value)}});items.push.apply(items,_toConsumableArray(linesNoBookingSize));return items}},{key:"submitBooking",value:function submitBooking(){var _this29=this;var productCounts=this.productCounts().map(function(line){return line.aantal});var productSum=productCounts.reduce(function(a,b){return a+b},0);if(this.bookingSize()===0&&productSum===0){this.error(this.languageHelper.translate("NO_PRODUCTS"));return false}var status=this.contactForm.checkRequiredCheckboxes();if(!status){return false}this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_BOOKING_SUBMITTED,this.selectedPackage.arrangement,Math.round(this.getTotalPrice()));var paymentMethod=this.paymentMethods(this.selectedPackage)[0];var paymentMethodEl=this.findElement('[name="paymentMethod"]:checked');if(paymentMethodEl&&this.validPaymentMethod(this.selectedPackage,paymentMethodEl.value)){paymentMethod=paymentMethodEl.value}this.loadingIndicatorHide();this.loadingIndicatorShow(this.findElement(".bookPackage"));var elem;if(null!==(elem=this.findElement(".bookPackage"))){elem.setAttribute("disabled","disabled")}var vouchers=Object.keys(this.appliedVouchers).length>0?Object.keys(this.appliedVouchers):null;var bookingParams={arrangement_id:this.selectedPackage.id,begin:this.selectedDate,betaalmethode:paymentMethod,contactformulier:this.contactForm.generateJson(),kortingscode:this.discount&&this.discount.code||null,producten:this.productCounts(),status:null,stuur_bevestiging_email:true,vouchers:vouchers};if(this.shouldShowBookingSize(this.selectedPackage)){bookingParams.boekingsgrootte=this.bookingSize()}if(this.options.getRedirectUrl()){bookingParams.redirect_url=this.options.getRedirectUrl()}return this.postJson("onlineboeking/reserveer",bookingParams).then(function(json){if(json.payment_url){_this29.eventHelper.sendEvent(RecrasEventHelper.PREFIX_BOOKING,RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT,null,Math.round(_this29.getTotalPrice()),{currency:_this29.languageHelper.currency,value:_this29.getTotalPrice(),items:_this29.formatGA4Items()});window.top.location.href=json.payment_url}else if(json.redirect){window.top.location.href=json.redirect}else if(json.message&&json.status){_this29.findElement(".recras-amountsform").reset();_this29.findElement(".recras-datetime").reset();_this29.findElement(".recras-contactform").reset();_this29.element.scrollIntoView({behavior:"smooth"});_this29.element.insertAdjacentHTML("afterbegin",'<p class="recras-success">'.concat(json.message,"</p>"))}else{console.log(json)}_this29.loadingIndicatorHide();_this29.findElement(".bookPackage").removeAttribute("disabled")})}},{key:"toggleDateField",value:function toggleDateField(showHide){var dateEl=this.findElement("#recras-onlinebooking-date");var labelEl=this.findElement('[for="recras-onlinebooking-date"]');if(showHide==="hide"){dateEl.classList.add("recrasHidden");labelEl.classList.add("recrasHidden")}else{dateEl.classList.remove("recrasHidden");labelEl.classList.remove("recrasHidden");this.findElement(".recras-datetime").classList.remove("recrasHidden")}}},{key:"toggleTimeField",value:function toggleTimeField(showHide){var timeEl=this.findElement("#recras-onlinebooking-time");var labelEl=this.findElement('[for="recras-onlinebooking-time"]');if(showHide==="hide"){timeEl.classList.add("recrasHidden");labelEl.classList.add("recrasHidden")}else{timeEl.classList.remove("recrasHidden");labelEl.classList.remove("recrasHidden");this.findElement(".recras-datetime").classList.remove("recrasHidden")}}},{key:"updateProductAmounts",value:function updateProductAmounts(){var _this30=this;this.loadingIndicatorHide();this.availableDays=[];this.removeWarnings();this.checkDependencies();this.checkMinMaxAmounts();var maxPromise=this.checkMaximumForPackage();this.checkBookingSize(this.selectedPackage);this.recheckVouchers().then(function(){_this30.showTotalPrice()});this.showStandardAttachments();var datePickerEl=this.findElement(".recras-onlinebooking-date");var thisClass=this;maxPromise.then(function(){var amountErrors=thisClass.findElements(".minimum-amount, .maximum-amount, .recras-product-dependency");if(amountErrors.length>0){thisClass.nextSectionActive(null,".recras-amountsform");datePickerEl.setAttribute("disabled","disabled");return}thisClass.nextSectionActive(".recras-amountsform",".recras-datetime");if(!thisClass.hasAtLeastOneProduct(thisClass.selectedPackage)){return}thisClass.loadingIndicatorShow(thisClass.findElement('label[for="recras-onlinebooking-date"]'));var startDate=new Date;var endDate=new Date;endDate.setMonth(endDate.getMonth()+3);if(!thisClass.prefilledDate){thisClass.getAvailableDaysInPeriod(thisClass.selectedPackage.id,startDate,endDate);return}var date=thisClass.prefilledDate;startDate=new Date(date);endDate=new Date(date);endDate.setDate(endDate.getDate()+1);thisClass.getAvailableDays(thisClass.selectedPackage.id,startDate,endDate).then(function(availableDays){if(availableDays.includes(RecrasDateHelper.datePartOnly(date))){thisClass.toggleDateField("hide");thisClass.calendarOnDateSelect(date,thisClass.selectedPackage.id)}else{thisClass.toggleDateField("show");thisClass.getAvailableDaysInPeriod(thisClass.selectedPackage.id,startDate,endDate)}})})}},{key:"getAvailableDaysInPeriod",value:function getAvailableDaysInPeriod(packageId,startDate,endDate){var _this31=this;var datePickerEl=this.findElement(".recras-onlinebooking-date");this.getAvailableDays(packageId,startDate,endDate).then(function(availableDays){_this31.loadingIndicatorHide();if(datePickerEl.value&&availableDays.indexOf(datePickerEl.value)===-1){datePickerEl.value="";_this31.clearTimes()}else{datePickerEl.removeAttribute("disabled")}})}},{key:"updateProductPrice",value:function updateProductPrice(el){var priceEl=el.parentNode.querySelector(".recras-price");var amount=parseInt(el.value,10);if(isNaN(amount)){amount=0}if(amount>0){priceEl.classList.remove("recrasUnitPrice")}else{priceEl.classList.add("recrasUnitPrice")}amount=Math.max(amount,1);priceEl.innerHTML=this.formatPrice(amount*el.dataset.price)}},{key:"validPaymentMethod",value:function validPaymentMethod(pack,method){return this.paymentMethods(pack).indexOf(method)>-1}}]);return RecrasBooking}();var RecrasCalendarHelper=function(){function RecrasCalendarHelper(){_classCallCheck(this,RecrasCalendarHelper)}_createClass(RecrasCalendarHelper,null,[{key:"defaultOptions",value:function defaultOptions(){return{firstDay:1,minDate:new Date,numberOfMonths:2,reposition:false,position:"bottom right",toString:function toString(date){return RecrasDateHelper.toString(date)}}}},{key:"i18n",value:function i18n(languageHelper){return{previousMonth:languageHelper.translate("DATE_PICKER_PREVIOUS_MONTH"),nextMonth:languageHelper.translate("DATE_PICKER_NEXT_MONTH"),months:[languageHelper.translate("DATE_PICKER_MONTH_JANUARY"),languageHelper.translate("DATE_PICKER_MONTH_FEBRUARY"),languageHelper.translate("DATE_PICKER_MONTH_MARCH"),languageHelper.translate("DATE_PICKER_MONTH_APRIL"),languageHelper.translate("DATE_PICKER_MONTH_MAY"),languageHelper.translate("DATE_PICKER_MONTH_JUNE"),languageHelper.translate("DATE_PICKER_MONTH_JULY"),languageHelper.translate("DATE_PICKER_MONTH_AUGUST"),languageHelper.translate("DATE_PICKER_MONTH_SEPTEMBER"),languageHelper.translate("DATE_PICKER_MONTH_OCTOBER"),languageHelper.translate("DATE_PICKER_MONTH_NOVEMBER"),languageHelper.translate("DATE_PICKER_MONTH_DECEMBER")],weekdays:[languageHelper.translate("DATE_PICKER_DAY_SUNDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_MONDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_TUESDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_WEDNESDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_THURSDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_FRIDAY_LONG"),languageHelper.translate("DATE_PICKER_DAY_SATURDAY_LONG")],weekdaysShort:[languageHelper.translate("DATE_PICKER_DAY_SUNDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_MONDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_TUESDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_WEDNESDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_THURSDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_FRIDAY_SHORT"),languageHelper.translate("DATE_PICKER_DAY_SATURDAY_SHORT")]}}},{key:"loadScript",value:function loadScript(){return new Promise(function(resolve,reject){var scriptID="recrasPikaday";if(document.getElementById(scriptID)){resolve(true)}var script=document.createElement("script");script.id=scriptID;script.src="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.8.2/pikaday.min.js";script.addEventListener("load",function(){return resolve(script)},false);script.addEventListener("error",function(){return reject(script)},false);document.head.appendChild(script)})}}]);return RecrasCalendarHelper}();var RecrasContactForm=function(){function RecrasContactForm(){var _this32=this;var options=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};_classCallCheck(this,RecrasContactForm);this.languageHelper=new RecrasLanguageHelper;if(!(options instanceof RecrasOptions)){throw new Error(this.languageHelper.translate("ERR_OPTIONS_INVALID"))}this.options=options;if(!this.options.getFormId()){throw new Error(this.languageHelper.translate("ERR_NO_FORM"))}this.checkboxEventListeners=[];this.eventHelper=new RecrasEventHelper;this.eventHelper.setEvents(this.options.getAnalyticsEvents());this.element=this.options.getElement();this.element.classList.add("recras-contactform-wrapper");this.languageHelper.setOptions(options);if(RecrasLanguageHelper.isValid(this.options.getLocale())){this.languageHelper.setLocale(this.options.getLocale())}this.fetchJson=function(url){return RecrasHttpHelper.fetchJson(url,_this32.error.bind(_this32))};this.postJson=function(url,data){return RecrasHttpHelper.postJson(_this32.options.getApiBase()+url,data,_this32.error.bind(_this32))};RecrasCSSHelper.loadCSS("global");this.GENDERS={onbekend:"GENDER_UNKNOWN",man:"GENDER_MALE",vrouw:"GENDER_FEMALE"};this.AUTOCOMPLETE_OPTIONS={"contact.naam":"organization","contact.website":"url","contactpersoon.achternaam":"family-name","contactpersoon.adres":"address-line1","contactpersoon.plaats":"address-level2","contactpersoon.postcode":"postal-code","contactpersoon.voornaam":"given-name"}}_createClass(RecrasContactForm,[{key:"checkRequiredCheckboxes",value:function checkRequiredCheckboxes(){var _this33=this;this.removeWarnings();var isOkay=true;_toConsumableArray(this.findElements(".checkboxGroupRequired")).forEach(function(group){var checked=group.querySelectorAll("input:checked");if(checked.length===0){group.parentNode.querySelector("label").insertAdjacentHTML("beforeend",'<div class="recrasError">'.concat(_this33.languageHelper.translate("CONTACT_FORM_CHECKBOX_REQUIRED"),"</div>"));isOkay=false}});return isOkay}},{key:"appendHtml",value:function appendHtml(msg){this.element.insertAdjacentHTML("beforeend",msg)}},{key:"error",value:function error(msg){this.removeErrors(".recras-contactform");this.showInlineError(this.findElement(".submitForm"),msg)}},{key:"findElement",value:function findElement(querystring){return this.element.querySelector(querystring)}},{key:"findElements",value:function findElements(querystring){return this.element.querySelectorAll(querystring)}},{key:"isStandalone",value:function isStandalone(options){if(options.showSubmit){console.warn('Option "showSubmit" was renamed to "standalone". Please update your code.');options.standalone=true}return!!options.standalone}},{key:"generateForm",value:function generateForm(){var _this34=this;var extraOptions=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};var waitFor=[];if(this.hasCountryField()){waitFor.push(this.getCountryList())}if(this.hasBookingDateField()||this.hasRelationDateField()){waitFor.push(RecrasCalendarHelper.loadScript());RecrasCSSHelper.loadCSS("pikaday")}return Promise.all(waitFor).then(function(){var standalone=_this34.isStandalone(extraOptions);var validateText=standalone?"novalidate":"";var html='<form class="recras-contactform" '.concat(validateText,">");if(extraOptions.voucherQuantitySelector){html+=_this34.quantitySelector(extraOptions.quantityTerm)}_this34.contactFormFields.forEach(function(field,idx){html+="<div>"+_this34.showField(field,idx)+"</div>"});if(standalone){html+=_this34.submitButtonHtml()}html+="</form>";return html})}},{key:"generateJson",value:function generateJson(){var formEl=this.options.getElement().querySelector(".recras-contactform");var elements=formEl.querySelectorAll('[id^="contactformulier-"], input[type="radio"]:checked');var contactForm={};_toConsumableArray(elements).forEach(function(field){contactForm[field.dataset.identifier]=field.value});_toConsumableArray(formEl.querySelectorAll('input[type="checkbox"]:checked')).forEach(function(field){if(contactForm[field.dataset.identifier]===undefined){contactForm[field.dataset.identifier]=[]}contactForm[field.dataset.identifier].push(field.value)});if(contactForm["boeking.datum"]){contactForm["boeking.datum"]=RecrasDateHelper.formatStringForAPI(contactForm["boeking.datum"])}return contactForm}},{key:"getContactFormFields",value:function getContactFormFields(){var _this35=this;return this.fetchJson(this.options.getApiBase()+"contactformulieren/"+this.options.getFormId()+"?embed=Velden").then(function(form){_this35.contactFormFields=form.Velden;_this35.packages=_this35.sortPackages(form.Arrangementen);return _this35.contactFormFields})}},{key:"getCountryList",value:function getCountryList(){var _this36=this;return this.fetchJson("https://cdn.rawgit.com/umpirsky/country-list/ddabf3a8/data/"+this.languageHelper.locale+"/country.json").then(function(json){_this36.countries=json;return _this36.countries})}},{key:"sortPackages",value:function sortPackages(packs){return packs.sort(function(a,b){if(a.arrangement<b.arrangement){return-1}if(a.arrangement>b.arrangement){return 1}if(a.id<b.id){return-1}if(a.id>b.id){return 1}return 0})}},{key:"getInvalidFields",value:function getInvalidFields(){var invalid=[];var required=this.getEmptyRequiredFields();var els=this.findElements(".recras-contactform :invalid");for(var _i14=0;_i14<els.length;_i14++){var el=els[_i14];if(!required.includes(el)){invalid.push(el)}}return invalid}},{key:"getEmptyRequiredFields",value:function getEmptyRequiredFields(){var isEmpty=[];var els=this.findElements(".recras-contactform :required");for(var _i16=0;_i16<els.length;_i16++){var el=els[_i16];if(el.value===undefined||el.value===""){isEmpty.push(el)}}return isEmpty}},{key:"getRelationExtraDateFields",value:function getRelationExtraDateFields(){return this.contactFormFields.filter(function(field){return field.soort_invoer==="contact.extra"&&field.input_type==="date"})}},{key:"hasFieldOfType",value:function hasFieldOfType(identifier){return this.contactFormFields.filter(function(field){return field.field_identifier===identifier}).length>0}},{key:"hasBookingDateField",value:function hasBookingDateField(){return this.hasFieldOfType("boeking.datum")}},{key:"hasCountryField",value:function hasCountryField(){return this.hasFieldOfType("contact.landcode")}},{key:"hasPackageField",value:function hasPackageField(){return this.hasFieldOfType("boeking.arrangement")}},{key:"hasRelationDateField",value:function hasRelationDateField(){return this.getRelationExtraDateFields().length>0}},{key:"isEmpty",value:function isEmpty(){var els=this.findElements(".recras-contactform input, .recras-contactform select, .recras-contactform textarea");var formValues=_toConsumableArray(els).map(function(el){return el.value});return!formValues.some(function(v){return v!==""})}},{key:"isValid",value:function isValid(){return this.findElement(".recras-contactform").checkValidity()}},{key:"loadingIndicatorHide",value:function loadingIndicatorHide(){_toConsumableArray(document.querySelectorAll(".recrasLoadingIndicator")).forEach(function(el){el.parentNode.removeChild(el)})}},{key:"loadingIndicatorShow",value:function loadingIndicatorShow(afterEl){if(!afterEl){return}afterEl.insertAdjacentHTML("beforeend",'<span class="recrasLoadingIndicator">'.concat(this.languageHelper.translate("LOADING"),"</span>"))}},{key:"quantitySelector",value:function quantitySelector(quantityTerm){if(!quantityTerm){quantityTerm=this.languageHelper.translate("VOUCHER_QUANTITY")}return'<div>\n            <label for="number-of-vouchers">'.concat(quantityTerm,'</label>\n            <input type="number" id="number-of-vouchers" class="number-of-vouchers" min="1" max="100" value="1" required>\n        </div>')}},{key:"removeErrors",value:function removeErrors(){var parentQuery=arguments.length>0&&arguments[0]!==undefined?arguments[0]:"";_toConsumableArray(this.findElements(parentQuery+" .booking-error")).forEach(function(el){el.parentNode.removeChild(el)})}},{key:"removeWarnings",value:function removeWarnings(){_toConsumableArray(this.findElements(".recrasError")).forEach(function(el){el.parentNode.removeChild(el)});_toConsumableArray(this.findElements(".recras-success")).forEach(function(el){el.parentNode.removeChild(el)})}},{key:"hasEmptyRequiredFields",value:function hasEmptyRequiredFields(){return this.getEmptyRequiredFields().length>0}},{key:"showField",value:function showField(field,idx){var _this37=this;if(field.soort_invoer==="header"){return"<h3>".concat(field.naam,"</h3>")}var today=RecrasDateHelper.toString(new Date);var timePattern="(0[0-9]|1[0-9]|2[0-3])(:[0-5][0-9])";var label=this.showLabel(field,idx);var attrRequired=field.verplicht?"required":"";var classes;var html;var placeholder;var fixedAttributes='id="contactformulier-'.concat(idx,'" name="contactformulier').concat(idx,'" ').concat(attrRequired,' data-identifier="').concat(field.field_identifier,'"');switch(field.soort_invoer){case"contactpersoon.geslacht":html="<select ".concat(fixedAttributes,' autocomplete="sex">');Object.keys(this.GENDERS).forEach(function(key){html+='<option value="'.concat(key,'">').concat(_this37.languageHelper.translate(_this37.GENDERS[key]))});html+="</select>";return label+html;case"keuze":classes=["checkboxGroup"];if(field.verplicht){classes.push("checkboxGroupRequired")}html='<div class="'.concat(classes.join(" "),'">');field.mogelijke_keuzes.forEach(function(choice){html+='<label><input type="checkbox" name="contactformulier'.concat(idx,'" value="').concat(choice,'" data-identifier="').concat(field.field_identifier,'">').concat(choice,"</label>")});html+="</div>";return label+html;case"keuze_enkel":case"contact.soort_klant":html='<div class="radioGroup">';field.mogelijke_keuzes.forEach(function(choice){html+='<label><input type="radio" name="contactformulier'.concat(idx,'" value="').concat(choice,'" ').concat(attrRequired,' data-identifier="').concat(field.field_identifier,'">').concat(choice,"</label>")});html+="</div>";return label+html;case"veel_tekst":return label+"<textarea ".concat(fixedAttributes,"></textarea>");case"contactpersoon.telefoon1":case"contactpersoon.telefoon2":return label+'<input type="tel" '.concat(fixedAttributes,' autocomplete="tel">');case"contactpersoon.email1":case"contactpersoon.email2":return label+'<input type="email" '.concat(fixedAttributes,' autocomplete="email">');case"contactpersoon.nieuwsbrieven":classes=["checkboxGroup"];if(field.verplicht){classes.push("checkboxGroupRequired")}html='<div class="'.concat(classes.join(" "),'">');Object.keys(field.newsletter_options).forEach(function(key){html+='<label><input type="checkbox" name="contactformulier'.concat(idx,'" value="').concat(key,'" data-identifier="').concat(field.field_identifier,'">').concat(field.newsletter_options[key],"</label>")});html+="</div>";return label+html;case"contact.landcode":html="<select ".concat(fixedAttributes,' autocomplete="country">');Object.keys(this.countries).forEach(function(code){var selectedText=code.toUpperCase()===_this37.options.getDefaultCountry()?"selected":"";html+='<option value="'.concat(code,'" ').concat(selectedText,">").concat(_this37.countries[code])});html+="</select>";return label+html;case"boeking.datum":placeholder=this.languageHelper.translate("DATE_FORMAT");return label+'<input type="text" '.concat(fixedAttributes,' min="').concat(today,'" placeholder="').concat(placeholder,'" autocomplete="off">');case"boeking.groepsgrootte":return label+'<input type="number" '.concat(fixedAttributes,' min="1">');case"boeking.starttijd":placeholder=this.languageHelper.translate("TIME_FORMAT");return label+'<input type="time" '.concat(fixedAttributes,' placeholder="').concat(placeholder,'" pattern="').concat(timePattern,'" step="300">');case"boeking.arrangement":var preFilledPackage=this.options.getPackageId();if(field.verplicht&&this.packages.length===1){var pack=this.packages[0];html="<select ".concat(fixedAttributes,'>\n                        <option value="').concat(pack.id,'" selected>').concat(pack.arrangement,"\n                    </select>");return label+html}html="<select ".concat(fixedAttributes,">");html+='<option value="">';this.packages.forEach(function(pack){var selText=preFilledPackage&&preFilledPackage===pack.id?"selected":"";html+='<option value="'.concat(pack.id,'" ').concat(selText,">").concat(pack.arrangement)});html+="</select>";return label+html;case"contact.extra":switch(field.input_type){case"number":return label+'<input type="number" '.concat(fixedAttributes,' autocomplete="off">');case"date":case"text":return label+'<input type="text" '.concat(fixedAttributes,' maxlength="200">');case"multiplechoice":classes=["checkboxGroup"];if(field.verplicht){classes.push("checkboxGroupRequired")}html='<div class="'.concat(classes.join(" "),'">');field.mogelijke_keuzes.forEach(function(choice){html+='<label><input type="checkbox" name="contactformulier'.concat(idx,'" value="').concat(choice,'" data-identifier="').concat(field.field_identifier,'">').concat(choice,"</label>")});html+="</div>";return label+html;case"singlechoice":html='<div class="radioGroup">';field.mogelijke_keuzes.forEach(function(choice){html+='<label><input type="radio" name="contactformulier'.concat(idx,'" value="').concat(choice,'" ').concat(attrRequired,' data-identifier="').concat(field.field_identifier,'">').concat(choice,"</label>")});html+="</div>";return label+html;default:console.debug("Unknown type",field.input_type,field);return label+'<input type="text" '.concat(fixedAttributes,">")}case"contact.website":default:var autocomplete=this.AUTOCOMPLETE_OPTIONS[field.soort_invoer]?this.AUTOCOMPLETE_OPTIONS[field.soort_invoer]:"";return label+'<input type="text" '.concat(fixedAttributes,' autocomplete="').concat(autocomplete,'">')}}},{key:"showForm",value:function showForm(){var _this38=this;this.loadingIndicatorShow(this.element);return this.getContactFormFields().then(function(){return _this38.generateForm({standalone:true})}).then(function(html){_this38.appendHtml(html);_toConsumableArray(_this38.findElements(".checkboxGroupRequired")).forEach(function(group){_toConsumableArray(group.querySelectorAll("input")).forEach(function(el){el.addEventListener("change",_this38.checkRequiredCheckboxes.bind(_this38))})});_this38.findElement(".recras-contactform").addEventListener("submit",_this38.submitForm.bind(_this38));if(_this38.hasBookingDateField()){var pikadayOptions=_extends(RecrasCalendarHelper.defaultOptions(),{field:_this38.findElement('[data-identifier="boeking.datum"]'),i18n:RecrasCalendarHelper.i18n(_this38.languageHelper),numberOfMonths:1});new Pikaday(pikadayOptions)}if(_this38.hasRelationDateField()){var fields=_this38.getRelationExtraDateFields();var thisYear=(new Date).getFullYear();var _pikadayOptions=_extends(RecrasCalendarHelper.defaultOptions(),{i18n:RecrasCalendarHelper.i18n(_this38.languageHelper),numberOfMonths:1,yearRange:[thisYear-90,thisYear+10]});delete _pikadayOptions.minDate;for(var _i18=0;_i18<fields.length;_i18++){var field=fields[_i18];_pikadayOptions.field=_this38.findElement('[data-identifier="'.concat(field.field_identifier,'"]'));new Pikaday(_pikadayOptions)}}_this38.loadingIndicatorHide()})}},{key:"showInlineError",value:function showInlineError(element,errorMsg){element.parentNode.insertAdjacentHTML("afterend",'<div class="booking-error">'.concat(errorMsg,"</div>"))}},{key:"showInlineErrors",value:function showInlineErrors(){for(var _i20=0,_this$getEmptyRequire2=this.getEmptyRequiredFields();_i20<_this$getEmptyRequire2.length;_i20++){var el=_this$getEmptyRequire2[_i20];var labelEl=el.parentNode.querySelector("label");var requiredText=this.languageHelper.translate("CONTACT_FORM_FIELD_REQUIRED",{FIELD_NAME:labelEl.innerText});el.parentNode.insertAdjacentHTML("afterend",'<div class="booking-error">'.concat(requiredText,"</div>"))}for(var _i22=0,_this$getInvalidField2=this.getInvalidFields();_i22<_this$getInvalidField2.length;_i22++){var _el=_this$getInvalidField2[_i22];var _labelEl=_el.parentNode.querySelector("label");var invalidText=this.languageHelper.translate("CONTACT_FORM_FIELD_INVALID",{FIELD_NAME:_labelEl.innerText});this.showInlineError(_el,invalidText)}}},{key:"showLabel",value:function showLabel(field,idx){var labelText=field.naam;if(field.verplicht){labelText+='<span class="recras-contactform-required" title="'.concat(this.languageHelper.translate("ATTR_REQUIRED"),'"></span>')}return'<label for="contactformulier-'.concat(idx,'">').concat(labelText,"</label>")}},{key:"submitButtonHtml",value:function submitButtonHtml(){return'<button type="submit" class="submitForm">'.concat(this.languageHelper.translate("BUTTON_SUBMIT_CONTACT_FORM"),"</button>")}},{key:"submitForm",value:function submitForm(e){var _this39=this;e.preventDefault();var submitButton=this.findElement(".submitForm");this.removeErrors(".recras-contactform");if(this.isEmpty()){submitButton.parentNode.insertAdjacentHTML("beforeend",'<div class="booking-error">'.concat(this.languageHelper.translate("ERR_CONTACT_FORM_EMPTY"),"</div>"));return false}else if(this.hasEmptyRequiredFields()||!this.isValid()){this.showInlineErrors();return false}if(!this.checkRequiredCheckboxes()){return false}this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_CONTACT_FORM,RecrasEventHelper.EVENT_CONTACT_FORM_SUBMIT,null,this.options.getFormId());this.loadingIndicatorHide();this.loadingIndicatorShow(submitButton);submitButton.setAttribute("disabled","disabled");this.postJson("contactformulieren/"+this.options.getFormId()+"/opslaan",this.generateJson()).then(function(json){if(json.success){if(_this39.options.getRedirectUrl()){window.top.location.href=_this39.options.getRedirectUrl()}else{_this39.element.scrollIntoView({behavior:"smooth"});_this39.element.insertAdjacentHTML("afterbegin",'<p class="recras-success">'.concat(_this39.languageHelper.translate("CONTACT_FORM_SUBMIT_SUCCESS"),"</p>"));submitButton.parentNode.reset()}}else{_this39.error(_this39.languageHelper.translate("CONTACT_FORM_SUBMIT_FAILED"))}submitButton.removeAttribute("disabled");_this39.loadingIndicatorHide()});return false}}]);return RecrasContactForm}();var RecrasCSSHelper=function(){function RecrasCSSHelper(){_classCallCheck(this,RecrasCSSHelper)}_createClass(RecrasCSSHelper,null,[{key:"cssBooking",value:function cssBooking(){return"\n.recras-onlinebooking {\n    max-width: 800px;\n}\n.recras-onlinebooking > form + form, .recras-finalise {\n    border-top: 2px solid #dedede; /* Any love for Kirby out there? */\n}\n.recras-amountsform > div {\n    display: -ms-grid;\n    display: grid;\n    -ms-grid-columns: 1fr 5em 7em;\n    grid-template-columns: 1fr 5em 7em;\n}\n.recras-amountsform > div > div:first-child {\n    -ms-grid-column: 1;\n}\n.recras-amountsform > div > input {\n    -ms-grid-column: 2;\n}\n.recras-amountsform input {\n    width: auto; /* Firefox fix */\n}\n.recras-amountsform > div > div:last-child {\n    -ms-grid-column: 3;\n}\n.recras-input-invalid {\n    border: 1px solid hsl(0, 50%, 50%);\n}\n.booking-error, .minimum-amount {\n    color: hsl(0, 50%, 50%);\n}\n.recras-success {\n    color: hsl(120, 40%, 40%);\n}\n.minimum-amount {\n    padding-left: 0.5em;\n}\n.recras-datetime {\n    display: -ms-grid;\n    display: grid;\n    -ms-grid-columns: 30% 70%;\n    grid-template-columns: 30% 70%;\n}\n.recras-datetime > * {\n    margin: 0.25em 0;\n}\n.recras-datetime label {\n    display: block;\n    -ms-grid-column: 1;\n}\n.recras-datetime input, .recras-datetime select {\n    max-width: 12em;\n    -ms-grid-column: 2;\n}\n.recras-datetime > :nth-child(-n + 2) {\n    -ms-grid-row: 1;\n}\n.recras-datetime > :nth-last-child(-n + 2) {\n    -ms-grid-row: 2;\n}\n.time-preview {\n    padding-right: 0.5em;\n}\n.recrasUnitPrice {\n    opacity: 0.5;\n}\n.recras-onlinebooking .recrasHidden {\n    display: none;\n}\n"}},{key:"cssGlobal",value:function cssGlobal(){return"\n.latestError, .recrasError {\n    color: hsl(0, 50%, 50%);\n}\n.recras-onlinebooking > *:not(.latestError):not(.recrasLoadingIndicator) {\n    padding: 1em 0;\n}\n.recras-datetime, .recras-discounts > div, .recras-contactform > div {\n    display: -ms-grid;\n    display: grid;\n    -ms-grid-columns: 1fr 12em;\n    grid-template-columns: 1fr 12em;\n}\n.recras-contactform > div {\n    padding-bottom: 0.25em;\n    padding-top: 0.25em;\n}\n.recras-contactform label {\n    display: block;\n}\n.recras-contactform > div > :last-child {\n    -ms-grid-column: 2;\n}\n.recras-amountsform .recras-full-width {\n    display: block;\n}\n.recras-discounts > div > input {\n    -ms-grid-column: 2;\n}\n\n.recrasLoadingIndicator {\n    animation: recrasSpinner 1.1s infinite linear;\n    border: 0.2em solid rgba(0, 0, 0, 0.2);\n    border-left-color: rgba(0, 0, 0, 0.5);\n    border-radius: 50%;\n    display: inline-block;\n    height: 2em;\n    overflow: hidden;\n    text-indent: -100vw;\n    width: 2em;\n}\n@keyframes recrasSpinner {\n    0% {\n        transform: rotate(0deg);\n    }\n    100% {\n        transform: rotate(360deg);\n    }\n}\nbutton .recrasLoadingIndicator, label .recrasLoadingIndicator {\n    height: 1em;\n    vertical-align: middle;\n    width: 1em;\n}\nbutton .recrasLoadingIndicator {\n    margin-left: 0.5em;\n}\n.bookPackage, .submitForm, .buyTemplate {\n    font: inherit;\n    font-weight: bold;\n    padding: 0.5em 2em;\n}\n@media (max-width: 520px) {\n    .pika-single {\n        max-width: 256px; /* Single month is 240px + 2x8px margin */\n    }\n}\n"}},{key:"insertIntoHead",value:function insertIntoHead(el){document.head.insertAdjacentElement("afterbegin",el)}},{key:"loadInlineCss",value:function loadInlineCss(cssName,inlineCss){var styleEl=document.createElement("style");styleEl.id="recras-css-"+cssName;styleEl.innerHTML=inlineCss;RecrasCSSHelper.insertIntoHead(styleEl)}},{key:"loadExternalCss",value:function loadExternalCss(cssName,url){var linkEl=document.createElement("link");linkEl.id="recras-css-"+cssName;linkEl.setAttribute("rel","stylesheet");linkEl.setAttribute("type","text/css");linkEl.setAttribute("href",url);RecrasCSSHelper.insertIntoHead(linkEl)}},{key:"loadCSS",value:function loadCSS(cssName){var inlineCss;var url;switch(cssName){case"booking":inlineCss=this.cssBooking();break;case"global":inlineCss=this.cssGlobal();break;case"pikaday":url="https://cdnjs.cloudflare.com/ajax/libs/pikaday/1.8.2/css/pikaday.min.css";break;default:console.warn("Unknown CSS");break}if(document.getElementById("recras-css-"+cssName)){return}if(inlineCss){RecrasCSSHelper.loadInlineCss(cssName,inlineCss)}if(url){RecrasCSSHelper.loadExternalCss(cssName,url)}}}]);return RecrasCSSHelper}();var RecrasDateHelper=function(){function RecrasDateHelper(){_classCallCheck(this,RecrasDateHelper)}_createClass(RecrasDateHelper,null,[{key:"clone",value:function clone(date){return new Date(date.getTime())}},{key:"datePartOnly",value:function datePartOnly(date){var x=new Date(date.getTime()-date.getTimezoneOffset()*60*1e3);return x.toISOString().substr(0,10)}},{key:"formatStringForAPI",value:function formatStringForAPI(date){var datePatternDMY="(0[1-9]|1[0-9]|2[0-9]|3[01])-(0[1-9]|1[012])-([0-9]{4})";var dmyMatches=date.match(datePatternDMY);if(dmyMatches){return dmyMatches[3]+"-"+dmyMatches[2]+"-"+dmyMatches[1]}return date}},{key:"setTimeForDate",value:function setTimeForDate(date,timeStr){date.setHours(timeStr.substr(0,2),timeStr.substr(3,2));return date}},{key:"timePartOnly",value:function timePartOnly(date){return date.toTimeString().substr(0,5)}},{key:"toString",value:function toString(date){var x=new Date(date.getTime()-date.getTimezoneOffset()*60*1e3);x=x.toISOString();return x.substr(8,2)+"-"+x.substr(5,2)+"-"+x.substr(0,4)}}]);return RecrasDateHelper}();var RecrasEventHelper=function(){function RecrasEventHelper(){_classCallCheck(this,RecrasEventHelper);this.analyticsEnabled=false;this.eventsEnabled=RecrasEventHelper.allEvents()}_createClass(RecrasEventHelper,[{key:"eventEnabled",value:function eventEnabled(name){return this.eventsEnabled.includes(name)}},{key:"ga4EventMap",value:function ga4EventMap(action){var _map;var map=(_map={},_defineProperty(_map,RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED,"select_content"),_defineProperty(_map,RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT,"begin_checkout"),_defineProperty(_map,RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED,"select_content"),_defineProperty(_map,RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT,"begin_checkout"),_map);if(map[action]===undefined){return false}return map[action]}},{key:"isGA4",value:function isGA4(){var fn=window[window.GoogleAnalyticsObject||"ga"];return fn&&fn.h&&fn.h.gtm4}},{key:"sendEvent",value:function sendEvent(cat,action){var label=arguments.length>2&&arguments[2]!==undefined?arguments[2]:undefined;var value=arguments.length>3&&arguments[3]!==undefined?arguments[3]:undefined;var ga4Value=arguments.length>4&&arguments[4]!==undefined?arguments[4]:undefined;var event;try{event=new Event(RecrasEventHelper.PREFIX_GLOBAL+":"+cat+":"+action)}catch(e){event=document.createEvent("Event");event.initEvent(action,true,true)}if(this.analyticsEnabled&&this.eventEnabled(action)){if(this.isGA4()&&this.ga4EventMap(action)&&ga4Value){this.sendGA4Event(this.ga4EventMap(action),ga4Value)}else if(typeof window.gtag==="function"){var eventData={event_category:RecrasEventHelper.PREFIX_GLOBAL+":"+cat};if(label){eventData.event_label=label}if(value){eventData.value=value}window.gtag("event",action,eventData)}else if(typeof window.ga==="function"){var _eventData={hitType:"event",eventCategory:RecrasEventHelper.PREFIX_GLOBAL+":"+cat,eventAction:action};if(label){_eventData.eventLabel=label}if(value){_eventData.eventValue=value}window.ga(function(){var prefix=window.ga.getAll()[0].get("name");if(prefix){prefix+="."}window.ga(prefix+"send",_eventData)})}}return document.dispatchEvent(event)}},{key:"sendGA4Event",value:function sendGA4Event(action,data){var fn=window[window.GoogleAnalyticsObject||"ga"];fn("event",action,data)}},{key:"setAnalytics",value:function setAnalytics(bool){this.analyticsEnabled=bool}},{key:"setEvents",value:function setEvents(events){this.eventsEnabled=events}}],[{key:"allEvents",value:function allEvents(){return[RecrasEventHelper.EVENT_BOOKING_BOOKING_SUBMITTED,RecrasEventHelper.EVENT_BOOKING_CONTACT_FORM_SHOWN,RecrasEventHelper.EVENT_BOOKING_DATE_SELECTED,RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED,RecrasEventHelper.EVENT_BOOKING_PACKAGES_SHOWN,RecrasEventHelper.EVENT_BOOKING_PRODUCTS_SHOWN,RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT,RecrasEventHelper.EVENT_BOOKING_RESET,RecrasEventHelper.EVENT_BOOKING_TIME_SELECTED,RecrasEventHelper.EVENT_CONTACT_FORM_SUBMIT,RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT,RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED,RecrasEventHelper.EVENT_VOUCHER_VOUCHER_SUBMITTED]}}]);return RecrasEventHelper}();_defineProperty(RecrasEventHelper,"PREFIX_GLOBAL","Recras");_defineProperty(RecrasEventHelper,"PREFIX_BOOKING","Booking");_defineProperty(RecrasEventHelper,"PREFIX_CONTACT_FORM","ContactForm");_defineProperty(RecrasEventHelper,"PREFIX_VOUCHER","Voucher");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_BOOKING_SUBMITTED","BuyInProgress");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_CONTACT_FORM_SHOWN","ContactFormShown");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_DATE_SELECTED","DateSelected");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_PACKAGE_CHANGED","PackageChanged");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_PACKAGES_SHOWN","PackagesShown");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_PRODUCTS_SHOWN","ProductsShown");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_REDIRECT_PAYMENT","RedirectToPayment");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_RESET","Reset");_defineProperty(RecrasEventHelper,"EVENT_BOOKING_TIME_SELECTED","TimeSelected");_defineProperty(RecrasEventHelper,"EVENT_CONTACT_FORM_SUBMIT","Submit");_defineProperty(RecrasEventHelper,"EVENT_VOUCHER_REDIRECT_PAYMENT","RedirectToPayment");_defineProperty(RecrasEventHelper,"EVENT_VOUCHER_TEMPLATE_CHANGED","TemplateChanged");_defineProperty(RecrasEventHelper,"EVENT_VOUCHER_VOUCHER_SUBMITTED","BuyInProgress");var RecrasHttpHelper=function(){function RecrasHttpHelper(){_classCallCheck(this,RecrasHttpHelper)}_createClass(RecrasHttpHelper,null,[{key:"call",value:function call(url,data,errorHandler){if(!url){throw new Error("ERR_FETCH_WITHOUT_URL")}var lastResponse;return fetch(url,data).then(function(response){lastResponse=response;return response.json()}).then(function(json){if(!lastResponse.ok){var errorMsg=json.error&&json.error.message?json.error.message:lastResponse.status+" "+lastResponse.statusText;errorHandler(errorMsg);return false}return json})["catch"](function(err){errorHandler(err)})}},{key:"fetchJson",value:function fetchJson(url,errorHandler){return this.call(url,{credentials:"omit",method:"get"},errorHandler)}},{key:"postJson",value:function postJson(url,data,errorHandler){return this.call(url,{body:JSON.stringify(data),credentials:"omit",method:"post"},errorHandler)}}]);return RecrasHttpHelper}();var RecrasLanguageHelper=function(){function RecrasLanguageHelper(){_classCallCheck(this,RecrasLanguageHelper);this.defaultLocale="nl_NL";this.locale=this.defaultLocale;this.options=null;this.i18n={de_DE:{AGREE_ATTACHMENTS:"Ich stimme den folgenden Unterlagen zu:",ATTR_REQUIRED:"Erforderlich",BOOKING_DISABLED_AGREEMENT:"Sie haben den Bedingungen noch nicht zugestimmt",BOOKING_DISABLED_AMOUNTS_INVALID:"Programmbeträge sind ungültig",BOOKING_DISABLED_CONTACT_FORM_INVALID:"Das Kontaktformular ist nicht korrekt ausgefüllt",BOOKING_DISABLED_INVALID_DATE:"Kein Datum ausgewählt",BOOKING_DISABLED_INVALID_TIME:"Keine Zeit ausgewählt",BOOKING_DISABLED_REQUIRED_PRODUCT:"Erforderliches Produkt noch nicht ausgewählt",BUTTON_BOOK_NOW:"Jetzt buchen",BUTTON_BUY_NOW:"Jetzt kaufen",BUTTON_SUBMIT_CONTACT_FORM:"Senden",CONTACT_FORM_CHECKBOX_REQUIRED:"Es muss mindestens eine Option aktiviert sein",CONTACT_FORM_FIELD_INVALID:'"{FIELD_NAME}" ist ungültig',CONTACT_FORM_FIELD_REQUIRED:'"{FIELD_NAME}" ist ein erforderliches Feld',CONTACT_FORM_SUBMIT_FAILED:"Das Kontaktformular konnte nicht gesendet werden. Bitte versuchen Sie es später noch einmal.",CONTACT_FORM_SUBMIT_SUCCESS:"Das Kontaktformular wurde erfolgreich gesendet.",DATE:"Datum",DATE_FORMAT:"TT-MM-JJJJ",DATE_INVALID:"Ungültiges datum",DATE_PICKER_NEXT_MONTH:"Nächsten Monat",DATE_PICKER_PREVIOUS_MONTH:"Vorheriger Monat",DATE_PICKER_MONTH_JANUARY:"Januar",DATE_PICKER_MONTH_FEBRUARY:"Februar",DATE_PICKER_MONTH_MARCH:"März",DATE_PICKER_MONTH_APRIL:"April",DATE_PICKER_MONTH_MAY:"Mai",DATE_PICKER_MONTH_JUNE:"Juni",DATE_PICKER_MONTH_JULY:"Juli",DATE_PICKER_MONTH_AUGUST:"August",DATE_PICKER_MONTH_SEPTEMBER:"September",DATE_PICKER_MONTH_OCTOBER:"Oktober",DATE_PICKER_MONTH_NOVEMBER:"November",DATE_PICKER_MONTH_DECEMBER:"Dezember",DATE_PICKER_DAY_MONDAY_LONG:"Montag",DATE_PICKER_DAY_MONDAY_SHORT:"Mo",DATE_PICKER_DAY_TUESDAY_LONG:"Dienstag",DATE_PICKER_DAY_TUESDAY_SHORT:"Di",DATE_PICKER_DAY_WEDNESDAY_LONG:"Mittwoch",DATE_PICKER_DAY_WEDNESDAY_SHORT:"Mi",DATE_PICKER_DAY_THURSDAY_LONG:"Donnerstag",DATE_PICKER_DAY_THURSDAY_SHORT:"Do",DATE_PICKER_DAY_FRIDAY_LONG:"Freitag",DATE_PICKER_DAY_FRIDAY_SHORT:"Fr",DATE_PICKER_DAY_SATURDAY_LONG:"Samstag",DATE_PICKER_DAY_SATURDAY_SHORT:"Sa",DATE_PICKER_DAY_SUNDAY_LONG:"Sonntag",DATE_PICKER_DAY_SUNDAY_SHORT:"So",DISCOUNT_APPLIED:"Rabatt eingelöst",DISCOUNT_CHECK:"Überprüfen",DISCOUNT_TITLE:"Rabattcode oder Gutschein",DISCOUNT_INVALID:"Ungültiger Rabattcode oder Gutschein",ERR_AMOUNTS_NO_PACKAGE:'Die Option "productAmounts" ist gesetzt, aber "package_id" ist nicht gesetzt',ERR_CONTACT_FORM_EMPTY:"Das Kontaktformular ist nicht ausgefüllt",ERR_DATE_NO_SINGLE_PACKAGE:'Die Option "date" erfordert ein einzelnes vorgefülltes Arrangement ("package_id")',ERR_DATE_PAST:'Option "date" ist ein Datum in der Vergangenheit',ERR_GENERAL:"Etwas ist schief gelaufen:",ERR_INVALID_DATE:'Die Option "date" ist keine gültige ISO 8601-Datumszeichenfolge (z. B. "2019-06-28")',ERR_INVALID_ELEMENT:'Option "Element" ist kein gültiges Element',ERR_INVALID_HOSTNAME:'Option "recras_hostname" ist ungültig.',ERR_INVALID_LOCALE:"Ungültiges Gebietsschema. Gültige Optionen sind: {LOCALES}",ERR_INVALID_REDIRECT_URL:"Ungültige redirect URL. Stellen Sie sicher, dass es mit http:// or https:// beginnt",ERR_INVALID_TIME:'Die Option "time" ist keine gültige Zeitzeichenfolge (z. B. "16:15")',ERR_NO_ELEMENT:'Option "element" nicht eingestellt.',ERR_NO_FORM:'Option "form_id" nicht eingestellt.',ERR_NO_HOSTNAME:'Option "recras_hostname" nicht eingestellt.',ERR_NO_TIMES_FOR_DATE:"Für diese Mengen sind an diesem Datum keine Zeiten mehr verfügbar. Versuchen Sie es mit einem anderen Datum.",ERR_OPTIONS_INVALID:'Options is not a "RecrasOptions" object',GENDER_UNKNOWN:"Unbekannte",GENDER_MALE:"Mann",GENDER_FEMALE:"Frau",HEADING_PRICE:"Preis",HEADING_QUANTITY:"Anzahl",LOADING:"Wird geladen...",NO_PRODUCTS:"Kein Produkt ausgewählt",PRICE_TOTAL:"Insgesamt",PRICE_TOTAL_WITH_DISCOUNT:"Insgesamt inklusive Rabatt",PRODUCT_MAXIMUM:"(höchstens {MAXIMUM})",PRODUCT_MINIMUM:"(mindestens {MINIMUM})",PRODUCT_REQUIRED:"{NUM} {PRODUCT} benötigt {REQUIRED_AMOUNT} {REQUIRED_PRODUCT} um auch gebucht zu werden.",TIME:"Zeit",TIME_FORMAT:"UU:MM",VOUCHER_ALREADY_APPLIED:"Gutschein bereits eingelöst",VOUCHER_APPLIED:"Gutschein eingelöst",VOUCHER_EMPTY:"Leerer Gutscheincode",VOUCHER_QUANTITY:"Anzahl der Gutscheine",VOUCHERS_DISCOUNT:"Rabatt von Gutschein(en)"},en_GB:{AGREE_ATTACHMENTS:"I agree with the following documents:",ATTR_REQUIRED:"Required",BOOKING_DISABLED_AGREEMENT:"You have not agreed to the terms yet",BOOKING_DISABLED_AMOUNTS_INVALID:"Programme amounts are invalid",BOOKING_DISABLED_CONTACT_FORM_INVALID:"Contact form is not filled in correctly",BOOKING_DISABLED_INVALID_DATE:"No date selected",BOOKING_DISABLED_INVALID_TIME:"No time selected",BOOKING_DISABLED_REQUIRED_PRODUCT:"Required product not yet selected",BUTTON_BOOK_NOW:"Book now",BUTTON_BUY_NOW:"Buy now",BUTTON_SUBMIT_CONTACT_FORM:"Submit",CONTACT_FORM_CHECKBOX_REQUIRED:"At least one option must be checked",CONTACT_FORM_FIELD_INVALID:'"{FIELD_NAME}" is invalid',CONTACT_FORM_FIELD_REQUIRED:'"{FIELD_NAME}" is a required field',CONTACT_FORM_SUBMIT_FAILED:"The contact form could not be sent. Please try again later.",CONTACT_FORM_SUBMIT_SUCCESS:"The contact form was sent successfully.",DATE:"Date",DATE_FORMAT:"DD-MM-YYYY",DATE_INVALID:"Invalid date",DATE_PICKER_NEXT_MONTH:"Next month",DATE_PICKER_PREVIOUS_MONTH:"Previous month",DATE_PICKER_MONTH_JANUARY:"January",DATE_PICKER_MONTH_FEBRUARY:"February",DATE_PICKER_MONTH_MARCH:"March",DATE_PICKER_MONTH_APRIL:"April",DATE_PICKER_MONTH_MAY:"May",DATE_PICKER_MONTH_JUNE:"June",DATE_PICKER_MONTH_JULY:"July",DATE_PICKER_MONTH_AUGUST:"August",DATE_PICKER_MONTH_SEPTEMBER:"September",DATE_PICKER_MONTH_OCTOBER:"October",DATE_PICKER_MONTH_NOVEMBER:"November",DATE_PICKER_MONTH_DECEMBER:"December",DATE_PICKER_DAY_MONDAY_LONG:"Monday",DATE_PICKER_DAY_MONDAY_SHORT:"Mon",DATE_PICKER_DAY_TUESDAY_LONG:"Tuesday",DATE_PICKER_DAY_TUESDAY_SHORT:"Tue",DATE_PICKER_DAY_WEDNESDAY_LONG:"Wednesday",DATE_PICKER_DAY_WEDNESDAY_SHORT:"Wed",DATE_PICKER_DAY_THURSDAY_LONG:"Thursday",DATE_PICKER_DAY_THURSDAY_SHORT:"Thu",DATE_PICKER_DAY_FRIDAY_LONG:"Friday",DATE_PICKER_DAY_FRIDAY_SHORT:"Fri",DATE_PICKER_DAY_SATURDAY_LONG:"Saturday",DATE_PICKER_DAY_SATURDAY_SHORT:"Sat",DATE_PICKER_DAY_SUNDAY_LONG:"Sunday",DATE_PICKER_DAY_SUNDAY_SHORT:"Sun",DISCOUNT_APPLIED:"Discount applied",DISCOUNT_CHECK:"Check",DISCOUNT_TITLE:"Discount code or voucher",DISCOUNT_INVALID:"Invalid discount code or voucher",ERR_AMOUNTS_NO_PACKAGE:'Option "productAmounts" is set, but "package_id" is not set',ERR_CONTACT_FORM_EMPTY:"Contact form is not filled in",ERR_DATE_NO_SINGLE_PACKAGE:'Option "date" requires a single pre-filled package ("package_id")',ERR_DATE_PAST:'Option "date" is a date in the past',ERR_GENERAL:"Something went wrong:",ERR_INVALID_DATE:'Option "date" is not a valid ISO 8601 date string (e.g. "2019-06-28")',ERR_INVALID_ELEMENT:'Option "element" is not a valid Element',ERR_INVALID_HOSTNAME:'Option "recras_hostname" is invalid.',ERR_INVALID_LOCALE:"Invalid locale. Valid options are: {LOCALES}",ERR_INVALID_REDIRECT_URL:"Invalid redirect URL. Make sure you it starts with http:// or https://",ERR_INVALID_TIME:'Option "time" is not a valid time string (e.g. "16:15")',ERR_NO_ELEMENT:'Option "element" not set.',ERR_NO_FORM:'Option "form_id" not set.',ERR_NO_HOSTNAME:'Option "recras_hostname" not set.',ERR_NO_TIMES_FOR_DATE:"There are no more times available on this date for these quantities. Try a different date.",ERR_OPTIONS_INVALID:'Options is not a "RecrasOptions" object',GENDER_UNKNOWN:"Unknown",GENDER_MALE:"Male",GENDER_FEMALE:"Female",HEADING_PRICE:"Price",HEADING_QUANTITY:"Quantity",LOADING:"Loading...",NO_PRODUCTS:"No product selected",PRICE_TOTAL:"Total",PRICE_TOTAL_WITH_DISCOUNT:"Total including discount",PRODUCT_MAXIMUM:"(at most {MAXIMUM})",PRODUCT_MINIMUM:"(at least {MINIMUM})",PRODUCT_REQUIRED:"{NUM} {PRODUCT} requires {REQUIRED_AMOUNT} {REQUIRED_PRODUCT} to also be booked.",TIME:"Time",TIME_FORMAT:"HH:MM",VOUCHER_ALREADY_APPLIED:"Voucher already applied",VOUCHER_APPLIED:"Voucher applied",VOUCHER_EMPTY:"Empty voucher code",VOUCHER_QUANTITY:"Number of vouchers",VOUCHERS_DISCOUNT:"Discount from voucher(s)"},nl_NL:{AGREE_ATTACHMENTS:"Ik ga akkoord met de volgende gegevens:",ATTR_REQUIRED:"Vereist",BOOKING_DISABLED_AGREEMENT:"Je bent nog niet akkoord met de voorwaarden",BOOKING_DISABLED_AMOUNTS_INVALID:"Aantallen in programma zijn ongeldig",BOOKING_DISABLED_CONTACT_FORM_INVALID:"Contactformulier is niet correct ingevuld",BOOKING_DISABLED_INVALID_DATE:"Geen datum geselecteerd",BOOKING_DISABLED_INVALID_TIME:"Geen tijd geselecteerd",BOOKING_DISABLED_REQUIRED_PRODUCT:"Vereist product nog niet geselecteerd",BUTTON_BOOK_NOW:"Nu boeken",BUTTON_BUY_NOW:"Nu kopen",BUTTON_SUBMIT_CONTACT_FORM:"Versturen",CONTACT_FORM_CHECKBOX_REQUIRED:"Ten minste één optie moet aangevinkt worden",CONTACT_FORM_FIELD_INVALID:'"{FIELD_NAME}" is ongeldig',CONTACT_FORM_FIELD_REQUIRED:'"{FIELD_NAME}" is een verplicht veld',CONTACT_FORM_SUBMIT_FAILED:"Het contactformulier kon niet worden verstuurd. Probeer het later nog eens.",CONTACT_FORM_SUBMIT_SUCCESS:"Het contactformulier is succesvol verstuurd.",DATE:"Datum",DATE_FORMAT:"DD-MM-JJJJ",DATE_INVALID:"Ongeldige datum",DATE_PICKER_NEXT_MONTH:"Volgende maand",DATE_PICKER_PREVIOUS_MONTH:"Vorige maand",DATE_PICKER_MONTH_JANUARY:"Januari",DATE_PICKER_MONTH_FEBRUARY:"Februari",DATE_PICKER_MONTH_MARCH:"Maart",DATE_PICKER_MONTH_APRIL:"April",DATE_PICKER_MONTH_MAY:"Mei",DATE_PICKER_MONTH_JUNE:"Juni",DATE_PICKER_MONTH_JULY:"Juli",DATE_PICKER_MONTH_AUGUST:"Augustus",DATE_PICKER_MONTH_SEPTEMBER:"September",DATE_PICKER_MONTH_OCTOBER:"Oktober",DATE_PICKER_MONTH_NOVEMBER:"November",DATE_PICKER_MONTH_DECEMBER:"December",DATE_PICKER_DAY_MONDAY_LONG:"Maandag",DATE_PICKER_DAY_MONDAY_SHORT:"Ma",DATE_PICKER_DAY_TUESDAY_LONG:"Dinsdag",DATE_PICKER_DAY_TUESDAY_SHORT:"Di",DATE_PICKER_DAY_WEDNESDAY_LONG:"Woensdag",DATE_PICKER_DAY_WEDNESDAY_SHORT:"Wo",DATE_PICKER_DAY_THURSDAY_LONG:"Donderdag",DATE_PICKER_DAY_THURSDAY_SHORT:"Do",DATE_PICKER_DAY_FRIDAY_LONG:"Vrijdag",DATE_PICKER_DAY_FRIDAY_SHORT:"Vr",DATE_PICKER_DAY_SATURDAY_LONG:"Zaterdag",DATE_PICKER_DAY_SATURDAY_SHORT:"Za",DATE_PICKER_DAY_SUNDAY_LONG:"Zondag",DATE_PICKER_DAY_SUNDAY_SHORT:"Zo",DISCOUNT_APPLIED:"Kortingscode toegepast",DISCOUNT_CHECK:"Controleren",DISCOUNT_TITLE:"Kortingscode of tegoedbon",DISCOUNT_INVALID:"Ongeldige kortingscode of tegoedbon",ERR_AMOUNTS_NO_PACKAGE:'Optie "productAmounts" is ingesteld, maar "package_id" is niet ingesteld',ERR_CONTACT_FORM_EMPTY:"Contactformulier is niet ingevuld",ERR_DATE_NO_SINGLE_PACKAGE:'Optie "date" vereist een enkel vooraf ingevuld arrangement ("package_id")',ERR_DATE_PAST:'Optie "date" is een datum in het verleden',ERR_GENERAL:"Er ging iets mis:",ERR_INVALID_DATE:'Optie "date" is geen geldige ISO 8601-datumstring (bijv. "2019-06-28")',ERR_INVALID_ELEMENT:'Optie "element" is geen geldig Element',ERR_INVALID_HOSTNAME:'Optie "recras_hostname" is ongeldig.',ERR_INVALID_LOCALE:"Ongeldige locale. Geldige opties zijn: {LOCALES}",ERR_INVALID_REDIRECT_URL:"Ongeldige redirect-URL. Zorg ervoor dat deze begint met http:// of https://",ERR_INVALID_TIME:'Optie "time" is geen geldige tijd-string (bijv. "16:15")',ERR_NO_ELEMENT:'Optie "element" niet ingesteld.',ERR_NO_FORM:'Optie "form_id" niet ingesteld.',ERR_NO_HOSTNAME:'Optie "recras_hostname" niet ingesteld.',ERR_NO_TIMES_FOR_DATE:"Er zijn geen tijden meer beschikbaar op deze datum voor deze aantallen. Probeer een andere datum.",ERR_OPTIONS_INVALID:'Opties is geen "RecrasOptions"-object',GENDER_UNKNOWN:"Onbekend",GENDER_MALE:"Man",GENDER_FEMALE:"Vrouw",HEADING_PRICE:"Prijs",HEADING_QUANTITY:"Aantal",LOADING:"Laden...",NO_PRODUCTS:"Geen product gekozen",PRICE_TOTAL:"Totaal",PRICE_TOTAL_WITH_DISCOUNT:"Totaal inclusief korting",PRODUCT_MAXIMUM:"(maximaal {MAXIMUM})",PRODUCT_MINIMUM:"(minimaal {MINIMUM})",PRODUCT_REQUIRED:"{NUM} {PRODUCT} vereist dat ook {REQUIRED_AMOUNT} {REQUIRED_PRODUCT} geboekt wordt.",TIME:"Tijd",TIME_FORMAT:"UU:MM",VOUCHER_ALREADY_APPLIED:"Tegoedbon al toegepast",VOUCHER_APPLIED:"Tegoedbon toegepast",VOUCHER_EMPTY:"Lege tegoedbon",VOUCHER_QUANTITY:"Aantal tegoedbonnen",VOUCHERS_DISCOUNT:"Korting uit tegoedbon(nen)"},sv_SE:{AGREE_ATTACHMENTS:"Jag håller med följande information:",ATTR_REQUIRED:"Obligatoriskt",BOOKING_DISABLED_AGREEMENT:"Du håller inte med villkoren ännu",BOOKING_DISABLED_AMOUNTS_INVALID:"Siffrorna i programmet är ogiltiga",BOOKING_DISABLED_CONTACT_FORM_INVALID:"Kontaktformuläret är inte korrekt ifyllt",BOOKING_DISABLED_INVALID_DATE:"Inget datum valt",BOOKING_DISABLED_INVALID_TIME:"Ingen tid vald",BOOKING_DISABLED_REQUIRED_PRODUCT:"Nödvändig produkt har ännu inte valts",BUTTON_BOOK_NOW:"Boka nu",BUTTON_BUY_NOW:"Köp nu",BUTTON_SUBMIT_CONTACT_FORM:"Skicka",CONTACT_FORM_CHECKBOX_REQUIRED:"Minst ett alternativ måste markeras",CONTACT_FORM_FIELD_INVALID:'"{FIELD_NAME}" är ogiltig',CONTACT_FORM_FIELD_REQUIRED:'"{FIELD_NAME}" är ett obligatoriskt fält',CONTACT_FORM_SUBMIT_FAILED:"Kontaktformuläret kunde inte skickas. Vänligen försök igen senare.",CONTACT_FORM_SUBMIT_SUCCESS:"Kontaktformuläret har skickats.",DATUM:"Datum",DATE_FORMAT:"DD-MM-ÅÅÅÅ",DATE_INVALID:"Ogiltigt datum",DATE_PICKER_NEXT_MONTH:"Nästa månad",DATE_PICKER_PREVIOUS_MONTH:"Förra månaden",DATE_PICKER_MONTH_JANUARI:"januari",DATE_PICKER_MONTH_FEBRUARY:"februari",DATE_PICKER_MONTH_MARCH:"mars",DATE_PICKER_MONTH_APRIL:"april",DATE_PICKER_MONTH_MAY:"aaj",DATE_PICKER_MONTH_JUNE:"juni",DATE_PICKER_MONTH_JULY:"Juli",DATE_PICKER_MONTH_AUGUST:"augusti",DATE_PICKER_MONTH_SEPTEMBER:"september",DATE_PICKER_MONTH_OCTOBER:"oktober",DATE_PICKER_MONTH_NOVEMBER:"november",DATE_PICKER_MONTH_DECEMBER:"december",DATE_PICKER_DAY_MONDAY_LONG:"Måndag",DATE_PICKER_DAY_MONDAY_SHORT:"Mån",DATE_PICKER_DAY_TUESDAY_LONG:"Tisdag",DATE_PICKER_DAY_TUESDAY_SHORT:"Tis",DATE_PICKER_DAY_WEDNESDAY_LONG:"Onsdag",DATE_PICKER_DAY_WEDNESDAY_SHORT:"Ons",DATE_PICKER_DAY_THURSDAY_LONG:"Torsdag",DATE_PICKER_DAY_THURSDAY_SHORT:"Tors",DATE_PICKER_DAY_FRIDAY_LONG:"Fredag",DATE_PICKER_DAY_FRIDAY_SHORT:"Fre",DATE_PICKER_DAY_SATURDAY_LONG:"Lördag",DATE_PICKER_DAY_SATURDAY_SHORT:"Lör",DATE_PICKER_DAY_SUNDAY_LONG:"Söndag",DATE_PICKER_DAY_SUNDAY_SHORT:"Sön",DISCOUNT_APPLIED:"Rabattkod tillämpas",DISCOUNT_CHECK:"Kontrollera",DISCOUNT_TITLE:"Rabattkod eller kupong",DISCOUNT_INVALID:"Ogiltig rabattkod eller kupong",ERR_AMOUNTS_NO_PACKAGE:'Alternativ "productAmounts" är inställt, men "package_id" är inte inställt',ERR_CONTACT_FORM_EMPTY:"Kontaktformuläret är inte ifyllt",ERR_DATE_NO_SINGLE_PACKAGE:'Alternativ "date" kräver ett enda förfyllt paket ("package_id")',ERR_DATE_PAST:'Alternativ "date" är ett datum tidigare',ERR_GENERAL:"Något gick fel:",ERR_INVALID_DATE:'Alternativ "date" är inte en giltig ISO 8601-datumsträng (t.ex. "2019-06-28")',ERR_INVALID_ELEMENT:'Alternativet "element" är inte ett giltigt element',ERR_INVALID_HOSTNAME:'Alternativet "recras_hostname" är ogiltigt.',ERR_INVALID_LOCALE:"Ogiltig land-språkkombination. Giltiga alternativ är: {LOCALES} ",ERR_INVALID_REDIRECT_URL:"Ogiltig omdirigerings-URL. Se till att det börjar med http:// eller https:// ",ERR_INVALID_TIME:'Alternativ "time" är inte en giltig tidsnotation (t.ex. "16:15")',ERR_NO_ELEMENT:'Alternativet "element" är inte inställt.',ERR_NO_FORM:'Alternativ "form_id" inte inställt.',ERR_NO_HOSTNAME:'Alternativ "recras_hostname" inte inställt.',ERR_NO_TIMES_FOR_DATE:"Det finns inga fler tillgängliga tider på detta datum för dessa nummer. Prova ett annat datum. ",ERR_OPTIONS_INVALID:'Alternativ är inte ett "RecrasOptions"-objekt',GENDER_UNKNOWN:"Okänd",GENDER_MALE:"Man",GENDER_FEMALE:"Kvinna",HEADING_PRICE:"Pris",HEADING_QUANTITY:"Antal",LOADING:"Laddar ...",NO_PRODUCTS:"Ingen produkt vald",PRICE_TOTAL:"Totalt",PRICE_TOTAL_WITH_DISCOUNT:"Totalt inklusive rabatt",PRODUCT_MAXIMUM:"(maximalt {MAXIMUM})",PRODUCT_MINIMUM:"(minimalt {MINIMUM})",PRODUCT_REQUIRED:"{NUM} {PRODUCT} kräver att {REQUIRED_AMOUNT} {REQUIRED_PRODUCT} också bokas.",TIME:"Tid",TIME_FORMAT:"TT:MM",VOUCHER_ALREADY_APPLIED:"Kupongen är redan inlöst",VOUCHER_APPLIED:"Kupong inlöst",VOUCHER_EMPTY:"Tom kupong",VOUCHER_QUANTITY:"Antal kuponger",VOUCHERS_DISCOUNT:"Rabatt från kupong(er)"}}}_createClass(RecrasLanguageHelper,[{key:"error",value:function error(msg){console.log("Error",msg)}},{key:"extractTags",value:function extractTags(msg){var alphanumericWithUnderscore="[a-zA-Z0-9_]";var regexPartMulticolumn="((?:\\((?:\\w+)(?::[^)]*)?\\))*)";var regex=new RegExp("{"+alphanumericWithUnderscore+"+"+regexPartMulticolumn+"}","g");var tags=msg.match(regex);if(!Array.isArray(tags)){return[]}return tags.map(function(tag){return tag.substring(1,tag.length-1)})}},{key:"filterTags",value:function filterTags(msg,packageID){var tags=this.extractTags(msg);if(tags.length===0){return Promise.resolve(msg)}return RecrasHttpHelper.postJson(this.options.getApiBase()+"tagfilter",{tags:tags,context:{packageID:packageID}},this.error).then(function(filtered){Object.keys(filtered).forEach(function(tag){msg=msg.split("{"+tag+"}").join(filtered[tag])});return msg})}},{key:"formatLocale",value:function formatLocale(what){switch(what){case"currency":return this.locale.replace("_","-").toUpperCase();default:return this.locale}}},{key:"formatPrice",value:function formatPrice(price){return parseFloat(price).toLocaleString(this.formatLocale("currency"),{currency:this.currency,style:"currency"})}},{key:"setCurrency",value:function setCurrency(){var _this40=this;var errorHandler=function errorHandler(err){_this40.currency="eur";_this40.error(err)};return RecrasHttpHelper.fetchJson(this.options.getApiBase()+"instellingen/currency",errorHandler).then(function(setting){_this40.currency=setting.waarde})}},{key:"setLocale",value:function setLocale(locale){this.locale=locale}},{key:"setOptions",value:function setOptions(options){this.options=options;return this.setCurrency()}},{key:"translate",value:function translate(string){var vars=arguments.length>1&&arguments[1]!==undefined?arguments[1]:{};var translated;if(this.i18n[this.locale]&&this.i18n[this.locale][string]){translated=this.i18n[this.locale][string]}else if(this.i18n.en_GB[string]){translated=this.i18n.en_GB[string]}else{translated=string;console.warn("String not translated: "+string)}if(Object.keys(vars).length>0){Object.keys(vars).forEach(function(key){translated=translated.replace("{"+key+"}",vars[key])})}return translated}}],[{key:"isValid",value:function isValid(locale){return this.validLocales.indexOf(locale)>-1}}]);return RecrasLanguageHelper}();_defineProperty(RecrasLanguageHelper,"validLocales",["de_DE","en_GB","nl_NL","sv_SE"]);var RecrasOptions=function(){function RecrasOptions(options){_classCallCheck(this,RecrasOptions);this.languageHelper=new RecrasLanguageHelper;this.validate(options);this.options=this.setOptions(options)}_createClass(RecrasOptions,[{key:"getAnalyticsEvents",value:function getAnalyticsEvents(){if(!Array.isArray(this.options.analyticsEvents)){this.options.analyticsEvents=RecrasEventHelper.allEvents()}this.options.analyticsEvents=this.options.analyticsEvents.filter(function(event){var eventExists=RecrasEventHelper.allEvents().includes(event);if(!eventExists){console.warn("Invalid event: "+event)}return eventExists});if(this.options.analyticsEvents.length===0){this.options.analyticsEvents=RecrasEventHelper.allEvents()}return this.options.analyticsEvents}},{key:"getAnalytics",value:function getAnalytics(){return this.options.analytics}},{key:"getApiBase",value:function getApiBase(){return this.getHostname()+"/api2/"}},{key:"getAutoScroll",value:function getAutoScroll(){return this.options.autoScroll!==undefined?this.options.autoScroll:true}},{key:"getDefaultCountry",value:function getDefaultCountry(){if(this.options.defaultCountry!==undefined){return this.options.defaultCountry}return this.getLocale().substr(3,2)}},{key:"getElement",value:function getElement(){return this.options.element}},{key:"getFormId",value:function getFormId(){return this.options.form_id}},{key:"getHostname",value:function getHostname(){return this.options.hostname}},{key:"getLocale",value:function getLocale(){return this.options.locale}},{key:"getPackageId",value:function getPackageId(){return this.options.package_id}},{key:"getPreFilledAmounts",value:function getPreFilledAmounts(){return this.options.productAmounts}},{key:"getPreFilledDate",value:function getPreFilledDate(){return this.options.date}},{key:"getPreFilledTime",value:function getPreFilledTime(){return this.options.time}},{key:"getPreviewTimes",value:function getPreviewTimes(){return this.options.previewTimes!==undefined?this.options.previewTimes:true}},{key:"getRedirectUrl",value:function getRedirectUrl(){return this.options.redirect_url}},{key:"getVoucherTemplateId",value:function getVoucherTemplateId(){return this.options.voucher_template_id}},{key:"isSinglePackage",value:function isSinglePackage(){if(Array.isArray(this.options.package_id)){return this.options.package_id.length===1}return!isNaN(parseInt(this.options.package_id,10))}},{key:"setOption",value:function setOption(option,value){this.options[option]=value}},{key:"setOptions",value:function setOptions(options){var protocol="https";if(RecrasOptions.hostnamesDebug.includes(options.recras_hostname)){protocol="http"}options.hostname=protocol+"://"+options.recras_hostname;return options}},{key:"validate",value:function validate(options){var hostnameRegex=new RegExp(/^[a-z0-9\-]+\.recras\.nl$/i);if(!options.element){throw new Error(this.languageHelper.translate("ERR_NO_ELEMENT"))}if(options.element instanceof Element===false){throw new Error(this.languageHelper.translate("ERR_INVALID_ELEMENT"))}if(!options.recras_hostname){throw new Error(this.languageHelper.translate("ERR_NO_HOSTNAME"))}if(!hostnameRegex.test(options.recras_hostname)&&!RecrasOptions.hostnamesDebug.includes(options.recras_hostname)){throw new Error(this.languageHelper.translate("ERR_INVALID_HOSTNAME"))}if(options.redirect_url){if(options.redirect_url.indexOf("http://")===-1&&options.redirect_url.indexOf("https://")===-1){throw new Error(this.languageHelper.translate("ERR_INVALID_REDIRECT_URL"))}}}}]);return RecrasOptions}();_defineProperty(RecrasOptions,"hostnamesDebug",["nginx:8886","nginx"]);var RecrasVoucher=function(){function RecrasVoucher(){var _this41=this;var options=arguments.length>0&&arguments[0]!==undefined?arguments[0]:{};_classCallCheck(this,RecrasVoucher);this.languageHelper=new RecrasLanguageHelper;if(options instanceof RecrasOptions===false){throw new Error(this.languageHelper.translate("ERR_OPTIONS_INVALID"))}this.options=options;this.eventHelper=new RecrasEventHelper;this.eventHelper.setEvents(this.options.getAnalyticsEvents());this.element=this.options.getElement();this.element.classList.add("recras-buy-voucher");this.fetchJson=function(url){return RecrasHttpHelper.fetchJson(url,_this41.error)};this.postJson=function(url,data){return RecrasHttpHelper.postJson(_this41.options.getApiBase()+url,data,_this41.error)};RecrasCSSHelper.loadCSS("global");if(this.options.getLocale()){if(!RecrasLanguageHelper.isValid(this.options.getLocale())){console.warn(this.languageHelper.translate("ERR_INVALID_LOCALE",{LOCALES:RecrasLanguageHelper.validLocales.join(", ")}))}else{this.languageHelper.setLocale(this.options.getLocale())}}this.languageHelper.setOptions(options).then(function(){return _this41.getVoucherTemplates()}).then(function(templates){if(_this41.options.getVoucherTemplateId()){_this41.changeTemplate(_this41.options.getVoucherTemplateId())}else{_this41.showTemplates(templates)}})}_createClass(RecrasVoucher,[{key:"appendHtml",value:function appendHtml(msg){this.element.insertAdjacentHTML("beforeend",msg)}},{key:"formatGA4Item",value:function formatGA4Item(){return[{item_name:this.selectedTemplate.name,price:this.selectedTemplate.price,quantity:parseInt(this.findElement("#number-of-vouchers").value)}]}},{key:"buyTemplate",value:function buyTemplate(){var _this42=this;var status=this.contactForm.checkRequiredCheckboxes();if(!status){return false}this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER,RecrasEventHelper.EVENT_VOUCHER_VOUCHER_SUBMITTED,this.selectedTemplate.name,Math.round(this.totalPrice()));this.findElement(".buyTemplate").setAttribute("disabled","disabled");var payload={voucher_template_id:this.selectedTemplate.id,number_of_vouchers:parseInt(this.findElement(".number-of-vouchers").value,10),contact_form:this.contactForm.generateJson()};if(this.options.getRedirectUrl()){payload.redirect_url=this.options.getRedirectUrl()}this.postJson("vouchers/buy",payload).then(function(json){if(json.payment_url){_this42.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER,RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT,null,Math.round(_this42.totalPrice()),{currency:_this42.languageHelper.currency,value:_this42.totalPrice(),items:_this42.formatGA4Item()});window.top.location.href=json.payment_url}else{console.log(json)}_this42.findElement(".buyTemplate").removeAttribute("disabled")})}},{key:"changeTemplate",value:function changeTemplate(templateID){this.selectedTemplate=this.templates.filter(function(t){return t.id===templateID})[0];this.clearAllExceptTemplateSelection();this.showContactForm(this.selectedTemplate);this.eventHelper.sendEvent(RecrasEventHelper.PREFIX_VOUCHER,RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED,null,templateID,{content_type:"voucher",item_id:templateID})}},{key:"clearAll",value:function clearAll(){this.clearElements(this.element.children)}},{key:"clearAllExceptTemplateSelection",value:function clearAllExceptTemplateSelection(){var elements=document.querySelectorAll("#"+this.element.id+" > *:not(.recras-voucher-templates)");this.clearElements(elements)}},{key:"clearElements",value:function clearElements(elements){_toConsumableArray(elements).forEach(function(el){el.parentNode.removeChild(el)});this.maybeAddLatestErrorElement()}},{key:"error",value:function error(msg){this.maybeAddLatestErrorElement();this.findElement(".latestError").innerHTML="<strong>".concat(this.languageHelper.translate("ERR_GENERAL"),"</strong><p>").concat(msg,"</p>")}},{key:"findElement",value:function findElement(querystring){return this.element.querySelector(querystring)}},{key:"findElements",value:function findElements(querystring){return this.element.querySelectorAll(querystring)}},{key:"formatPrice",value:function formatPrice(price){return this.languageHelper.formatPrice(price)}},{key:"getContactForm",value:function getContactForm(template){var _this43=this;this.options.setOption("form_id",template.contactform_id);var contactForm=new RecrasContactForm(this.options);return contactForm.getContactFormFields().then(function(){_this43.contactForm=contactForm;return contactForm})}},{key:"getVoucherTemplates",value:function getVoucherTemplates(){var _this44=this;return this.fetchJson(this.options.getApiBase()+"voucher_templates").then(function(templates){templates=templates.filter(function(template){return!!template.contactform_id});_this44.templates=templates;return templates})}},{key:"maybeAddLatestErrorElement",value:function maybeAddLatestErrorElement(){var errorEl=this.findElement(".latestError");if(!errorEl){this.appendHtml('<div class="latestError"></div>')}}},{key:"maybeDisableBuyButton",value:function maybeDisableBuyButton(){var button=this.findElement(".buyTemplate");if(!button){return false}var shouldDisable=false;this.contactForm.removeErrors();if(this.contactForm.hasEmptyRequiredFields()||!this.contactForm.isValid()||!this.contactForm.checkRequiredCheckboxes()){this.contactForm.showInlineErrors();shouldDisable=true}if(shouldDisable){button.setAttribute("disabled","disabled")}else{button.removeAttribute("disabled")}}},{key:"showBuyButton",value:function showBuyButton(){var html='<div><button type="submit" class="buyTemplate" disabled>'.concat(this.languageHelper.translate("BUTTON_BUY_NOW"),"</button></div>");this.appendHtml(html);this.findElement(".buyTemplate").addEventListener("click",this.buyTemplate.bind(this))}},{key:"showContactForm",value:function showContactForm(template){var _this45=this;return this.getContactForm(template).then(function(form){return form.generateForm({voucherQuantitySelector:true,quantityTerm:_this45.selectedTemplate.quantity_term})}).then(function(html){_this45.appendHtml(html);_this45.showBuyButton();_toConsumableArray(_this45.findElements('#number-of-vouchers, [name^="contactformulier"]')).forEach(function(el){el.addEventListener("change",_this45.maybeDisableBuyButton.bind(_this45))})})}},{key:"showTemplates",value:function showTemplates(templates){var _this46=this;var templateOptions=templates.map(function(template){return'<option value="'.concat(template.id,'">').concat(template.name," (").concat(_this46.formatPrice(template.price),")")});var html='<select class="recrasVoucherTemplates"><option>'.concat(templateOptions.join(""),"</select>");this.appendHtml('<div class="recras-voucher-templates">'.concat(html,"</div>"));var voucherSelectEl=this.findElement(".recrasVoucherTemplates");voucherSelectEl.addEventListener("change",function(){var selectedTemplateId=parseInt(voucherSelectEl.value,10);_this46.changeTemplate(selectedTemplateId)})}},{key:"totalPrice",value:function totalPrice(){return this.selectedTemplate.price*this.findElement("#number-of-vouchers").value}}]);return RecrasVoucher}();

package/docs/onlinebooking.html

@@ -20,7 +20,7 @@
         console.log(params);
     };
     const recrasOptions = {
-        recras_hostname: 'staging-7164-boek-3v9yx2.recras.nl', // Required
+        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/package.json

@@ -1,15 +1,16 @@
 {
   "name": "@recras/online-booking-js",
-  "version": "1.10.3",
+  "version": "1.11.0",
   "description": "JS library for easy integration of Recras online booking and voucher sales",
   "main": "dist/onlinebooking.js",
   "scripts": {
-    "build": "npm run _catFiles && npm run _babelSrc",
+    "_babelSrc": "babel tmp -d dist && rm tmp/*.js",
+    "_catFiles": "mkdir -p tmp && cat src/*.js > tmp/onlinebooking.js",
+    "build": "npm run _catFiles && npm run _babelSrc && npm run minify",
     "jshint": "jshint src",
-    "test": "karma start test/js-unit/karma.conf.js --verbose",
     "karma": "npm test",
-    "_babelSrc": "babel tmp -d dist && rm tmp/*.js",
-    "_catFiles": "mkdir -p tmp && cat src/*.js > tmp/onlinebooking.js"
+    "minify": "./node_modules/uglify-js/bin/uglifyjs dist/onlinebooking.js -o dist/onlinebooking.min.js",
+    "test": "karma start test/js-unit/karma.conf.js --verbose"
   },
   "repository": {
     "type": "git",
@@ -30,21 +31,22 @@
   },
   "homepage": "https://github.com/Recras/online-booking-js#readme",
   "devDependencies": {
-    "@babel/cli": "7.14.5",
-    "@babel/core": "7.14.6",
-    "@babel/plugin-proposal-class-properties": "7.14.5",
-    "@babel/plugin-transform-arrow-functions": "7.14.5",
-    "@babel/plugin-transform-for-of": "7.14.5",
-    "@babel/plugin-transform-object-assign": "7.14.5",
-    "@babel/preset-env": "7.14.7",
+    "@babel/cli": "7.17.0",
+    "@babel/core": "7.17.0",
+    "@babel/plugin-proposal-class-properties": "7.16.7",
+    "@babel/plugin-transform-arrow-functions": "7.16.7",
+    "@babel/plugin-transform-for-of": "7.16.7",
+    "@babel/plugin-transform-object-assign": "7.16.7",
+    "@babel/preset-env": "7.16.11",
     "babel-plugin-transform-es2017-object-entries": "0.0.5",
-    "jasmine-core": "3.7.1",
+    "jasmine-core": "4.0.1",
     "jasmine-spec-reporter": "7.0.0",
-    "jshint": "2.13.0",
-    "karma": "6.3.4",
+    "jshint": "2.13.4",
+    "karma": "6.3.17",
     "karma-chrome-launcher": "3.1.0",
-    "karma-firefox-launcher": "2.1.1",
-    "karma-jasmine": "4.0.1",
-    "karma-spec-reporter": "0.0.32"
+    "karma-firefox-launcher": "2.1.2",
+    "karma-jasmine": "4.0.2",
+    "karma-spec-reporter": "0.0.33",
+    "uglify-js": "3.15.3"
   }
 }

package/src/booking.js

@@ -1,6 +1,6 @@
 /*******************************
 *  Recras integration library  *
-*  v 1.10.3                    *
+*  v 1.11.0                    *
 *******************************/
 
 class RecrasBooking {
@@ -318,7 +318,11 @@ class RecrasBooking {
                 RecrasEventHelper.PREFIX_BOOKING,
                 RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED,
                 selectedPackage[0].arrangement,
-                selectedPackage[0].id
+                selectedPackage[0].id,
+                {
+                    content_type: 'package',
+                    item_id: selectedPackage[0].id,
+                }
             );
         }
         this.selectedPackage = selectedPackage[0];
@@ -1375,6 +1379,43 @@ ${ msgs[1] }</p></div>`);
         return attachments;
     }
 
+    formatGA4Items() {
+        let items = [];
+
+        if (this.bookingSize() > 0) {
+            let pck = this.selectedPackage;
+            items.push({
+                item_name: (pck.weergavenaam || pck.arrangement),
+                price: this.bookingSizePrice(pck),
+                quantity: this.bookingSize(),
+            });
+        }
+
+        let linesNoBookingSize = this.getLinesNoBookingSize(this.selectedPackage);
+        linesNoBookingSize = linesNoBookingSize.filter(line => {
+            const lineEl = this.findElement(`[data-package-id="${ line.id }"]`);
+            if (!lineEl) {
+                return false;
+            }
+
+            if (isNaN(parseInt(lineEl.value))) {
+                return false;
+            }
+            return parseInt(lineEl.value) > 0;
+        });
+        linesNoBookingSize = linesNoBookingSize.map(line => {
+            const lineEl = this.findElement(`[data-package-id="${line.id}"]`);
+            return {
+                item_name: line.beschrijving_templated,
+                price: line.product.verkoop,
+                quantity: parseInt(lineEl.value),
+            };
+        });
+        items.push(...linesNoBookingSize);
+
+        return items;
+    }
+
     submitBooking() {
         let productCounts = this.productCounts().map(line => line.aantal);
         let productSum = productCounts.reduce((a, b) => a + b, 0);
@@ -1432,7 +1473,12 @@ ${ msgs[1] }</p></div>`);
                     RecrasEventHelper.PREFIX_BOOKING,
                     RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT,
                     null,
-                    Math.round(this.getTotalPrice())
+                    Math.round(this.getTotalPrice()),
+                    {
+                        currency: this.languageHelper.currency,
+                        value: this.getTotalPrice(),
+                        items: this.formatGA4Items(),
+                    }
                 );
                 window.top.location.href = json.payment_url;
             } else if (json.redirect) {

package/src/eventHelper.js

@@ -48,7 +48,26 @@ class RecrasEventHelper {
         return this.eventsEnabled.includes(name);
     }
 
-    sendEvent(cat, action, label = undefined, value = undefined) {
+    ga4EventMap(action) {
+        let map = {
+            [RecrasEventHelper.EVENT_BOOKING_PACKAGE_CHANGED]: 'select_content',
+            [RecrasEventHelper.EVENT_BOOKING_REDIRECT_PAYMENT]: 'begin_checkout',
+            [RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED]: 'select_content',
+            [RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT]: 'begin_checkout',
+        };
+
+        if (map[action] === undefined) {
+            return false;
+        }
+        return map[action];
+    }
+
+    isGA4() {
+        const fn = window[window.GoogleAnalyticsObject || 'ga'];
+        return fn && fn.h && fn.h.gtm4;
+    }
+
+    sendEvent(cat, action, label = undefined, value = undefined, ga4Value = undefined) {
         let event;
 
         try {
@@ -60,8 +79,11 @@ class RecrasEventHelper {
         }
 
         if (this.analyticsEnabled && this.eventEnabled(action)) {
-            if (typeof window.gtag === 'function') {
-                // Global Site Tag - the more modern variant
+            if (this.isGA4() && this.ga4EventMap(action) && ga4Value) {
+                // v4
+                this.sendGA4Event(this.ga4EventMap(action), ga4Value);
+            } else if (typeof window.gtag === 'function') {
+                // Global Site Tag (v3)
                 let eventData = {
                     event_category: RecrasEventHelper.PREFIX_GLOBAL + ':' + cat,
                 };
@@ -73,7 +95,7 @@ class RecrasEventHelper {
                 }
                 window.gtag('event', action, eventData);
             } else if (typeof window.ga === 'function') {
-                // "Old" Google Analytics
+                // "Old" Google Analytics (v2) and Tag Manager
                 let eventData = {
                     hitType: 'event',
                     eventCategory: RecrasEventHelper.PREFIX_GLOBAL + ':' + cat,
@@ -92,13 +114,18 @@ class RecrasEventHelper {
                         prefix += '.';
                     }
                     window.ga(prefix + 'send', eventData);
-                })
+                });
             }
         }
 
         return document.dispatchEvent(event);
     }
 
+    sendGA4Event(action, data) {
+        const fn = window[window.GoogleAnalyticsObject || 'ga'];
+        fn('event', action, data);
+    }
+
     setAnalytics(bool) {
         this.analyticsEnabled = bool;
     }

package/src/vouchers.js

@@ -43,6 +43,16 @@ class RecrasVoucher {
         this.element.insertAdjacentHTML('beforeend', msg);
     }
 
+    formatGA4Item() {
+        return [
+            {
+                item_name: this.selectedTemplate.name,
+                price: this.selectedTemplate.price,
+                quantity: parseInt(this.findElement('#number-of-vouchers').value),
+            }
+        ];
+    }
+
     buyTemplate() {
         let status = this.contactForm.checkRequiredCheckboxes();
         if (!status) {
@@ -72,7 +82,12 @@ class RecrasVoucher {
                         RecrasEventHelper.PREFIX_VOUCHER,
                         RecrasEventHelper.EVENT_VOUCHER_REDIRECT_PAYMENT,
                         null,
-                        Math.round(this.totalPrice())
+                        Math.round(this.totalPrice()),
+                        {
+                            currency: this.languageHelper.currency,
+                            value: this.totalPrice(),
+                            items: this.formatGA4Item(),
+                        }
                     );
                     window.top.location.href = json.payment_url;
                 } else {
@@ -94,7 +109,11 @@ class RecrasVoucher {
             RecrasEventHelper.PREFIX_VOUCHER,
             RecrasEventHelper.EVENT_VOUCHER_TEMPLATE_CHANGED,
             null,
-            templateID
+            templateID,
+            {
+                content_type: 'voucher',
+                item_id: templateID,
+            }
         );
     }