@everymatrix/bonus-elevate-shop-item 1.44.0 → 1.45.0

package/dist/collection/components/bonus-elevate-shop-item/bonus-elevate-shop-item.js

@@ -1,373 +1,343 @@
-import { Component, Event, Fragment, h, Host, Prop, State } from '@stencil/core';
-import '@everymatrix/general-styling-wrapper';
-import { getTranslations, translate } from '../../utils/locale.utils';
-import { getDevicePlatform } from '../../utils/utils';
+import { Fragment, h, Host } from "@stencil/core";
+import "../../../../../general-styling-wrapper/dist/types/index";
+import { getTranslations, translate } from "../../utils/locale.utils";
+import { getDevicePlatform } from "../../utils/utils";
 export class BonusElevateShopItem {
-  constructor() {
-    /**
-     * Currently selected language.
-     */
-    this.language = 'en';
-    /**
-     * Client custom styling via inline styles
-     */
-    this.clientStyling = '';
-    /**
-     * Client custom styling via url
-     */
-    this.clientStylingUrl = '';
-    /**
-     * Translation via url
-     */
-    this.translationUrl = '';
-    /**
-     * Show slider dots
-     */
-    this.showSliderDots = false;
-    /**
-     * Show slider navigate arrows
-     */
-    this.showSliderArrows = true;
-    this.isGiftNotFound = false;
-    this.redeemErrorMsg = '';
-    this.isRedeeming = false;
-    this.bindedHandler = this.handleMessage.bind(this);
-    this.deviceType = getDevicePlatform();
-  }
-  redeemGiftConfirm() {
-    window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
-  }
-  handleMessage(message) {
-    if (message.data && message.data.type === "bee-redeem-confirmed" &&
-      message.data.id == this.elevateGift.id) {
-      this.redeemGift();
+    constructor() {
+        this.bindedHandler = this.handleMessage.bind(this);
+        this.deviceType = getDevicePlatform();
+        this.endpoint = undefined;
+        this.language = 'en';
+        this.itemId = undefined;
+        this.elevateGift = undefined;
+        this.session = undefined;
+        this.clientStyling = '';
+        this.clientStylingUrl = '';
+        this.translationUrl = '';
+        this.showSliderDots = false;
+        this.showSliderArrows = true;
+        this.isGiftNotFound = false;
+        this.redeemErrorMsg = '';
+        this.isRedeeming = false;
     }
-  }
-  onBackClicked() {
-    window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
-  }
-  redeemGift() {
-    if (this.elevateGift.available.toLowerCase() === 'false') {
-      return;
+    redeemGiftConfirm() {
+        window.postMessage({ type: 'BEERedeemConfirm', shopItem: this.elevateGift }, window.location.href);
     }
-    let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
-    let claimGiftOptions = {
-      method: 'PUT',
-      headers: {
-        'x-SessionId': this.session,
-        'Content-Type': 'application/json-patch+json',
-      },
-      body: JSON.stringify({ giftId: this.elevateGift.id }),
-    };
-    this.redeemErrorMsg = '';
-    this.isRedeeming = true;
-    fetch(url.toString(), claimGiftOptions)
-      .then((res) => res.json())
-      .then((res) => {
-      if (res.success) {
-        this.redeemGiftButton.emit();
-        window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
-      }
-      else {
-        let translatedError = translate(`error${res.errorCode}`, this.language);
-        this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
-        window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
-      }
-    })
-      .catch((err) => {
-      window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
-    }).finally(() => {
-      this.isRedeeming = false;
-    });
-  }
-  async loadElevateGift() {
-    let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
-    let options = {
-      headers: {
-        'Content-Type': 'application/json',
-        'x-SessionId': this.session,
-      },
-      method: 'GET',
-    };
-    await new Promise((resolve) => {
-      fetch(url.href, options)
-        .then((res) => res.json())
-        .then((data) => {
-        let filteredGifts = data.data;
-        if (filteredGifts && filteredGifts.length == 1) {
-          this.elevateGift = filteredGifts[0];
-          this.isGiftNotFound = false;
+    handleMessage(message) {
+        if (message.data && message.data.type === "bee-redeem-confirmed" &&
+            message.data.id == this.elevateGift.id) {
+            this.redeemGift();
         }
-        else {
-          this.isGiftNotFound = true;
+    }
+    onBackClicked() {
+        window.postMessage({ type: 'OnGiftDetailsBackButtonClicked' }, window.location.href);
+    }
+    redeemGift() {
+        if (this.elevateGift.available.toLowerCase() === 'false') {
+            return;
         }
-        resolve(true);
-      });
-    });
-  }
-  disconnectedCallback() {
-    window.removeEventListener('message', this.bindedHandler, false);
-  }
-  componentDidLoad() {
-    window.addEventListener('message', this.bindedHandler, false);
-  }
-  async componentWillLoad() {
-    if (this.translationUrl.length > 2) {
-      await getTranslations(this.translationUrl);
+        let url = new URL(`${this.endpoint}/v1/elevate/redeem`);
+        let claimGiftOptions = {
+            method: 'PUT',
+            headers: {
+                'x-SessionId': this.session,
+                'Content-Type': 'application/json-patch+json',
+            },
+            body: JSON.stringify({ giftId: this.elevateGift.id }),
+        };
+        this.redeemErrorMsg = '';
+        this.isRedeeming = true;
+        fetch(url.toString(), claimGiftOptions)
+            .then((res) => res.json())
+            .then((res) => {
+            if (res.success) {
+                this.redeemGiftButton.emit();
+                window.postMessage({ type: 'BEEGiftRedeem', itemId: this.elevateGift.id }, window.location.href);
+            }
+            else {
+                let translatedError = translate(`error${res.errorCode}`, this.language);
+                this.redeemErrorMsg = translatedError ? translatedError : translate('redeemFailed', this.language);
+                window.postMessage({ type: 'BEEGiftRedeemFailed', itemId: this.elevateGift.id, res }, window.location.href);
+            }
+        })
+            .catch((err) => {
+            window.postMessage({ type: 'BEEGiftClaimFailed', itemId: this.elevateGift.id, err }, window.location.href);
+        }).finally(() => {
+            this.isRedeeming = false;
+        });
     }
-    if (this.elevateGift) {
-      this.isGiftNotFound = false;
+    async loadElevateGift() {
+        let url = new URL(`${this.endpoint}/v1/elevate/shop?language=${this.language}&filter=id=${this.itemId}`);
+        let options = {
+            headers: {
+                'Content-Type': 'application/json',
+                'x-SessionId': this.session,
+            },
+            method: 'GET',
+        };
+        await new Promise((resolve) => {
+            fetch(url.href, options)
+                .then((res) => res.json())
+                .then((data) => {
+                let filteredGifts = data.data;
+                if (filteredGifts && filteredGifts.length == 1) {
+                    this.elevateGift = filteredGifts[0];
+                    this.isGiftNotFound = false;
+                }
+                else {
+                    this.isGiftNotFound = true;
+                }
+                resolve(true);
+            });
+        });
     }
-    else {
-      await this.loadElevateGift();
+    disconnectedCallback() {
+        window.removeEventListener('message', this.bindedHandler, false);
     }
-  }
-  render() {
-    return (h(Host, null,
-      h("general-styling-wrapper", { clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }),
-      h("div", { class: 'ElevateDetails' },
-        this.isGiftNotFound && (h(Fragment, null,
-          h("div", { class: "Row ThumbnailRow" },
-            h("div", { class: "BackButton", onClick: () => {
-                this.onBackClicked();
-              } }, '<')),
-          h("div", { class: "Thumnails GiftNotFound" },
-            translate('noDataFound', this.language),
-            "."))),
-        this.elevateGift && h(Fragment, null,
-          h("div", { class: "ThumbnailRow" },
-            h("div", { class: 'Row' },
-              h("div", { class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'),
-              h("bonus-elevate-shop-assets-slider", { class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })),
-            h("div", { class: 'Col Details' },
-              h("h3", { class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName),
-              h("div", { class: "GiftPoints" },
-                h("span", { class: "Points" },
-                  this.elevateGift.points,
-                  " "),
-                h("span", { class: " PointsLabel" }, translate('coins', this.language))))),
-          h("div", { class: 'ShopItemDetail Details' },
-            h("div", { class: "GiftPresentation" },
-              h("p", null, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))),
-            h("div", { class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
-                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)),
-            h("span", { class: 'RedeemError Error' },
-              " ",
-              this.redeemErrorMsg,
-              " "))))));
-  }
-  static get is() { return "bonus-elevate-shop-item"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["bonus-elevate-shop-item.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["bonus-elevate-shop-item.css"]
-  }; }
-  static get properties() { return {
-    "endpoint": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "NorWAy endpoint"
-      },
-      "attribute": "endpoint",
-      "reflect": true
-    },
-    "language": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Currently selected language."
-      },
-      "attribute": "language",
-      "reflect": true,
-      "defaultValue": "'en'"
-    },
-    "itemId": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Elevate gift id"
-      },
-      "attribute": "item-id",
-      "reflect": true
-    },
-    "elevateGift": {
-      "type": "unknown",
-      "mutable": true,
-      "complexType": {
-        "original": "BonusElevateShopItemInfo",
-        "resolved": "BonusElevateShopItemInfo",
-        "references": {
-          "BonusElevateShopItemInfo": {
-            "location": "import",
-            "path": "../../models/bonus-elevate-shop-item"
-          }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Elevate gift id"
-      }
-    },
-    "session": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "session"
-      },
-      "attribute": "session",
-      "reflect": true
-    },
-    "clientStyling": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via inline styles"
-      },
-      "attribute": "client-styling",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "clientStylingUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Client custom styling via url"
-      },
-      "attribute": "client-styling-url",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "translationUrl": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Translation via url"
-      },
-      "attribute": "translation-url",
-      "reflect": true,
-      "defaultValue": "''"
-    },
-    "showSliderDots": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider dots"
-      },
-      "attribute": "show-slider-dots",
-      "reflect": true,
-      "defaultValue": "false"
-    },
-    "showSliderArrows": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Show slider navigate arrows"
-      },
-      "attribute": "show-slider-arrows",
-      "reflect": true,
-      "defaultValue": "true"
+    componentDidLoad() {
+        window.addEventListener('message', this.bindedHandler, false);
     }
-  }; }
-  static get states() { return {
-    "isGiftNotFound": {},
-    "redeemErrorMsg": {},
-    "isRedeeming": {}
-  }; }
-  static get events() { return [{
-      "method": "redeemGiftButton",
-      "name": "redeemGiftButton",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "Object",
-        "resolved": "Object",
-        "references": {
-          "Object": {
-            "location": "global"
-          }
+    async componentWillLoad() {
+        if (this.translationUrl.length > 2) {
+            await getTranslations(this.translationUrl);
+        }
+        if (this.elevateGift) {
+            this.isGiftNotFound = false;
+        }
+        else {
+            await this.loadElevateGift();
         }
-      }
-    }]; }
+    }
+    render() {
+        return (h(Host, { key: '6f28f64d3413dd82bc81fc6fd975baa992d06289' }, h("general-styling-wrapper", { key: '88dedbfb25562fbe95a69748649ed9c14a2c42f6', clientStylingUrl: this.clientStylingUrl, clientStyling: this.clientStyling }), h("div", { key: '9f2a66f9d48882220ab5d3850f343e995ffe9a6b', class: 'ElevateDetails' }, this.isGiftNotFound && (h(Fragment, { key: '91f4079bf7af7e4d61b1681a9848c72c9a2249d5' }, h("div", { key: 'e0427680e0d7e94e51644f12a2430a6a42e3d340', class: "Row ThumbnailRow" }, h("div", { key: '4fd78968b2fdf281b7c22596351b366058cfcec3', class: "BackButton", onClick: () => {
+                this.onBackClicked();
+            } }, '<')), h("div", { key: 'eeb8cbc40429cf1ebf7a5f0de3d5b8226a40437b', class: "Thumnails GiftNotFound" }, translate('noDataFound', this.language), "."))), this.elevateGift && h(Fragment, { key: '45380d051b279d9c7fcd580f06252911763073e0' }, h("div", { key: 'c440d72501fb91601106fbf74a866887bc02ee43', class: "ThumbnailRow" }, h("div", { key: '005f436acbc51372d013e1931d54b71738f2e0fc', class: 'Row' }, h("div", { key: 'a9ace30abf1c50d639c31bb047d7b7d7cb6b27b8', class: "BackButton", onClick: () => { this.onBackClicked(); } }, '<'), h("bonus-elevate-shop-assets-slider", { key: '8c4121e66a3fae912e72fc10c6a81354a7b36e9f', class: 'Thumbnails', itemsPerPage: 1, sliderItems: this.elevateGift.presentation.assets, showSliderDots: this.showSliderDots })), h("div", { key: 'c6a207dfe14402e4d1890e7b787bf4b5a2247160', class: 'Col Details' }, h("h3", { key: 'c190b88ab4d1e13885593b9d6b9c62b161bdff23', class: "GiftName" }, this.elevateGift.presentation.displayName || this.elevateGift.displayName), h("div", { key: 'befddb7b8dff3bb73377da4bfb30ce003dcccb7b', class: "GiftPoints" }, h("span", { key: '4e879d150709e670b2c7c90f0034c75c4ba30386', class: "Points" }, this.elevateGift.points, " "), h("span", { key: 'a7d28d964b41126a76f9988d0f4fc05653787066', class: " PointsLabel" }, translate('coins', this.language))))), h("div", { key: '14d2374d40825ac91b275fda81ca22d40f21c0be', class: 'ShopItemDetail Details' }, h("div", { key: '197bb9c0089173f8c4f180e115068f6204a6f7ea', class: "GiftPresentation" }, h("p", { key: '30be8dbec63f8f4d2bc3687d7e992d73c534a20f' }, this.elevateGift.presentation.description ? this.elevateGift.presentation.description : translate('noGiftPresentation', this.language))), h("div", { key: '7e0a9e4d03f338137649c9477a44c7036aea1609', class: `RedeemButton ${this.elevateGift.available === 'false' || this.isRedeeming ? 'Disabled' : ''}
+                ${this.deviceType == 'dk' ? 'DkButton' : ''}`, onClick: this.redeemGiftConfirm.bind(this) }, translate('redeem', this.language)), h("span", { key: '89b70f02565437ed28b175c65d0767354b6c9d6b', class: 'RedeemError Error' }, " ", this.redeemErrorMsg, " "))))));
+    }
+    static get is() { return "bonus-elevate-shop-item"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["bonus-elevate-shop-item.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["bonus-elevate-shop-item.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "endpoint": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "NorWAy endpoint"
+                },
+                "attribute": "endpoint",
+                "reflect": true
+            },
+            "language": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Currently selected language."
+                },
+                "attribute": "language",
+                "reflect": true,
+                "defaultValue": "'en'"
+            },
+            "itemId": {
+                "type": "string",
+                "mutable": true,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Elevate gift id"
+                },
+                "attribute": "item-id",
+                "reflect": true
+            },
+            "elevateGift": {
+                "type": "unknown",
+                "mutable": true,
+                "complexType": {
+                    "original": "BonusElevateShopItemInfo",
+                    "resolved": "BonusElevateShopItemInfo",
+                    "references": {
+                        "BonusElevateShopItemInfo": {
+                            "location": "import",
+                            "path": "../../models/bonus-elevate-shop-item",
+                            "id": "../../../../packages/stencil/bonus-elevate-shop-item/src/models/bonus-elevate-shop-item.ts::BonusElevateShopItemInfo"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Elevate gift id"
+                }
+            },
+            "session": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "session"
+                },
+                "attribute": "session",
+                "reflect": true
+            },
+            "clientStyling": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via inline styles"
+                },
+                "attribute": "client-styling",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "clientStylingUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Client custom styling via url"
+                },
+                "attribute": "client-styling-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "translationUrl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Translation via url"
+                },
+                "attribute": "translation-url",
+                "reflect": true,
+                "defaultValue": "''"
+            },
+            "showSliderDots": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider dots"
+                },
+                "attribute": "show-slider-dots",
+                "reflect": true,
+                "defaultValue": "false"
+            },
+            "showSliderArrows": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Show slider navigate arrows"
+                },
+                "attribute": "show-slider-arrows",
+                "reflect": true,
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isGiftNotFound": {},
+            "redeemErrorMsg": {},
+            "isRedeeming": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "redeemGiftButton",
+                "name": "redeemGiftButton",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "complexType": {
+                    "original": "Object",
+                    "resolved": "Object",
+                    "references": {
+                        "Object": {
+                            "location": "global",
+                            "id": "global::Object"
+                        }
+                    }
+                }
+            }];
+    }
 }