@everymatrix/lottery-oddsbom-latest-result 0.0.1

package/dist/collection/collection-manifest.json

@@ -0,0 +1,31 @@
+{
+  "entries": [
+    "components/lottery-oddsbom-latest-result/lottery-oddsbom-latest-result.js"
+  ],
+  "compiler": {
+    "name": "@stencil/core",
+    "version": "4.19.2",
+    "typescriptVersion": "5.4.5"
+  },
+  "collections": [
+    {
+      "name": "@everymatrix/lottery-oddsbom-bullet",
+      "tags": [
+        "lottery-oddsbom-bullet"
+      ]
+    },
+    {
+      "name": "@everymatrix/lottery-oddsbom-ticket-result",
+      "tags": [
+        "lottery-oddsbom-ticket-result"
+      ]
+    },
+    {
+      "name": "@everymatrix/ui-skeleton",
+      "tags": [
+        "ui-skeleton"
+      ]
+    }
+  ],
+  "bundles": []
+}

package/dist/collection/components/lottery-oddsbom-latest-result/index.js

@@ -0,0 +1 @@
+export { LotteryOddsbomLatestResult } from './lottery-oddsbom-latest-result';

package/dist/collection/components/lottery-oddsbom-latest-result/lottery-oddsbom-latest-result.css

@@ -0,0 +1,100 @@
+.lottery-tipping-latest-result {
+  container-type: inline-size;
+  background: var(--emw--color-background, #fff);
+  color: var(--emw--color-typography, #000);
+}
+.lottery-tipping-latest-result .header-section {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+.lottery-tipping-latest-result .match-info-section {
+  justify-content: space-between;
+  padding: 15px 0px;
+  height: 18px;
+}
+.lottery-tipping-latest-result .match-details,
+.lottery-tipping-latest-result .prize-details {
+  font-weight: 600;
+  display: flex;
+  align-items: center;
+}
+.lottery-tipping-latest-result .match-details .title-icon {
+  margin-right: 8px;
+  display: flex;
+}
+.lottery-tipping-latest-result .match-details .title-text__extra {
+  margin-left: 5px;
+}
+.lottery-tipping-latest-result .prize-details .winners-count {
+  margin-right: 5px;
+}
+
+.loading-wrap {
+  margin: 20px 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  min-height: 100px;
+}
+.loading-wrap .dots-container {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: 100%;
+}
+.loading-wrap .dot {
+  height: 14px;
+  width: 14px;
+  margin-right: 14px;
+  border-radius: 14px;
+  background-color: var(--emw--color-gray-300, #333);
+  animation: pulse 1.5s infinite ease-in-out;
+}
+.loading-wrap .dot:last-child {
+  margin-right: 0;
+}
+.loading-wrap .dot:nth-child(1) {
+  animation-delay: -0.3s;
+}
+.loading-wrap .dot:nth-child(2) {
+  animation-delay: -0.1s;
+}
+.loading-wrap .dot:nth-child(3) {
+  animation-delay: 0.1s;
+}
+@keyframes pulse {
+  0% {
+    transform: scale(0.8);
+    background-color: var(--emw--color-gray-300, #333);
+  }
+  50% {
+    transform: scale(1.2);
+    background-color: var(--emw--color-gray-100, #e6e6e6);
+  }
+  100% {
+    transform: scale(0.8);
+    background-color: var(--emw--color-gray-150, #6f6f6f);
+  }
+}
+
+.latest-result-wrapper {
+  background: var(--emw--color-background, #fff);
+}
+.latest-result-wrapper.game-wrapper {
+  border: 1px solid var(--emw--color-background-tertiary, #ccc);
+  border-radius: 8px;
+  box-shadow: 0 2px 4px var(--emw--color-background-tertiary, #ccc);
+  overflow-x: auto;
+  transition: box-shadow 0.3s ease;
+  padding: 20px;
+}
+.latest-result-wrapper.game-wrapper:hover {
+  box-shadow: 0 4px 12px var(--emw--color-background-tertiary, #ccc);
+}
+
+.loading-turnOver {
+  display: inline-flex;
+  align-items: center;
+}

package/dist/collection/components/lottery-oddsbom-latest-result/lottery-oddsbom-latest-result.js

@@ -0,0 +1,470 @@
+import "../../../../../lottery-oddsbom-ticket-result/dist/types/index";
+import { h } from "@stencil/core";
+import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
+import { fetchDrawsInfo, fetchGameInfo, fetchSaleStatistics } from "../../utils/api";
+import { resolveTranslationUrl, translate } from "../../utils/locale.utils";
+import { changeCurDrawItemByDate, findLatestDateIdx, thousandSeparator } from "../../utils/utils";
+import "../../../../../ui-skeleton/dist/types/index";
+const BombIcons = {
+    ['Football']: (h("svg", { height: "18px", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": "true", class: "text-sm" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M19.063 19.072l-.81-.97-.117.083.385-2.43.136-.211 2.23-3.464.037-.057h1.075a9.964 9.964 0 01-2.936 7.049zM4.769 5.112l2.8.877-.072 3.246-2.427 2.95-1.561-.153L2.39 9.26a9.977 9.977 0 012.378-4.148zm7.745-3.086l-.72 1.645-3.798 1.404-2.395-.75A9.953 9.953 0 0112 2c.174 0 .343.017.514.026zm7.346 3.812l-1.128 1.29-3.402-.755-.033-.008-2.446-2.241.057.016.862-1.973a9.996 9.996 0 016.09 3.67zm-1.87 8.894l-3.385-.493-1.358-4.067 2.173-2.755 3.144.698 1.347 3.634-1.921 2.983zm-4.64 5.787l4.304-1.486.62.742a9.945 9.945 0 01-5.878 2.205l.954-1.461zm-6.314-2.84l3.91.873-.001.003 1.509 1.507-1.24 1.898a9.946 9.946 0 01-5.908-2.553l1.73-1.728zm1.16-7.72l4.168.725 1.302 3.9-2.552 2.98-3.97-.885-1.412-3.724L8.196 9.96zM2 12c0-.31.019-.615.047-.92l.485 1.203-.454.907A9.934 9.934 0 012 11.999zM12 1C5.934 1 1 5.935 1 12c0 6.067 4.935 11 11 11 6.066 0 11-4.933 11-11 0-6.065-4.934-11-11-11z", fill: "currentColor" })))
+};
+export class LotteryOddsbomLatestResult {
+    constructor() {
+        this.mbSource = undefined;
+        this.clientStyling = undefined;
+        this.clientStylingUrl = undefined;
+        this.translationUrl = '';
+        this.language = 'en';
+        this.endpoint = undefined;
+        this.gameId = undefined;
+        this.curDate = undefined;
+        this.showLoading = true;
+        this.hideWrapperEmpty = false;
+        this.isPassingData = false;
+        this.drawResults = '';
+        this.isEmpty = true;
+        this._curDate = undefined;
+        this.drawResultsList = [];
+        this.curDrawItem = {};
+        this.curTurnOver = 0;
+        this.isLoadingTurnover = false;
+        this.vendorGameId = undefined;
+        this.gameName = undefined;
+        this.isLoading = false;
+    }
+    handleClientStylingChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStyling(this.stylingContainer, this.clientStyling);
+        }
+    }
+    handleClientStylingUrlChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    handleMbSourceChange(newValue, oldValue) {
+        if (newValue != oldValue) {
+            setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+        }
+    }
+    async handleDateChange(n, o) {
+        if (n !== o) {
+            await this.setCurItem(n);
+            if (this.curDrawItem && this.curDrawItem.drawId) {
+                this.getTurnOver();
+            }
+        }
+    }
+    async handleDrawResultsChange(n, o) {
+        if (n !== o) {
+            await this.setDrawResults();
+        }
+    }
+    async getTurnOver() {
+        var _a, _b;
+        try {
+            this.isLoadingTurnover = true;
+            const res = await fetchSaleStatistics({
+                endpoint: this.endpoint,
+                gameId: this.vendorGameId,
+                drawId: this.curDrawItem.drawId
+            });
+            this.curTurnOver = (_b = (_a = res === null || res === void 0 ? void 0 : res.wagerSegment) === null || _a === void 0 ? void 0 : _a.totalSalesCrossDraw) !== null && _b !== void 0 ? _b : 0;
+        }
+        catch (e) {
+            console.error(e);
+        }
+        finally {
+            this.isLoadingTurnover = false;
+        }
+    }
+    get formattedTurnover() {
+        const turnover = this.curTurnOver;
+        const unit = '€';
+        if (turnover === null || turnover === undefined)
+            return '';
+        return `${unit}${turnover ? thousandSeparator(turnover) : 0}`;
+    }
+    async setCurItem(curDate) {
+        var _a;
+        try {
+            if (curDate && ((_a = this.drawResultsList) === null || _a === void 0 ? void 0 : _a.length)) {
+                this.curDrawItem = await changeCurDrawItemByDate(curDate, this.drawResultsList);
+                this.isEmpty = false;
+            }
+            else {
+                this.isEmpty = true;
+            }
+        }
+        catch (_b) {
+            this.isEmpty = true;
+        }
+    }
+    async setDrawResults() {
+        try {
+            if (this.drawResults) {
+                this.drawResultsList = JSON.parse(this.drawResults);
+                await this.setCurItem(this.curDate);
+            }
+        }
+        catch (err) {
+            console.error(err);
+        }
+    }
+    componentDidLoad() {
+        if (this.stylingContainer) {
+            if (this.mbSource)
+                setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
+            if (this.clientStyling)
+                setClientStyling(this.stylingContainer, this.clientStyling);
+            if (this.clientStylingUrl)
+                setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
+        }
+    }
+    disconnectedCallback() {
+        this.stylingSubscription && this.stylingSubscription.unsubscribe();
+    }
+    async getDrawData() {
+        if (this.isPassingData) {
+            this.setDrawResults();
+        }
+        else {
+            this.fetchData();
+        }
+    }
+    async getGameInfo() {
+        return fetchGameInfo({ endpoint: this.endpoint, gameId: this.gameId }).then(({ vendorGameId, gameName }) => {
+            this.vendorGameId = vendorGameId;
+            this.gameName = gameName;
+        });
+    }
+    async componentWillLoad() {
+        resolveTranslationUrl(this.translationUrl);
+        await Promise.all([this.getDrawData(), this.getGameInfo()]);
+        if (this.curDrawItem && this.curDrawItem.drawId) {
+            this.getTurnOver();
+        }
+    }
+    async fetchData() {
+        this.isLoading = true;
+        try {
+            const res = await fetchDrawsInfo({ endpoint: this.endpoint, gameId: this.gameId });
+            this.getGameDrawInfoEvent.emit({
+                drawDatesOptions: res.drawDatesOptions,
+                gameId: this.gameId
+            });
+            this.drawResultsList = res.drawResultsList;
+            this._curDate = res.drawDatesOptions[findLatestDateIdx(res.drawDatesOptions)];
+            await this.setCurItem(this._curDate);
+        }
+        catch (error) {
+            this.getGameDrawInfoEvent.emit({
+                drawDatesOptions: [],
+                gameId: this.gameId
+            });
+        }
+        finally {
+            this.isLoading = false;
+        }
+    }
+    renderLoading() {
+        return (h("div", { class: "loading-wrap" }, h("section", { class: "dots-container" }, h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }), h("div", { class: "dot" }))));
+    }
+    renderEmpty() {
+        return null;
+    }
+    renderMainContent() {
+        var _a, _b, _c, _d, _e, _f;
+        if (!(this.curDate || this._curDate) || this.isEmpty) {
+            return this.renderEmpty();
+        }
+        return (h("div", { class: "lottery-tipping-latest-result" }, h("div", { class: "header-section match-info-section" }, h("div", { class: "match-details" }, h("span", { class: "title-icon" }, BombIcons.Football), h("span", { class: "title-text" }, this.gameName, ' ', this.isLoadingTurnover ? (h("div", { class: "loading-turnOver" }, h("ui-skeleton", { structure: "rectangle", width: "100px", height: "16px" }))) : (h("span", { class: "title-text__extra" }, "(", translate('turnover', this.language) + ' ' + this.formattedTurnover || 0, ")")))), h("div", { class: "prize-details" }, h("span", { class: "winners-count" }, (((_a = this.curDrawItem) === null || _a === void 0 ? void 0 : _a.winNumber) || 0) + ' ' + translate('winners', this.language)), h("span", { class: "prize-amount" }, translate('prize', this.language) + ' ' + (((_b = this.curDrawItem) === null || _b === void 0 ? void 0 : _b.formattedWinTurnOver) || 0)))), !!(((_c = this.curDrawItem) === null || _c === void 0 ? void 0 : _c.drawId) || (((_d = this.curDrawItem) === null || _d === void 0 ? void 0 : _d.results) || []).length) && (h("lottery-oddsbom-ticket-result", { language: this.language, "mb-source": this.mbSource, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "translation-url": this.translationUrl, endpoint: this.endpoint, "game-id": this.vendorGameId, "draw-id": (_e = this.curDrawItem) === null || _e === void 0 ? void 0 : _e.drawId, "default-results": JSON.stringify(((_f = this.curDrawItem) === null || _f === void 0 ? void 0 : _f.results) || []), "split-view": false }))));
+    }
+    render() {
+        return (h("div", { key: '08c7308433c4d55f4cec1540002a03596155fe98', ref: (el) => (this.stylingContainer = el), class: {
+                'latest-result-wrapper': true,
+                'game-wrapper': !(this.hideWrapperEmpty && this.isEmpty)
+            } }, this.isLoading && this.showLoading ? this.renderLoading() : this.renderMainContent()));
+    }
+    static get is() { return "lottery-oddsbom-latest-result"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["lottery-oddsbom-latest-result.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["lottery-oddsbom-latest-result.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "mbSource": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via message bus"
+                },
+                "attribute": "mb-source",
+                "reflect": true
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via string"
+                },
+                "attribute": "client-styling",
+                "reflect": true
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via css file url"
+                },
+                "attribute": "client-styling-url",
+                "reflect": true
+            },
+            "translationUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom translation via json file url"
+                },
+                "attribute": "translation-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom language for translation"
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "'en'"
+            },
+            "endpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "endpoint",
+                "reflect": true
+            },
+            "gameId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "GameID of the game"
+                },
+                "attribute": "game-id",
+                "reflect": true
+            },
+            "curDate": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "cur-date",
+                "reflect": true
+            },
+            "showLoading": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "show-loading",
+                "reflect": true,
+                "defaultValue": "true"
+            },
+            "hideWrapperEmpty": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "hide-wrapper-empty",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "isPassingData": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "is-passing-data",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "drawResults": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "attribute": "draw-results",
+                "reflect": true,
+                "defaultValue": "''"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isEmpty": {},
+            "_curDate": {},
+            "drawResultsList": {},
+            "curDrawItem": {},
+            "curTurnOver": {},
+            "isLoadingTurnover": {},
+            "vendorGameId": {},
+            "gameName": {},
+            "isLoading": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "getGameDrawInfoEvent",
+                "name": "getGameDrawInfo",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "GetGameDrawInfo",
+                    "resolved": "GetGameDrawInfo",
+                    "references": {
+                        "GetGameDrawInfo": {
+                            "location": "import",
+                            "path": "../../models",
+                            "id": "../../../../packages/stencil/lottery-oddsbom-latest-result/src/models/index.ts::GetGameDrawInfo"
+                        }
+                    }
+                }
+            }];
+    }
+    static get watchers() {
+        return [{
+                "propName": "clientStyling",
+                "methodName": "handleClientStylingChange"
+            }, {
+                "propName": "clientStylingUrl",
+                "methodName": "handleClientStylingUrlChange"
+            }, {
+                "propName": "mbSource",
+                "methodName": "handleMbSourceChange"
+            }, {
+                "propName": "curDate",
+                "methodName": "handleDateChange"
+            }, {
+                "propName": "drawResults",
+                "methodName": "handleDrawResultsChange"
+            }];
+    }
+}

package/dist/collection/index.js

@@ -0,0 +1 @@
+export * from './components/lottery-oddsbom-latest-result';

package/dist/collection/models/index.js

@@ -0,0 +1 @@
+export {};

package/dist/collection/utils/api.js

@@ -0,0 +1,36 @@
+import { fetchRequest, toQueryParams } from "./utils";
+export async function fetchGameInfo({ endpoint, gameId }) {
+    if (!(endpoint && gameId))
+        return;
+    const gameInfo = await fetchRequest(`${endpoint}/games/${gameId}`, 'GET', {});
+    return {
+        vendorGameId: gameInfo === null || gameInfo === void 0 ? void 0 : gameInfo.type,
+        gameName: gameInfo.name
+    };
+}
+export async function fetchDrawsInfo({ endpoint, gameId }) {
+    if (!(endpoint && gameId))
+        return;
+    const GAME_DRAW_LIMIT = 9999;
+    const filterData = { status: 'PAYABLE', limit: GAME_DRAW_LIMIT };
+    const { items: drawList } = await fetchRequest(`${endpoint}/games/${gameId}/draws${toQueryParams(filterData)}`);
+    if (!drawList || drawList.length === 0)
+        return {};
+    const settledDrawList = drawList
+        .filter((item) => item.winningNumbers.length > 0)
+        .sort((a, b) => a === null || a === void 0 ? void 0 : a.date.localeCompare(b === null || b === void 0 ? void 0 : b.date));
+    const drawDatesOptions = settledDrawList.map((item) => item.date);
+    return {
+        drawDatesOptions,
+        drawResultsList: settledDrawList
+    };
+}
+export async function fetchSaleStatistics({ endpoint, gameId, drawId }) {
+    try {
+        const res = await fetchRequest(`${endpoint}/games/${gameId}/draws/${drawId}/saleStatistics`);
+        return res;
+    }
+    catch (error) {
+        return Promise.reject(error);
+    }
+}