@everymatrix/lottery-game-page 0.1.5 → 0.1.9

package/dist/components/lottery-draw-results2.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import '@everymatrix/lottery-grid';
+import { d as defineCustomElement$2 } from './lottery-bullet2.js';
+import { d as defineCustomElement$1 } from './lottery-grid2.js';
 
 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['ro', 'en'];
@@ -207,13 +208,23 @@ function defineCustomElement() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["lottery-draw-results"];
+  const components = ["lottery-draw-results", "lottery-bullet", "lottery-grid"];
   components.forEach(tagName => { switch (tagName) {
     case "lottery-draw-results":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, LotteryDrawResults);
       }
       break;
+    case "lottery-bullet":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "lottery-grid":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
   } });
 }
 defineCustomElement();

package/dist/components/lottery-game-details.js

@@ -0,0 +1,6 @@
+import { L as LotteryGameDetails$1, d as defineCustomElement$1 } from './lottery-game-details2.js';
+
+const LotteryGameDetails = LotteryGameDetails$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LotteryGameDetails, defineCustomElement };

package/dist/components/lottery-game-details2.js

@@ -0,0 +1,49 @@
+import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$3 } from './helper-accordion2.js';
+import { d as defineCustomElement$2 } from './helper-tab2.js';
+import { d as defineCustomElement$1 } from './helper-tabs2.js';
+
+const lotteryGameDetailsCss = ":host{display:block}";
+
+const LotteryGameDetails = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+  }
+  render() {
+    return (h("div", null, h("helper-accordion", { "header-title": "Game Details", collapsed: false }, h("div", { slot: "accordionContent" }, h("helper-tabs", null)))));
+  }
+  static get style() { return lotteryGameDetailsCss; }
+}, [1, "lottery-game-details"]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["lottery-game-details", "helper-accordion", "helper-tab", "helper-tabs"];
+  components.forEach(tagName => { switch (tagName) {
+    case "lottery-game-details":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, LotteryGameDetails);
+      }
+      break;
+    case "helper-accordion":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "helper-tab":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "helper-tabs":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+defineCustomElement();
+
+export { LotteryGameDetails as L, defineCustomElement as d };

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

@@ -1,9 +1,16 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-import '@everymatrix/lottery-ticket-controller';
-import '@everymatrix/lottery-game-details';
-import '@everymatrix/lottery-draw-results-history';
-import { d as defineCustomElement$3 } from './helper-modal2.js';
-import { d as defineCustomElement$2 } from './lottery-draw-results2.js';
+import { d as defineCustomElement$d } from './helper-accordion2.js';
+import { d as defineCustomElement$c } from './helper-filters2.js';
+import { d as defineCustomElement$b } from './helper-modal2.js';
+import { d as defineCustomElement$a } from './helper-tab2.js';
+import { d as defineCustomElement$9 } from './helper-tabs2.js';
+import { d as defineCustomElement$8 } from './lottery-bullet2.js';
+import { d as defineCustomElement$7 } from './lottery-draw-results2.js';
+import { d as defineCustomElement$6 } from './lottery-draw-results-history2.js';
+import { d as defineCustomElement$5 } from './lottery-game-details2.js';
+import { d as defineCustomElement$4 } from './lottery-grid2.js';
+import { d as defineCustomElement$3 } from './lottery-ticket2.js';
+import { d as defineCustomElement$2 } from './lottery-ticket-controller2.js';
 
 const DEFAULT_LANGUAGE = 'en';
 const SUPPORTED_LANGUAGES = ['ro', 'en', 'ar'];
@@ -363,19 +370,69 @@ function defineCustomElement$1() {
   if (typeof customElements === "undefined") {
     return;
   }
-  const components = ["lottery-game-page", "helper-modal", "lottery-draw-results"];
+  const components = ["lottery-game-page", "helper-accordion", "helper-filters", "helper-modal", "helper-tab", "helper-tabs", "lottery-bullet", "lottery-draw-results", "lottery-draw-results-history", "lottery-game-details", "lottery-grid", "lottery-ticket", "lottery-ticket-controller"];
   components.forEach(tagName => { switch (tagName) {
     case "lottery-game-page":
       if (!customElements.get(tagName)) {
         customElements.define(tagName, LotteryGamePage$1);
       }
       break;
+    case "helper-accordion":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$d();
+      }
+      break;
+    case "helper-filters":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$c();
+      }
+      break;
     case "helper-modal":
       if (!customElements.get(tagName)) {
-        defineCustomElement$3();
+        defineCustomElement$b();
+      }
+      break;
+    case "helper-tab":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$a();
+      }
+      break;
+    case "helper-tabs":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$9();
+      }
+      break;
+    case "lottery-bullet":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$8();
       }
       break;
     case "lottery-draw-results":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$7();
+      }
+      break;
+    case "lottery-draw-results-history":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$6();
+      }
+      break;
+    case "lottery-game-details":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$5();
+      }
+      break;
+    case "lottery-grid":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "lottery-ticket":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "lottery-ticket-controller":
       if (!customElements.get(tagName)) {
         defineCustomElement$2();
       }

package/dist/components/lottery-grid.js

@@ -0,0 +1,6 @@
+import { L as LotteryGrid$1, d as defineCustomElement$1 } from './lottery-grid2.js';
+
+const LotteryGrid = LotteryGrid$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LotteryGrid, defineCustomElement };

package/dist/components/lottery-grid2.js

@@ -0,0 +1,197 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$1 } from './lottery-bullet2.js';
+
+const lotteryGridCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GridContainer{display:flex;flex-direction:column;max-width:1200px}.Grid{margin-top:10px 0 10px 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:25px}";
+
+const LotteryGrid = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.gridFilledEvent = createEvent(this, "gridFilled", 7);
+    this.gridDirtyEvent = createEvent(this, "gridDirty", 7);
+    /**
+     * Number of bullets of grid
+     */
+    this.totalNumbers = 0;
+    /**
+     * Number of maximum bullets that can be selected
+     */
+    this.maximumAllowed = 0;
+    /**
+     * Minimum allowed of bullets
+     */
+    this.minimumAllowed = 1;
+    /**
+     * Allows the user to select numbers on the grid
+     */
+    this.selectable = true;
+    /**
+     * Numbers that should be showed as selected on the grid (as a string of those numbers e.g. '1,2,3,4,5,6')
+     */
+    this.selectedNumbers = '';
+    /**
+     * Show only selected numbers
+     */
+    this.displaySelected = false;
+    /**
+     * Language
+     */
+    this.language = 'en';
+    this.numbers = [];
+    this.selectedCounter = 0;
+  }
+  connectedCallback() {
+    let selected = [];
+    if (this.selectedNumbers.length > 0) {
+      selected = this.selectedNumbers.split(',');
+      this.selectedCounter = selected.length;
+    }
+    if (this.displaySelected) {
+      selected.forEach((item) => {
+        this.numbers.push({
+          number: item,
+          selected: true,
+          selectable: this.selectable
+        });
+      });
+    }
+    else {
+      [...Array(this.totalNumbers).keys()]
+        .map(number => (number + 1).toString())
+        .forEach((number) => {
+        this.numbers.push({
+          number,
+          selected: selected.indexOf(number) >= 0 ? true : false,
+          selectable: this.selectedCounter == this.maximumAllowed ? false : this.selectable
+        });
+      });
+    }
+  }
+  lotteryBulletSelectionHandler(event) {
+    this.numbers = this.numbers.map((item) => {
+      if (item.number == event.detail.value) {
+        return {
+          number: item.number,
+          selected: event.detail.selected,
+          selectable: item.selectable
+        };
+      }
+      return {
+        number: item.number,
+        selected: item.selected,
+        selectable: item.selectable
+      };
+    });
+    if (event.detail.selected) {
+      this.selectedCounter += 1;
+      if (this.selectedCounter == this.maximumAllowed) {
+        this.numbers = this.numbers.map((item) => {
+          return {
+            number: item.number,
+            selected: item.selected,
+            selectable: item.selected ? true : false
+          };
+        });
+        this.gridFilledEvent.emit({
+          id: this.ticketId,
+          index: this.gridIndex,
+          selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
+        });
+      }
+    }
+    else {
+      if (this.selectedCounter == this.maximumAllowed) {
+        this.numbers = this.numbers.map((item) => {
+          return {
+            number: item.number,
+            selected: item.selected,
+            selectable: true
+          };
+        });
+        this.gridDirtyEvent.emit({
+          id: this.ticketId,
+          index: this.gridIndex,
+          selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
+        });
+      }
+      this.selectedCounter -= 1;
+    }
+  }
+  async resetSelectionHandler(event) {
+    if (event.detail && event.detail == this.ticketId) {
+      this.selectedCounter = 0;
+      this.numbers = this.numbers.map((item) => {
+        return {
+          number: item.number,
+          selected: false,
+          selectable: this.selectable
+        };
+      });
+      this.gridDirtyEvent.emit({
+        id: this.ticketId,
+        index: this.gridIndex,
+        selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
+      });
+    }
+  }
+  async autoSelectionHandler(event) {
+    if (event.detail && event.detail == this.ticketId) {
+      this.resetSelectionHandler(event);
+      let array = [...Array(this.totalNumbers).keys()]
+        .map(number => number + 1)
+        .sort(() => 0.5 - Math.random());
+      array = array.slice(0, this.minimumAllowed);
+      this.numbers = this.numbers.map((item) => {
+        return {
+          number: item.number,
+          selected: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
+          selectable: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
+        };
+      });
+      this.gridFilledEvent.emit({
+        id: this.ticketId,
+        index: this.gridIndex,
+        selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
+      });
+      this.selectedCounter = this.maximumAllowed;
+    }
+  }
+  render() {
+    return (h("div", { class: "GridContainer" }, h("div", { class: "Grid" }, this.numbers.map((item) => h("div", null, h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected }))))));
+  }
+  static get style() { return lotteryGridCss; }
+}, [1, "lottery-grid", {
+    "ticketId": [2, "ticket-id"],
+    "totalNumbers": [2, "total-numbers"],
+    "gameId": [1, "game-id"],
+    "maximumAllowed": [2, "maximum-allowed"],
+    "minimumAllowed": [2, "minimum-allowed"],
+    "selectable": [4],
+    "selectedNumbers": [1, "selected-numbers"],
+    "displaySelected": [4, "display-selected"],
+    "language": [1],
+    "gridIndex": [2, "grid-index"],
+    "numbers": [32]
+  }, [[0, "lotteryBulletSelection", "lotteryBulletSelectionHandler"], [4, "resetSelection", "resetSelectionHandler"], [4, "autoSelection", "autoSelectionHandler"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["lottery-grid", "lottery-bullet"];
+  components.forEach(tagName => { switch (tagName) {
+    case "lottery-grid":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, LotteryGrid);
+      }
+      break;
+    case "lottery-bullet":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+defineCustomElement();
+
+export { LotteryGrid as L, defineCustomElement as d };

package/dist/components/lottery-ticket-controller.js

@@ -0,0 +1,6 @@
+import { L as LotteryTicketController$1, d as defineCustomElement$1 } from './lottery-ticket-controller2.js';
+
+const LotteryTicketController = LotteryTicketController$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LotteryTicketController, defineCustomElement };

package/dist/components/lottery-ticket-controller2.js

@@ -0,0 +1,118 @@
+import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
+import { d as defineCustomElement$4 } from './helper-accordion2.js';
+import { d as defineCustomElement$3 } from './lottery-bullet2.js';
+import { d as defineCustomElement$2 } from './lottery-grid2.js';
+import { d as defineCustomElement$1 } from './lottery-ticket2.js';
+
+const lotteryTicketControllerCss = ":host{display:block}";
+
+const LotteryTicketController = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    this.deleteTicketEvent = createEvent(this, "deleteTicket", 7);
+    /**
+     * Endpoint URL for the source of data (NorWAy standard)
+     */
+    this.endpoint = '';
+    /**
+     * Ticket number
+     */
+    this.ticketId = 1;
+    /**
+     * Activates postMessages as events for actions from the widget
+     */
+    this.postMessage = false;
+    /**
+     * Name of the event emitter by the action button
+     */
+    this.eventName = 'deleteTicketAction';
+    /**
+     * Collapsed
+     */
+    this.collapsed = true;
+    /**
+     * Number of grids?
+     */
+    this.numberOfGrids = 1;
+    /**
+     * This toggles if the last ticket added should be expanded or not
+     */
+    this.last = false;
+    /**
+     * Language
+     */
+    this.language = 'en';
+    /**
+     * Shows the auto-pick button
+     */
+    this.autoPick = false;
+    /**
+     * Shows the reset button
+     */
+    this.resetButton = false;
+  }
+  // @TODO fix the `any` type
+  helperAccordionActionHandler() {
+    if (this.postMessage) {
+      window.postMessage({ type: this.eventName }, window.location.href);
+    }
+    this.deleteTicketEvent.emit({
+      ticketId: this.ticketId
+    });
+  }
+  render() {
+    return (h("div", null, h("helper-accordion", { "header-title": 'Ticket ' + this.ticketId, "header-subtitle": this.ticketDescription, footer: true, "delete-tab": true, collapsed: !this.last || this.collapsed, language: this.language }, h("div", { slot: "accordionContent" }, h("lottery-ticket", { endpoint: this.endpoint, "game-id": this.gameId, "ticket-id": this.ticketId, "number-of-grids": this.numberOfGrids, language: this.language, "reset-button": this.resetButton, "auto-pick": this.autoPick })))));
+  }
+  static get style() { return lotteryTicketControllerCss; }
+}, [1, "lottery-ticket-controller", {
+    "endpoint": [1],
+    "ticketId": [2, "ticket-id"],
+    "ticketDescription": [1, "ticket-description"],
+    "gameId": [1, "game-id"],
+    "postMessage": [4, "post-message"],
+    "eventName": [1, "event-name"],
+    "collapsed": [4],
+    "numberOfGrids": [2, "number-of-grids"],
+    "last": [4],
+    "language": [1],
+    "autoPick": [4, "auto-pick"],
+    "resetButton": [4, "reset-button"]
+  }, [[0, "helperAccordionAction", "helperAccordionActionHandler"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["lottery-ticket-controller", "helper-accordion", "lottery-bullet", "lottery-grid", "lottery-ticket"];
+  components.forEach(tagName => { switch (tagName) {
+    case "lottery-ticket-controller":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, LotteryTicketController);
+      }
+      break;
+    case "helper-accordion":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$4();
+      }
+      break;
+    case "lottery-bullet":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$3();
+      }
+      break;
+    case "lottery-grid":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$2();
+      }
+      break;
+    case "lottery-ticket":
+      if (!customElements.get(tagName)) {
+        defineCustomElement$1();
+      }
+      break;
+  } });
+}
+defineCustomElement();
+
+export { LotteryTicketController as L, defineCustomElement as d };

package/dist/components/lottery-ticket.js

@@ -0,0 +1,6 @@
+import { L as LotteryTicket$1, d as defineCustomElement$1 } from './lottery-ticket2.js';
+
+const LotteryTicket = LotteryTicket$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { LotteryTicket, defineCustomElement };