@everymatrix/lottery-game-page 1.77.25 → 1.77.26

package/dist/collection/components/lottery-game-page/lottery-game-page.js

@@ -1,6 +1,6 @@
 import { h, getAssetPath } from "@stencil/core";
 import { translate, getTranslations } from "../../utils/locale.utils";
-import { isMobile, generateUUID, fetchRequest } from "../../utils/utils";
+import { isMobile, generateUUID, fetchRequest, showNotification } from "../../utils/utils";
 import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
 import "../../../../../lottery-ticket-controller/dist/types/index";
 import "../../../../../helper-modal/dist/types/index";
@@ -26,9 +26,9 @@ export class LotteryGamePage {
                 return '';
             }
             value = value.toString();
-            const parts = value.split(".");
-            parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
-            return parts.join(".");
+            const parts = value.split('.');
+            parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+            return parts.join('.');
         };
         this.endpoint = undefined;
         this.endpointTicket = undefined;
@@ -89,17 +89,26 @@ export class LotteryGamePage {
             this.isLoading = false;
         });
     }
+    watchGameInfoChange(newValue, oldValue) {
+        if (newValue && newValue != oldValue) {
+            this.getGameDetails();
+        }
+    }
     async componentWillLoad() {
-        this.getGameDetails();
+        if (this.gameId && this.endpoint) {
+            this.getGameDetails();
+        }
         if (this.sessionId) {
             this.isLoggedIn = true;
         }
         // Translation url logic
         const promises = [];
         if (this.translationUrl) {
-            const translationPromise = getTranslations(this.translationUrl).then((data) => {
+            const translationPromise = getTranslations(this.translationUrl)
+                .then((data) => {
                 this.translationData = JSON.stringify(data);
-            }).catch(err => {
+            })
+                .catch((err) => {
                 console.log(err);
             });
             promises.push(translationPromise);
@@ -120,8 +129,13 @@ export class LotteryGamePage {
         const setTime = () => {
             this.daysRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60 * 60 * 24));
             this.hoursRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60 * 60) - this.daysRemaining * 24);
-            this.minutesRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60) - this.daysRemaining * 24 * 60 - this.hoursRemaining * 60);
-            this.secondsRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / 1000 - this.daysRemaining * 24 * 60 * 60 - this.hoursRemaining * 60 * 60 - this.minutesRemaining * 60);
+            this.minutesRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60) -
+                this.daysRemaining * 24 * 60 -
+                this.hoursRemaining * 60);
+            this.secondsRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / 1000 -
+                this.daysRemaining * 24 * 60 * 60 -
+                this.hoursRemaining * 60 * 60 -
+                this.minutesRemaining * 60);
         };
         setTime();
         this.interval = setInterval(setTime, 1000);
@@ -147,9 +161,9 @@ export class LotteryGamePage {
             this.basicBetType = this.gameData.rules.betTypes[0];
             this.nextDate = (_b = this.gameData.currentDraw) === null || _b === void 0 ? void 0 : _b.date;
             this.nextDate && this.countdownLogic(this.nextDate);
-            this.secondarySelectionAllowed = this.gameData.rules.secondarySelectionAllowed === "INPUT" ? true : false;
+            this.secondarySelectionAllowed = this.gameData.rules.secondarySelectionAllowed === 'INPUT' ? true : false;
             this.quickPick = this.gameData.rules.quickPickAvailable;
-            this.isSubscription = this.gameData.rules.wagerTypes && this.gameData.rules.wagerTypes.includes("Subscription");
+            this.isSubscription = this.gameData.rules.wagerTypes && this.gameData.rules.wagerTypes.includes('Subscription');
             let draws = this.gameData.draws ? this.gameData.draws.filter((item) => !item.winningNumbers) : [];
             draws.length > 0 && (this.nextDraw = draws[0].id);
             this.createNewTicket();
@@ -165,7 +179,12 @@ export class LotteryGamePage {
         this.mainTickets.forEach((item) => {
             var _a;
             if (item.completed.every((v) => v)) {
-                this.totalAmount += (item.drawCount) * (item.stake || this.basicStake) * (item.multiplierNum) * (item.lineNum) * ((_a = item.betType) === null || _a === void 0 ? void 0 : _a.combinations);
+                this.totalAmount +=
+                    item.drawCount *
+                        (item.stake || this.basicStake) *
+                        item.multiplierNum *
+                        item.lineNum *
+                        ((_a = item.betType) === null || _a === void 0 ? void 0 : _a.combinations);
             }
         });
         this.currency = currency;
@@ -276,11 +295,31 @@ export class LotteryGamePage {
     createNewTicket() {
         this.mainTickets = [
             ...this.mainTickets,
-            { gameId: this.gameId, ticketId: this.mainTickets.length + 1, drawCount: 1, multiplierNum: 1, completed: [false], stake: this.basicStake, betType: this.basicBetType, lineNum: this.basicLine, quickPicks: [false], betName: '' }
+            {
+                gameId: this.gameId,
+                ticketId: this.mainTickets.length + 1,
+                drawCount: 1,
+                multiplierNum: 1,
+                completed: [false],
+                stake: this.basicStake,
+                betType: this.basicBetType,
+                lineNum: this.basicLine,
+                quickPicks: [false],
+                betName: ''
+            }
         ];
         this.secondaryTickets = [
             ...this.secondaryTickets,
-            { gameId: this.gameId, ticketId: this.secondaryTickets.length + 1, drawCount: 1, multiplierNum: 1, completed: [false], stake: this.basicStake, betType: this.basicBetType, lineNum: this.basicLine }
+            {
+                gameId: this.gameId,
+                ticketId: this.secondaryTickets.length + 1,
+                drawCount: 1,
+                multiplierNum: 1,
+                completed: [false],
+                stake: this.basicStake,
+                betType: this.basicBetType,
+                lineNum: this.basicLine
+            }
         ];
     }
     showLoginModal() {
@@ -314,10 +353,9 @@ export class LotteryGamePage {
             return indices;
         }, []);
         let mergedUniqueArray = [...new Set([...secondaryDirtyTicketLines, ...dirtyTicketLines])].sort((a, b) => a - b);
-        ;
         if (mergedUniqueArray.length) {
             this.showSubmitError = true;
-            let lines = mergedUniqueArray.map(item => `Line${item + 1}`).join();
+            let lines = mergedUniqueArray.map((item) => `Line${item + 1}`).join();
             this.submitError = `The number of the selected number(s) on ${lines} is invalid.`;
             setTimeout(() => {
                 this.showSubmitError = false;
@@ -328,7 +366,11 @@ export class LotteryGamePage {
             var _a;
             body.tickets.push({
                 startingDrawId: this.nextDraw,
-                amount: (item.stake * item.drawCount * item.multiplierNum * (item.lineNum || 1) * ((_a = item.betType) === null || _a === void 0 ? void 0 : _a.combinations)).toString(),
+                amount: (item.stake *
+                    item.drawCount *
+                    item.multiplierNum *
+                    (item.lineNum || 1) *
+                    ((_a = item.betType) === null || _a === void 0 ? void 0 : _a.combinations)).toString(),
                 gameId: this.gameId,
                 gameName: this.gameData.name,
                 currency: this.currency,
@@ -346,24 +388,11 @@ export class LotteryGamePage {
                 multiplier: item.multiplier,
                 multiplierNum: item.multiplierNum,
                 drawCount: item.drawCount,
-                quickPick: this.quickPick,
+                quickPick: this.quickPick
             });
         });
         return body;
     }
-    showNotification(message, theme = '', position = 'top-end') {
-        const notification = document.createElement('vaadin-notification');
-        notification.renderer = (root) => {
-            root.textContent = message;
-        };
-        notification.duration = 5000;
-        if (theme) {
-            notification.setAttribute('theme', theme);
-        }
-        notification.setAttribute('position', position);
-        document.body.appendChild(notification);
-        notification.opened = true;
-    }
     handleSubmitTickets() {
         if (this.isSubscription && this.isSubscribed) {
             this.submitTickets();
@@ -399,19 +428,19 @@ export class LotteryGamePage {
             const timeStamp = format(new Date(), 'yyyyMMddHHMMSS');
             this.subscriptionParam.name = `${this.subscriptionParam.ruleType}_${playerId}_${timeStamp}`;
             const { id } = await fetchRequest(crateRuleUrl, 'POST', this.subscriptionParam, {
-                'Authorization': `Bearer ${this.sessionId}`,
+                Authorization: `Bearer ${this.sessionId}`
             });
             if (bodyParam) {
                 const body = Object.assign(Object.assign({}, bodyParam), { ruleDefinitionId: id });
                 const createTicketId = `${this.endpointTicket}/subscription`;
                 await fetchRequest(createTicketId, 'POST', body, {
-                    'Authorization': `Bearer ${this.sessionId}`,
+                    Authorization: `Bearer ${this.sessionId}`
                 });
-                this.showNotification('Subscription rule created successfully.', 'success');
+                showNotification({ message: 'Subscription rule created successfully.', theme: 'success' });
             }
         }
         catch (err) {
-            this.showNotification('Failed to create the subscription rule. Please try again.', 'error');
+            showNotification({ message: 'Failed to create the subscription rule. Please try again.', theme: 'error' });
         }
         this.isLoading = false;
     }
@@ -426,8 +455,8 @@ export class LotteryGamePage {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
-                    'Accept': 'application/json',
-                    'Authorization': `Bearer ${this.sessionId}`,
+                    Accept: 'application/json',
+                    Authorization: `Bearer ${this.sessionId}`,
                     'X-Idempotency-Key': uuid
                 },
                 body: JSON.stringify(body)
@@ -447,11 +476,11 @@ export class LotteryGamePage {
             })
                 .then(() => {
                 // this.successVisible = true;
-                this.showNotification('Ticket submitted successfully.', 'success');
+                showNotification({ message: 'Ticket submitted successfully.', theme: 'success' });
             })
                 .catch((err) => {
                 console.log('Error ', err);
-                this.showNotification('Failed to purchase the ticket. Please try again.', 'error');
+                showNotification({ message: 'Failed to purchase the ticket. Please try again.', theme: 'error' });
             })
                 .finally(() => {
                 this.isLoading = false;
@@ -473,18 +502,19 @@ export class LotteryGamePage {
         }
         return (
         /* Game details */
-        h("div", { class: "GamePage", dir: this.language == 'ar' ? 'rtl' : 'ltr', ref: el => this.stylingContainer = el }, h("div", { class: "GridBanner", style: { 'background': `url(${this.backgroundUrl ? this.backgroundUrl : backgroundImagePath})`, 'background-size': 'contain', 'background-repeat': 'no-repeat', 'background-position': 'center' } }, h("div", { class: "BannerButtonsWrapper" }), h("div", { class: "Tabs" }, h("div", { class: 'TabButton' + (this.tabIndex == 0 ? ' Active' : ''), onClick: () => this.tabIndex = 0 }, translate('buy', this.language)), h("div", { class: 'TabButton' + (this.tabIndex == 1 ? ' Active' : ''), onClick: () => this.tabIndex = 1 }, translate('viewLatest', this.language)))), h("div", { class: "NextDrawWrapper" }, this.nextDate && h("div", { class: "NextDraw" }, h("p", { class: "BannerText" }, translate('nextDraw', this.language)), h("div", { class: "BannerCountdown" }, h("span", { class: "CountdownDays" }, this.daysRemaining, "D"), h("span", { class: "CountdownHours" }, this.hoursRemaining, "H"), h("span", { class: "CountdownMinutes" }, this.minutesRemaining, "M"), h("span", { class: "CountdownSeconds" }, this.secondsRemaining, "S")))), this.tabIndex == 0 &&
-            h("div", { class: "GamePageContent" }, h("div", { class: "GameDetails" }, h("lottery-game-details", { "low-number": (_b = (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.boards[0]) === null || _b === void 0 ? void 0 : _b.lowNumber, "high-number": (_d = (_c = this.gameData.rules) === null || _c === void 0 ? void 0 : _c.boards[0]) === null || _d === void 0 ? void 0 : _d.highNumber, "minimum-allowed": (_f = (_e = this.gameData.rules) === null || _e === void 0 ? void 0 : _e.boards[0]) === null || _f === void 0 ? void 0 : _f.minimumAllowed, "maxinum-allowed": (_h = (_g = this.gameData.rules) === null || _g === void 0 ? void 0 : _g.boards[0]) === null || _h === void 0 ? void 0 : _h.maxinumAllowed, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, "translation-url": this.translationData })), h("div", { class: "TicketsWrapper" }, this.mainTickets.map((item) => {
-                var _a, _b;
-                return h("lottery-ticket-controller", { endpoint: this.endpoint, "ticket-id": item.ticketId, "game-id": item.gameId, collapsed: false, last: true, language: this.language, "auto-pick": (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.quickPickAvailable, "reset-button": (_b = this.gameData.rules) === null || _b === void 0 ? void 0 : _b.quickPickAvailable, "total-controllers": this.mainTickets.length, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource });
-            })), h("div", { class: "OrderSummary" }, h("h3", { class: "OrderSummaryTitle" }, translate('orderSummaryTitle', this.language)), h("div", { class: "OrderTicketInfo" }, h("div", { class: "Ticket" }, translate('orderSummaryTickets', this.language), ": ", h("span", null, this.mainTickets.length)), h("div", null, h("span", null, this.thousandSeperator(((_k = (_j = this.mainTickets[0]) === null || _j === void 0 ? void 0 : _j.betType) === null || _k === void 0 ? void 0 : _k.combinations) * ((_l = this.mainTickets[0]) === null || _l === void 0 ? void 0 : _l.lineNum))), h("span", { class: "Multiplier" }, "x"), ((_m = this.gameData.rules) === null || _m === void 0 ? void 0 : _m.stakeMultiplierAvailable) &&
-                h("span", null, h("span", null, ((_o = this.mainTickets[0]) === null || _o === void 0 ? void 0 : _o.multiplierNum) === 1 ? `${(_p = this.mainTickets[0]) === null || _p === void 0 ? void 0 : _p.multiplierNum} Multiplier` : `${(_q = this.mainTickets[0]) === null || _q === void 0 ? void 0 : _q.multiplierNum} Multipliers`), h("span", { class: "Multiplier" }, "x")), h("span", null, `${(_r = this.mainTickets[0]) === null || _r === void 0 ? void 0 : _r.stake} EUR`), ((_s = this.gameData.rules) === null || _s === void 0 ? void 0 : _s.drawMultiplierAvailable) &&
-                h("span", null, h("span", { class: "Multiplier" }, "x"), h("span", null, ((_t = this.mainTickets[0]) === null || _t === void 0 ? void 0 : _t.drawCount) === 1 ? `${(_u = this.mainTickets[0]) === null || _u === void 0 ? void 0 : _u.drawCount} Draw` : `${(_v = this.mainTickets[0]) === null || _v === void 0 ? void 0 : _v.drawCount} Draws`)))), h("hr", null), h("div", { class: "Total" }, translate('orderSummaryTotal', this.language), ": ", h("span", null, this.thousandSeperator(this.totalAmount), " ", this.currency)), this.isSubscription &&
-                h("div", { class: "SubscriptionWrapper" }, h("lottery-subscription", { endpoint: this.endpoint, endpointSubscription: this.endpointSubscription, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, gameName: this.gameData.name })), h("div", { class: "ButtonWrapper" }, this.isLoggedIn &&
-                h("div", null, !this.isLoading &&
-                    h("div", { class: "submitWrap" }, h("div", { class: "Button", onClick: () => this.handleSubmitTickets() }, translate('orderSummarySubmit', this.language)), this.showSubmitError && h("div", { class: 'submitError' }, this.submitError), this.showApiError && h("div", { class: 'submitError' }, this.apiError), this.showSubscriptionError && h("div", { class: 'submitError' }, this.subscriptionError)), this.isLoading && h("span", { class: "Button", style: { "cursor": "default" } }, translate('loading', this.language))), !this.isLoggedIn &&
-                h("div", null, h("span", { class: "Button", onClick: () => this.showLoginModal() }, translate('orderSummarySubmit', this.language)), h("helper-modal", { "title-modal": "Success", visible: this.loginModalVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, h("p", { class: "SubmitModalSuccess" }, translate('modalLogin', this.language))))))), this.tabIndex == 1 &&
-            h("div", null, h("lottery-draw-results-history", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })), h("helper-modal", { "title-modal": "Success", visible: this.successVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, h("p", { class: "SubmitModalSuccess" }, translate('submitSuccess', this.language)))));
+        h("div", { class: "GamePage", dir: this.language == 'ar' ? 'rtl' : 'ltr', ref: (el) => (this.stylingContainer = el) }, h("div", { class: "GridBanner", style: {
+                background: `url(${this.backgroundUrl ? this.backgroundUrl : backgroundImagePath})`,
+                'background-size': 'contain',
+                'background-repeat': 'no-repeat',
+                'background-position': 'center'
+            } }, h("div", { class: "BannerButtonsWrapper" }), h("div", { class: "Tabs" }, h("div", { class: 'TabButton' + (this.tabIndex == 0 ? ' Active' : ''), onClick: () => (this.tabIndex = 0) }, translate('buy', this.language)), h("div", { class: 'TabButton' + (this.tabIndex == 1 ? ' Active' : ''), onClick: () => (this.tabIndex = 1) }, translate('viewLatest', this.language)))), this.nextDate && (h("div", { class: "NextDrawWrapper" }, h("div", { class: "NextDraw" }, h("p", { class: "BannerText" }, translate('nextDraw', this.language)), h("div", { class: "BannerCountdown" }, h("span", { class: "CountdownDays" }, this.daysRemaining, "D"), h("span", { class: "CountdownHours" }, this.hoursRemaining, "H"), h("span", { class: "CountdownMinutes" }, this.minutesRemaining, "M"), h("span", { class: "CountdownSeconds" }, this.secondsRemaining, "S"))))), this.tabIndex == 0 && (h("div", { class: "GamePageContentWrapper" }, h("div", { class: "GamePageContent" }, h("div", { class: "GameDetails" }, h("lottery-game-details", { "low-number": (_b = (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.boards[0]) === null || _b === void 0 ? void 0 : _b.lowNumber, "high-number": (_d = (_c = this.gameData.rules) === null || _c === void 0 ? void 0 : _c.boards[0]) === null || _d === void 0 ? void 0 : _d.highNumber, "minimum-allowed": (_f = (_e = this.gameData.rules) === null || _e === void 0 ? void 0 : _e.boards[0]) === null || _f === void 0 ? void 0 : _f.minimumAllowed, "maxinum-allowed": (_h = (_g = this.gameData.rules) === null || _g === void 0 ? void 0 : _g.boards[0]) === null || _h === void 0 ? void 0 : _h.maxinumAllowed, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, "translation-url": this.translationData })), h("div", { class: "TicketsWrapper" }, this.mainTickets.map((item) => {
+            var _a, _b;
+            return (h("lottery-ticket-controller", { endpoint: this.endpoint, "ticket-id": item.ticketId, "game-id": item.gameId, collapsed: false, last: true, language: this.language, "auto-pick": (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.quickPickAvailable, "reset-button": (_b = this.gameData.rules) === null || _b === void 0 ? void 0 : _b.quickPickAvailable, "total-controllers": this.mainTickets.length, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }));
+        })), h("div", { class: "OrderSummary" }, h("h3", { class: "OrderSummaryTitle" }, translate('orderSummaryTitle', this.language)), h("div", { class: "OrderTicketInfo" }, h("div", { class: "Ticket" }, translate('orderSummaryTickets', this.language), ": ", h("span", null, this.mainTickets.length)), h("div", null, h("span", null, this.thousandSeperator(((_k = (_j = this.mainTickets[0]) === null || _j === void 0 ? void 0 : _j.betType) === null || _k === void 0 ? void 0 : _k.combinations) * ((_l = this.mainTickets[0]) === null || _l === void 0 ? void 0 : _l.lineNum))), h("span", { class: "Multiplier" }, "x"), ((_m = this.gameData.rules) === null || _m === void 0 ? void 0 : _m.stakeMultiplierAvailable) && (h("span", null, h("span", null, ((_o = this.mainTickets[0]) === null || _o === void 0 ? void 0 : _o.multiplierNum) === 1
+            ? `${(_p = this.mainTickets[0]) === null || _p === void 0 ? void 0 : _p.multiplierNum} Multiplier`
+            : `${(_q = this.mainTickets[0]) === null || _q === void 0 ? void 0 : _q.multiplierNum} Multipliers`), h("span", { class: "Multiplier" }, "x"))), h("span", null, `${(_r = this.mainTickets[0]) === null || _r === void 0 ? void 0 : _r.stake} EUR`), ((_s = this.gameData.rules) === null || _s === void 0 ? void 0 : _s.drawMultiplierAvailable) && (h("span", null, h("span", { class: "Multiplier" }, "x"), h("span", null, ((_t = this.mainTickets[0]) === null || _t === void 0 ? void 0 : _t.drawCount) === 1
+            ? `${(_u = this.mainTickets[0]) === null || _u === void 0 ? void 0 : _u.drawCount} Draw`
+            : `${(_v = this.mainTickets[0]) === null || _v === void 0 ? void 0 : _v.drawCount} Draws`))))), h("hr", null), h("div", { class: "Total" }, translate('orderSummaryTotal', this.language), ":", ' ', h("span", null, this.thousandSeperator(this.totalAmount), " ", this.currency)), this.isSubscription && (h("div", { class: "SubscriptionWrapper" }, h("lottery-subscription", { endpoint: this.endpoint, endpointSubscription: this.endpointSubscription, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, gameName: this.gameData.name }))), h("div", { class: "ButtonWrapper" }, this.isLoggedIn && (h("div", null, !this.isLoading && (h("div", { class: "submitWrap" }, h("div", { class: "Button", onClick: () => this.handleSubmitTickets() }, translate('orderSummarySubmit', this.language)), this.showSubmitError && h("div", { class: "submitError" }, this.submitError), this.showApiError && h("div", { class: "submitError" }, this.apiError), this.showSubscriptionError && h("div", { class: "submitError" }, this.subscriptionError))), this.isLoading && (h("span", { class: "Button", style: { cursor: 'default' } }, translate('loading', this.language))))), !this.isLoggedIn && (h("div", null, h("span", { class: "Button", onClick: () => this.showLoginModal() }, translate('orderSummarySubmit', this.language)), h("helper-modal", { "title-modal": "Success", visible: this.loginModalVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, h("p", { class: "SubmitModalSuccess" }, translate('modalLogin', this.language)))))))))), this.tabIndex == 1 && (h("div", { class: "HistoryContentWrapper" }, h("lottery-draw-results-history", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))), h("helper-modal", { "title-modal": "Success", visible: this.successVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, h("p", { class: "SubmitModalSuccess" }, translate('submitSuccess', this.language)))));
     }
     static get is() { return "lottery-game-page"; }
     static get encapsulation() { return "shadow"; }
@@ -787,6 +817,12 @@ export class LotteryGamePage {
             }, {
                 "propName": "translationUrl",
                 "methodName": "handleNewTranslations"
+            }, {
+                "propName": "endpoint",
+                "methodName": "watchGameInfoChange"
+            }, {
+                "propName": "gameId",
+                "methodName": "watchGameInfoChange"
             }];
     }
     static get listeners() {

package/dist/collection/utils/utils.js

@@ -12,7 +12,7 @@ export const isMobile = (userAgent) => {
 };
 export const generateUUID = () => {
     return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-        var r = Math.random() * 16 | 0, v = c == 'x' ? r : (r & 0x3 | 0x8);
+        var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
         return v.toString(16);
     });
 };
@@ -28,13 +28,20 @@ export function fetchRequest(url, method = 'GET', body = null, headers = {}) {
             options.body = JSON.stringify(body);
         }
         fetch(url, options)
-            .then(response => {
+            .then((response) => {
             if (!response.ok) {
                 throw new Error(`HTTP error! Status: ${response.status}`);
             }
             return response.json();
         })
-            .then(data => resolve(data))
-            .catch(error => reject(error));
+            .then((data) => resolve(data))
+            .catch((error) => reject(error));
     });
 }
+export const showNotification = ({ message, theme = 'success' }) => {
+    window.postMessage({
+        type: 'ShowNotificationToast',
+        message,
+        theme
+    });
+};