@everymatrix/lottery-game-page 0.0.9 → 0.0.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (55) hide show
  1. package/dist/cjs/helper-accordion.cjs.entry.js +88 -0
  2. package/dist/cjs/{helper-accordion_13.cjs.entry.js → helper-filters_2.cjs.entry.js} +21 -1023
  3. package/dist/cjs/helper-modal.cjs.entry.js +44 -0
  4. package/dist/cjs/helper-tab.cjs.entry.js +33 -0
  5. package/dist/cjs/helper-tabs.cjs.entry.js +38 -0
  6. package/dist/cjs/loader.cjs.js +1 -1
  7. package/dist/cjs/lottery-bullet_2.cjs.entry.js +202 -0
  8. package/dist/cjs/lottery-draw-results-history.cjs.entry.js +124 -0
  9. package/dist/cjs/lottery-game-details.cjs.entry.js +19 -0
  10. package/dist/cjs/lottery-game-page.cjs.entry.js +299 -0
  11. package/dist/cjs/lottery-game-page.cjs.js +1 -1
  12. package/dist/cjs/lottery-ticket-controller.cjs.entry.js +69 -0
  13. package/dist/cjs/lottery-ticket.cjs.entry.js +146 -0
  14. package/dist/collection/collection-manifest.json +7 -1
  15. package/dist/components/helper-accordion2.js +1 -0
  16. package/dist/components/helper-filters2.js +1 -0
  17. package/dist/components/helper-modal2.js +1 -0
  18. package/dist/components/helper-pagination.js +1 -0
  19. package/dist/components/helper-tab2.js +1 -0
  20. package/dist/components/helper-tabs2.js +1 -0
  21. package/dist/components/lottery-bullet2.js +1 -0
  22. package/dist/components/lottery-draw-results-history2.js +1 -0
  23. package/dist/components/lottery-draw-results2.js +1 -0
  24. package/dist/components/lottery-game-details2.js +1 -0
  25. package/dist/components/lottery-game-page.js +1 -0
  26. package/dist/components/lottery-grid2.js +1 -0
  27. package/dist/components/lottery-ticket-controller2.js +1 -0
  28. package/dist/components/lottery-ticket2.js +1 -0
  29. package/dist/esm/helper-accordion.entry.js +84 -0
  30. package/dist/esm/{helper-accordion_13.entry.js → helper-filters_2.entry.js} +23 -1014
  31. package/dist/esm/helper-modal.entry.js +40 -0
  32. package/dist/esm/helper-tab.entry.js +29 -0
  33. package/dist/esm/helper-tabs.entry.js +34 -0
  34. package/dist/esm/loader.js +1 -1
  35. package/dist/esm/lottery-bullet_2.entry.js +197 -0
  36. package/dist/esm/lottery-draw-results-history.entry.js +120 -0
  37. package/dist/esm/lottery-game-details.entry.js +15 -0
  38. package/dist/esm/lottery-game-page.entry.js +295 -0
  39. package/dist/esm/lottery-game-page.js +1 -1
  40. package/dist/esm/lottery-ticket-controller.entry.js +65 -0
  41. package/dist/esm/lottery-ticket.entry.js +142 -0
  42. package/dist/lottery-game-page/lottery-game-page.esm.js +1 -1
  43. package/dist/lottery-game-page/p-010895a3.entry.js +1 -0
  44. package/dist/lottery-game-page/p-09f983c6.entry.js +1 -0
  45. package/dist/lottery-game-page/p-0c7ada78.entry.js +1 -0
  46. package/dist/lottery-game-page/p-2932d2a7.entry.js +1 -0
  47. package/dist/lottery-game-page/p-48831184.entry.js +1 -0
  48. package/dist/lottery-game-page/p-50298d2c.entry.js +1 -0
  49. package/dist/lottery-game-page/p-6736fa79.entry.js +1 -0
  50. package/dist/lottery-game-page/p-88f81126.entry.js +1 -0
  51. package/dist/lottery-game-page/{p-49bd2864.entry.js → p-95b37270.entry.js} +105 -105
  52. package/dist/lottery-game-page/p-a1dd3eb2.entry.js +1 -0
  53. package/dist/lottery-game-page/p-caf09eaf.entry.js +1 -0
  54. package/dist/stencil.config.js +9 -5
  55. package/package.json +1 -1
@@ -4,90 +4,9 @@ Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  const index = require('./index-81cb3b3b.js');
6
6
 
7
- const DEFAULT_LANGUAGE$5 = 'en';
8
- const SUPPORTED_LANGUAGES$5 = ['ro', 'en'];
9
- const TRANSLATIONS$5 = {
10
- en: {
11
- deleteTicket: 'Delete ticket'
12
- },
13
- ro: {
14
- deleteTicket: 'Sterge biletul'
15
- },
16
- };
17
- const translate$6 = (key, customLang) => {
18
- const lang = customLang;
19
- return TRANSLATIONS$5[lang !== undefined && SUPPORTED_LANGUAGES$5.includes(lang) ? lang : DEFAULT_LANGUAGE$5][key];
20
- };
21
-
22
- const helperAccordionCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.Header{border-radius:4px;margin-bottom:1px;background:#009993;display:flex;gap:30px;border:1px solid #009993;padding:8px 10px;user-select:none}.Header:hover{background:#00ABA4}.Header .Title,.Header .Subtitle,.Header .Description{margin:0;font-size:14px;color:#fff}.Header .Expand{margin-left:auto;color:#FFF;width:17px;height:17px;cursor:pointer;text-align:center;transform:rotate(90deg);font-size:20px;user-select:none}.Content{border-radius:4px;background:#fff;border:1px solid #009993;padding:10px 15px;user-select:none;color:#000;margin-bottom:10px}.ActionButton{border-radius:4px;margin-top:10px;cursor:pointer;text-transform:capitalize;display:block;font-size:12px;text-align:center;padding:8px 20px;width:80px;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.ActionButton:hover{background:#FF6536;border:1px solid #FF3D00}";
23
-
24
- const Accordion = class {
25
- constructor(hostRef) {
26
- index.registerInstance(this, hostRef);
27
- this.accordionEvent = index.createEvent(this, "helperAccordionAction", 7);
28
- /**
29
- * Title (top header)
30
- */
31
- this.headerTitle = '';
32
- /**
33
- * SubTitle (top header)
34
- */
35
- this.headerSubtitle = '';
36
- /**
37
- * Description
38
- */
39
- this.description = '';
40
- /**
41
- * Enables footer content
42
- */
43
- this.footer = false;
44
- /**
45
- * Enables footer button for tab deletion
46
- */
47
- this.deleteTab = false;
48
- /**
49
- * Activates postMessages as events for actions from the widget
50
- */
51
- this.postMessage = false;
52
- /**
53
- * Name of the event emitter by the action button
54
- */
55
- this.eventName = 'helperAccordionAction';
56
- /**
57
- * Collapsed
58
- */
59
- this.collapsed = true;
60
- /**
61
- * Language
62
- */
63
- this.language = 'en';
64
- }
65
- // @TODO fix the `any` type :)
66
- connectedCallback() {
67
- this.showContent = !this.collapsed;
68
- }
69
- toggleContent() {
70
- this.showContent = !this.showContent;
71
- }
72
- deleteAction() {
73
- if (this.postMessage) {
74
- // @TODO maybe change the name type, this one sucks
75
- window.postMessage({ type: this.eventName }, window.location.href);
76
- }
77
- this.accordionEvent.emit();
78
- }
79
- render() {
80
- return (index.h("div", { class: "Wrapper" }, index.h("div", { class: "Header" }, index.h("p", { class: "Title" }, this.headerTitle), index.h("p", { class: "Subtitle" }, this.headerSubtitle), index.h("p", { class: "Subtitle" }, this.description), index.h("span", { class: "Expand", onClick: () => this.toggleContent() }, this.showContent ? '<' : '>')), this.showContent &&
81
- index.h("div", null, index.h("div", { class: "Content" }, index.h("slot", { name: 'accordionContent' }), this.footer && this.showContent &&
82
- index.h("div", null, this.deleteTab &&
83
- index.h("span", { class: "ActionButton", onClick: () => this.deleteAction() }, translate$6('deleteTicket', this.language)))))));
84
- }
85
- };
86
- Accordion.style = helperAccordionCss;
87
-
88
- const DEFAULT_LANGUAGE$4 = 'en';
89
- const SUPPORTED_LANGUAGES$4 = ['ro', 'en'];
90
- const TRANSLATIONS$4 = {
7
+ const DEFAULT_LANGUAGE$1 = 'en';
8
+ const SUPPORTED_LANGUAGES$1 = ['ro', 'en'];
9
+ const TRANSLATIONS$1 = {
91
10
  en: {
92
11
  filterOpen: 'Filter',
93
12
  filterClear: 'Clear',
@@ -111,9 +30,9 @@ const TRANSLATIONS$4 = {
111
30
  filterModalButton: 'Cauta'
112
31
  },
113
32
  };
114
- const translate$5 = (key, customLang) => {
33
+ const translate$2 = (key, customLang) => {
115
34
  const lang = customLang;
116
- return TRANSLATIONS$4[lang !== undefined && SUPPORTED_LANGUAGES$4.includes(lang) ? lang : DEFAULT_LANGUAGE$4][key];
35
+ return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
117
36
  };
118
37
 
119
38
  /**
@@ -1802,7 +1721,7 @@ function isDescendant(base, path) {
1802
1721
  * @param {string} path Path to translate
1803
1722
  * @return {string} Translated string
1804
1723
  */
1805
- function translate$4(base, newBase, path) {
1724
+ function translate$1(base, newBase, path) {
1806
1725
  return newBase + path.slice(base.length);
1807
1726
  }
1808
1727
 
@@ -4003,7 +3922,7 @@ function handleNotification(event, inst, fromProp, toPath, negate) {
4003
3922
  let detail = /** @type {Object} */(event.detail);
4004
3923
  let fromPath = detail && detail.path;
4005
3924
  if (fromPath) {
4006
- toPath = translate$4(fromProp, toPath, fromPath);
3925
+ toPath = translate$1(fromProp, toPath, fromPath);
4007
3926
  value = detail && detail.value;
4008
3927
  } else {
4009
3928
  value = event.currentTarget[fromProp];
@@ -4289,10 +4208,10 @@ function computeLinkedPaths(inst, path, value) {
4289
4208
  for (let a in links) {
4290
4209
  let b = links[a];
4291
4210
  if (isDescendant(a, path)) {
4292
- link = translate$4(a, b, path);
4211
+ link = translate$1(a, b, path);
4293
4212
  inst._setPendingPropertyOrPath(link, value, true, true);
4294
4213
  } else if (isDescendant(b, path)) {
4295
- link = translate$4(b, a, path);
4214
+ link = translate$1(b, a, path);
4296
4215
  inst._setPendingPropertyOrPath(link, value, true, true);
4297
4216
  }
4298
4217
  }
@@ -4404,7 +4323,7 @@ function runBindingEffect(inst, path, props, oldProps, info, hasPaths, nodeList)
4404
4323
  node.__isPropertyEffectsClient &&
4405
4324
  node.__dataHasAccessor && node.__dataHasAccessor[binding.target]) {
4406
4325
  let value = props[path];
4407
- path = translate$4(part.source, binding.target, path);
4326
+ path = translate$1(part.source, binding.target, path);
4408
4327
  if (node._setPendingPropertyOrPath(path, value, false, true)) {
4409
4328
  inst._enqueueClient(node);
4410
4329
  }
@@ -16432,7 +16351,7 @@ class DomRepeat extends domRepeatBase {
16432
16351
  if (prop == this.as) {
16433
16352
  this.items[idx] = value;
16434
16353
  }
16435
- let path = translate$4(this.as, `${JSCompiler_renameProperty('items', this)}.${idx}`, prop);
16354
+ let path = translate$1(this.as, `${JSCompiler_renameProperty('items', this)}.${idx}`, prop);
16436
16355
  this.notifyPath(path, value);
16437
16356
  }
16438
16357
  }
@@ -22391,142 +22310,14 @@ const HelperFilters = class {
22391
22310
  this.filterData.filterToCalendar = new Date(event.target.value).toISOString();
22392
22311
  }
22393
22312
  render() {
22394
- return (index.h("div", { class: "HelperFilters" }, index.h("div", { class: "FilterButtonsWrapper" }, index.h("button", { class: "FilterOpen", onClick: () => this.toggleFilterModal() }, translate$5('filterOpen', this.language)), this.showClearButton ? index.h("button", { class: "FilterClear", onClick: () => this.resetSearch() }, translate$5('filterClear', this.language)) : null), index.h("helper-modal", { "title-modal": "Filter Modal", visible: this.showFilterModal }, index.h("div", { class: "FilterModalHeader" }, index.h("h3", { class: "FilterModalTitle" }, this.activateTicketSearch ? translate$5('filterModalTicketTitle', this.language) : translate$5('filterModalDrawTitle', this.language))), index.h("div", { class: "FilterModalBody" }, index.h("input", { type: "text", value: this.filterData.drawTicketId, onInput: (event) => this.handleDrawTicketId(event), class: "FilterModalSearch", placeholder: this.activateTicketSearch ? translate$5('filterTicketPlaceholder', this.language) : translate$5('filterDrawPlaceholder', this.language) }), index.h("div", { class: "FilterCalendarWrapper" }, index.h("vaadin-date-picker", { value: this.filterData.filterFromCalendar, onChange: (event) => this.handleFilterFrom(event), placeholder: translate$5('filterFromCalendar', this.language), class: "VaadinDatePicker" }), index.h("vaadin-date-picker", { value: this.filterData.filterToCalendar, onChange: (event) => this.handleFilterTo(event), placeholder: translate$5('filterToCalendar', this.language), class: "VaadinDatePicker" }))), index.h("div", { class: "FilterModalFooter" }, index.h("button", { class: "FilterModalButton", onClick: () => this.filterSearch() }, translate$5('filterModalButton', this.language))))));
22313
+ return (index.h("div", { class: "HelperFilters" }, index.h("div", { class: "FilterButtonsWrapper" }, index.h("button", { class: "FilterOpen", onClick: () => this.toggleFilterModal() }, translate$2('filterOpen', this.language)), this.showClearButton ? index.h("button", { class: "FilterClear", onClick: () => this.resetSearch() }, translate$2('filterClear', this.language)) : null), index.h("helper-modal", { "title-modal": "Filter Modal", visible: this.showFilterModal }, index.h("div", { class: "FilterModalHeader" }, index.h("h3", { class: "FilterModalTitle" }, this.activateTicketSearch ? translate$2('filterModalTicketTitle', this.language) : translate$2('filterModalDrawTitle', this.language))), index.h("div", { class: "FilterModalBody" }, index.h("input", { type: "text", value: this.filterData.drawTicketId, onInput: (event) => this.handleDrawTicketId(event), class: "FilterModalSearch", placeholder: this.activateTicketSearch ? translate$2('filterTicketPlaceholder', this.language) : translate$2('filterDrawPlaceholder', this.language) }), index.h("div", { class: "FilterCalendarWrapper" }, index.h("vaadin-date-picker", { value: this.filterData.filterFromCalendar, onChange: (event) => this.handleFilterFrom(event), placeholder: translate$2('filterFromCalendar', this.language), class: "VaadinDatePicker" }), index.h("vaadin-date-picker", { value: this.filterData.filterToCalendar, onChange: (event) => this.handleFilterTo(event), placeholder: translate$2('filterToCalendar', this.language), class: "VaadinDatePicker" }))), index.h("div", { class: "FilterModalFooter" }, index.h("button", { class: "FilterModalButton", onClick: () => this.filterSearch() }, translate$2('filterModalButton', this.language))))));
22395
22314
  }
22396
22315
  };
22397
22316
  HelperFilters.style = helperFiltersCss;
22398
22317
 
22399
- /**
22400
- * @name isMobile
22401
- * @description A method that returns if the browser used to access the app is from a mobile device or not
22402
- * @param {String} userAgent window.navigator.userAgent
22403
- * @returns {Boolean} true or false
22404
- */
22405
- const isMobile = (userAgent) => {
22406
- return !!(userAgent.toLowerCase().match(/android/i) ||
22407
- userAgent.toLowerCase().match(/blackberry|bb/i) ||
22408
- userAgent.toLowerCase().match(/iphone|ipad|ipod/i) ||
22409
- userAgent.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i));
22410
- };
22411
-
22412
- const helperModalCss = ":host{display:block}.HelperModalWrapper{position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0, 0, 0, 0.7);opacity:0;visibility:hidden;transform:scale(1.1);transition:visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;z-index:1}.HelperModalVisible{opacity:1;visibility:visible;transform:scale(1);transition:visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s}.HelperModalContent{position:relative;border:solid 1px #848e97;box-shadow:2px 2px 2px rgba(0, 0, 0, 0.007);font-size:14px;padding:10px 10px 5px 10px;background-color:#fff;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:4px;width:600px;max-height:600px;overflow-y:scroll}.HelperModalMobileContent{background:#FFF;top:50%;left:50%;transform:translate(-50%, -50%);border-radius:4px;width:80%;max-height:350px}.HelperModalClose{cursor:pointer;position:absolute;top:15px;right:15px;font-size:20px;color:#000}.HelperModalMobileClose{position:absolute;top:15px;right:15px;font-size:20px;color:#000}";
22413
-
22414
- const HelperModal = class {
22415
- constructor(hostRef) {
22416
- index.registerInstance(this, hostRef);
22417
- this.cancel = index.createEvent(this, "modalCloseEvent", 7);
22418
- /**
22419
- * Toggles if the helper is visible or not
22420
- */
22421
- this.visible = true;
22422
- this.userAgent = window.navigator.userAgent;
22423
- }
22424
- handleHelperModalClose() {
22425
- this.visible = false;
22426
- this.cancel.emit();
22427
- }
22428
- ;
22429
- render() {
22430
- return ((this.visible &&
22431
- index.h("div", { class: this.visible ? "HelperModalWrapper HelperModalVisible" : "HelperModalWrapper" }, index.h("div", { class: "HelperModalWrapper HelperModalVisible" }, index.h("div", { class: "HelperModalContent" + (isMobile(this.userAgent) ? ' HelperModalMobileContent' : '') }, index.h("span", { class: "HelperModalClose" + (isMobile(this.userAgent) ? ' HelperModalMobileClose' : ''), onClick: this.handleHelperModalClose.bind(this) }, "X"), index.h("slot", null))))));
22432
- }
22433
- };
22434
- HelperModal.style = helperModalCss;
22435
-
22436
- const helperTabCss = ":host{display:block}";
22437
-
22438
- const HelperTab = class {
22439
- constructor(hostRef) {
22440
- index.registerInstance(this, hostRef);
22441
- /**
22442
- * Selected index
22443
- */
22444
- this.selectedIndex = 0;
22445
- }
22446
- /**
22447
- * Endpoing for CMS
22448
- */
22449
- connectedCallback() {
22450
- /**
22451
- * fetch(cmsEndpoint + / + / + selectedIndex)
22452
- */
22453
- }
22454
- render() {
22455
- return [
22456
- index.h("div", null, "Reference site about Lorem Ipsum, giving information on its origins, as well as a random Lipsum generator.", this.selectedIndex + 1)
22457
- ];
22458
- }
22459
- };
22460
- HelperTab.style = helperTabCss;
22461
-
22462
- const helperTabsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.Tabs{display:flex;gap:10px;overflow-x:auto}.TabButton{cursor:pointer;width:auto;border-radius:4px;padding:8px 15px;margin:5px 0 10px;border:1px solid #009993;background:#FFF;color:#000;font-size:12px;transition:all 0.2s linear;text-align:center;letter-spacing:0;white-space:nowrap}.TabButton:hover{background:#F1F1F1}.TabButton.Active{background:#009993;color:#FFF}";
22463
-
22464
- const HelperTabs = class {
22465
- constructor(hostRef) {
22466
- index.registerInstance(this, hostRef);
22467
- /**
22468
- * Tell me if it is disabled
22469
- */
22470
- this.disabled = false;
22471
- /**
22472
- * Tell me what tab is selected
22473
- */
22474
- this.selected = false;
22475
- /**
22476
- * Default selected index
22477
- */
22478
- this.selectedIndex = 0;
22479
- /**
22480
- * Tabs details
22481
- */
22482
- this.tabs = [{ label: 'Draw Details' }, { label: 'Winnings' }, { label: 'How to Play' }, { label: 'Game Odds' }, { label: 'FAQs' }];
22483
- }
22484
- connectedCallback() {
22485
- }
22486
- render() {
22487
- return (index.h("div", null, index.h("div", { class: "Tabs" }, this.tabs.map((tab, index$1) => index.h("button", { class: 'TabButton' + (this.selectedIndex == index$1 ? ' Active' : ''), onClick: () => this.selectedIndex = index$1 }, tab.label))), index.h("div", null, index.h("helper-tab", { selectedIndex: this.selectedIndex }))));
22488
- }
22489
- get host() { return index.getElement(this); }
22490
- };
22491
- HelperTabs.style = helperTabsCss;
22492
-
22493
- const lotteryBulletCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.Circle{cursor:pointer;color:#000000;display:block;background:#FFF;border:solid 2px #00958f;height:20px;width:20px;border-radius:50%;margin:0;display:flex;align-items:center;justify-content:center;user-select:none;font-size:12px;font-weight:600;position:relative}.Circle:hover{background:#aee4e2}.Circle.Selected{color:#ffffff;background:#9EC258;background:-webkit-radial-gradient(top, #00958f, #004D4A);background:-moz-radial-gradient(top, #00958f, #004D4A);background:radial-gradient(to bottom, #00958f, #004D4A);border:solid 2px #00958f}.Circle.Disabled{color:#707070;background:#D4D4D4;border:solid 2px #707070;cursor:default}.Circle.DisabledSelected{color:#ffffff;background:#9EC258;background:-webkit-radial-gradient(top, #00958f, #004D4A);background:-moz-radial-gradient(top, #00958f, #004D4A);background:radial-gradient(to bottom, #00958f, #004D4A);border:solid 2px #707070;cursor:default}";
22494
-
22495
- const LotteryBullet = class {
22496
- constructor(hostRef) {
22497
- index.registerInstance(this, hostRef);
22498
- this.bulletEvent = index.createEvent(this, "lotteryBulletSelection", 7);
22499
- /**
22500
- * Value of the bullet
22501
- */
22502
- this.value = '0';
22503
- /**
22504
- * Marks if the bullet should be selectable
22505
- */
22506
- this.selectable = true;
22507
- /**
22508
- * Marks if the bullet should be selected
22509
- */
22510
- this.isSelected = false;
22511
- this.select = () => {
22512
- if (this.selectable) {
22513
- this.isSelected = !this.isSelected;
22514
- this.bulletEvent.emit({
22515
- value: this.value,
22516
- selected: this.isSelected
22517
- });
22518
- }
22519
- };
22520
- }
22521
- render() {
22522
- return (index.h("div", { class: 'Circle ' + (this.selectable ? '' : 'Disabled') + (this.isSelected ? 'Selected' : ''), onClick: () => this.select() }, this.value));
22523
- }
22524
- };
22525
- LotteryBullet.style = lotteryBulletCss;
22526
-
22527
- const DEFAULT_LANGUAGE$3 = 'en';
22528
- const SUPPORTED_LANGUAGES$3 = ['ro', 'en'];
22529
- const TRANSLATIONS$3 = {
22318
+ const DEFAULT_LANGUAGE = 'en';
22319
+ const SUPPORTED_LANGUAGES = ['ro', 'en'];
22320
+ const TRANSLATIONS = {
22530
22321
  en: {
22531
22322
  drawResultsHeader: 'Last draw results',
22532
22323
  drawId: 'Draw ID',
@@ -22550,9 +22341,9 @@ const TRANSLATIONS$3 = {
22550
22341
  numberOfDraws: 'Numarul de extrageri'
22551
22342
  },
22552
22343
  };
22553
- const translate$3 = (key, customLang) => {
22344
+ const translate = (key, customLang) => {
22554
22345
  const lang = customLang;
22555
- return TRANSLATIONS$3[lang !== undefined && SUPPORTED_LANGUAGES$3.includes(lang) ? lang : DEFAULT_LANGUAGE$3][key];
22346
+ return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
22556
22347
  };
22557
22348
 
22558
22349
  const lotteryDrawResultsCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.TicketInfo{display:flex;flex-direction:row;gap:15px;background-color:#009993;color:#fff;padding:12px;font-size:14px}.DrawResultsSection{max-width:500px;margin:0 auto;margin:0px auto 10px;border-radius:4px}.DrawResultsHeader{display:flex;justify-content:space-between;padding:10px 20px;background-color:#009993;color:#fff;font-size:14px}.DrawResultsHeader h4{text-transform:uppercase;font-weight:400;margin:0}.DrawMultipler label{display:block;margin:15px 0}.DrawResultsBody{padding:0 20px}.DrawResultsBody .DrawNumbersGrid{font-size:14px}.DrawResultsBody .NumberOfDrawsContainer{display:table;width:100%}.Toggle{cursor:pointer;display:inline-block}.ToggleSwitch{display:inline-block;background:#ccc;border-radius:16px;width:58px;height:24px;position:relative;vertical-align:middle;transition:background 0.25s}.ToggleSwitch:before,.ToggleSwitch:after{content:\"\"}.ToggleSwitch:before{display:block;background:linear-gradient(to bottom, #fff 0%, #eee 100%);border-radius:50%;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.25);width:16px;height:16px;position:absolute;top:4px;left:4px;transition:left 0.25s}.Toggle:hover .ToggleSwitch:before{background:linear-gradient(to bottom, #fff 0%, #fff 100%);box-shadow:0 0 0 1px rgba(0, 0, 0, 0.5)}.ToggleCheckbox:checked+.ToggleSwitch{background:#56c080}.ToggleCheckbox:checked+.ToggleSwitch:before{left:38px}.ToggleCheckbox{position:absolute;visibility:hidden}.Label{margin-right:5px;position:relative;top:2px}.DrawTicketsContainer{margin:30px auto}.ExpandableBoxes{position:relative}.ExpandableBox{width:100%;height:100%;max-height:100px;float:left;margin:0 0 20px 0;border:1px solid #009993;border-radius:4px;padding:10px;box-sizing:border-box;-webkit-transition:all 0.6s ease-in-out;-moz-transition:all 0.6s ease-in-out;-o-transition:all 0.6s ease-in-out;-ms-transition:all 0.6s ease-in-out;transition:all 0.6s ease-in-out;overflow:hidden}.ExpandableBox.ShowBox{max-height:400px;margin:0px 0px 20p 0px}.ExpandableBox.HideBox{width:0;height:0;overflow:hidden;border:none;padding:0;margin:0;opacity:0}";
@@ -22684,809 +22475,16 @@ const LotteryDrawResults = class {
22684
22475
  }
22685
22476
  else {
22686
22477
  return (index.h("section", { class: "DrawResultsSection" }, !this.drawMode ?
22687
- index.h("div", { class: "DrawResultsArea" }, index.h("div", { class: "TicketInfo" }, index.h("div", { class: "TicketGameName" }, translate$3('drawName', this.language), ": ", index.h("span", null, this.gameName)), index.h("div", { class: "TicketDate" }, "Ticket Purchase Date: ", index.h("span", null, (_a = this.ticketData) === null || _a === void 0 ? void 0 : _a.createdAt.slice(0, 10))), index.h("div", { class: "TicketStatus" }, "Status: ", index.h("span", null, (_b = this.ticketData) === null || _b === void 0 ? void 0 : _b.state))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "TicketIdContainer" }, index.h("p", null, "Ticket id: ", index.h("span", null, (_c = this.ticketData) === null || _c === void 0 ? void 0 : _c.id))), index.h("div", { class: "TicketAmountContainer" }, index.h("p", null, "Ticket amount: ", index.h("span", null, (_d = this.ticketData) === null || _d === void 0 ? void 0 : _d.amount))), index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate$3('drawNumbersGridTicket', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "maximum-allowed": this.rules.maximumAllowed, "total-numbers": this.rules.totalNumbers, "selected-numbers": this.selection, selectable: false, "display-selected": true, language: this.language }))), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", index.h("span", null, JSON.stringify((_e = this.ticketData) === null || _e === void 0 ? void 0 : _e.multiplier)))), index.h("div", { class: "NumberOfDrawsContainer" }, index.h("p", null, translate$3('numberOfDraws', this.language), ": ", (_f = this.ticketData) === null || _f === void 0 ? void 0 :
22688
- _f.drawCount), index.h("div", { class: "DrawTicketsContainer" }, this.drawResults.map((item, index$1) => index.h("div", { class: "ExpandableBoxes" }, index.h("div", { class: this.toggleDrawer[index$1] ? 'ExpandableBox ShowBox' : 'ExpandableBox', onClick: () => this.changeBox(index$1) }, index.h("div", { class: "TicketResultContainer" }, index.h("p", null, translate$3('ticketResult', this.language), ": ", item.status)), item.state == 'won' &&
22689
- index.h("div", { class: "AmountWonContainer" }, index.h("p", null, translate$3('amountWon', this.language), ": ", Number(item.amount).toLocaleString('en'), " ", item.currency)), index.h("div", { class: "DrawIdContainer" }, index.h("p", null, translate$3('drawId', this.language), ": ", item.drawId)), index.h("div", { class: "DrawDateContainer" }, index.h("p", null, translate$3('drawDate', this.language), ": ", item.updatedAt.slice(0, 10), " | ", item.updatedAt.slice(11, 19))), index.h("div", { class: "DrawNumbersGrid" }), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", item.multiplier)))))))))
22478
+ index.h("div", { class: "DrawResultsArea" }, index.h("div", { class: "TicketInfo" }, index.h("div", { class: "TicketGameName" }, translate('drawName', this.language), ": ", index.h("span", null, this.gameName)), index.h("div", { class: "TicketDate" }, "Ticket Purchase Date: ", index.h("span", null, (_a = this.ticketData) === null || _a === void 0 ? void 0 : _a.createdAt.slice(0, 10))), index.h("div", { class: "TicketStatus" }, "Status: ", index.h("span", null, (_b = this.ticketData) === null || _b === void 0 ? void 0 : _b.state))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "TicketIdContainer" }, index.h("p", null, "Ticket id: ", index.h("span", null, (_c = this.ticketData) === null || _c === void 0 ? void 0 : _c.id))), index.h("div", { class: "TicketAmountContainer" }, index.h("p", null, "Ticket amount: ", index.h("span", null, (_d = this.ticketData) === null || _d === void 0 ? void 0 : _d.amount))), index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate('drawNumbersGridTicket', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "maximum-allowed": this.rules.maximumAllowed, "total-numbers": this.rules.totalNumbers, "selected-numbers": this.selection, selectable: false, "display-selected": true, language: this.language }))), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", index.h("span", null, JSON.stringify((_e = this.ticketData) === null || _e === void 0 ? void 0 : _e.multiplier)))), index.h("div", { class: "NumberOfDrawsContainer" }, index.h("p", null, translate('numberOfDraws', this.language), ": ", (_f = this.ticketData) === null || _f === void 0 ? void 0 :
22479
+ _f.drawCount), index.h("div", { class: "DrawTicketsContainer" }, this.drawResults.map((item, index$1) => index.h("div", { class: "ExpandableBoxes" }, index.h("div", { class: this.toggleDrawer[index$1] ? 'ExpandableBox ShowBox' : 'ExpandableBox', onClick: () => this.changeBox(index$1) }, index.h("div", { class: "TicketResultContainer" }, index.h("p", null, translate('ticketResult', this.language), ": ", item.status)), item.state == 'won' &&
22480
+ index.h("div", { class: "AmountWonContainer" }, index.h("p", null, translate('amountWon', this.language), ": ", Number(item.amount).toLocaleString('en'), " ", item.currency)), index.h("div", { class: "DrawIdContainer" }, index.h("p", null, translate('drawId', this.language), ": ", item.drawId)), index.h("div", { class: "DrawDateContainer" }, index.h("p", null, translate('drawDate', this.language), ": ", item.updatedAt.slice(0, 10), " | ", item.updatedAt.slice(11, 19))), index.h("div", { class: "DrawNumbersGrid" }), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", item.multiplier)))))))))
22690
22481
  :
22691
22482
  index.h("div", { class: "DrawResultsArea" }, this.drawData &&
22692
- index.h("div", null, index.h("div", { class: "DrawResultsHeader" }, index.h("span", null, translate$3('drawId', this.language), ": ", this.drawData.id), index.h("span", null, translate$3('drawDate', this.language), ": ", this.drawData.date.slice(0, 10))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate$3('drawNumbersGridDraw', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "maximum-allowed": this.rules.maximumAllowed, "total-numbers": this.rules.totalNumbers, selectedNumbers: this.drawData.winningNumbers.join(','), "display-selected": true, selectable: false, language: this.language })), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", this.multiplier))))))));
22483
+ index.h("div", null, index.h("div", { class: "DrawResultsHeader" }, index.h("span", null, translate('drawId', this.language), ": ", this.drawData.id), index.h("span", null, translate('drawDate', this.language), ": ", this.drawData.date.slice(0, 10))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate('drawNumbersGridDraw', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "maximum-allowed": this.rules.maximumAllowed, "total-numbers": this.rules.totalNumbers, selectedNumbers: this.drawData.winningNumbers.join(','), "display-selected": true, selectable: false, language: this.language })), index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, "Multiplier: ", this.multiplier))))))));
22693
22484
  }
22694
22485
  }
22695
22486
  };
22696
22487
  LotteryDrawResults.style = lotteryDrawResultsCss;
22697
22488
 
22698
- const DEFAULT_LANGUAGE$2 = 'en';
22699
- const SUPPORTED_LANGUAGES$2 = ['ro', 'en'];
22700
- const TRANSLATIONS$2 = {
22701
- en: {
22702
- drawResultsHeader: 'Draw results history',
22703
- drawId: 'Draw ID',
22704
- drawDate: 'Draw Date',
22705
- drawNumbersGridA: 'Draw numbers Grid A',
22706
- viewAllResults: 'View All',
22707
- lastFiveDraws: 'Last 5 Draws',
22708
- lastTenDraws: 'Last 10 Draws',
22709
- lastFifteenDraws: 'Last 15 Draws'
22710
- },
22711
- ro: {
22712
- drawResultsHeader: 'Draw results history',
22713
- drawId: 'Draw ID',
22714
- drawDate: 'Draw Date',
22715
- drawNumbersGridA: 'Draw numbers Grid A',
22716
- viewAllResults: 'View All',
22717
- lastFiveDraws: 'Last 5 Draws',
22718
- lastTenDraws: 'Last 10 Draws',
22719
- lastFifteenDraws: 'Last 15 Draws'
22720
- },
22721
- };
22722
- const translate$2 = (key, customLang) => {
22723
- const lang = customLang;
22724
- return TRANSLATIONS$2[lang !== undefined && SUPPORTED_LANGUAGES$2.includes(lang) ? lang : DEFAULT_LANGUAGE$2][key];
22725
- };
22726
-
22727
- const lotteryDrawResultsHistoryCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GridBanner{background-color:#009993;background-repeat:no-repeat;background-position:center;color:#111;padding:0 20px 30px}.GridBanner .BannerButtonsWrapper{display:flex;justify-content:space-between;padding-top:16px}.GridBanner .BannerButtonsWrapper .BannerBackButton,.GridBanner .BannerButtonsWrapper .BannerLobbyButton{background:#fff;border:1px solid #009993;border-radius:4px;padding:7px 15px;font-size:12px;text-transform:uppercase;width:80px}.GridBanner .HistoryGridBannerArea{padding-top:30px}.HistoryGridBannerArea{display:flex;flex-direction:column;align-items:center}.BannerText{font-size:14px;font-weight:300}.BannerCountdown{font-size:22px;display:flex;gap:20px}.DrawResultsSection{max-width:500px;margin:0 auto}.HistoryGridWrapper{padding:0 15px}.HistoryGrid{border:1px solid #009993;border-radius:5px}.DrawResultsHeader{color:#009993;padding:15px;text-align:center}.DrawResultsHeader h4{text-transform:uppercase;font-size:16px;font-weight:600;margin:0}.DrawNumbersGrid{padding:10px 50px}.DrawNumbersGrid p{margin:0 0 10px 0;font-size:14px}.BulletContainer{margin-bottom:20px}.DrawResultTop{background-color:#009993;padding:10px;text-align:center;color:#fff;padding:0 50px;display:flex;justify-content:center;gap:40px}.ViewAllResults{display:block;padding:10px 40px;margin:40px auto;border:0;border-radius:5px;background-color:#009993;color:#fff;outline:none}.FilterSection{display:flex;justify-content:space-between;padding:10px 0 25px}.FilterSection .FilterResultsContainer{display:flex;gap:5px}.FilterSection .QuickFilterButton{cursor:pointer;width:max-content;border-radius:4px;border:1px solid #00958f;background:#FFF;color:#000;font-size:12px;transition:all 0.2s linear;text-align:center;letter-spacing:0}.FilterSection .QuickFilterButton:hover{background:#F1F1F1}.FilterSection helper-filters{margin-left:auto}";
22728
-
22729
- const LotteryDrawResultsHistory = class {
22730
- constructor(hostRef) {
22731
- index.registerInstance(this, hostRef);
22732
- /**
22733
- * The number of results to be displayed
22734
- */
22735
- this.numberOfResults = 3;
22736
- /**
22737
- *Language
22738
- */
22739
- this.language = 'en';
22740
- this.drawData = [];
22741
- this.displayAllDrawsResults = true;
22742
- this.showQuickFilters = true;
22743
- this.winningDataSetsData = [''];
22744
- this.getDrawsData = () => {
22745
- let url = new URL(`${this.endpoint}/games/${this.gameId}`);
22746
- fetch(url.href)
22747
- .then((res) => {
22748
- if (res.status >= 300) {
22749
- throw new Error('There was an error while fetching the data');
22750
- }
22751
- return res.json();
22752
- })
22753
- .then((data) => {
22754
- console.log("getDrawsData ", data);
22755
- // filter out incomplete data sets for draws
22756
- this.winningDataSetsData = data.draws.filter(draw => draw.winningNumbers);
22757
- this.drawData = this.winningDataSetsData;
22758
- console.log('this.drawData', this.drawData);
22759
- });
22760
- };
22761
- this.filterResults = (resultsNumber) => {
22762
- this.numberOfResults = resultsNumber;
22763
- this.displayAllDrawsResults = true;
22764
- };
22765
- this.getDrawResults = (drawID) => {
22766
- let url = new URL(`${this.endpoint}/games/${this.gameId}/draws/${drawID}`);
22767
- let drawOptions = {
22768
- method: "GET",
22769
- headers: {
22770
- 'Content-Type': "application/json",
22771
- 'Accept': 'application/json',
22772
- },
22773
- };
22774
- fetch(url.href, drawOptions)
22775
- .then((response) => {
22776
- return response.json();
22777
- })
22778
- .then((data) => {
22779
- console.log("getDrawResults ", data);
22780
- this.drawData = [data];
22781
- });
22782
- };
22783
- this.viewAllResults = () => {
22784
- this.numberOfResults = this.drawData.length;
22785
- this.displayAllDrawsResults = false;
22786
- window.scrollTo({ top: 0, behavior: 'smooth' });
22787
- };
22788
- }
22789
- // Filters events
22790
- filtersHandler(event) {
22791
- var _a;
22792
- this.getDrawResults((_a = event.detail) === null || _a === void 0 ? void 0 : _a.drawTicketId);
22793
- this.showQuickFilters = false;
22794
- }
22795
- clearFiltersHandler() {
22796
- this.drawData = this.winningDataSetsData;
22797
- this.showQuickFilters = true;
22798
- }
22799
- connectedCallback() {
22800
- this.getDrawsData();
22801
- }
22802
- disconnectedCallback() {
22803
- clearInterval(this.interval);
22804
- }
22805
- render() {
22806
- let gridHeader = index.h("div", { class: "DrawResultsHeader" }, this.displayAllDrawsResults ? index.h("h4", null, translate$2('drawResultsHeader', this.language)) :
22807
- index.h("div", { class: "DrawResultsHeaderContent" }, index.h("div", { class: "FilterSection" }, this.showQuickFilters &&
22808
- index.h("div", { class: "FilterResultsContainer" }, index.h("button", { class: "QuickFilterButton", onClick: () => this.filterResults(5) }, translate$2('lastFiveDraws', this.language)), index.h("button", { class: "QuickFilterButton", onClick: () => this.filterResults(10) }, translate$2('lastTenDraws', this.language)), index.h("button", { class: "QuickFilterButton", onClick: () => this.filterResults(15) }, translate$2('lastFifteenDraws', this.language))), index.h("helper-filters", { "show-filter-id": "true", "activate-ticket-search": "false", "game-id": "3797", "player-id": "2323" })), index.h("h4", null, "All draws results history")));
22809
- let gridContent = index.h("div", { class: "HistoryGridWrapper" }, index.h("div", { class: "HistoryGrid" }, this.drawData.map((item) => index.h("lottery-draw-results", { endpoint: this.endpoint, "game-id": this.gameId, "draw-id": item.id, "draw-mode": true })).reverse().slice(0, this.numberOfResults)));
22810
- return index.h("section", { class: "GridWrapper" }, index.h("div", { class: "DrawResultsSection" }, index.h("div", { class: "DrawResultsArea" }, gridHeader, gridContent, this.displayAllDrawsResults && index.h("button", { class: "ViewAllResults", onClick: this.viewAllResults }, "View All"))));
22811
- }
22812
- };
22813
- LotteryDrawResultsHistory.style = lotteryDrawResultsHistoryCss;
22814
-
22815
- const lotteryGameDetailsCss = ":host{display:block}";
22816
-
22817
- const LotteryGameDetails = class {
22818
- constructor(hostRef) {
22819
- index.registerInstance(this, hostRef);
22820
- }
22821
- render() {
22822
- return (index.h("div", null, index.h("helper-accordion", { "header-title": "Game Details", collapsed: false }, index.h("div", { slot: "accordionContent" }, index.h("helper-tabs", null)))));
22823
- }
22824
- };
22825
- LotteryGameDetails.style = lotteryGameDetailsCss;
22826
-
22827
- const DEFAULT_LANGUAGE$1 = 'en';
22828
- const SUPPORTED_LANGUAGES$1 = ['ro', 'en'];
22829
- const TRANSLATIONS$1 = {
22830
- en: {
22831
- error: 'Error',
22832
- title: 'Chrono',
22833
- backButton: 'Back',
22834
- lobbyButton: 'Lobby',
22835
- prize: 'Prize',
22836
- winUpTo: 'Win up to',
22837
- nextDraw: 'Next draw in: ',
22838
- buy: 'Buy tickets',
22839
- viewLatest: 'View latest results',
22840
- createTicket: 'Create Ticket',
22841
- modalSuccess: 'Purchase will be successfull soon!',
22842
- deleteTicketModalTitle: 'Delete Ticket',
22843
- deleteTicketModalText: 'Are you sure you want to delete this ticket?',
22844
- deleteTicketModalCancel: 'Cancel',
22845
- deleteTicketModalConfirm: 'Delete',
22846
- orderSummaryTitle: 'Order Summary',
22847
- orderSummaryTickets: 'Ticket',
22848
- orderSummaryTotal: 'Total',
22849
- orderSummarySubmit: 'Submit'
22850
- },
22851
- ro: {
22852
- error: 'Eroare',
22853
- title: 'Loto 6/49',
22854
- backButton: 'Inapoi',
22855
- lobbyButton: 'Lobby',
22856
- prize: 'MARELE JACKPOT OMG',
22857
- winUpTo: 'Castiga pana la',
22858
- nextDraw: 'In cat timp devii milionar daca cumperi acum!!!',
22859
- buy: 'Cumpara bilet',
22860
- viewLatest: 'Ultimile extrageri',
22861
- createTicket: 'Creeaza bilet',
22862
- modalSuccess: 'Achiziția va avea succes în curând!',
22863
- deleteTicketModalTitle: 'Sterge biletul',
22864
- deleteTicketModalText: 'Esti sigur ca vrei sa stergi acest bilet?',
22865
- deleteTicketModalCancel: 'Anuleaza',
22866
- deleteTicketModalConfirm: 'Sterge',
22867
- orderSummaryTitle: 'Rezumat comanda',
22868
- orderSummaryTickets: 'Bilet',
22869
- orderSummaryTotal: 'Total',
22870
- orderSummarySubmit: 'Trimite'
22871
- },
22872
- };
22873
- const translate$1 = (key, customLang) => {
22874
- const lang = customLang;
22875
- return TRANSLATIONS$1[lang !== undefined && SUPPORTED_LANGUAGES$1.includes(lang) ? lang : DEFAULT_LANGUAGE$1][key];
22876
- };
22877
-
22878
- const lotteryGamePageCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GamePage .GridBanner{background-color:#009993;background-repeat:no-repeat;background-position:center;color:#111;padding:0 20px 10px;height:220px;display:flex;flex-direction:column;justify-content:space-between}.GamePage .GridBanner .BannerButtonsWrapper{display:flex;justify-content:space-between;padding-top:16px}.GamePage .GridBanner .BannerButtonsWrapper .BannerBackButton,.GamePage .GridBanner .BannerButtonsWrapper .BannerLobbyButton{background:#fff;border:1px solid #D4D4D4;border-radius:4px;padding:7px 15px;font-size:12px;text-transform:uppercase;width:80px}.GamePage .GridBanner .GridBannerArea{padding-top:30px;display:flex;flex-direction:column;align-items:center}.GamePage .TotalWinnings{color:#00958f;font-size:18px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.GamePage .TotalWinnings span{font-size:22px;font-weight:700}.GamePage .NextDraw{color:#00958f;font-size:24px;font-weight:600;margin:0 auto;text-align:center;text-transform:capitalize;display:flex;justify-content:center;align-items:center;flex-direction:column}.GamePage .NextDraw .BannerText{font-weight:400;font-size:18px}.GamePage .NextDraw .BannerCountdown{font-size:22px;color:#00958f;display:flex;gap:20px}.GamePage .Tabs{display:flex;justify-content:center;gap:10px}.GamePage .Tabs .TabButton{border-radius:4px;cursor:pointer;padding:8px 0;width:50%;max-width:200px;border:1px solid #00958f;background:#F1F1F1;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0}.GamePage .Tabs .TabButton.Active{background:#00958f;color:#FFF}.NextDrawWrapper{padding:10px 15px;background:#fff}.NextDrawWrapper .BannerText{font-size:16px;font-weight:700;text-align:center}.NextDrawWrapper .BannerCountdown{font-size:22px;display:flex;gap:8px;color:#009993;font-weight:bolder;justify-content:center}.GamePageContent{padding:10px 15px;max-width:1200px;margin:0 auto}.GameDetails{padding-bottom:10px;margin-bottom:20px;border-bottom:1px solid #e9e9e9}.CreateNewTicket{background:#004D4A;height:100px;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.CreateNewTicket button{cursor:pointer;display:inline-block;border-radius:50%;width:40px;height:40px;margin:5px;border:1px solid #FFF;background:#FFF;color:#004D4A;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0}.CreateNewTicket button:hover{background:#F1F1F1}.CreateNewTicket span{display:inline-block;font-size:12px;text-align:center;margin:0 auto;color:#FFF}.OrderSummary{min-width:200px;border-radius:4px;display:flex;flex-direction:column;justify-content:center;margin-top:20px;background:#fff}.OrderSummary .OrderSummaryTitle{font-size:16px;color:#009993;text-transform:uppercase;text-align:center}.OrderSummary .Ticket{display:inline-block;color:#000;font-size:14px;height:50px;border-bottom:solid 1px #D4D4D4;line-height:50px}.OrderSummary .Ticket span{text-align:right}.OrderSummary .Total{display:inline-block;color:#000;font-size:14px;height:50px;line-height:50px}.OrderSummary .Total span{text-align:right}.ButtonWrapper{display:flex;align-items:center;justify-content:center}.ButtonWrapper .Button{cursor:pointer;border-radius:4px;padding:8px 60px;width:max-content;margin:5px;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0;background:#009993;border:1px solid #009993;color:#FFF}.ButtonWrapper .Button:hover{background:#00ABA4}.SubmitModalSuccess{text-align:center;font-size:18px;padding:20px}.DeleteTicketModalWrapper{padding:20px;text-align:center}.DeleteTicketModalWrapper .DeleteTicketModalTitle{font-size:16px;color:#00958f;font-weight:400;text-transform:uppercase;margin:20px 0 40px}.DeleteTicketModalWrapper .DeleteTicketModalText{font-size:14px;color:#000;line-height:22px;margin-bottom:40px}.DeleteTicketModalWrapper .DeleteTicketModalButtons{display:flex;gap:10px;justify-content:center}.DeleteTicketModalWrapper .DeleteTicketModalButtons .DeleteTicketModalConfirm{cursor:pointer;border-radius:4px;padding:8px 25px;width:max-content;margin:5px;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.DeleteTicketModalWrapper .DeleteTicketModalButtons .DeleteTicketModalConfirm:hover{background:#FF6536;border:1px solid #FF3D00}.DeleteTicketModalWrapper .DeleteTicketModalButtons .DeleteTicketModalCancel{cursor:pointer;width:max-content;border-radius:4px;padding:10px 25px;margin:5px;border:1px solid #00958f;background:#FFF;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0}.DeleteTicketModalWrapper .DeleteTicketModalButtons .DeleteTicketModalCancel:hover{background:#F1F1F1}@media (min-width: 1200px){.GamePageContent .TicketsWrapper{float:left;width:49%}.GamePageContent .GameDetails{float:right;width:49%}.GamePageContent .OrderSummary{float:right;width:49%}}";
22879
-
22880
- const LotteryGamePage = class {
22881
- constructor(hostRef) {
22882
- index.registerInstance(this, hostRef);
22883
- /**
22884
- * Language of the widget
22885
- */
22886
- this.language = 'en';
22887
- /**
22888
- * Shows the auto-pick button
22889
- */
22890
- this.autoPick = false;
22891
- /**
22892
- * Shows the reset button
22893
- */
22894
- this.resetButton = false;
22895
- this.tickets = [];
22896
- this.tabIndex = 0;
22897
- this.hasErrors = false;
22898
- this.totalAmount = 0;
22899
- this.successVisible = false;
22900
- this.deleteVisible = false;
22901
- this.latestDraw = {};
22902
- this.totalWinningsAmount = 0;
22903
- this.multiplier = false;
22904
- this.quickPick = false;
22905
- }
22906
- // @TODO fix `any` type later, I'm lazy now
22907
- connectedCallback() {
22908
- this.getGameDetails();
22909
- this.getDraws();
22910
- }
22911
- countdownLogic(date) {
22912
- this.interval = setInterval(() => {
22913
- this.daysRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60 * 60 * 24));
22914
- this.hoursRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60 * 60) - this.daysRemaining * 24);
22915
- this.minutesRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / (1000 * 60) - this.daysRemaining * 24 * 60 - this.hoursRemaining * 60);
22916
- this.secondsRemaining = Math.floor((Date.parse(date) - new Date().getTime()) / 1000 - this.daysRemaining * 24 * 60 * 60 - this.hoursRemaining * 60 * 60 - this.minutesRemaining * 60);
22917
- }, 1000);
22918
- }
22919
- disconnectedCallback() {
22920
- clearInterval(this.interval);
22921
- }
22922
- getGameDetails() {
22923
- let url = new URL(`${this.endpoint}/games/${this.gameId}`);
22924
- fetch(url.href)
22925
- .then((res) => {
22926
- if (res.status >= 300) {
22927
- this.hasErrors = true;
22928
- throw new Error('There was an error while fetching the data');
22929
- }
22930
- return res.json();
22931
- })
22932
- .then((data) => {
22933
- this.gameData = data;
22934
- this.basicStake = this.gameData.rules.stakes[0].amount;
22935
- let draws = this.gameData.draws.filter((item) => !item.winningNumbers);
22936
- console.log('draws', draws);
22937
- this.nextDraw = draws[0].id;
22938
- this.createNewTicket();
22939
- })
22940
- .catch((err) => {
22941
- this.hasErrors = true;
22942
- console.log('Error', err);
22943
- });
22944
- }
22945
- calculateTotalAmount() {
22946
- const { currency } = this.gameData.rules.stakes[0];
22947
- this.totalAmount = 0;
22948
- this.tickets.forEach((item) => {
22949
- if (item.completed) {
22950
- this.totalAmount += item.amount * item.stake;
22951
- }
22952
- });
22953
- this.currency = currency;
22954
- }
22955
- // @TODO CustomEvent type
22956
- gridFilledHandler(event) {
22957
- // @TODO item ts
22958
- this.tickets = this.tickets.map((item) => {
22959
- if (item.ticketId == event.detail.id) {
22960
- let arr = item.selectedNumbers || [];
22961
- arr[event.detail.index] = event.detail.selectedNumbers.map((item) => parseInt(item, 10));
22962
- return {
22963
- gameId: item.gameId,
22964
- ticketId: item.ticketId,
22965
- completed: true,
22966
- amount: event.detail.draws,
22967
- stake: item.stake,
22968
- selectedNumbers: arr
22969
- };
22970
- }
22971
- return item;
22972
- });
22973
- this.calculateTotalAmount();
22974
- }
22975
- // @TODO fix any type
22976
- gridDirtyHandler(event) {
22977
- // @TODO item ts
22978
- this.tickets = this.tickets.map((item) => {
22979
- if (item.gameId == event.detail.id) {
22980
- return {
22981
- gameId: item.gameId,
22982
- ticketId: item.ticketId,
22983
- completed: false,
22984
- amount: item.amount,
22985
- stake: item.stake,
22986
- grids: []
22987
- };
22988
- }
22989
- return item;
22990
- });
22991
- }
22992
- // @TODO CustomEvent type
22993
- deleteTicketHandler(event) {
22994
- this.deleteVisible = true;
22995
- this.deleteEventData = event;
22996
- }
22997
- modalCloseEvent() {
22998
- this.deleteVisible = false;
22999
- }
23000
- stakeChangeHandler(event) {
23001
- const { ticketId, stake } = event.detail;
23002
- this.tickets[ticketId - 1].stake = stake;
23003
- this.calculateTotalAmount();
23004
- }
23005
- multiplierChangeHandler(event) {
23006
- this.multiplier = event.detail;
23007
- }
23008
- getDraws() {
23009
- // append from query param with the current date value in order to get the next draw
23010
- let url = new URL(`${this.endpoint}/games/${this.gameId}/draws`);
23011
- let drawOptions = {
23012
- method: "GET",
23013
- headers: {
23014
- 'Content-Type': "application/json",
23015
- 'Accept': 'application/json',
23016
- },
23017
- };
23018
- fetch(url.href, drawOptions)
23019
- .then((response) => {
23020
- return response.json();
23021
- })
23022
- .then((data) => {
23023
- var _a;
23024
- let upcoming = data.items.filter((item) => {
23025
- if (Date.parse(item.date) > new Date().getTime()) {
23026
- return !item.winningNumbers;
23027
- }
23028
- });
23029
- let past = data.items.filter((item) => item.winningNumbers);
23030
- this.latestDraw = upcoming[0];
23031
- this.nextDate = this.latestDraw.date;
23032
- this.countdownLogic(this.nextDate);
23033
- this.lastDrawId = past[past.length - 1].id;
23034
- // calculate total winnings
23035
- // @TODO fix any type
23036
- (_a = this.latestDraw) === null || _a === void 0 ? void 0 : _a.prizes.forEach((element) => {
23037
- this.totalWinningsAmount += JSON.parse(element.amount);
23038
- });
23039
- });
23040
- }
23041
- ;
23042
- // @TODO fix any type
23043
- confirmDeleteTicketHandler(event) {
23044
- // @TODO fix any type
23045
- this.tickets = this.tickets.filter((item) => {
23046
- if (item.ticketId == event.detail.ticketId) {
23047
- return false;
23048
- }
23049
- return true;
23050
- });
23051
- this.calculateTotalAmount();
23052
- this.deleteVisible = false;
23053
- }
23054
- createNewTicket() {
23055
- this.tickets = [
23056
- ...this.tickets,
23057
- { gameId: this.gameId, ticketId: this.tickets.length + 1, completed: false, amount: 1, stake: this.basicStake, grids: [] }
23058
- ];
23059
- }
23060
- submitTickets() {
23061
- let url = new URL(`${this.endpoint}/tickets`);
23062
- // @TODO Body TS type
23063
- let body = {
23064
- gameId: this.gameId,
23065
- tickets: []
23066
- };
23067
- console.log('body', body);
23068
- this.tickets.forEach((item) => {
23069
- body.tickets.push({
23070
- startingDrawId: this.nextDraw,
23071
- amount: item.stake,
23072
- gameId: this.gameId,
23073
- currency: this.currency,
23074
- selection: item.selectedNumbers,
23075
- multiplier: this.multiplier,
23076
- drawCount: item.amount,
23077
- quickPick: this.quickPick,
23078
- });
23079
- });
23080
- // @TODO Options TS type
23081
- let options = {
23082
- method: 'POST',
23083
- headers: {
23084
- 'Content-Type': 'application/json',
23085
- 'Accept': 'application/json',
23086
- 'Authorization': `Bearer ${this.sessionId}`
23087
- },
23088
- body: JSON.stringify(body)
23089
- };
23090
- fetch(url.href, options)
23091
- .then((res) => {
23092
- if (res.status > 300) {
23093
- throw new Error('err');
23094
- }
23095
- return res.json();
23096
- })
23097
- .then((data) => {
23098
- console.log('data', data);
23099
- });
23100
- this.successVisible = true;
23101
- }
23102
- render() {
23103
- // const backgroundSrc = getAssetPath('./static/chrono_lottery_mobile.png');
23104
- // const backgroundDesktopSrc = getAssetPath('./static/chrono_desktop.png');
23105
- if (this.hasErrors) {
23106
- return (index.h("div", { class: "GamePage" }, index.h("div", { class: "Title" }, translate$1('error', this.language))));
23107
- }
23108
- return (
23109
- /* Game details */
23110
- index.h("div", { class: "GamePage" }, index.h("div", { class: "GridBanner" }, index.h("div", { class: "BannerButtonsWrapper" }, index.h("button", { class: "BannerBackButton" }, index.h("span", { class: "BannerBackButtonArrow" }, "\u1438 "), translate$1('backButton', this.language)), index.h("button", { class: "BannerLobbyButton" }, translate$1('lobbyButton', this.language))), index.h("div", { class: "Tabs" }, index.h("div", { class: 'TabButton' + (this.tabIndex == 0 ? ' Active' : ''), onClick: () => this.tabIndex = 0 }, translate$1('buy', this.language)), index.h("div", { class: 'TabButton' + (this.tabIndex == 1 ? ' Active' : ''), onClick: () => this.tabIndex = 1 }, translate$1('viewLatest', this.language)))), index.h("div", { class: "NextDrawWrapper" }, index.h("div", { class: "TotalWinnings" }, translate$1('winUpTo', this.language), ": ", index.h("span", null, "$", this.totalWinningsAmount.toLocaleString('en-US', { maximumFractionDigits: 2 }))), index.h("div", { class: "NextDraw" }, index.h("p", { class: "BannerText" }, translate$1('nextDraw', this.language)), index.h("div", { class: "BannerCountdown" }, index.h("span", { class: "CountdownDays" }, this.daysRemaining, "D"), index.h("span", { class: "CountdownHours" }, this.hoursRemaining, "H"), index.h("span", { class: "CountdownMinutes" }, this.minutesRemaining, "M"), index.h("span", { class: "CountdownSeconds" }, this.secondsRemaining, "S")))), this.tabIndex == 0 &&
23111
- index.h("div", { class: "GamePageContent" }, index.h("div", { class: "GameDetails" }, index.h("lottery-game-details", null)), index.h("div", { class: "TicketsWrapper" }, this.tickets.map((item) => index.h("lottery-ticket-controller", { endpoint: this.endpoint, "ticket-id": item.ticketId, "game-id": item.gameId, collapsed: false, last: true, language: this.language, "auto-pick": this.autoPick, "reset-button": this.resetButton })), index.h("div", { class: "CreateNewTicket" }, index.h("button", { onClick: () => this.createNewTicket() }, "+"), index.h("span", null, translate$1('createTicket', this.language)))), index.h("div", { class: "OrderSummary" }, index.h("h3", { class: "OrderSummaryTitle" }, translate$1('orderSummaryTitle', this.language)), index.h("div", { class: "Ticket" }, translate$1('orderSummaryTickets', this.language), ": ", index.h("span", null, this.tickets.length)), index.h("div", { class: "Total" }, translate$1('orderSummaryTotal', this.language), ": ", index.h("span", null, this.totalAmount, " ", this.currency)), index.h("div", { class: "ButtonWrapper" }, index.h("span", { class: "Button", onClick: () => this.submitTickets() }, translate$1('orderSummarySubmit', this.language))))), this.tabIndex == 1 &&
23112
- index.h("div", null, index.h("lottery-draw-results", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language, "draw-id": this.lastDrawId, "draw-mode": true }), index.h("lottery-draw-results-history", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language })), index.h("helper-modal", { "title-modal": "Success", visible: this.successVisible }, index.h("p", { class: "SubmitModalSuccess" }, translate$1('modalSuccess', this.language))), index.h("helper-modal", { "title-modal": "Delete Ticket", visible: this.deleteVisible }, index.h("div", { class: "DeleteTicketModalWrapper" }, index.h("h3", { class: "DeleteTicketModalTitle" }, translate$1('deleteTicketModalTitle', this.language)), index.h("p", { class: "DeleteTicketModalText" }, translate$1('deleteTicketModalText', this.language)), index.h("div", { class: "DeleteTicketModalButtons" }, index.h("button", { class: "DeleteTicketModalCancel", onClick: () => this.modalCloseEvent() }, translate$1('deleteTicketModalCancel', this.language)), index.h("button", { class: "DeleteTicketModalConfirm", onClick: () => this.confirmDeleteTicketHandler(this.deleteEventData) }, translate$1('deleteTicketModalConfirm', this.language)))))));
23113
- }
23114
- static get assetsDirs() { return ["static"]; }
23115
- get element() { return index.getElement(this); }
23116
- };
23117
- LotteryGamePage.style = lotteryGamePageCss;
23118
-
23119
- 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:350px}.Grid{margin-top:10px 0 10px 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px}";
23120
-
23121
- const LotteryGrid = class {
23122
- constructor(hostRef) {
23123
- index.registerInstance(this, hostRef);
23124
- this.gridFilledEvent = index.createEvent(this, "gridFilled", 7);
23125
- this.gridDirtyEvent = index.createEvent(this, "gridDirty", 7);
23126
- /**
23127
- * Number of bullets of grid
23128
- */
23129
- this.totalNumbers = 0;
23130
- /**
23131
- * Number of maximum bullets that can be selected
23132
- */
23133
- this.maximumAllowed = 0;
23134
- /**
23135
- * Minimum allowed of bullets
23136
- */
23137
- this.minimumAllowed = 1;
23138
- /**
23139
- * Allows the user to select numbers on the grid
23140
- */
23141
- this.selectable = true;
23142
- /**
23143
- * Numbers that should be showed as selected on the grid (as a string of those numbers e.g. '1,2,3,4,5,6')
23144
- */
23145
- this.selectedNumbers = '';
23146
- /**
23147
- * Show only selected numbers
23148
- */
23149
- this.displaySelected = false;
23150
- /**
23151
- * Language
23152
- */
23153
- this.language = 'en';
23154
- this.numbers = [];
23155
- this.selectedCounter = 0;
23156
- }
23157
- connectedCallback() {
23158
- let selected = [];
23159
- if (this.selectedNumbers.length > 0) {
23160
- selected = this.selectedNumbers.split(',');
23161
- this.selectedCounter = selected.length;
23162
- }
23163
- if (this.displaySelected) {
23164
- selected.forEach((item) => {
23165
- this.numbers.push({
23166
- number: item,
23167
- selected: true,
23168
- selectable: this.selectable
23169
- });
23170
- });
23171
- }
23172
- else {
23173
- [...Array(this.totalNumbers).keys()]
23174
- .map(number => (number + 1).toString())
23175
- .forEach((number) => {
23176
- this.numbers.push({
23177
- number,
23178
- selected: selected.indexOf(number) >= 0 ? true : false,
23179
- selectable: this.selectedCounter == this.maximumAllowed ? false : this.selectable
23180
- });
23181
- });
23182
- }
23183
- }
23184
- lotteryBulletSelectionHandler(event) {
23185
- this.numbers = this.numbers.map((item) => {
23186
- if (item.number == event.detail.value) {
23187
- return {
23188
- number: item.number,
23189
- selected: event.detail.selected,
23190
- selectable: item.selectable
23191
- };
23192
- }
23193
- return {
23194
- number: item.number,
23195
- selected: item.selected,
23196
- selectable: item.selectable
23197
- };
23198
- });
23199
- if (event.detail.selected) {
23200
- this.selectedCounter += 1;
23201
- if (this.selectedCounter == this.maximumAllowed) {
23202
- this.numbers = this.numbers.map((item) => {
23203
- return {
23204
- number: item.number,
23205
- selected: item.selected,
23206
- selectable: item.selected ? true : false
23207
- };
23208
- });
23209
- this.gridFilledEvent.emit({
23210
- id: this.ticketId,
23211
- index: this.gridIndex,
23212
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
23213
- });
23214
- }
23215
- }
23216
- else {
23217
- if (this.selectedCounter == this.maximumAllowed) {
23218
- this.numbers = this.numbers.map((item) => {
23219
- return {
23220
- number: item.number,
23221
- selected: item.selected,
23222
- selectable: true
23223
- };
23224
- });
23225
- this.gridDirtyEvent.emit({
23226
- id: this.ticketId,
23227
- index: this.gridIndex,
23228
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
23229
- });
23230
- }
23231
- this.selectedCounter -= 1;
23232
- }
23233
- }
23234
- async resetSelectionHandler(event) {
23235
- if (event.detail && event.detail == this.ticketId) {
23236
- this.selectedCounter = 0;
23237
- this.numbers = this.numbers.map((item) => {
23238
- return {
23239
- number: item.number,
23240
- selected: false,
23241
- selectable: this.selectable
23242
- };
23243
- });
23244
- this.gridDirtyEvent.emit({
23245
- id: this.ticketId,
23246
- index: this.gridIndex,
23247
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
23248
- });
23249
- }
23250
- }
23251
- async autoSelectionHandler(event) {
23252
- if (event.detail && event.detail == this.ticketId) {
23253
- this.resetSelectionHandler(event);
23254
- let array = [...Array(this.totalNumbers).keys()]
23255
- .map(number => number + 1)
23256
- .sort(() => 0.5 - Math.random());
23257
- array = array.slice(0, this.minimumAllowed);
23258
- this.numbers = this.numbers.map((item) => {
23259
- return {
23260
- number: item.number,
23261
- selected: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
23262
- selectable: array.indexOf(parseInt(item.number, 10)) >= 0 ? true : false,
23263
- };
23264
- });
23265
- this.gridFilledEvent.emit({
23266
- id: this.ticketId,
23267
- index: this.gridIndex,
23268
- selectedNumbers: this.numbers.filter((item) => item.selected).map((item) => item.number)
23269
- });
23270
- this.selectedCounter = this.maximumAllowed;
23271
- }
23272
- }
23273
- render() {
23274
- return (index.h("div", { class: "GridContainer" }, index.h("div", { class: "Grid" }, this.numbers.map((item) => index.h("div", null, index.h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected }))))));
23275
- }
23276
- };
23277
- LotteryGrid.style = lotteryGridCss;
23278
-
23279
- const DEFAULT_LANGUAGE = 'en';
23280
- const SUPPORTED_LANGUAGES = ['ro', 'en'];
23281
- const TRANSLATIONS = {
23282
- en: {
23283
- loading: 'Loading, please wait ...',
23284
- error: 'It was an error while trying to fetch the data',
23285
- grid: 'Grid',
23286
- multiplier: 'Multiplier',
23287
- numberOfDraws: 'Number of draws',
23288
- wagerPerDraw: 'Wager per draw',
23289
- resetButton: 'Reset',
23290
- autoButton: 'I feel lucky'
23291
- },
23292
- ro: {
23293
- loading: 'Se incarca, va rugam asteptati ...',
23294
- error: 'A fost o eroare in timp ce asteptam datele',
23295
- grid: 'Grid',
23296
- multiplier: 'Multiplicator',
23297
- numberOfDraws: 'Numarul de extrageri',
23298
- wagerPerDraw: 'Pariul per extragere',
23299
- resetButton: 'Reseteaza',
23300
- autoButton: 'Ma simt norocos'
23301
- },
23302
- };
23303
- const translate = (key, customLang) => {
23304
- const lang = customLang;
23305
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
23306
- };
23307
-
23308
- const lotteryTicketCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.Toggle{cursor:pointer;margin-top:20px;display:inline-block}.ToggleSwitch{display:inline-block;background:#707070;border-radius:16px;width:58px;height:24px;position:relative;vertical-align:middle;transition:background 0.25s}.ToggleSwitch:before,.ToggleSwitch:after{content:\"\"}.ToggleSwitch:before{display:block;background:linear-gradient(to bottom, #fff 0%, #F1F1F1 100%);border-radius:50%;box-shadow:0 0 0 1px rgba(0, 0, 0, 0.25);width:16px;height:16px;position:absolute;top:4px;left:4px;transition:left 0.25s}.Toggle:hover .ToggleSwitch:before{background:linear-gradient(to bottom, #fff 0%, #fff 100%);box-shadow:0 0 0 1px rgba(0, 0, 0, 0.5)}.ToggleCheckbox:checked+.ToggleSwitch{background:#00ABA4}.ToggleCheckbox:checked+.ToggleSwitch:before{left:38px}.ToggleCheckbox{position:absolute;visibility:hidden}.Label{margin-right:5px;position:relative;top:2px;font-size:14px;font-weight:lighter;color:#000}input[type=number]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.NumberInput,.WagerInput{margin-top:10px;display:inline-flex;align-items:center}.NumberInput,.NumberInput *{box-sizing:border-box}.NumberInput button{cursor:pointer;outline:none;-webkit-appearance:none;background-color:transparent;border:none;align-items:center;justify-content:center;height:20px;margin:0;position:relative}.NumberInput button:after{display:inline-block;position:absolute;transform:translate(-50%, -50%) rotate(180deg);width:30px;align-items:center;text-align:center}.NumberInput button.Plus:after{transform:translate(-50%, -50%) rotate(0deg);width:30px;display:inline-flex;align-items:center;text-align:center}.NumberInput input[type=number],.WagerInput input[type=number]{max-width:50px;display:inline-flex;align-items:center;padding:4px 10px;text-align:center}.NumberInput input[type=number] .WagerInputTitle,.WagerInput input[type=number] .WagerInputTitle{font-size:14px;color:#000;padding:10px}.InputDefault{background-color:#F1F1F1;border-radius:4px;padding:5px;border:solid 1px #D4D4D4;color:#707070}.AutoButton{cursor:pointer;display:block;border-radius:4px;padding:8px 25px;width:max-content;margin:5px 0;border:1px solid #00958f;background:#FFF;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0}.AutoButton:active{background:#00958f;color:#FFF}.ResetButton{cursor:pointer;display:block;border-radius:4px;padding:8px 25px;width:max-content;margin:5px 0;color:#000;font-size:12px;transition:all 0.2s linear;text-transform:uppercase;text-align:center;letter-spacing:0;background:#FF3D00;border:1px solid #FF3D00;color:#FFF}.ResetButton:hover{background:#FF6536;border:1px solid #FF3D00}.TicketGridBullets{background:#f1f1f1;border-radius:4px;padding:20px;margin-top:5px}.TicketGridBullets .TicketGridTitle{margin-top:0px}";
23309
-
23310
- const LotteryTicket = class {
23311
- constructor(hostRef) {
23312
- index.registerInstance(this, hostRef);
23313
- this.ticketCompleted = index.createEvent(this, "ticketCompleted", 7);
23314
- this.autoSelection = index.createEvent(this, "autoSelection", 7);
23315
- this.resetSelection = index.createEvent(this, "resetSelection", 7);
23316
- this.stakeChange = index.createEvent(this, "stakeChange", 7);
23317
- this.multiplierChange = index.createEvent(this, "multiplierChange", 7);
23318
- /**
23319
- * Number of grids of a ticket
23320
- */
23321
- this.numberOfGrids = 1;
23322
- /**
23323
- * Option to have the ticket registered for multiple draws
23324
- */
23325
- this.multipleDraws = true;
23326
- /**
23327
- * Shows the reset button
23328
- */
23329
- this.resetButton = false;
23330
- /**
23331
- * Shows the auto-pick button
23332
- */
23333
- this.autoPick = false;
23334
- /**
23335
- * Language
23336
- */
23337
- this.language = 'en';
23338
- this.multiplier = false;
23339
- this.numberOfDraws = 1;
23340
- this.isLoading = true;
23341
- this.hasErrors = false;
23342
- this.ticketDone = false;
23343
- }
23344
- connectedCallback() {
23345
- let url = new URL(`${this.endpoint}/games/${this.gameId}`);
23346
- fetch(url.href)
23347
- .then((response) => {
23348
- if (response.ok) {
23349
- return response.json();
23350
- }
23351
- else {
23352
- // Throw error
23353
- this.hasErrors = true;
23354
- }
23355
- })
23356
- .then((data) => {
23357
- this.isLoading = false;
23358
- this.gameData = data;
23359
- this.grids = [...Array(data.rules.boards.length).keys()];
23360
- })
23361
- .catch((err) => {
23362
- this.isLoading = false;
23363
- this.hasErrors = true;
23364
- console.error('Error!', err);
23365
- });
23366
- }
23367
- multiplierChangeHandler(e) {
23368
- this.multiplier = e.target ? e.target.checked : false;
23369
- this.multiplierChange.emit(this.multiplier);
23370
- }
23371
- drawsChangeHandler(event) {
23372
- this.ticket = Object.assign(Object.assign({}, this.ticket), { draws: event });
23373
- this.ticketCompleted.emit(this.ticket);
23374
- }
23375
- gridFilledHandler(event) {
23376
- this.ticket = Object.assign(Object.assign({}, event.detail), { draws: this.numberOfDraws });
23377
- this.ticketDone = true;
23378
- this.ticketCompleted.emit(this.ticket);
23379
- }
23380
- toggleAutoSelection() {
23381
- this.ticketDone = true;
23382
- this.autoSelection.emit(this.ticketId);
23383
- }
23384
- toggleResetSelection() {
23385
- this.ticketDone = false;
23386
- this.resetSelection.emit(this.ticketId);
23387
- }
23388
- changeStake(event) {
23389
- this.stakeChange.emit({
23390
- ticketId: this.ticketId,
23391
- stake: event.target.value
23392
- });
23393
- }
23394
- render() {
23395
- if (this.isLoading) {
23396
- return (index.h("div", null, index.h("p", null, translate('loading', this.language))));
23397
- }
23398
- else {
23399
- if (this.hasErrors) {
23400
- return (index.h("div", null, index.h("p", null, translate('error', this.language))));
23401
- }
23402
- else {
23403
- const { rules } = this.gameData;
23404
- return (index.h("div", { class: "TicketContainer" }, index.h("p", null, this.gameData.name), this.resetButton && this.ticketDone &&
23405
- index.h("a", { class: "ResetButton", onClick: () => this.toggleResetSelection() }, translate('resetButton', this.language)), this.autoPick && !this.ticketDone &&
23406
- index.h("a", { class: "AutoButton", onClick: () => this.toggleAutoSelection() }, translate('autoButton', this.language)), this.grids.map((item, index$1) => index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, translate('grid', this.language), " ", item), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": rules.boards[index$1].maximumAllowed, "minimum-allowed": rules.boards[index$1].minimumAllowed, "total-numbers": rules.boards[index$1].totalNumbers, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, language: this.language }))), rules.multiplier &&
23407
- index.h("div", null, index.h("label", { class: "Toggle" }, index.h("label", { class: "Label" }, translate('multiplier', this.language), ": "), index.h("input", { class: "ToggleCheckbox", type: "checkbox", onInput: (e) => this.multiplierChangeHandler(e) }), index.h("div", { class: "ToggleSwitch" }))), this.multipleDraws &&
23408
- index.h("div", { class: "TicketDraws" }, index.h("label", { class: "Label" }, translate('numberOfDraws', this.language), ": "), index.h("div", { class: "NumberInput" }, index.h("button", { onClick: () => this.numberOfDraws > 1 ? this.numberOfDraws-- : this.numberOfDraws = 1, class: "Minus" }, "-"), index.h("input", { class: "InputDefault", min: "1", value: this.numberOfDraws, type: "number" }), index.h("button", { onClick: () => this.numberOfDraws++, class: "Plus" }, "+"))), index.h("label", { class: "Label" }, translate('wagerPerDraw', this.language), ": "), index.h("div", { class: "WagerInput" }, rules.stakes.length > 1 ? index.h("div", null, index.h("select", { class: "InputDefault", onChange: (event) => this.changeStake(event) }, rules.stakes.map((item) => index.h("option", { value: item.amount }, item.amount, " ", item.currency)))) : index.h("div", null, index.h("input", { min: "1", value: rules.stakes[0].amount, type: "number", disabled: true }), index.h("p", { class: "WagerInputTitle" }, rules.stakes[0].currency)))));
23409
- }
23410
- }
23411
- }
23412
- static get watchers() { return {
23413
- "numberOfDraws": ["drawsChangeHandler"]
23414
- }; }
23415
- };
23416
- LotteryTicket.style = lotteryTicketCss;
23417
-
23418
- const lotteryTicketControllerCss = ":host{display:block}";
23419
-
23420
- const LotteryTicketController = class {
23421
- constructor(hostRef) {
23422
- index.registerInstance(this, hostRef);
23423
- this.deleteTicketEvent = index.createEvent(this, "deleteTicket", 7);
23424
- /**
23425
- * Endpoint URL for the source of data (NorWAy standard)
23426
- */
23427
- this.endpoint = '';
23428
- /**
23429
- * Ticket number
23430
- */
23431
- this.ticketId = 1;
23432
- /**
23433
- * Activates postMessages as events for actions from the widget
23434
- */
23435
- this.postMessage = false;
23436
- /**
23437
- * Name of the event emitter by the action button
23438
- */
23439
- this.eventName = 'deleteTicketAction';
23440
- /**
23441
- * Collapsed
23442
- */
23443
- this.collapsed = true;
23444
- /**
23445
- * Number of grids?
23446
- */
23447
- this.numberOfGrids = 1;
23448
- /**
23449
- * This toggles if the last ticket added should be expanded or not
23450
- */
23451
- this.last = false;
23452
- /**
23453
- * Language
23454
- */
23455
- this.language = 'en';
23456
- /**
23457
- * Shows the auto-pick button
23458
- */
23459
- this.autoPick = false;
23460
- /**
23461
- * Shows the reset button
23462
- */
23463
- this.resetButton = false;
23464
- }
23465
- // @TODO fix the `any` type
23466
- helperAccordionActionHandler() {
23467
- if (this.postMessage) {
23468
- window.postMessage({ type: this.eventName }, window.location.href);
23469
- }
23470
- this.deleteTicketEvent.emit({
23471
- ticketId: this.ticketId
23472
- });
23473
- }
23474
- render() {
23475
- return (index.h("div", null, index.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 }, index.h("div", { slot: "accordionContent" }, index.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 })))));
23476
- }
23477
- };
23478
- LotteryTicketController.style = lotteryTicketControllerCss;
23479
-
23480
- exports.helper_accordion = Accordion;
23481
22489
  exports.helper_filters = HelperFilters;
23482
- exports.helper_modal = HelperModal;
23483
- exports.helper_tab = HelperTab;
23484
- exports.helper_tabs = HelperTabs;
23485
- exports.lottery_bullet = LotteryBullet;
23486
22490
  exports.lottery_draw_results = LotteryDrawResults;
23487
- exports.lottery_draw_results_history = LotteryDrawResultsHistory;
23488
- exports.lottery_game_details = LotteryGameDetails;
23489
- exports.lottery_game_page = LotteryGamePage;
23490
- exports.lottery_grid = LotteryGrid;
23491
- exports.lottery_ticket = LotteryTicket;
23492
- exports.lottery_ticket_controller = LotteryTicketController;