@everymatrix/casino-game-thumb-view 1.32.4 → 1.33.0

package/dist/components/casino-extrainfo-blackjack.js

@@ -0,0 +1,92 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { D as DEFAULT_BLACKJACK_TOTAL_SEATS } from './game-thumbnail.js';
+import { t as translate } from './locale.utils.js';
+import { d as defineCustomElement$3 } from './casino-game-thumbnail-betlimit2.js';
+import { d as defineCustomElement$2 } from './casino-game-thumbnail-extrainfo2.js';
+
+const SeatSvg = `<svg xmlns="http://www.w3.org/2000/svg" width="13" height="14" viewBox="0 0 13 14">
+  <path
+    d="M11.58 6c-1.17 0-2.13.95-2.13 2.12v.4a8.82 8.82 0 00-2.92-.4c-1.54 0-2.45.22-2.92.4v-.4A2.136 2.136 0 001.48 6a1.33 1.33 0 00-.5 2.55c.14.07.24.21.24.37l.26 1.06c0 .96.73 1.75 1.65 1.85a.65.65 0 00.28 1.23.65.65 0 00.3-1.22h5.64a.65.65 0 00.3 1.22.65.65 0 00.28-1.23c.93-.1 1.65-.9 1.65-1.85l.27-1.06c0-.16.1-.3.24-.37A1.33 1.33 0 0011.58 6z"/>
+  <path
+    d="M4.34 7.5c.55-.1 1.27-.17 2.2-.17.91 0 1.63.07 2.18.17.21-.96.9-1.74 1.8-2.1V4a3.99 3.99 0 00-7.97 0v1.4c.9.36 1.58 1.14 1.79 2.1z"/>
+</svg>
+`;
+
+const casinoExtrainfoBlackjackCss = ":host{display:block}.OpenSeat,.ClosedSeat{display:inline-block;width:16px;height:16px;margin-right:4px}.OpenSeat svg,.ClosedSeat svg{width:100%;height:100%}.OpenSeat{animation:flip-closed-seat 2s both;-webkit-animation:flip-closed-seat 2s both;-webkit-backface-visibility:visible;backface-visibility:visible}.ClosedSeat{animation:flip-open 2s both;-webkit-animation:flip-open 2s both;-webkit-backface-visibility:visible;backface-visibility:visible}.OpenSeat svg{fill:transparent;stroke:var(--emfe-w-color-white, #FFFFFF)}.ClosedSeat svg{fill:var(--emfe-w-color-white, #FFFFFF)}.FullTable{display:flex;position:relative;z-index:10;height:20px;padding:1px 4px 1px 0;align-items:center;border-radius:3px;font-size:12px;white-space:normal;text-transform:uppercase;-webkit-animation-name:silde-in-from-left;animation-name:silde-in-from-left;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both}.FullTable svg{width:100%;height:100%;fill:var(--emfe-w-color-white, #FFFFFF)}.FullTable.ClosedSeat{margin-right:-3px}";
+
+const CasinoExtrainfoBlackjack$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+  }
+  /**
+   * Generate Jackpot live seats info
+   * @param totalSeats
+   * @param occupiedSeats
+   */
+  generateBlackJackSeats(totalSeats = DEFAULT_BLACKJACK_TOTAL_SEATS, occupiedSeats = []) {
+    let seatsStatus = [];
+    for (let i = 0; i < totalSeats; i++) {
+      seatsStatus.push({
+        seatNo: i,
+        isClosed: occupiedSeats.indexOf((i + 1).toString()) > -1,
+      });
+    }
+    this.isTableFull = totalSeats == occupiedSeats.length;
+    return seatsStatus;
+  }
+  async onGameLoaded(gameInfo) {
+    var _a, _b, _c;
+    this.gameInfo = gameInfo;
+    this.gameDetails = this.gameInfo.details;
+    this.seatsStatus = this.generateBlackJackSeats((_a = this.gameDetails) === null || _a === void 0 ? void 0 : _a.totalSeats, (_b = this.gameDetails) === null || _b === void 0 ? void 0 : _b.currentOccupiedSeats);
+    (_c = this.infoWrapperRef) === null || _c === void 0 ? void 0 : _c.onGameLoaded(gameInfo);
+  }
+  async onGameDetailUpdated(details) {
+    var _a, _b;
+    this.gameInfo.details = this.gameDetails = details;
+    this.seatsStatus = this.generateBlackJackSeats((_a = this.gameDetails) === null || _a === void 0 ? void 0 : _a.totalSeats, (_b = this.gameDetails) === null || _b === void 0 ? void 0 : _b.currentOccupiedSeats);
+    this.gameDetails = Object.assign({}, this.gameDetails);
+  }
+  render() {
+    return (h(Host, null, h("casino-game-thumbnail-extrainfo", { ref: (el) => (this.infoWrapperRef = el), language: this.language }, this.gameDetails && this.gameDetails.isOpen && (h("div", { slot: "category-details", class: "LiveIcons", part: "LiveIcons" }, this.isTableFull ? (h("span", { class: "FullTable", part: "FullTable" }, translate('full', this.language))) : (this.seatsStatus.map((seatStatus) => (h("span", { class: `${seatStatus.isClosed ? 'ClosedSeat' : 'OpenSeat'} svg-container`, id: `s${seatStatus.seatNo}`, part: `${seatStatus.isClosed ? 'ClosedSeat' : 'OpenSeat'} svg-container`, innerHTML: SeatSvg })))))))));
+  }
+  static get style() { return casinoExtrainfoBlackjackCss; }
+}, [0, "casino-extrainfo-blackjack", {
+    "language": [1],
+    "gameInfo": [32],
+    "gameDetails": [32],
+    "seatsStatus": [32],
+    "isTableFull": [32],
+    "onGameLoaded": [64],
+    "onGameDetailUpdated": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["casino-extrainfo-blackjack", "casino-game-thumbnail-betlimit", "casino-game-thumbnail-extrainfo"];
+  components.forEach(tagName => { switch (tagName) {
+    case "casino-extrainfo-blackjack":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, CasinoExtrainfoBlackjack$1);
+      }
+      break;
+    case "casino-game-thumbnail-betlimit":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "casino-game-thumbnail-extrainfo":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const CasinoExtrainfoBlackjack = CasinoExtrainfoBlackjack$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { CasinoExtrainfoBlackjack, defineCustomElement };

package/dist/components/casino-extrainfo-roulette.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface CasinoExtrainfoRoulette extends Components.CasinoExtrainfoRoulette, HTMLElement {}
+export const CasinoExtrainfoRoulette: {
+  prototype: CasinoExtrainfoRoulette;
+  new (): CasinoExtrainfoRoulette;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/dist/components/casino-extrainfo-roulette.js

@@ -0,0 +1,78 @@
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+import { R as ROULETTE_COLOR_MAP, a as WIDGETTYPE_GAMECATEGORY } from './game-thumbnail.js';
+import { d as defineCustomElement$3 } from './casino-game-thumbnail-betlimit2.js';
+import { d as defineCustomElement$2 } from './casino-game-thumbnail-extrainfo2.js';
+
+const casinoExtrainfoRouletteCss = ":host{display:block;font-family:system-ui, -apple-system, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\"}.Blue{color:#4d90a7}.Red{background-color:red}.Black{background-color:var(--emfe-w-color-black, #000000)}.Green{background-color:#56A80A}.White{background-color:var(--emfe-w-color-white, #FFFFFF)}.Yellow{background-color:#eeca3d}.Gold{background-color:#866d0c}.Orange{background-color:#574708}.Purple{background-color:#330033}";
+
+const CasinoExtrainfoRoulette$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    /**
+     * Language
+     */
+    this.language = 'en';
+  }
+  async onGameLoaded(gameInfo) {
+    var _a;
+    this.gameInfo = Object.assign({}, gameInfo);
+    this.gameDetails = this.gameInfo.details ? Object.assign({}, this.gameInfo.details) : null;
+    (_a = this.infoWrapperRef) === null || _a === void 0 ? void 0 : _a.onGameLoaded(gameInfo);
+  }
+  async onGameDetailUpdated(details) {
+    this.gameInfo.details = this.gameDetails = details;
+    this.gameInfo = Object.assign({}, this.gameInfo);
+    this.gameDetails = Object.assign({}, this.gameDetails);
+  }
+  getRouletteNumberColor(value) {
+    return ROULETTE_COLOR_MAP[value];
+  }
+  render() {
+    var _a, _b, _c, _d;
+    const isDouble = this.gameDetails ?
+      this.gameDetails.category.toLowerCase() ===
+        WIDGETTYPE_GAMECATEGORY.doubleballroulette : false;
+    let rouletteNumbers = (isDouble
+      ? (_a = this.gameDetails) === null || _a === void 0 ? void 0 : _a.currentDoubleBallRouletteNumbers
+      : (_b = this.gameDetails) === null || _b === void 0 ? void 0 : _b.currentRouletteNumbers) || [];
+    return (h(Host, null, h("casino-game-thumbnail-extrainfo", { ref: (el) => (this.infoWrapperRef = el), language: this.language }, h("div", { slot: "category-details", class: `LiveIcons ${((_c = this.gameDetails) === null || _c === void 0 ? void 0 : _c.isOpen) ? 'GameBackdrop' : ''}`, part: `LiveIcons ${((_d = this.gameDetails) === null || _d === void 0 ? void 0 : _d.isOpen) ? 'GameBackdrop' : ''}` }, rouletteNumbers.slice(0, 5).map((rNum, idx) => isDouble === true ? (h("div", { class: "Double", part: "Double" }, h("span", { id: `s${idx}0`, class: `LatestResult ${idx == 0 ? 'First' : ''} ${this.showLiveClass ? 'FirstElementAnimated' : ''} ${this.getRouletteNumberColor(rNum[0])}` }, ' ', rNum[0]), h("span", { id: `s${idx}1`, class: `LatestResult ${idx == 0 ? 'First' : ''} ${this.showLiveClass ? 'FirstElementAnimated' : ''} ${this.getRouletteNumberColor(rNum[1])}` }, ' ', rNum[1]))) : (h("span", { id: `s${idx}`, class: `LatestResult ${idx == 0 ? 'First' : ''} ${this.showLiveClass ? 'FirstElementAnimated' : ''} ${this.getRouletteNumberColor(rNum)}` }, ' ', rNum)))))));
+  }
+  static get style() { return casinoExtrainfoRouletteCss; }
+}, [0, "casino-extrainfo-roulette", {
+    "language": [1],
+    "gameInfo": [32],
+    "gameDetails": [32],
+    "showLiveClass": [32],
+    "onGameLoaded": [64],
+    "onGameDetailUpdated": [64]
+  }]);
+function defineCustomElement$1() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["casino-extrainfo-roulette", "casino-game-thumbnail-betlimit", "casino-game-thumbnail-extrainfo"];
+  components.forEach(tagName => { switch (tagName) {
+    case "casino-extrainfo-roulette":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, CasinoExtrainfoRoulette$1);
+      }
+      break;
+    case "casino-game-thumbnail-betlimit":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "casino-game-thumbnail-extrainfo":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+  } });
+}
+defineCustomElement$1();
+
+const CasinoExtrainfoRoulette = CasinoExtrainfoRoulette$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { CasinoExtrainfoRoulette, defineCustomElement };

package/dist/components/casino-game-thumb-view.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../types/components";
+
+interface CasinoGameThumbView extends Components.CasinoGameThumbView, HTMLElement {}
+export const CasinoGameThumbView: {
+  prototype: CasinoGameThumbView;
+  new (): CasinoGameThumbView;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;