@everymatrix/lottery-ticket-controller 1.44.0 → 1.45.2

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 (58) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/helper-accordion_5.cjs.entry.js +570 -697
  3. package/dist/cjs/index-2275f129.js +1304 -0
  4. package/dist/cjs/loader.cjs.js +7 -13
  5. package/dist/cjs/lottery-ticket-controller.cjs.js +17 -11
  6. package/dist/collection/collection-manifest.json +3 -3
  7. package/dist/collection/components/lottery-ticket-controller/index.js +1 -0
  8. package/dist/collection/components/lottery-ticket-controller/lottery-ticket-controller.css +1 -1
  9. package/dist/collection/components/lottery-ticket-controller/lottery-ticket-controller.js +371 -399
  10. package/dist/collection/utils/locale.utils.js +17 -17
  11. package/dist/collection/utils/utils.js +1 -1
  12. package/dist/esm/app-globals-0f993ce5.js +3 -0
  13. package/dist/esm/helper-accordion_5.entry.js +570 -697
  14. package/dist/esm/index-cf1a7f99.js +1277 -0
  15. package/dist/esm/loader.js +7 -13
  16. package/dist/esm/lottery-ticket-controller.js +14 -11
  17. package/dist/lottery-ticket-controller/lottery-ticket-controller.esm.js +1 -1
  18. package/dist/lottery-ticket-controller/p-5d5cd019.entry.js +1 -0
  19. package/dist/lottery-ticket-controller/p-e1255160.js +1 -0
  20. package/dist/lottery-ticket-controller/p-ee226061.js +2 -0
  21. package/dist/stencil.config.dev.js +17 -0
  22. package/dist/stencil.config.js +14 -19
  23. package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/lottery-ticket-controller/.stencil/packages/stencil/lottery-ticket-controller/stencil.config.d.ts +2 -0
  24. package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/lottery-ticket-controller/.stencil/packages/stencil/lottery-ticket-controller/stencil.config.dev.d.ts +2 -0
  25. package/dist/types/components/lottery-ticket-controller/index.d.ts +1 -0
  26. package/dist/types/components/lottery-ticket-controller/lottery-ticket-controller.d.ts +70 -70
  27. package/dist/types/components.d.ts +16 -1
  28. package/dist/types/stencil-public-runtime.d.ts +142 -33
  29. package/loader/cdn.js +1 -3
  30. package/loader/index.cjs.js +1 -3
  31. package/loader/index.d.ts +13 -1
  32. package/loader/index.es2017.js +1 -3
  33. package/loader/index.js +1 -3
  34. package/loader/package.json +1 -0
  35. package/package.json +10 -3
  36. package/dist/cjs/index-797fecd9.js +0 -1286
  37. package/dist/components/helper-accordion.js +0 -6
  38. package/dist/components/helper-accordion2.js +0 -158
  39. package/dist/components/index.d.ts +0 -26
  40. package/dist/components/index.js +0 -1
  41. package/dist/components/lottery-bullet.js +0 -6
  42. package/dist/components/lottery-bullet2.js +0 -91
  43. package/dist/components/lottery-grid.js +0 -6
  44. package/dist/components/lottery-grid2.js +0 -245
  45. package/dist/components/lottery-ticket-controller.d.ts +0 -11
  46. package/dist/components/lottery-ticket-controller.js +0 -185
  47. package/dist/components/lottery-ticket.js +0 -6
  48. package/dist/components/lottery-ticket2.js +0 -273
  49. package/dist/esm/index-c4bda097.js +0 -1260
  50. package/dist/esm/polyfills/core-js.js +0 -11
  51. package/dist/esm/polyfills/css-shim.js +0 -1
  52. package/dist/esm/polyfills/dom.js +0 -79
  53. package/dist/esm/polyfills/es5-html-element.js +0 -1
  54. package/dist/esm/polyfills/index.js +0 -34
  55. package/dist/esm/polyfills/system.js +0 -6
  56. package/dist/lottery-ticket-controller/p-1f81b6df.js +0 -1
  57. package/dist/lottery-ticket-controller/p-2577bcb1.entry.js +0 -1
  58. package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/lottery-ticket-controller/.stencil/packages/lottery-ticket-controller/stencil.config.d.ts +0 -2
@@ -1,185 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
- import { d as defineCustomElement$5 } from './helper-accordion2.js';
3
- import { d as defineCustomElement$4 } from './lottery-bullet2.js';
4
- import { d as defineCustomElement$3 } from './lottery-grid2.js';
5
- import { d as defineCustomElement$2 } from './lottery-ticket2.js';
6
-
7
- const DEFAULT_LANGUAGE = 'en';
8
- const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'ar', 'hr'];
9
- const TRANSLATIONS = {
10
- en: {
11
- ticket: 'Ticket',
12
- },
13
- ro: {
14
- ticket: 'Bilet',
15
- },
16
- fr: {
17
- ticket: 'Billet'
18
- },
19
- ar: {
20
- ticket: 'تذكرة',
21
- },
22
- hr: {
23
- ticket: 'Listić',
24
- }
25
- };
26
- const translate = (key, customLang) => {
27
- const lang = customLang;
28
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
29
- };
30
-
31
- const lotteryTicketControllerCss = ":host{font-family:\"Roboto\", system-ui, -apple-system, \"Segoe UI\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\";font-size:0.8rem}*,*::before,*::after{margin:0;padding:0;list-style:none;outline:none;box-sizing:border-box}input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.player-account-gaming-limits-popup-2{background:var(--emfe-w-color-black, #000000);color:var(--emfe-w-color-white, #000)}.Title{font-weight:800;font-size:18px}button{display:block;font-size:0.75rem;padding:12px 0;border:0;border-radius:2px;cursor:pointer}button.PrimaryButtonStyle{font-size:14px;color:#fff;background:#7ac317}button.SecondaryButtonStyle{border:1px solid #999;color:#666;background:#fff}.LinkButton{display:inline;padding:0;color:#3366CC;text-decoration:underline;background-color:rgba(0, 0, 0, 0)}.ResultIconWrapper{display:flex;flex-direction:column;align-items:center;margin:12px 0}.ResultIconWrapper svg{height:auto;width:60px;margin:12px}.ResultIconWrapper p{color:#666}.Overlay{position:absolute;top:0;left:0;width:100vw;height:100vh;background-color:rgba(0, 0, 0, 0.5);display:flex;justify-content:center;align-items:center}.ModalContainer{position:fixed;top:30vh;width:320px;height:auto;padding:18px 14px;background:#fff;border-radius:4px}.InitialWrapper{display:flex;flex-direction:column;gap:12px}.AdditionalInformation{margin:10px 0;font-size:14px}.TermsConditions{font-size:12px}.ExpandButton{font-size:14px;background-color:#fff;border:0;padding:0;margin-top:-10px;color:#999;display:flex;justify-content:center;align-items:center;cursor:pointer}.ExpandButton svg{width:28px;height:auto;margin-left:-4px}.LeftAlign{text-align:left;font-size:16px}.CenterAlign{text-align:center}.SetLimitSection{display:flex;flex-direction:column;gap:6px}.DepositTextSection{display:flex;justify-content:space-between}.DepositInputSection{height:32px;display:flex;gap:4px}.DepositInput{flex-grow:1;padding:0 6px}.SubmitDepositButton{flex-grow:1;font-size:0.75rem;padding:0}.SubmitDepositButton[disabled]{align-items:center;color:#ccc;cursor:not-allowed;background:#fff;border:#ccc 1px solid}.Hidden{display:none}.Extended{transform:rotate(180deg)}";
32
-
33
- const LotteryTicketController$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
34
- constructor() {
35
- super();
36
- this.__registerHost();
37
- this.__attachShadow();
38
- this.deleteTicketEvent = createEvent(this, "deleteTicket", 7);
39
- /**
40
- * Endpoint URL for the source of data (NorWAy standard)
41
- */
42
- this.endpoint = '';
43
- /**
44
- * Ticket number
45
- */
46
- this.ticketId = 1;
47
- /**
48
- * Activates postMessages as events for actions from the widget
49
- */
50
- this.postMessage = false;
51
- /**
52
- * Name of the event emitter by the action button
53
- */
54
- this.eventName = 'deleteTicketAction';
55
- /**
56
- * Collapsed
57
- */
58
- this.collapsed = true;
59
- /**
60
- * Number of grids?
61
- */
62
- this.numberOfGrids = 1;
63
- /**
64
- * This toggles if the last ticket added should be expanded or not
65
- */
66
- this.last = false;
67
- /**
68
- * Language
69
- */
70
- this.language = 'en';
71
- /**
72
- * Shows the auto-pick button
73
- */
74
- this.autoPick = false;
75
- /**
76
- * Shows the reset button
77
- */
78
- this.resetButton = false;
79
- /**
80
- * Number of ticket controllers
81
- */
82
- this.totalControllers = 1;
83
- /**
84
- * Client custom styling via string
85
- */
86
- this.clientStyling = '';
87
- /**
88
- * Client custom styling via url content
89
- */
90
- this.clientStylingUrlContent = '';
91
- this.limitStylingAppends = false;
92
- this.setClientStyling = () => {
93
- let sheet = document.createElement('style');
94
- sheet.innerHTML = this.clientStyling;
95
- this.stylingContainer.prepend(sheet);
96
- };
97
- this.setClientStylingURL = () => {
98
- let cssFile = document.createElement('style');
99
- setTimeout(() => {
100
- cssFile.innerHTML = this.clientStylingUrlContent;
101
- this.stylingContainer.prepend(cssFile);
102
- }, 1);
103
- };
104
- }
105
- // @TODO fix the `any` type
106
- helperAccordionActionHandler() {
107
- if (this.postMessage) {
108
- window.postMessage({ type: this.eventName }, window.location.href);
109
- }
110
- this.deleteTicketEvent.emit({
111
- ticketId: this.ticketId
112
- });
113
- }
114
- componentDidRender() {
115
- // start custom styling area
116
- if (!this.limitStylingAppends && this.stylingContainer) {
117
- if (this.clientStyling)
118
- this.setClientStyling();
119
- if (this.clientStylingUrlContent)
120
- this.setClientStylingURL();
121
- this.limitStylingAppends = true;
122
- }
123
- // end custom styling area
124
- }
125
- render() {
126
- console.log('ticket id:', this.ticketId);
127
- return (h("div", { class: "LotteryTicketControllerContainer", ref: el => this.stylingContainer = el }, h("helper-accordion", { "header-title": `${translate('ticket', this.language)} ${this.ticketId}`, "header-subtitle": this.ticketDescription, footer: true, "delete-tab": this.totalControllers !== 1, collapsed: !this.last || this.collapsed, language: this.language, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }, 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, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })))));
128
- }
129
- static get style() { return lotteryTicketControllerCss; }
130
- }, [1, "lottery-ticket-controller", {
131
- "endpoint": [513],
132
- "ticketId": [514, "ticket-id"],
133
- "ticketDescription": [513, "ticket-description"],
134
- "gameId": [513, "game-id"],
135
- "postMessage": [516, "post-message"],
136
- "eventName": [513, "event-name"],
137
- "collapsed": [516],
138
- "numberOfGrids": [514, "number-of-grids"],
139
- "last": [516],
140
- "language": [513],
141
- "autoPick": [516, "auto-pick"],
142
- "resetButton": [516, "reset-button"],
143
- "totalControllers": [514, "total-controllers"],
144
- "clientStyling": [513, "client-styling"],
145
- "clientStylingUrlContent": [513, "client-styling-url-content"],
146
- "limitStylingAppends": [32]
147
- }, [[0, "helperAccordionAction", "helperAccordionActionHandler"]]]);
148
- function defineCustomElement$1() {
149
- if (typeof customElements === "undefined") {
150
- return;
151
- }
152
- const components = ["lottery-ticket-controller", "helper-accordion", "lottery-bullet", "lottery-grid", "lottery-ticket"];
153
- components.forEach(tagName => { switch (tagName) {
154
- case "lottery-ticket-controller":
155
- if (!customElements.get(tagName)) {
156
- customElements.define(tagName, LotteryTicketController$1);
157
- }
158
- break;
159
- case "helper-accordion":
160
- if (!customElements.get(tagName)) {
161
- defineCustomElement$5();
162
- }
163
- break;
164
- case "lottery-bullet":
165
- if (!customElements.get(tagName)) {
166
- defineCustomElement$4();
167
- }
168
- break;
169
- case "lottery-grid":
170
- if (!customElements.get(tagName)) {
171
- defineCustomElement$3();
172
- }
173
- break;
174
- case "lottery-ticket":
175
- if (!customElements.get(tagName)) {
176
- defineCustomElement$2();
177
- }
178
- break;
179
- } });
180
- }
181
-
182
- const LotteryTicketController = LotteryTicketController$1;
183
- const defineCustomElement = defineCustomElement$1;
184
-
185
- export { LotteryTicketController, defineCustomElement };
@@ -1,6 +0,0 @@
1
- import { L as LotteryTicket$1, d as defineCustomElement$1 } from './lottery-ticket2.js';
2
-
3
- const LotteryTicket = LotteryTicket$1;
4
- const defineCustomElement = defineCustomElement$1;
5
-
6
- export { LotteryTicket, defineCustomElement };
@@ -1,273 +0,0 @@
1
- import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
2
- import { d as defineCustomElement$2 } from './lottery-bullet2.js';
3
- import { d as defineCustomElement$1 } from './lottery-grid2.js';
4
-
5
- const DEFAULT_LANGUAGE = 'en';
6
- const SUPPORTED_LANGUAGES = ['ro', 'en', 'hr'];
7
- const TRANSLATIONS = {
8
- en: {
9
- loading: 'Loading, please wait ...',
10
- error: 'It was an error while trying to fetch the data',
11
- grid: 'Grid',
12
- multiplier: 'Multiplier',
13
- numberOfDraws: 'Number of draws',
14
- wagerPerDraw: 'Wager per draw',
15
- resetButton: 'Reset',
16
- autoButton: 'I feel lucky'
17
- },
18
- ro: {
19
- loading: 'Se incarca, va rugam asteptati ...',
20
- error: 'A fost o eroare in timp ce asteptam datele',
21
- grid: 'Grid',
22
- multiplier: 'Multiplicator',
23
- numberOfDraws: 'Numarul de extrageri',
24
- wagerPerDraw: 'Pariul per extragere',
25
- resetButton: 'Reseteaza',
26
- autoButton: 'Ma simt norocos'
27
- },
28
- fr: {
29
- loading: 'Loading, please wait ...',
30
- error: 'It was an error while trying to fetch the data',
31
- grid: 'Grid',
32
- multiplier: 'Multiplier',
33
- numberOfDraws: 'Number of draws',
34
- wagerPerDraw: 'Wager per draw',
35
- resetButton: 'Reset',
36
- autoButton: 'I feel lucky'
37
- },
38
- ar: {
39
- loading: 'Loading, please wait ...',
40
- error: 'It was an error while trying to fetch the data',
41
- grid: 'Grid',
42
- multiplier: 'Multiplier',
43
- numberOfDraws: 'Number of draws',
44
- wagerPerDraw: 'Wager per draw',
45
- resetButton: 'Reset',
46
- autoButton: 'I feel lucky'
47
- },
48
- hr: {
49
- loading: 'Učitavanje, molimo pričekajte ...',
50
- error: 'Došlo je do pogreške prilikom pokušaja dohvaćanja podataka',
51
- grid: 'Tablica',
52
- multiplier: 'Multiplikator',
53
- numberOfDraws: 'Broj izvlačenja',
54
- wagerPerDraw: 'Ulog po izvlačenju',
55
- resetButton: 'Resetiraj',
56
- autoButton: 'Osjećam se sretno'
57
- }
58
- };
59
- const translate = (key, customLang) => {
60
- const lang = customLang;
61
- return TRANSLATIONS[lang !== undefined && SUPPORTED_LANGUAGES.includes(lang) ? lang : DEFAULT_LANGUAGE][key];
62
- };
63
-
64
- const lotteryTicketCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.TicketTitle{font-size:16px;font-weight:bold}.ButtonContainer{display:flex;justify-content:flex-end}.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;border:none;align-items:center;justify-content:center;height:20px;position:relative}.NumberInput button:after{display:inline-block;position:absolute;transform:translate(-50%, -50%) rotate(180deg);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:inline-block;border-radius:4px;padding:8px 20px;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:inline-block;border-radius:4px;padding:8px 20px;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}.Minus{border-radius:4px;width:30px;height:24px !important;margin-right:10px;color:#FFF;background:#009993}.Plus{border-radius:4px;width:30px;height:24px !important;margin-left:10px;color:#FFF;background:#009993}.SelectWrapper{width:auto;padding:5px;margin:0 auto;border:1px solid #ccc;border-radius:5px;position:relative}.SelectButton,.SelectOptions li{display:flex;align-items:center;cursor:pointer}.SelectButton{display:flex;padding:0 5px;border-radius:7px;align-items:center;justify-content:space-between;font-size:14px}.SelectButton span:first-child{padding-right:10px}.SelectExpand{transition:transform 0.3s linear;font-size:12px}.SelectActive .SelectExpand{transform:rotate(180deg)}.SelectContent{display:none;padding:5px;border-radius:7px}.SelectWrapper.SelectActive .SelectContent{width:100%;display:block;position:absolute;left:0;top:32px;padding:0;border:1px solid #ccc;overflow:hidden;background:#fff}.SelectContent .SelectOptions{max-height:100px;margin:0;overflow-y:auto;padding:0}.SelectContent .SelectOptions .SelectedValue{background-color:#009993;color:#fff}.SelectOptions::-webkit-scrollbar{width:7px}.SelectOptions::-webkit-scrollbar-track{background:#f1f1f1;border-radius:25px}.SelectOptions::-webkit-scrollbar-thumb{background:#ccc;border-radius:25px}.SelectOptions li{height:20px;padding:0 13px;font-size:14px}.SelectOptions li:hover{background:#f2f2f2}";
65
-
66
- const LotteryTicket = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
67
- constructor() {
68
- super();
69
- this.__registerHost();
70
- this.__attachShadow();
71
- this.ticketCompleted = createEvent(this, "ticketCompleted", 7);
72
- this.autoSelection = createEvent(this, "autoSelection", 7);
73
- this.resetSelection = createEvent(this, "resetSelection", 7);
74
- this.stakeChange = createEvent(this, "stakeChange", 7);
75
- this.multiplierChange = createEvent(this, "multiplierChange", 7);
76
- /**
77
- * Number of grids of a ticket
78
- */
79
- this.numberOfGrids = 1;
80
- /**
81
- * Option to have the ticket registered for multiple draws
82
- */
83
- this.multipleDraws = true;
84
- /**
85
- * Shows the reset button
86
- */
87
- this.resetButton = false;
88
- /**
89
- * Shows the auto-pick button
90
- */
91
- this.autoPick = false;
92
- /**
93
- * Language
94
- */
95
- this.language = 'en';
96
- /**
97
- * Client custom styling via string
98
- */
99
- this.clientStyling = '';
100
- /**
101
- * Client custom styling via url content
102
- */
103
- this.clientStylingUrlContent = '';
104
- this.multiplier = false;
105
- this.numberOfDraws = 1;
106
- this.isLoading = true;
107
- this.hasErrors = false;
108
- this.ticketDone = false;
109
- this.isCustomSelect = false;
110
- this.amountInfo = {};
111
- this.limitStylingAppends = false;
112
- this.setClientStyling = () => {
113
- let sheet = document.createElement('style');
114
- sheet.innerHTML = this.clientStyling;
115
- this.stylingContainer.prepend(sheet);
116
- };
117
- this.setClientStylingURL = () => {
118
- let cssFile = document.createElement('style');
119
- setTimeout(() => {
120
- cssFile.innerHTML = this.clientStylingUrlContent;
121
- this.stylingContainer.prepend(cssFile);
122
- }, 1);
123
- };
124
- }
125
- /**
126
- * @TODO find a better way to implement click outside the custom select, so that we don't have to use the 'data-cluster' attribute on each element
127
- */
128
- checkForClickOutside(ev) {
129
- if (ev.composedPath()[0].getAttribute('data-cluster') !== 'SelectComponent') {
130
- this.isCustomSelect = false;
131
- }
132
- }
133
- connectedCallback() {
134
- let url = new URL(`${this.endpoint}/games/${this.gameId}`);
135
- fetch(url.href)
136
- .then((response) => {
137
- if (response.ok) {
138
- return response.json();
139
- }
140
- else {
141
- // Throw error
142
- this.hasErrors = true;
143
- }
144
- })
145
- .then((data) => {
146
- this.isLoading = false;
147
- this.gameData = data;
148
- this.grids = [...Array(this.gameData.type.boards.length).keys()];
149
- this.amountInfo = this.gameData.type.stakes[0]; // initial value for select
150
- })
151
- .catch((err) => {
152
- this.isLoading = false;
153
- this.hasErrors = true;
154
- console.error('Error!', err);
155
- });
156
- }
157
- componentDidRender() {
158
- // start custom styling area
159
- if (!this.limitStylingAppends && this.stylingContainer) {
160
- if (this.clientStyling)
161
- this.setClientStyling();
162
- if (this.clientStylingUrlContent)
163
- this.setClientStylingURL();
164
- this.limitStylingAppends = true;
165
- }
166
- // end custom styling area
167
- }
168
- multiplierChangeHandler(e) {
169
- this.multiplier = e.target ? e.target.checked : false;
170
- this.multiplierChange.emit(this.multiplier);
171
- }
172
- drawsChangeHandler(event) {
173
- this.ticket = Object.assign(Object.assign({}, this.ticket), { draws: event });
174
- this.ticketCompleted.emit(this.ticket);
175
- }
176
- gridFilledHandler(event) {
177
- this.ticket = Object.assign(Object.assign({}, event.detail), { draws: this.numberOfDraws });
178
- this.ticketDone = true;
179
- this.ticketCompleted.emit(this.ticket);
180
- }
181
- toggleAutoSelection() {
182
- this.ticketDone = true;
183
- this.autoSelection.emit(this.ticketId);
184
- }
185
- toggleResetSelection() {
186
- this.ticketDone = false;
187
- this.resetSelection.emit(this.ticketId);
188
- }
189
- changeStake(ticketid, amount) {
190
- this.stakeChange.emit({
191
- ticketId: ticketid,
192
- stake: amount
193
- });
194
- }
195
- toggleClass() {
196
- this.isCustomSelect = !this.isCustomSelect;
197
- }
198
- setDropdownItem(item) {
199
- this.amountInfo = {
200
- value: item.value,
201
- currency: item.currency
202
- };
203
- this.isCustomSelect = false;
204
- this.changeStake(this.ticketId, item.amount);
205
- }
206
- render() {
207
- if (this.isLoading) {
208
- return (h("div", null, h("p", null, translate('loading', this.language))));
209
- }
210
- else {
211
- if (this.hasErrors) {
212
- return (h("div", null, h("p", null, translate('error', this.language))));
213
- }
214
- else {
215
- const { type } = this.gameData;
216
- return (h("div", { class: "TicketContainer", ref: el => this.stylingContainer = el }, h("p", { class: "TicketTitle" }, this.gameData.name), this.resetButton && this.ticketDone &&
217
- h("div", { class: "ButtonContainer" }, h("a", { class: "ResetButton", onClick: () => this.toggleResetSelection() }, translate('resetButton', this.language))), this.autoPick && !this.ticketDone &&
218
- h("div", { class: "ButtonContainer" }, h("a", { class: "AutoButton", onClick: () => this.toggleAutoSelection() }, translate('autoButton', this.language))), this.grids.map((_, index) => h("div", { class: "TicketGridBullets" }, h("p", { class: "TicketGridTitle" }, translate('grid', this.language), " ", index + 1), h("lottery-grid", { "grid-index": index, "maximum-allowed": type.boards[index].maximumAllowed, "minimum-allowed": type.boards[index].minimumAllowed, "total-numbers": type.boards[index].highNumber - type.boards[index].lowNumber + 1, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, language: this.language, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))), type.multiplier &&
219
- h("div", null, h("label", { class: "Toggle" }, h("label", { class: "Label" }, translate('multiplier', this.language), ": "), h("input", { class: "ToggleCheckbox", type: "checkbox", onInput: (e) => this.multiplierChangeHandler(e) }), h("div", { class: "ToggleSwitch" }))), this.multipleDraws &&
220
- h("div", { class: "TicketDraws" }, h("label", { class: "Label" }, translate('numberOfDraws', this.language), ": "), h("div", { class: "NumberInput" }, h("button", { onClick: () => this.numberOfDraws > 1 ? this.numberOfDraws-- : this.numberOfDraws = 1, class: "Minus" }, "-"), h("input", { class: "InputDefault", min: "1", value: this.numberOfDraws, type: "number" }), h("button", { onClick: () => this.numberOfDraws++, class: "Plus" }, "+"))), h("div", null, h("label", { class: "Label" }, translate('wagerPerDraw', this.language), ": "), h("div", { class: "WagerInput" }, type.stakes.length > 1 ?
221
- (h("div", { "data-cluster": "SelectComponent", class: this.isCustomSelect ? "SelectWrapper SelectActive" : "SelectWrapper" }, h("div", { "data-cluster": "SelectComponent", class: "SelectButton", onClick: () => this.toggleClass() }, h("span", { "data-cluster": "SelectComponent" }, this.amountInfo.value, " ", this.amountInfo.currency), h("span", { "data-cluster": "SelectComponent", class: "SelectExpand" }, "\u25BC")), h("div", { "data-cluster": "SelectComponent", class: "SelectContent" }, h("ul", { "data-cluster": "SelectComponent", class: "SelectOptions" }, type.stakes.map((item) => h("li", { "data-cluster": "SelectComponent", class: this.amountInfo.value == item.value ? 'SelectedValue' : '', value: item.value, onClick: () => this.setDropdownItem(item) }, item.value, " ", item.currency)))))) : (h("div", null, h("input", { min: "1", value: type.stakes[0].amount, type: "number", disabled: true }), h("p", { class: "WagerInputTitle" }, type.stakes[0].currency)))))));
222
- }
223
- }
224
- }
225
- static get watchers() { return {
226
- "numberOfDraws": ["drawsChangeHandler"]
227
- }; }
228
- static get style() { return lotteryTicketCss; }
229
- }, [1, "lottery-ticket", {
230
- "endpoint": [513],
231
- "gameId": [513, "game-id"],
232
- "numberOfGrids": [514, "number-of-grids"],
233
- "multipleDraws": [516, "multiple-draws"],
234
- "ticketId": [514, "ticket-id"],
235
- "resetButton": [516, "reset-button"],
236
- "autoPick": [516, "auto-pick"],
237
- "language": [513],
238
- "clientStyling": [513, "client-styling"],
239
- "clientStylingUrlContent": [513, "client-styling-url-content"],
240
- "multiplier": [32],
241
- "numberOfDraws": [32],
242
- "isLoading": [32],
243
- "hasErrors": [32],
244
- "ticketDone": [32],
245
- "isCustomSelect": [32],
246
- "amountInfo": [32],
247
- "limitStylingAppends": [32]
248
- }, [[8, "click", "checkForClickOutside"], [0, "gridFilled", "gridFilledHandler"]]]);
249
- function defineCustomElement() {
250
- if (typeof customElements === "undefined") {
251
- return;
252
- }
253
- const components = ["lottery-ticket", "lottery-bullet", "lottery-grid"];
254
- components.forEach(tagName => { switch (tagName) {
255
- case "lottery-ticket":
256
- if (!customElements.get(tagName)) {
257
- customElements.define(tagName, LotteryTicket);
258
- }
259
- break;
260
- case "lottery-bullet":
261
- if (!customElements.get(tagName)) {
262
- defineCustomElement$2();
263
- }
264
- break;
265
- case "lottery-grid":
266
- if (!customElements.get(tagName)) {
267
- defineCustomElement$1();
268
- }
269
- break;
270
- } });
271
- }
272
-
273
- export { LotteryTicket as L, defineCustomElement as d };