@everymatrix/lottery-game-page 1.76.12 → 1.76.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.
@@ -9710,40 +9710,47 @@ const LotteryBullet = class {
9710
9710
  });
9711
9711
  }
9712
9712
  };
9713
- this.setClientStyling = () => {
9714
- let sheet = document.createElement('style');
9715
- sheet.innerHTML = this.clientStyling;
9716
- this.stylingContainer.prepend(sheet);
9717
- };
9718
- this.setClientStylingURL = () => {
9719
- let cssFile = document.createElement('style');
9720
- setTimeout(() => {
9721
- cssFile.innerHTML = this.clientStylingUrlContent;
9722
- this.stylingContainer.prepend(cssFile);
9723
- }, 1);
9724
- };
9725
9713
  this.value = '0';
9726
9714
  this.selectable = true;
9727
9715
  this.isSelected = false;
9728
9716
  this.isBonus = false;
9729
9717
  this.clientStyling = '';
9730
- this.clientStylingUrlContent = '';
9731
- this.limitStylingAppends = false;
9718
+ this.clientStylingUrl = '';
9719
+ this.mbSource = undefined;
9732
9720
  }
9733
- componentDidRender() {
9734
- // start custom styling area
9735
- if (!this.limitStylingAppends && this.stylingContainer) {
9721
+ handleClientStylingChange(newValue, oldValue) {
9722
+ if (newValue != oldValue) {
9723
+ setClientStyling(this.stylingContainer, this.clientStyling);
9724
+ }
9725
+ }
9726
+ handleClientStylingUrlChange(newValue, oldValue) {
9727
+ if (newValue != oldValue) {
9728
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
9729
+ }
9730
+ }
9731
+ handleMbSourceChange(newValue, oldValue) {
9732
+ if (newValue != oldValue) {
9733
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9734
+ }
9735
+ }
9736
+ componentDidLoad() {
9737
+ if (this.stylingContainer) {
9738
+ if (this.mbSource)
9739
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9736
9740
  if (this.clientStyling)
9737
- this.setClientStyling();
9738
- if (this.clientStylingUrlContent)
9739
- this.setClientStylingURL();
9740
- this.limitStylingAppends = true;
9741
+ setClientStyling(this.stylingContainer, this.clientStyling);
9742
+ if (this.clientStylingUrl)
9743
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
9741
9744
  }
9742
- // end custom styling area
9743
9745
  }
9744
9746
  render() {
9745
- return (index.h("div", { key: 'a21cbee8f556bfbbe9f97be5f44bfc08b6f24dd6', class: 'Circle ' + (this.selectable ? '' : 'Disabled') + (this.isSelected ? 'Selected' : '') + (this.isBonus ? ' Bonus' : ''), onClick: () => this.select(), ref: el => this.stylingContainer = el }, this.value));
9747
+ return (index.h("div", { key: '2cfab600728d3aa72f9f87e4e07a968ea030e415', class: 'Circle ' + (this.selectable ? '' : 'Disabled') + (this.isSelected ? 'Selected' : '') + (this.isBonus ? ' Bonus' : ''), onClick: () => this.select(), ref: el => this.stylingContainer = el }, this.value));
9746
9748
  }
9749
+ static get watchers() { return {
9750
+ "clientStyling": ["handleClientStylingChange"],
9751
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
9752
+ "mbSource": ["handleMbSourceChange"]
9753
+ }; }
9747
9754
  };
9748
9755
  LotteryBullet.style = LotteryBulletStyle0;
9749
9756
 
@@ -9840,18 +9847,6 @@ const LotteryDrawResults = class {
9840
9847
  index.registerInstance(this, hostRef);
9841
9848
  this.ticketDrawDetails = [];
9842
9849
  this.ticketDrawDetailsFlag = true;
9843
- this.setClientStyling = () => {
9844
- let sheet = document.createElement('style');
9845
- sheet.innerHTML = this.clientStyling;
9846
- this.stylingContainer.prepend(sheet);
9847
- };
9848
- this.setClientStylingURL = () => {
9849
- let cssFile = document.createElement('style');
9850
- setTimeout(() => {
9851
- cssFile.innerHTML = this.clientStylingUrlContent;
9852
- this.stylingContainer.prepend(cssFile);
9853
- }, 1);
9854
- };
9855
9850
  this.displayPrizeCategory = (details, drawDetail) => {
9856
9851
  const prizeMap = new Map();
9857
9852
  details.forEach((detail) => {
@@ -9905,7 +9900,8 @@ const LotteryDrawResults = class {
9905
9900
  this.ticketNumbers = '';
9906
9901
  this.sessionId = '';
9907
9902
  this.clientStyling = '';
9908
- this.clientStylingUrlContent = '';
9903
+ this.clientStylingUrl = '';
9904
+ this.mbSource = undefined;
9909
9905
  this.ticketDrawData = '';
9910
9906
  this.historyDrawData = '';
9911
9907
  this.tabValue = '';
@@ -9918,10 +9914,24 @@ const LotteryDrawResults = class {
9918
9914
  this.ticketDataLoaded = false;
9919
9915
  this.ticketDraws = [];
9920
9916
  this.toggleDrawer = [false];
9921
- this.limitStylingAppends = false;
9922
9917
  this.drawData = undefined;
9923
9918
  this.resultMap = { Won: "Win", Lost: "Lose" };
9924
9919
  }
9920
+ handleClientStylingChange(newValue, oldValue) {
9921
+ if (newValue != oldValue) {
9922
+ setClientStyling(this.stylingContainer, this.clientStyling);
9923
+ }
9924
+ }
9925
+ handleClientStylingUrlChange(newValue, oldValue) {
9926
+ if (newValue != oldValue) {
9927
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
9928
+ }
9929
+ }
9930
+ handleMbSourceChange(newValue, oldValue) {
9931
+ if (newValue != oldValue) {
9932
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9933
+ }
9934
+ }
9925
9935
  componentWillLoad() {
9926
9936
  if (this.translationUrl) {
9927
9937
  getTranslations$6(JSON.parse(this.translationUrl));
@@ -9956,16 +9966,15 @@ const LotteryDrawResults = class {
9956
9966
  this.ticketDrawDetailsFlag = false;
9957
9967
  }
9958
9968
  }
9959
- componentDidRender() {
9960
- // start custom styling area
9961
- if (!this.limitStylingAppends && this.stylingContainer) {
9969
+ componentDidLoad() {
9970
+ if (this.stylingContainer) {
9971
+ if (this.mbSource)
9972
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
9962
9973
  if (this.clientStyling)
9963
- this.setClientStyling();
9964
- if (this.clientStylingUrlContent)
9965
- this.setClientStylingURL();
9966
- this.limitStylingAppends = true;
9974
+ setClientStyling(this.stylingContainer, this.clientStyling);
9975
+ if (this.clientStylingUrl)
9976
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
9967
9977
  }
9968
- // end custom styling area
9969
9978
  }
9970
9979
  getDrawData(drawId) {
9971
9980
  this.isLoading = true;
@@ -10024,11 +10033,11 @@ const LotteryDrawResults = class {
10024
10033
  else {
10025
10034
  return (index.h("section", { class: "DrawResultsSection", ref: el => this.stylingContainer = el }, this.drawMode ?
10026
10035
  index.h("div", { class: "DrawResultsArea" }, this.drawData &&
10027
- index.h("div", null, index.h("div", { class: "DrawResultsHeader" }, index.h("span", null, translate$6('drawId', this.language), ": ", this.drawData.id), index.h("span", null, translate$6('drawDate', this.language), ": ", format(new Date(this.drawData.date), 'dd/MM/yyyy'))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate$6('drawNumbersGridDraw', this.language)), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "selected-numbers": this.drawData.winningNumbers.length && this.drawData.winningNumbers[0]['numbers'].join(','), "secondary-numbers": this.drawData.winningNumbers.length ? this.drawData.winningNumbers[0]['secondaryNumbers'].join(',') : '', "display-selected": true, selectable: false, language: this.language, "grid-type": 'ticket', "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })), index.h("div", { class: "DrawPrizes" }, index.h("label", { class: "Label" }, translate$6('prize', this.language), " "), this.drawData.prizes.length ? index.h("div", null, " ", this.drawData.prizes.filter(item => item.division !== 'None').map((prize) => index.h("div", null, index.h("span", { style: { 'margin-right': '5px' } }, prize.division, ":"), index.h("span", { style: { 'margin-right': '4px' } }, " ", this.thousandSeperator(prize.amount.value)), index.h("span", null, prize.amount.currency)))) : index.h("div", null, "None"))))))
10036
+ index.h("div", null, index.h("div", { class: "DrawResultsHeader" }, index.h("span", null, translate$6('drawId', this.language), ": ", this.drawData.id), index.h("span", null, translate$6('drawDate', this.language), ": ", format(new Date(this.drawData.date), 'dd/MM/yyyy'))), index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "DrawNumbersGrid" }, index.h("p", null, translate$6('drawNumbersGridDraw', this.language)), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "selected-numbers": this.drawData.winningNumbers.length && this.drawData.winningNumbers[0]['numbers'].join(','), "secondary-numbers": this.drawData.winningNumbers.length ? this.drawData.winningNumbers[0]['secondaryNumbers'].join(',') : '', "display-selected": true, selectable: false, language: this.language, "grid-type": 'ticket', "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })), index.h("div", { class: "DrawPrizes" }, index.h("label", { class: "Label" }, translate$6('prize', this.language), " "), this.drawData.prizes.length ? index.h("div", null, " ", this.drawData.prizes.filter(item => item.division !== 'None').map((prize) => index.h("div", null, index.h("span", { style: { 'margin-right': '5px' } }, prize.division, ":"), index.h("span", { style: { 'margin-right': '4px' } }, " ", this.thousandSeperator(prize.amount.value)), index.h("span", null, prize.amount.currency)))) : index.h("div", null, "None"))))))
10028
10037
  :
10029
10038
  index.h("div", { class: "DrawResultsArea TicketDraws" }, index.h("div", { class: "DrawResultsBody" }, index.h("div", { class: "TicketIdContainer" }, index.h("label", { class: "Label" }, translate$6('ticketId', this.language), ": ", index.h("span", null, this.ticketId))), index.h("div", { class: "TicketTypeContainer" }, index.h("label", { class: "Label" }, translate$6('ticketType', this.language), ": ", index.h("span", null, this.ticketType))), index.h("div", { class: "TicketAmountContainer" }, index.h("label", { class: "Label" }, translate$6('ticketAmount', this.language), ": ", index.h("span", null, `${this.thousandSeperator(this.ticketAmount)} ${this.ticketCurrency}`))), index.h("div", { class: "DrawNumbersGrid" }, this.gridNumbers.map((grid, index$1) => {
10030
10039
  var _a;
10031
- return index.h("div", null, index.h("label", { class: "Label" }, translate$6('drawNumbersGridTicket', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "selected-numbers": grid.join(','), "secondary-numbers": (_a = this.gridSecondaryNumbers[index$1]) === null || _a === void 0 ? void 0 : _a.join(','), selectable: false, "display-selected": true, language: this.language, "translation-url": this.translationUrl, "grid-type": 'ticket', "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })));
10040
+ return index.h("div", null, index.h("label", { class: "Label" }, translate$6('drawNumbersGridTicket', this.language), ":"), index.h("div", { class: "BulletContainer" }, index.h("lottery-grid", { "selected-numbers": grid.join(','), "secondary-numbers": (_a = this.gridSecondaryNumbers[index$1]) === null || _a === void 0 ? void 0 : _a.join(','), selectable: false, "display-selected": true, language: this.language, "translation-url": this.translationUrl, "grid-type": 'ticket', "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })));
10032
10041
  })), this.ticketMultiplier &&
10033
10042
  index.h("div", { class: "DrawMultipler" }, index.h("label", { class: "Label" }, translate$6('multiplierNum', this.language), ": ", this.thousandSeperator(this.ticketMultiplierNum))), index.h("div", { class: "NumberOfDrawsContainer" }, index.h("label", { class: "Label" }, translate$6('numberOfDraws', this.language), ": ", this.thousandSeperator(this.ticketDrawCount)), index.h("div", { class: "DrawTicketsContainer" }, this.ticketDrawDetails && this.ticketDrawDetails.length > 0 &&
10034
10043
  index.h("div", { class: "ExpandableBoxes" }, this.ticketDrawDetails.map((drawDetail, index$1) => {
@@ -10038,11 +10047,16 @@ const LotteryDrawResults = class {
10038
10047
  index.h("div", { class: "DrawIdContainer" }, index.h("p", null, translate$6('drawId', this.language), ": ", drawDetail.drawId))), index.h("div", { class: "ExpandableBoxBody" }, index.h("div", { class: "DrawIdContainer" }, index.h("p", null, translate$6('drawId', this.language), ": ", drawDetail.drawId)), index.h("div", { class: "DrawDateContainer" }, index.h("p", null, translate$6('drawDate', this.language), ": ", (_a = drawDetail.drawData) === null || _a === void 0 ? void 0 :
10039
10048
  _a.date.slice(0, 10), " | ", (_b = drawDetail.drawData) === null || _b === void 0 ? void 0 :
10040
10049
  _b.date.slice(11, 19))), index.h("div", { class: "DrawNumbersGrid" }, drawDetail.drawData &&
10041
- index.h("div", { class: 'BulletContainer' }, index.h("label", { class: "Label" }, translate$6('drawNumbersGridDraw', this.language), ":"), index.h("lottery-grid", { "selected-numbers": ((_d = (_c = drawDetail.drawData) === null || _c === void 0 ? void 0 : _c.winningNumbers) === null || _d === void 0 ? void 0 : _d.length) && ((_e = drawDetail.drawData.winningNumbers[0]['numbers']) === null || _e === void 0 ? void 0 : _e.join(',')), "secondary-numbers": ((_g = (_f = drawDetail.drawData) === null || _f === void 0 ? void 0 : _f.winningNumbers) === null || _g === void 0 ? void 0 : _g.length) && ((_h = drawDetail.drawData.winningNumbers[0]['secondaryNumbers']) === null || _h === void 0 ? void 0 : _h.join(',')), selectable: false, "display-selected": true, language: this.language, "translation-url": this.translationUrl, "grid-type": 'ticket', "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))), drawDetail.details.length > 0 &&
10050
+ index.h("div", { class: 'BulletContainer' }, index.h("label", { class: "Label" }, translate$6('drawNumbersGridDraw', this.language), ":"), index.h("lottery-grid", { "selected-numbers": ((_d = (_c = drawDetail.drawData) === null || _c === void 0 ? void 0 : _c.winningNumbers) === null || _d === void 0 ? void 0 : _d.length) && ((_e = drawDetail.drawData.winningNumbers[0]['numbers']) === null || _e === void 0 ? void 0 : _e.join(',')), "secondary-numbers": ((_g = (_f = drawDetail.drawData) === null || _f === void 0 ? void 0 : _f.winningNumbers) === null || _g === void 0 ? void 0 : _g.length) && ((_h = drawDetail.drawData.winningNumbers[0]['secondaryNumbers']) === null || _h === void 0 ? void 0 : _h.join(',')), selectable: false, "display-selected": true, language: this.language, "translation-url": this.translationUrl, "grid-type": 'ticket', "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))), drawDetail.details.length > 0 &&
10042
10051
  index.h("div", { class: "DrawPrizes" }, index.h("label", { class: "Label" }, translate$6('prize', this.language), ":"), index.h("span", null, drawDetail.details.map((item) => index.h("span", null, index.h("div", null, index.h("span", null, item.prizeName, item.times > 1 ? ' x ' + item.times : '', ": "), index.h("span", { style: { 'margin-right': '4px' } }, this.thousandSeperator(item.amount)), index.h("span", null, item.currency))))))));
10043
10052
  }))))))));
10044
10053
  }
10045
10054
  }
10055
+ static get watchers() { return {
10056
+ "clientStyling": ["handleClientStylingChange"],
10057
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
10058
+ "mbSource": ["handleMbSourceChange"]
10059
+ }; }
10046
10060
  };
10047
10061
  LotteryDrawResults.style = LotteryDrawResultsStyle0;
10048
10062
 
@@ -10130,18 +10144,6 @@ const LotteryDrawResultsHistory = class {
10130
10144
  this.noResults = this.drawData.filter(draw => draw.winningNumbers).length == 0 ? true : false;
10131
10145
  });
10132
10146
  };
10133
- this.setClientStyling = () => {
10134
- let sheet = document.createElement('style');
10135
- sheet.innerHTML = this.clientStyling;
10136
- this.stylingContainer.prepend(sheet);
10137
- };
10138
- this.setClientStylingURL = () => {
10139
- let cssFile = document.createElement('style');
10140
- setTimeout(() => {
10141
- cssFile.innerHTML = this.clientStylingUrlContent;
10142
- this.stylingContainer.prepend(cssFile);
10143
- }, 1);
10144
- };
10145
10147
  this.transDataToString = (data) => {
10146
10148
  try {
10147
10149
  return JSON.stringify(data);
@@ -10154,7 +10156,8 @@ const LotteryDrawResultsHistory = class {
10154
10156
  this.gameId = undefined;
10155
10157
  this.language = 'en';
10156
10158
  this.clientStyling = '';
10157
- this.clientStylingUrlContent = '';
10159
+ this.clientStylingUrl = '';
10160
+ this.mbSource = undefined;
10158
10161
  this.translationUrl = undefined;
10159
10162
  this.drawData = [];
10160
10163
  this.winningDataSetsData = [''];
@@ -10162,7 +10165,6 @@ const LotteryDrawResultsHistory = class {
10162
10165
  this.dateFiltersTo = '';
10163
10166
  this.isLoading = false;
10164
10167
  this.noResults = false;
10165
- this.limitStylingAppends = false;
10166
10168
  this.activeIndex = 0;
10167
10169
  this.totalResults = 0;
10168
10170
  this.limit = 5;
@@ -10189,6 +10191,21 @@ const LotteryDrawResultsHistory = class {
10189
10191
  this.isReset = false;
10190
10192
  this.getDrawsData();
10191
10193
  }
10194
+ handleClientStylingChange(newValue, oldValue) {
10195
+ if (newValue != oldValue) {
10196
+ setClientStyling(this.stylingContainer, this.clientStyling);
10197
+ }
10198
+ }
10199
+ handleClientStylingUrlChange(newValue, oldValue) {
10200
+ if (newValue != oldValue) {
10201
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10202
+ }
10203
+ }
10204
+ handleMbSourceChange(newValue, oldValue) {
10205
+ if (newValue != oldValue) {
10206
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10207
+ }
10208
+ }
10192
10209
  connectedCallback() {
10193
10210
  this.getDrawsData();
10194
10211
  }
@@ -10197,25 +10214,29 @@ const LotteryDrawResultsHistory = class {
10197
10214
  getTranslations$5(JSON.parse(this.translationUrl));
10198
10215
  }
10199
10216
  }
10200
- disconnectedCallback() {
10201
- clearInterval(this.interval);
10202
- }
10203
- componentDidRender() {
10204
- // start custom styling area
10205
- if (!this.limitStylingAppends && this.stylingContainer) {
10217
+ componentDidLoad() {
10218
+ if (this.stylingContainer) {
10219
+ if (this.mbSource)
10220
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10206
10221
  if (this.clientStyling)
10207
- this.setClientStyling();
10208
- if (this.clientStylingUrlContent)
10209
- this.setClientStylingURL();
10210
- this.limitStylingAppends = true;
10222
+ setClientStyling(this.stylingContainer, this.clientStyling);
10223
+ if (this.clientStylingUrl)
10224
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10211
10225
  }
10212
- // end custom styling area
10226
+ }
10227
+ disconnectedCallback() {
10228
+ clearInterval(this.interval);
10213
10229
  }
10214
10230
  render() {
10215
- let gridHeader = index.h("div", { key: 'b8771d5092661ca5020d307ab0187311f8a60e56', class: "DrawResultsHeader" }, index.h("div", { key: 'dbe57fcd0959a88490c2ec6b92a5f828fb5abd55', class: "DrawResultsHeaderContent" }, index.h("h4", { key: 'bff47a0181c280a240cec2e3fde19381a2cf1609' }, translate$5('drawResultsHeader', this.language)), index.h("div", { key: '9c7d774d0d07be3e05f6528d000b158550e32a57', class: "FilterSection" }, index.h("helper-filters", { key: '7325eb71811951573d107ae4a1095c4ad66ce157', "activate-ticket-search": "false", "game-id": this.gameId, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))));
10216
- return index.h("section", { key: '52afb52ee81dab86d31a99498bddf955e3a7bf22', class: "GridWrapper", ref: el => this.stylingContainer = el }, index.h("div", { key: '2d84ed5d4d2c3fa426d245284f8c2dc36da20786', class: "DrawResultsSection" }, index.h("div", { key: 'c960bea0d2c9281fd288d47f983db8929cfa2fe4', class: "DrawResultsAreaHistory" }, gridHeader, index.h("div", { key: '4cf5407c17f5b4573f5d568679a49ee93677e884', class: "HistoryGridWrapper" }, index.h("div", { key: '6ca8e6d7f872b75591003de5c8d5f144ec283a08', class: "HistoryGrid" }, this.isLoading &&
10217
- index.h("p", { key: 'cc1ac748056d3bf79c0eb7853fed0fded00665b4' }, translate$5('loading', this.language)), !this.isLoading && !this.noResults && this.drawData.map((item) => index.h("lottery-draw-results", { endpoint: this.endpoint, "game-id": this.gameId, "draw-id": item.id, "draw-mode": true, language: this.language, "history-draw-data": this.transDataToString(item), "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })), !this.isLoading && this.noResults && (index.h("p", { key: 'afca3878b22cbf60503b80ad83aeb5ed4213f775', class: "errorText" }, translate$5('noResults', this.language))))), index.h("div", { key: '43ae21f99e95c46a41a7434afb29c4544698a4b6', class: "DrawHistoryPaginationWrapper" }, (this.totalResults > this.limit) && index.h("lottery-pagination", { key: '63594981436325b34aa0baf91f5477d83908b011', arrowsActive: true, numberedNavActive: true, "is-reset": this.isReset, "first-page": false, "prev-page": true, "next-page": true, offset: this.offset, limit: this.limit, total: this.totalResults, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })))));
10231
+ let gridHeader = index.h("div", { key: '77c5f0d587b90c5548f60e045803452e95b8377c', class: "DrawResultsHeader" }, index.h("div", { key: '4aecd3e65ca3b687ed5f32ddd050932edcd4716d', class: "DrawResultsHeaderContent" }, index.h("h4", { key: '373c5c9d7e2e91e0561ee5dbb56b6cc1f0531fbe' }, translate$5('drawResultsHeader', this.language)), index.h("div", { key: '443cb8d63aee0bba92b9ff288bd18336030550ec', class: "FilterSection" }, index.h("helper-filters", { key: '1ed26ba1a261288d2d1c10a14d786da2b6ee4d6b', "activate-ticket-search": "false", "game-id": this.gameId, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))));
10232
+ return index.h("section", { key: '1b2914b84b381721c9a96395f9629407e1444463', class: "GridWrapper", ref: el => this.stylingContainer = el }, index.h("div", { key: '98295c6cd09cd28719b738e16d6aee43be5426eb', class: "DrawResultsSection" }, index.h("div", { key: 'd29bcfe89ad920705c0551c2265e2b7a0a58d6b6', class: "DrawResultsAreaHistory" }, gridHeader, index.h("div", { key: '65b37fa0a70535b5de5f0fbecb3d221bbaa9cad6', class: "HistoryGridWrapper" }, index.h("div", { key: 'dec3e5dde880ecabaf8ccd624ac02de66f86ae82', class: "HistoryGrid" }, this.isLoading &&
10233
+ index.h("p", { key: '4597f37c985b6e63540a74c3b28541974cb8798d' }, translate$5('loading', this.language)), !this.isLoading && !this.noResults && this.drawData.map((item) => index.h("lottery-draw-results", { endpoint: this.endpoint, "game-id": this.gameId, "draw-id": item.id, "draw-mode": true, language: this.language, "history-draw-data": this.transDataToString(item), "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })), !this.isLoading && this.noResults && (index.h("p", { key: '1232ffaba11ae9ede882ce3421fb5087e04bdb87', class: "errorText" }, translate$5('noResults', this.language))))), index.h("div", { key: 'c1038f322eafd601df4066746f0f1eb605ade0b0', class: "DrawHistoryPaginationWrapper" }, (this.totalResults > this.limit) && index.h("lottery-pagination", { key: '496f30e9225389b7bc0c6d7784851a01e13ea3c8', arrowsActive: true, numberedNavActive: true, "is-reset": this.isReset, "first-page": false, "prev-page": true, "next-page": true, offset: this.offset, limit: this.limit, total: this.totalResults, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })))));
10218
10234
  }
10235
+ static get watchers() { return {
10236
+ "clientStyling": ["handleClientStylingChange"],
10237
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
10238
+ "mbSource": ["handleMbSourceChange"]
10239
+ }; }
10219
10240
  };
10220
10241
  LotteryDrawResultsHistory.style = LotteryDrawResultsHistoryStyle0;
10221
10242
 
@@ -10225,42 +10246,49 @@ const LotteryGameDetailsStyle0 = lotteryGameDetailsCss;
10225
10246
  const LotteryGameDetails = class {
10226
10247
  constructor(hostRef) {
10227
10248
  index.registerInstance(this, hostRef);
10228
- this.setClientStyling = () => {
10229
- let sheet = document.createElement('style');
10230
- sheet.innerHTML = this.clientStyling;
10231
- this.stylingContainer.prepend(sheet);
10232
- };
10233
- this.setClientStylingURL = () => {
10234
- let cssFile = document.createElement('style');
10235
- setTimeout(() => {
10236
- cssFile.innerHTML = this.clientStylingUrlContent;
10237
- this.stylingContainer.prepend(cssFile);
10238
- }, 1);
10239
- };
10240
10249
  this.clientStyling = '';
10241
- this.clientStylingUrlContent = '';
10250
+ this.clientStylingUrl = '';
10251
+ this.mbSource = undefined;
10242
10252
  this.lowNumber = undefined;
10243
10253
  this.highNumber = undefined;
10244
10254
  this.minimumAllowed = undefined;
10245
10255
  this.maxinumAllowed = undefined;
10246
10256
  this.language = 'en';
10247
10257
  this.translationUrl = undefined;
10248
- this.limitStylingAppends = false;
10249
10258
  }
10250
- componentDidRender() {
10251
- // start custom styling area
10252
- if (!this.limitStylingAppends && this.stylingContainer) {
10259
+ handleClientStylingChange(newValue, oldValue) {
10260
+ if (newValue != oldValue) {
10261
+ setClientStyling(this.stylingContainer, this.clientStyling);
10262
+ }
10263
+ }
10264
+ handleClientStylingUrlChange(newValue, oldValue) {
10265
+ if (newValue != oldValue) {
10266
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10267
+ }
10268
+ }
10269
+ handleMbSourceChange(newValue, oldValue) {
10270
+ if (newValue != oldValue) {
10271
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10272
+ }
10273
+ }
10274
+ componentDidLoad() {
10275
+ if (this.stylingContainer) {
10276
+ if (this.mbSource)
10277
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10253
10278
  if (this.clientStyling)
10254
- this.setClientStyling();
10255
- if (this.clientStylingUrlContent)
10256
- this.setClientStylingURL();
10257
- this.limitStylingAppends = true;
10279
+ setClientStyling(this.stylingContainer, this.clientStyling);
10280
+ if (this.clientStylingUrl)
10281
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10258
10282
  }
10259
- // end custom styling area
10260
10283
  }
10261
10284
  render() {
10262
- return (index.h("div", { key: 'bfc44a442056b452e331fc736f9c22e30dca143b', class: "GamePageDetailsContainer", ref: el => this.stylingContainer = el }, index.h("helper-accordion", { key: 'c8ad00900a8f16050a840c2e21fd4c2cebf2e1ec', "header-title": "Game Details", collapsed: false, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }, index.h("div", { key: 'cc8dc2dc148fb862f51a5c45b18c6c3e9fbb46f7', class: "AccordionContainer", slot: "accordionContent" }, index.h("helper-tabs", { key: 'b72ade93e6a2432276b24929be8865b2516ca44a', "low-number": this.lowNumber, "high-number": this.highNumber, "minimum-allowed": this.minimumAllowed, "maxinum-allowed": this.maxinumAllowed, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })))));
10285
+ return (index.h("div", { key: '0bb2683f87461804914d26c708499902d92dc503', class: "GamePageDetailsContainer", ref: el => this.stylingContainer = el }, index.h("helper-accordion", { key: '2ba23b953a9519ccb36fd203c3ac98a366673822', "header-title": "Game Details", collapsed: false, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, index.h("div", { key: '54c18e3a6fde25ff0953bb7b15b8a1200e237fd0', class: "AccordionContainer", slot: "accordionContent" }, index.h("helper-tabs", { key: '0cb93435825bf7a42636848ffd5ff67a30369cfa', "low-number": this.lowNumber, "high-number": this.highNumber, "minimum-allowed": this.minimumAllowed, "maxinum-allowed": this.maxinumAllowed, language: this.language, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })))));
10263
10286
  }
10287
+ static get watchers() { return {
10288
+ "clientStyling": ["handleClientStylingChange"],
10289
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
10290
+ "mbSource": ["handleMbSourceChange"]
10291
+ }; }
10264
10292
  };
10265
10293
  LotteryGameDetails.style = LotteryGameDetailsStyle0;
10266
10294
 
@@ -10419,25 +10447,6 @@ const LotteryGamePage = class {
10419
10447
  this.gameData = {};
10420
10448
  this.isMobile = isMobile$1(this.userAgent);
10421
10449
  this.secondarySelectionAllowed = false;
10422
- this.setClientStyling = () => {
10423
- let sheet = document.createElement('style');
10424
- sheet.innerHTML = this.clientStyling;
10425
- this.stylingContainer.prepend(sheet);
10426
- };
10427
- this.setClientStylingURL = () => {
10428
- let url = new URL(this.clientStylingurl);
10429
- let cssFile = document.createElement('style');
10430
- fetch(url.href)
10431
- .then((res) => res.text())
10432
- .then((data) => {
10433
- this.clientStylingUrlContent = data;
10434
- cssFile.innerHTML = data;
10435
- setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
10436
- })
10437
- .catch((err) => {
10438
- console.log('error ', err);
10439
- });
10440
- };
10441
10450
  this.thousandSeperator = (value) => {
10442
10451
  if (value === 0) {
10443
10452
  return '0';
@@ -10459,9 +10468,9 @@ const LotteryGamePage = class {
10459
10468
  this.language = 'en';
10460
10469
  this.backgroundUrl = undefined;
10461
10470
  this.clientStyling = '';
10462
- this.clientStylingurl = '';
10471
+ this.clientStylingUrl = '';
10472
+ this.mbSource = undefined;
10463
10473
  this.translationUrl = '';
10464
- this.clientStylingUrlContent = '';
10465
10474
  this.tickets = [];
10466
10475
  this.mainTickets = [];
10467
10476
  this.secondaryTickets = [];
@@ -10476,7 +10485,6 @@ const LotteryGamePage = class {
10476
10485
  this.nextDate = undefined;
10477
10486
  this.isLoggedIn = false;
10478
10487
  this.loginModalVisible = false;
10479
- this.limitStylingAppends = false;
10480
10488
  this.isLoading = false;
10481
10489
  this.showSubmitError = false;
10482
10490
  this.submitError = '';
@@ -10489,6 +10497,21 @@ const LotteryGamePage = class {
10489
10497
  this.subscriptionError = '';
10490
10498
  this.isSubscribed = false;
10491
10499
  }
10500
+ handleClientStylingChange(newValue, oldValue) {
10501
+ if (newValue != oldValue) {
10502
+ setClientStyling(this.stylingContainer, this.clientStyling);
10503
+ }
10504
+ }
10505
+ handleClientStylingUrlChange(newValue, oldValue) {
10506
+ if (newValue != oldValue) {
10507
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10508
+ }
10509
+ }
10510
+ handleMbSourceChange(newValue, oldValue) {
10511
+ if (newValue != oldValue) {
10512
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10513
+ }
10514
+ }
10492
10515
  handleNewTranslations() {
10493
10516
  this.isLoading = true;
10494
10517
  getTranslations$4(this.translationUrl).then(() => {
@@ -10514,16 +10537,16 @@ const LotteryGamePage = class {
10514
10537
  }
10515
10538
  return Promise.all(promises);
10516
10539
  }
10517
- componentDidRender() {
10518
- // start custom styling area
10519
- if (!this.limitStylingAppends && this.stylingContainer) {
10540
+ componentDidLoad() {
10541
+ console.log('Lottery Widget From LOCAL');
10542
+ if (this.stylingContainer) {
10543
+ if (this.mbSource)
10544
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10520
10545
  if (this.clientStyling)
10521
- this.setClientStyling();
10522
- if (this.clientStylingurl)
10523
- this.setClientStylingURL();
10524
- this.limitStylingAppends = true;
10546
+ setClientStyling(this.stylingContainer, this.clientStyling);
10547
+ if (this.clientStylingUrl)
10548
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10525
10549
  }
10526
- // end custom styling area
10527
10550
  }
10528
10551
  countdownLogic(date) {
10529
10552
  const setTime = () => {
@@ -10882,48 +10905,39 @@ const LotteryGamePage = class {
10882
10905
  return (
10883
10906
  /* Game details */
10884
10907
  index.h("div", { class: "GamePage", dir: this.language == 'ar' ? 'rtl' : 'ltr', ref: el => this.stylingContainer = el }, index.h("div", { class: "GridBanner", style: { 'background': `url(${this.backgroundUrl ? this.backgroundUrl : backgroundImagePath})`, 'background-size': 'contain', 'background-repeat': 'no-repeat', 'background-position': 'center' } }, index.h("div", { class: "BannerButtonsWrapper" }), index.h("div", { class: "Tabs" }, index.h("div", { class: 'TabButton' + (this.tabIndex == 0 ? ' Active' : ''), onClick: () => this.tabIndex = 0 }, translate$4('buy', this.language)), index.h("div", { class: 'TabButton' + (this.tabIndex == 1 ? ' Active' : ''), onClick: () => this.tabIndex = 1 }, translate$4('viewLatest', this.language)))), index.h("div", { class: "NextDrawWrapper" }, this.nextDate && index.h("div", { class: "NextDraw" }, index.h("p", { class: "BannerText" }, translate$4('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 &&
10885
- index.h("div", { class: "GamePageContent" }, index.h("div", { class: "GameDetails" }, index.h("lottery-game-details", { "low-number": (_b = (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.boards[0]) === null || _b === void 0 ? void 0 : _b.lowNumber, "high-number": (_d = (_c = this.gameData.rules) === null || _c === void 0 ? void 0 : _c.boards[0]) === null || _d === void 0 ? void 0 : _d.highNumber, "minimum-allowed": (_f = (_e = this.gameData.rules) === null || _e === void 0 ? void 0 : _e.boards[0]) === null || _f === void 0 ? void 0 : _f.minimumAllowed, "maxinum-allowed": (_h = (_g = this.gameData.rules) === null || _g === void 0 ? void 0 : _g.boards[0]) === null || _h === void 0 ? void 0 : _h.maxinumAllowed, language: this.language, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent, "translation-url": this.translationData })), index.h("div", { class: "TicketsWrapper" }, this.mainTickets.map((item) => {
10908
+ index.h("div", { class: "GamePageContent" }, index.h("div", { class: "GameDetails" }, index.h("lottery-game-details", { "low-number": (_b = (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.boards[0]) === null || _b === void 0 ? void 0 : _b.lowNumber, "high-number": (_d = (_c = this.gameData.rules) === null || _c === void 0 ? void 0 : _c.boards[0]) === null || _d === void 0 ? void 0 : _d.highNumber, "minimum-allowed": (_f = (_e = this.gameData.rules) === null || _e === void 0 ? void 0 : _e.boards[0]) === null || _f === void 0 ? void 0 : _f.minimumAllowed, "maxinum-allowed": (_h = (_g = this.gameData.rules) === null || _g === void 0 ? void 0 : _g.boards[0]) === null || _h === void 0 ? void 0 : _h.maxinumAllowed, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, "translation-url": this.translationData })), index.h("div", { class: "TicketsWrapper" }, this.mainTickets.map((item) => {
10886
10909
  var _a, _b;
10887
- return 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": (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.quickPickAvailable, "reset-button": (_b = this.gameData.rules) === null || _b === void 0 ? void 0 : _b.quickPickAvailable, "total-controllers": this.mainTickets.length, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent });
10910
+ return 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": (_a = this.gameData.rules) === null || _a === void 0 ? void 0 : _a.quickPickAvailable, "reset-button": (_b = this.gameData.rules) === null || _b === void 0 ? void 0 : _b.quickPickAvailable, "total-controllers": this.mainTickets.length, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource });
10888
10911
  })), index.h("div", { class: "OrderSummary" }, index.h("h3", { class: "OrderSummaryTitle" }, translate$4('orderSummaryTitle', this.language)), index.h("div", { class: "OrderTicketInfo" }, index.h("div", { class: "Ticket" }, translate$4('orderSummaryTickets', this.language), ": ", index.h("span", null, this.mainTickets.length)), index.h("div", null, index.h("span", null, this.thousandSeperator(((_k = (_j = this.mainTickets[0]) === null || _j === void 0 ? void 0 : _j.betType) === null || _k === void 0 ? void 0 : _k.combinations) * ((_l = this.mainTickets[0]) === null || _l === void 0 ? void 0 : _l.lineNum))), index.h("span", { class: "Multiplier" }, "x"), ((_m = this.gameData.rules) === null || _m === void 0 ? void 0 : _m.stakeMultiplierAvailable) &&
10889
10912
  index.h("span", null, index.h("span", null, ((_o = this.mainTickets[0]) === null || _o === void 0 ? void 0 : _o.multiplierNum) === 1 ? `${(_p = this.mainTickets[0]) === null || _p === void 0 ? void 0 : _p.multiplierNum} Multiplier` : `${(_q = this.mainTickets[0]) === null || _q === void 0 ? void 0 : _q.multiplierNum} Multipliers`), index.h("span", { class: "Multiplier" }, "x")), index.h("span", null, `${(_r = this.mainTickets[0]) === null || _r === void 0 ? void 0 : _r.stake} EUR`), ((_s = this.gameData.rules) === null || _s === void 0 ? void 0 : _s.drawMultiplierAvailable) &&
10890
10913
  index.h("span", null, index.h("span", { class: "Multiplier" }, "x"), index.h("span", null, ((_t = this.mainTickets[0]) === null || _t === void 0 ? void 0 : _t.drawCount) === 1 ? `${(_u = this.mainTickets[0]) === null || _u === void 0 ? void 0 : _u.drawCount} Draw` : `${(_v = this.mainTickets[0]) === null || _v === void 0 ? void 0 : _v.drawCount} Draws`)))), index.h("hr", null), index.h("div", { class: "Total" }, translate$4('orderSummaryTotal', this.language), ": ", index.h("span", null, this.thousandSeperator(this.totalAmount), " ", this.currency)), this.isSubscription &&
10891
- index.h("div", { class: "SubscriptionWrapper" }, index.h("lottery-subscription", { endpoint: this.endpoint, endpointSubscription: this.endpointSubscription, language: this.language, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent, gameName: this.gameData.name })), index.h("div", { class: "ButtonWrapper" }, this.isLoggedIn &&
10914
+ index.h("div", { class: "SubscriptionWrapper" }, index.h("lottery-subscription", { endpoint: this.endpoint, endpointSubscription: this.endpointSubscription, language: this.language, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource, gameName: this.gameData.name })), index.h("div", { class: "ButtonWrapper" }, this.isLoggedIn &&
10892
10915
  index.h("div", null, !this.isLoading &&
10893
10916
  index.h("div", { class: "submitWrap" }, index.h("div", { class: "Button", onClick: () => this.handleSubmitTickets() }, translate$4('orderSummarySubmit', this.language)), this.showSubmitError && index.h("div", { class: 'submitError' }, this.submitError), this.showApiError && index.h("div", { class: 'submitError' }, this.apiError), this.showSubscriptionError && index.h("div", { class: 'submitError' }, this.subscriptionError)), this.isLoading && index.h("span", { class: "Button", style: { "cursor": "default" } }, translate$4('loading', this.language))), !this.isLoggedIn &&
10894
- index.h("div", null, index.h("span", { class: "Button", onClick: () => this.showLoginModal() }, translate$4('orderSummarySubmit', this.language)), index.h("helper-modal", { "title-modal": "Success", visible: this.loginModalVisible, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }, index.h("p", { class: "SubmitModalSuccess" }, translate$4('modalLogin', this.language))))))), this.tabIndex == 1 &&
10895
- index.h("div", null, index.h("lottery-draw-results-history", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })), index.h("helper-modal", { "title-modal": "Success", visible: this.successVisible, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }, index.h("p", { class: "SubmitModalSuccess" }, translate$4('submitSuccess', this.language)))));
10917
+ index.h("div", null, index.h("span", { class: "Button", onClick: () => this.showLoginModal() }, translate$4('orderSummarySubmit', this.language)), index.h("helper-modal", { "title-modal": "Success", visible: this.loginModalVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, index.h("p", { class: "SubmitModalSuccess" }, translate$4('modalLogin', this.language))))))), this.tabIndex == 1 &&
10918
+ index.h("div", null, index.h("lottery-draw-results-history", { endpoint: this.endpoint, "game-id": this.gameId, language: this.language, "translation-url": this.translationData, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })), index.h("helper-modal", { "title-modal": "Success", visible: this.successVisible, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, index.h("p", { class: "SubmitModalSuccess" }, translate$4('submitSuccess', this.language)))));
10896
10919
  }
10897
10920
  static get assetsDirs() { return ["../static"]; }
10898
10921
  get element() { return index.getElement(this); }
10899
10922
  static get watchers() { return {
10923
+ "clientStyling": ["handleClientStylingChange"],
10924
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
10925
+ "mbSource": ["handleMbSourceChange"],
10900
10926
  "translationUrl": ["handleNewTranslations"]
10901
10927
  }; }
10902
10928
  };
10903
10929
  LotteryGamePage.style = LotteryGamePageStyle0;
10904
10930
 
10905
- const lotteryGridCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GridContainer{display:flex;flex-direction:column;max-width:1200px}.Grid{margin-top:10px 0 10px 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.Grid.TicketGrid{gap:5px}";
10906
- const LotteryGridStyle0 = lotteryGridCss;
10907
-
10908
- const LotteryGrid = class {
10909
- constructor(hostRef) {
10910
- index.registerInstance(this, hostRef);
10911
- this.gridFilledEvent = index.createEvent(this, "gridFilled", 7);
10912
- this.gridDirtyEvent = index.createEvent(this, "gridDirty", 7);
10913
- this.gridClearAllEvent = index.createEvent(this, "gridClearAllEvent", 7);
10914
- this.selectedCounter = 0;
10915
- this.setClientStyling = () => {
10916
- let sheet = document.createElement('style');
10917
- sheet.innerHTML = this.clientStyling;
10918
- this.stylingContainer.prepend(sheet);
10919
- };
10920
- this.setClientStylingURL = () => {
10921
- let cssFile = document.createElement('style');
10922
- setTimeout(() => {
10923
- cssFile.innerHTML = this.clientStylingUrlContent;
10924
- this.stylingContainer.prepend(cssFile);
10925
- }, 1);
10926
- };
10931
+ const lotteryGridCss = "@import url(\"https://fonts.googleapis.com/css2?family=Roboto:wght@100&display=swap\");:host{display:block;font-family:\"Roboto\", sans-serif}.GridContainer{display:flex;flex-direction:column;max-width:1200px}.Grid{margin-top:10px 0 10px 0;display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.Grid.TicketGrid{gap:5px}";
10932
+ const LotteryGridStyle0 = lotteryGridCss;
10933
+
10934
+ const LotteryGrid = class {
10935
+ constructor(hostRef) {
10936
+ index.registerInstance(this, hostRef);
10937
+ this.gridFilledEvent = index.createEvent(this, "gridFilled", 7);
10938
+ this.gridDirtyEvent = index.createEvent(this, "gridDirty", 7);
10939
+ this.gridClearAllEvent = index.createEvent(this, "gridClearAllEvent", 7);
10940
+ this.selectedCounter = 0;
10927
10941
  this.ticketId = undefined;
10928
10942
  this.totalNumbers = 0;
10929
10943
  this.gameId = undefined;
@@ -10938,14 +10952,39 @@ const LotteryGrid = class {
10938
10952
  this.gridIndex = undefined;
10939
10953
  this.gridType = '';
10940
10954
  this.clientStyling = '';
10941
- this.clientStylingUrlContent = '';
10955
+ this.clientStylingUrl = '';
10956
+ this.mbSource = undefined;
10942
10957
  this.highNumber = 47;
10943
10958
  this.lowNumber = 1;
10944
10959
  this.selectionType = 'mainSelection';
10945
10960
  this.partialQuickpickAvailable = false;
10946
10961
  this.numbers = [];
10947
10962
  this.bonusNumbers = [];
10948
- this.limitStylingAppends = false;
10963
+ }
10964
+ handleClientStylingChange(newValue, oldValue) {
10965
+ if (newValue != oldValue) {
10966
+ setClientStyling(this.stylingContainer, this.clientStyling);
10967
+ }
10968
+ }
10969
+ handleClientStylingUrlChange(newValue, oldValue) {
10970
+ if (newValue != oldValue) {
10971
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10972
+ }
10973
+ }
10974
+ handleMbSourceChange(newValue, oldValue) {
10975
+ if (newValue != oldValue) {
10976
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10977
+ }
10978
+ }
10979
+ componentDidLoad() {
10980
+ if (this.stylingContainer) {
10981
+ if (this.mbSource)
10982
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
10983
+ if (this.clientStyling)
10984
+ setClientStyling(this.stylingContainer, this.clientStyling);
10985
+ if (this.clientStylingUrl)
10986
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
10987
+ }
10949
10988
  }
10950
10989
  connectedCallback() {
10951
10990
  let selected = [];
@@ -10982,17 +11021,6 @@ const LotteryGrid = class {
10982
11021
  });
10983
11022
  }
10984
11023
  }
10985
- componentDidRender() {
10986
- // start custom styling area
10987
- if (!this.limitStylingAppends && this.stylingContainer) {
10988
- if (this.clientStyling)
10989
- this.setClientStyling();
10990
- if (this.clientStylingUrlContent)
10991
- this.setClientStylingURL();
10992
- this.limitStylingAppends = true;
10993
- }
10994
- // end custom styling area
10995
- }
10996
11024
  // wrote this because the classic .sort(() => 0.5 - Math.random()) method yielded low entropy shuffles for some reason on certain devices
10997
11025
  shuffleArray(array) {
10998
11026
  const result = [];
@@ -11118,8 +11146,13 @@ const LotteryGrid = class {
11118
11146
  }
11119
11147
  }
11120
11148
  render() {
11121
- return (index.h("div", { key: '8ad436904a126e6bee036c7372cf45c075022e5f', class: "GridContainer", ref: el => this.stylingContainer = el }, index.h("div", { key: '5a8818209485f0808a99978910f6f26473dd6f59', class: this.gridType === 'ticket' ? 'Grid TicketGrid' : 'Grid' }, this.numbers.map((item) => index.h("div", null, index.h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))), this.bonusNumbers.length ? this.bonusNumbers.map((item) => index.h("div", null, index.h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected, "is-bonus": true, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))) : '')));
11149
+ return (index.h("div", { key: 'f62b5b1e5a6cf7bcaa13ce2c8a281bc93fa439f7', class: "GridContainer", ref: el => this.stylingContainer = el }, index.h("div", { key: 'e381adbfff57e2cc343188c46037eb45ab798cac', class: this.gridType === 'ticket' ? 'Grid TicketGrid' : 'Grid' }, this.numbers.map((item) => index.h("div", null, index.h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))), this.bonusNumbers.length ? this.bonusNumbers.map((item) => index.h("div", null, index.h("lottery-bullet", { value: item.number, selectable: item.selectable, "is-selected": item.selected, "is-bonus": true, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))) : '')));
11122
11150
  }
11151
+ static get watchers() { return {
11152
+ "clientStyling": ["handleClientStylingChange"],
11153
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
11154
+ "mbSource": ["handleMbSourceChange"]
11155
+ }; }
11123
11156
  };
11124
11157
  LotteryGrid.style = LotteryGridStyle0;
11125
11158
 
@@ -11261,18 +11294,6 @@ const LotteryPagination = class {
11261
11294
  }
11262
11295
  }
11263
11296
  };
11264
- this.setClientStyling = () => {
11265
- let sheet = document.createElement('style');
11266
- sheet.innerHTML = this.clientStyling;
11267
- this.stylingContainer.prepend(sheet);
11268
- };
11269
- this.setClientStylingURL = () => {
11270
- let cssFile = document.createElement('style');
11271
- setTimeout(() => {
11272
- cssFile.innerHTML = this.clientStylingUrlContent;
11273
- this.stylingContainer.prepend(cssFile);
11274
- }, 1);
11275
- };
11276
11297
  this.nextPage = false;
11277
11298
  this.prevPage = false;
11278
11299
  this.offset = 0;
@@ -11280,7 +11301,8 @@ const LotteryPagination = class {
11280
11301
  this.total = 1;
11281
11302
  this.language = 'en';
11282
11303
  this.clientStyling = '';
11283
- this.clientStylingUrlContent = '';
11304
+ this.clientStylingUrl = '';
11305
+ this.mbSource = undefined;
11284
11306
  this.arrowsActive = undefined;
11285
11307
  this.secondaryArrowsActive = undefined;
11286
11308
  this.numberedNavActive = undefined;
@@ -11293,7 +11315,21 @@ const LotteryPagination = class {
11293
11315
  this.totalInt = undefined;
11294
11316
  this.pagesArray = [];
11295
11317
  this.endInt = 0;
11296
- this.limitStylingAppends = false;
11318
+ }
11319
+ handleClientStylingChange(newValue, oldValue) {
11320
+ if (newValue != oldValue) {
11321
+ setClientStyling(this.stylingContainer, this.clientStyling);
11322
+ }
11323
+ }
11324
+ handleClientStylingUrlChange(newValue, oldValue) {
11325
+ if (newValue != oldValue) {
11326
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11327
+ }
11328
+ }
11329
+ handleMbSourceChange(newValue, oldValue) {
11330
+ if (newValue != oldValue) {
11331
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11332
+ }
11297
11333
  }
11298
11334
  componentWillLoad() {
11299
11335
  if (this.translationUrl) {
@@ -11336,17 +11372,15 @@ const LotteryPagination = class {
11336
11372
  }
11337
11373
  }
11338
11374
  }
11339
- componentDidRender() {
11340
- this.isReset = false;
11341
- // start custom styling area
11342
- if (!this.limitStylingAppends && this.stylingContainer) {
11375
+ componentDidLoad() {
11376
+ if (this.stylingContainer) {
11377
+ if (this.mbSource)
11378
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11343
11379
  if (this.clientStyling)
11344
- this.setClientStyling();
11345
- if (this.clientStylingUrlContent)
11346
- this.setClientStylingURL();
11347
- this.limitStylingAppends = true;
11380
+ setClientStyling(this.stylingContainer, this.clientStyling);
11381
+ if (this.clientStylingUrl)
11382
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11348
11383
  }
11349
- // end custom styling area
11350
11384
  }
11351
11385
  render() {
11352
11386
  /**
@@ -11375,6 +11409,11 @@ const LotteryPagination = class {
11375
11409
  }
11376
11410
  return (index.h("div", { id: "PaginationContainer", ref: el => this.stylingContainer = el }, this.arrowsActive && buttonsLeftSide, this.numberedNavActive && navigationArea, this.arrowsActive && buttonsRightSide));
11377
11411
  }
11412
+ static get watchers() { return {
11413
+ "clientStyling": ["handleClientStylingChange"],
11414
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
11415
+ "mbSource": ["handleMbSourceChange"]
11416
+ }; }
11378
11417
  };
11379
11418
  LotteryPagination.style = LotteryPaginationStyle0;
11380
11419
 
@@ -11451,18 +11490,6 @@ const LotterySubscription = class {
11451
11490
  index.registerInstance(this, hostRef);
11452
11491
  this.subscriptionCompleted = index.createEvent(this, "subscriptionCompleted", 7);
11453
11492
  this.subscriptionCheckChange = index.createEvent(this, "subscriptionCheckChange", 7);
11454
- this.setClientStyling = () => {
11455
- let sheet = document.createElement('style');
11456
- sheet.innerHTML = this.clientStyling;
11457
- this.stylingContainer.prepend(sheet);
11458
- };
11459
- this.setClientStylingURL = () => {
11460
- let cssFile = document.createElement('style');
11461
- setTimeout(() => {
11462
- cssFile.innerHTML = this.clientStylingUrlContent;
11463
- this.stylingContainer.prepend(cssFile);
11464
- }, 1);
11465
- };
11466
11493
  this.changeDateParam = () => {
11467
11494
  if (this.filterData.from && !this.filterData.to) {
11468
11495
  let from = this.filterData.from;
@@ -11555,7 +11582,8 @@ const LotterySubscription = class {
11555
11582
  };
11556
11583
  this.translationUrl = undefined;
11557
11584
  this.clientStyling = '';
11558
- this.clientStylingUrlContent = '';
11585
+ this.clientStylingUrl = '';
11586
+ this.mbSource = undefined;
11559
11587
  this.endpoint = undefined;
11560
11588
  this.endpointTicket = undefined;
11561
11589
  this.endpointSubscription = undefined;
@@ -11575,7 +11603,6 @@ const LotterySubscription = class {
11575
11603
  this.endDateRule = undefined;
11576
11604
  this.gameNameRule = undefined;
11577
11605
  this.ruleType = '';
11578
- this.limitStylingAppends = false;
11579
11606
  }
11580
11607
  componentWillLoad() {
11581
11608
  if (this.translationUrl) {
@@ -11583,13 +11610,29 @@ const LotterySubscription = class {
11583
11610
  }
11584
11611
  this.getSubscriptionData();
11585
11612
  }
11586
- componentDidRender() {
11587
- if (!this.limitStylingAppends && this.stylingContainer) {
11613
+ handleClientStylingChange(newValue, oldValue) {
11614
+ if (newValue != oldValue) {
11615
+ setClientStyling(this.stylingContainer, this.clientStyling);
11616
+ }
11617
+ }
11618
+ handleClientStylingUrlChange(newValue, oldValue) {
11619
+ if (newValue != oldValue) {
11620
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11621
+ }
11622
+ }
11623
+ handleMbSourceChange(newValue, oldValue) {
11624
+ if (newValue != oldValue) {
11625
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11626
+ }
11627
+ }
11628
+ componentDidLoad() {
11629
+ if (this.stylingContainer) {
11630
+ if (this.mbSource)
11631
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11588
11632
  if (this.clientStyling)
11589
- this.setClientStyling();
11590
- if (this.clientStylingUrlContent)
11591
- this.setClientStylingURL();
11592
- this.limitStylingAppends = true;
11633
+ setClientStyling(this.stylingContainer, this.clientStyling);
11634
+ if (this.clientStylingUrl)
11635
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11593
11636
  }
11594
11637
  }
11595
11638
  transDate(from, to) {
@@ -11689,10 +11732,15 @@ const LotterySubscription = class {
11689
11732
  }
11690
11733
  }
11691
11734
  render() {
11692
- return (index.h("div", { key: '1bf289722935c5d2b574ba18f322830c81335585', class: "subscripitonContainer", ref: el => this.stylingContainer = el }, index.h("vaadin-checkbox", { key: '5f62fb61bccecd3632525ab0b28a41e45487c7ec', label: "Subscription", checked: this.isSubscribed, onChange: this.handleCheckboxchange.bind(this) }), this.isSubscribed &&
11693
- index.h("div", { key: 'd8e56e346ca8f275866738ab9c6d8eb14437d84a', class: "secondConditon" }, index.h("span", { key: '13c61d7582b1e0716395bd06c410a621b8af97d8', style: { 'margin-right': '8px' } }, "Occurrence: "), index.h("vaadin-select", { key: 'cf8d9c4176f66d2095798cae79b82b748e7ffb0b', items: this.frequenceList, value: this.frequenceState, "on-value-changed": this.handleSelectionChange.bind(this) }), this.frequenceState === 'Custom' &&
11694
- index.h("div", { key: 'c1496adac7e295830074da0b096bf4bbc0af8247', class: "thirdCondition" }, index.h("div", { key: '2aa4f92c84ab37edee56640ae0657f59e92c3719', class: "filterCalenderWrap" }, index.h("div", { key: '6665e3f2bd28650794eb174db6081ab4a9f514f0', class: "filterText" }, "Subscription Start Date*"), index.h("div", { key: '50a05e684bf068ab00d6d4298e65a6b94c44b79a', class: "filter" }, index.h("vaadin-date-picker", { value: this.filterData.from, key: "filterFromCalendar", max: this.filterData.to === undefined ? undefined : this.changeFormate(this.filterData.to), onChange: this.handleFilterFrom, placeholder: translate$2('filterFromCalendar', this.language), ref: el => this.setDateFormate(el), class: "VaadinDatePicker" }))), index.h("div", { key: '85c4bf037ad7bc9797f809aa7e71fcbfbc80c298', class: "filterCalenderWrap" }, index.h("div", { key: '87b446788202ae55ad698c8455c9a6d09a9d22d6', class: "filterText" }, "Subscription End Date"), index.h("div", { key: '5700c92b2f0c57959f84b5f7ac7a3488d1d0d096', class: "filter" }, index.h("vaadin-date-picker", { value: this.filterData.to, key: "filterToCalendar", min: this.filterData.from === undefined ? undefined : this.changeFormate(this.filterData.from), onChange: this.handleFilterTo, placeholder: translate$2('filterToCalendar', this.language), ref: el => this.setDateFormate(el), class: "VaadinDatePicker" })))))));
11735
+ return (index.h("div", { key: 'f301b99245d1950605dbdfac1f4bc06c60ea0c50', class: "subscripitonContainer", ref: el => this.stylingContainer = el }, index.h("vaadin-checkbox", { key: 'e9005320778ae1d66975e7825b5259fa2bca36d2', label: "Subscription", checked: this.isSubscribed, onChange: this.handleCheckboxchange.bind(this) }), this.isSubscribed &&
11736
+ index.h("div", { key: '9dc052565ef92bb4c00559766b933e4bf567c1a7', class: "secondConditon" }, index.h("span", { key: '4251cf447cb9c00b12109c1d930720f6465983be', style: { 'margin-right': '8px' } }, "Occurrence: "), index.h("vaadin-select", { key: '0eabde390ba1fcab6ec654bf567c38b1afd376c7', items: this.frequenceList, value: this.frequenceState, "on-value-changed": this.handleSelectionChange.bind(this) }), this.frequenceState === 'Custom' &&
11737
+ index.h("div", { key: '61ab68b026444a2c2f63f200b7eeeb84d615c00e', class: "thirdCondition" }, index.h("div", { key: '6b03192f386a3b864012c8c5374a454f367a95e3', class: "filterCalenderWrap" }, index.h("div", { key: 'ec7e479eaba4b50dcd41cb953b90dd97fe879dae', class: "filterText" }, "Subscription Start Date*"), index.h("div", { key: '796c81340a082f033a9461d7ef2e0116b962d1e6', class: "filter" }, index.h("vaadin-date-picker", { value: this.filterData.from, key: "filterFromCalendar", max: this.filterData.to === undefined ? undefined : this.changeFormate(this.filterData.to), onChange: this.handleFilterFrom, placeholder: translate$2('filterFromCalendar', this.language), ref: el => this.setDateFormate(el), class: "VaadinDatePicker" }))), index.h("div", { key: '7a8a64b82154802b65a848f73226e65904e6fe57', class: "filterCalenderWrap" }, index.h("div", { key: '396e291a86a3121f7a3fd7d1316271b8c36f6915', class: "filterText" }, "Subscription End Date"), index.h("div", { key: 'ecf9e2f2564c8bf336fcaef61d9ed46635f1bda0', class: "filter" }, index.h("vaadin-date-picker", { value: this.filterData.to, key: "filterToCalendar", min: this.filterData.from === undefined ? undefined : this.changeFormate(this.filterData.from), onChange: this.handleFilterTo, placeholder: translate$2('filterToCalendar', this.language), ref: el => this.setDateFormate(el), class: "VaadinDatePicker" })))))));
11695
11738
  }
11739
+ static get watchers() { return {
11740
+ "clientStyling": ["handleClientStylingChange"],
11741
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
11742
+ "mbSource": ["handleMbSourceChange"]
11743
+ }; }
11696
11744
  };
11697
11745
  LotterySubscription.style = LotterySubscriptionStyle0;
11698
11746
 
@@ -11786,18 +11834,6 @@ const LotteryTicket = class {
11786
11834
  this.drawMultiplierChange = index.createEvent(this, "drawMultiplierChange", 7);
11787
11835
  this.lineMultiplierChange = index.createEvent(this, "lineMultiplierChange", 7);
11788
11836
  this.betTypeChange = index.createEvent(this, "betTypeChange", 7);
11789
- this.setClientStyling = () => {
11790
- let sheet = document.createElement('style');
11791
- sheet.innerHTML = this.clientStyling;
11792
- this.stylingContainer.prepend(sheet);
11793
- };
11794
- this.setClientStylingURL = () => {
11795
- let cssFile = document.createElement('style');
11796
- setTimeout(() => {
11797
- cssFile.innerHTML = this.clientStylingUrlContent;
11798
- this.stylingContainer.prepend(cssFile);
11799
- }, 1);
11800
- };
11801
11837
  this.endpoint = undefined;
11802
11838
  this.gameId = undefined;
11803
11839
  this.numberOfGrids = 1;
@@ -11807,14 +11843,14 @@ const LotteryTicket = class {
11807
11843
  this.autoPick = false;
11808
11844
  this.language = 'en';
11809
11845
  this.clientStyling = '';
11810
- this.clientStylingUrlContent = '';
11846
+ this.clientStylingUrl = '';
11847
+ this.mbSource = undefined;
11811
11848
  this.translationUrl = undefined;
11812
11849
  this.isLoading = true;
11813
11850
  this.hasErrors = false;
11814
11851
  this.ticketDone = [];
11815
11852
  this.isCustomSelect = false;
11816
11853
  this.amountInfo = {};
11817
- this.limitStylingAppends = false;
11818
11854
  this.stakeMultiplier = '1';
11819
11855
  this.lineMultiplier = 0;
11820
11856
  this.isCustomSelectStake = false;
@@ -11873,6 +11909,21 @@ const LotteryTicket = class {
11873
11909
  betType: this.playType[0]
11874
11910
  });
11875
11911
  }
11912
+ handleClientStylingChange(newValue, oldValue) {
11913
+ if (newValue != oldValue) {
11914
+ setClientStyling(this.stylingContainer, this.clientStyling);
11915
+ }
11916
+ }
11917
+ handleClientStylingUrlChange(newValue, oldValue) {
11918
+ if (newValue != oldValue) {
11919
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11920
+ }
11921
+ }
11922
+ handleMbSourceChange(newValue, oldValue) {
11923
+ if (newValue != oldValue) {
11924
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11925
+ }
11926
+ }
11876
11927
  checkForClickOutside(ev) {
11877
11928
  if (this.selectRef && !this.selectRef.contains(ev.composedPath()[0])) {
11878
11929
  this.isCustomSelect = false;
@@ -11954,16 +12005,15 @@ const LotteryTicket = class {
11954
12005
  getTranslations$1(JSON.parse(this.translationUrl));
11955
12006
  }
11956
12007
  }
11957
- componentDidRender() {
11958
- // start custom styling area
11959
- if (!this.limitStylingAppends && this.stylingContainer) {
12008
+ componentDidLoad() {
12009
+ if (this.stylingContainer) {
12010
+ if (this.mbSource)
12011
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
11960
12012
  if (this.clientStyling)
11961
- this.setClientStyling();
11962
- if (this.clientStylingUrlContent)
11963
- this.setClientStylingURL();
11964
- this.limitStylingAppends = true;
12013
+ setClientStyling(this.stylingContainer, this.clientStyling);
12014
+ if (this.clientStylingUrl)
12015
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
11965
12016
  }
11966
- // end custom styling area
11967
12017
  }
11968
12018
  gridFilledHandler(event) {
11969
12019
  this.ticket = Object.assign(Object.assign({}, event.detail), { drawCount: this.drawMultiplier, multiplierNum: Number(this.stakeMultiplier), multiplier: this.gameData.rules.stakeMultiplierAvailable, quickPicks: this.quickPicks, betName: this.playType.length > 1 ? this.playType.find((item) => item.value === this.selectedPlayTypeId).label : this.groupType[this.tabIndex].groupName });
@@ -12092,8 +12142,8 @@ const LotteryTicket = class {
12092
12142
  index.h("div", null, index.h("label", { class: "Label" }, translate$1('playType', this.language), ": "), index.h("vaadin-select", { style: { 'width': '160px' }, items: this.playType, value: this.selectedPlayTypeId, "on-value-changed": (e) => this.handlePlayTypeChange(e.detail.value) })), this.boardsAllowed.length > 1 &&
12093
12143
  index.h("div", null, index.h("label", { class: "Label" }, translate$1('lines', this.language), ": "), index.h("div", { class: "WagerInput" }, index.h("div", { ref: el => this.selectLineRef = el, class: this.isCustomSelectLine ? "SelectWrapper SelectActive" : "SelectWrapper" }, index.h("div", { class: "SelectButton", onClick: () => this.toggleLineSelection() }, index.h("span", null, this.lineMultiplier), index.h("span", { class: "SelectExpand" }, "\u25BC")), index.h("div", { class: "SelectContent" }, index.h("ul", { class: "SelectOptions" }, this.boardsAllowed.map((item) => index.h("li", { class: this.lineMultiplier == item ? 'SelectedValue' : '', value: item, onClick: () => this.setLineMultiplier(item) }, item))))))), this.grids.map((_, index$1) => index.h("div", null, index.h("div", { class: "TicketGridHeader" }, index.h("div", null, translate$1('lineName', this.language), index$1 + 1), this.resetButton && this.ticketDone[index$1] &&
12094
12144
  index.h("div", { class: "ButtonContainer" }, index.h("a", { class: "ResetButton", onClick: () => this.toggleResetSelection(index$1) }, translate$1('resetButton', this.language))), this.autoPick && !this.ticketDone[index$1] &&
12095
- index.h("div", { class: "ButtonContainer" }, index.h("a", { class: "AutoButton", onClick: () => this.toggleAutoSelection(index$1) }, translate$1('autoButton', this.language)))), index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, rules.boards[0].selectionName), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": this.maximumAllowed, "minimum-allowed": this.minimumAllowed, "number-range": JSON.stringify(this.numberRange), "high-number": rules.boards[0].highNumber, "low-number": rules.boards[0].lowNumber, "total-numbers": rules.boards[0].highNumber - rules.boards[0].lowNumber + 1, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, "partial-quickpick-available": this.partialQuickpickAvailable, language: this.language, "translation-url": this.translationUrl, "selection-type": 'mainSelection', "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })), this.secondarySelectionAllowed &&
12096
- index.h("div", { class: "SecondarySelectionWrapper" }, index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, rules.boards[0].secondarySelectionName), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": this.secondaryMaximumAllowed, "minimum-allowed": this.secondaryMinimumAllowed, "number-range": JSON.stringify(this.secondaryNumberRange), "high-number": rules.boards[0].secondaryHighNumber, "low-number": rules.boards[0].secondaryLowNumber, "total-numbers": rules.boards[0].secondaryHighNumber - rules.boards[0].secondaryLowNumber + 1, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, "partial-quickpick-available": this.partialQuickpickAvailable, language: this.language, "translation-url": this.translationUrl, "selection-type": 'secondarySelection', "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }))))), rules.stakeMultiplierAvailable &&
12145
+ index.h("div", { class: "ButtonContainer" }, index.h("a", { class: "AutoButton", onClick: () => this.toggleAutoSelection(index$1) }, translate$1('autoButton', this.language)))), index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, rules.boards[0].selectionName), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": this.maximumAllowed, "minimum-allowed": this.minimumAllowed, "number-range": JSON.stringify(this.numberRange), "high-number": rules.boards[0].highNumber, "low-number": rules.boards[0].lowNumber, "total-numbers": rules.boards[0].highNumber - rules.boards[0].lowNumber + 1, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, "partial-quickpick-available": this.partialQuickpickAvailable, language: this.language, "translation-url": this.translationUrl, "selection-type": 'mainSelection', "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })), this.secondarySelectionAllowed &&
12146
+ index.h("div", { class: "SecondarySelectionWrapper" }, index.h("div", { class: "TicketGridBullets" }, index.h("p", { class: "TicketGridTitle" }, rules.boards[0].secondarySelectionName), index.h("lottery-grid", { "grid-index": index$1, "maximum-allowed": this.secondaryMaximumAllowed, "minimum-allowed": this.secondaryMinimumAllowed, "number-range": JSON.stringify(this.secondaryNumberRange), "high-number": rules.boards[0].secondaryHighNumber, "low-number": rules.boards[0].secondaryLowNumber, "total-numbers": rules.boards[0].secondaryHighNumber - rules.boards[0].secondaryLowNumber + 1, selectable: true, "reset-button": true, "auto-pick": true, "game-id": this.gameId, "ticket-id": this.ticketId, "partial-quickpick-available": this.partialQuickpickAvailable, language: this.language, "translation-url": this.translationUrl, "selection-type": 'secondarySelection', "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }))))), rules.stakeMultiplierAvailable &&
12097
12147
  index.h("div", null, index.h("label", { class: "Label" }, translate$1('multiplier', this.language), ": "), index.h("div", { class: "WagerInput" }, rules.stakeMultipliers.length > 1 ?
12098
12148
  (index.h("div", { ref: el => this.selectStakeRef = el, class: this.isCustomSelectStake ? "SelectWrapper SelectActive" : "SelectWrapper" }, index.h("div", { class: "SelectButton", onClick: () => this.toggleSelection() }, index.h("span", null, this.stakeMultiplier), index.h("span", { class: "SelectExpand" }, "\u25BC")), index.h("div", { class: "SelectContent" }, index.h("ul", { class: "SelectOptions" }, rules.stakeMultipliers.map((item) => index.h("li", { class: this.stakeMultiplier == item ? 'SelectedValue' : '', value: item, onClick: () => this.setStakeMultiplier(item) }, item)))))) : (index.h("div", null, index.h("input", { min: "1", value: rules.stakeMultipliers[0] || 1, type: "number", disabled: true }))))), rules.drawMultiplierAvailable &&
12099
12149
  index.h("div", null, index.h("label", { class: "Label" }, translate$1('numberOfDraws', this.language), ": "), index.h("div", { class: "WagerInput" }, rules.durations.length > 1 ?
@@ -12104,7 +12154,10 @@ const LotteryTicket = class {
12104
12154
  }
12105
12155
  static get watchers() { return {
12106
12156
  "lineMultiplier": ["handleLineMultiplierChange"],
12107
- "tabIndex": ["handleTabIndexChange"]
12157
+ "tabIndex": ["handleTabIndexChange"],
12158
+ "clientStyling": ["handleClientStylingChange"],
12159
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
12160
+ "mbSource": ["handleMbSourceChange"]
12108
12161
  }; }
12109
12162
  };
12110
12163
  LotteryTicket.style = LotteryTicketStyle0;
@@ -12147,18 +12200,6 @@ const LotteryTicketController = class {
12147
12200
  constructor(hostRef) {
12148
12201
  index.registerInstance(this, hostRef);
12149
12202
  this.deleteTicketEvent = index.createEvent(this, "deleteTicket", 7);
12150
- this.setClientStyling = () => {
12151
- let sheet = document.createElement('style');
12152
- sheet.innerHTML = this.clientStyling;
12153
- this.stylingContainer.prepend(sheet);
12154
- };
12155
- this.setClientStylingURL = () => {
12156
- let cssFile = document.createElement('style');
12157
- setTimeout(() => {
12158
- cssFile.innerHTML = this.clientStylingUrlContent;
12159
- this.stylingContainer.prepend(cssFile);
12160
- }, 1);
12161
- };
12162
12203
  this.endpoint = '';
12163
12204
  this.ticketId = 1;
12164
12205
  this.ticketDescription = undefined;
@@ -12173,9 +12214,9 @@ const LotteryTicketController = class {
12173
12214
  this.resetButton = false;
12174
12215
  this.totalControllers = 1;
12175
12216
  this.clientStyling = '';
12176
- this.clientStylingUrlContent = '';
12217
+ this.clientStylingUrl = '';
12218
+ this.mbSource = undefined;
12177
12219
  this.translationUrl = undefined;
12178
- this.limitStylingAppends = false;
12179
12220
  }
12180
12221
  // @TODO fix the `any` type
12181
12222
  helperAccordionActionHandler() {
@@ -12191,20 +12232,39 @@ const LotteryTicketController = class {
12191
12232
  getTranslations(JSON.parse(this.translationUrl));
12192
12233
  }
12193
12234
  }
12194
- componentDidRender() {
12195
- // start custom styling area
12196
- if (!this.limitStylingAppends && this.stylingContainer) {
12235
+ handleClientStylingChange(newValue, oldValue) {
12236
+ if (newValue != oldValue) {
12237
+ setClientStyling(this.stylingContainer, this.clientStyling);
12238
+ }
12239
+ }
12240
+ handleClientStylingUrlChange(newValue, oldValue) {
12241
+ if (newValue != oldValue) {
12242
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
12243
+ }
12244
+ }
12245
+ handleMbSourceChange(newValue, oldValue) {
12246
+ if (newValue != oldValue) {
12247
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12248
+ }
12249
+ }
12250
+ componentDidLoad() {
12251
+ if (this.stylingContainer) {
12252
+ if (this.mbSource)
12253
+ setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
12197
12254
  if (this.clientStyling)
12198
- this.setClientStyling();
12199
- if (this.clientStylingUrlContent)
12200
- this.setClientStylingURL();
12201
- this.limitStylingAppends = true;
12255
+ setClientStyling(this.stylingContainer, this.clientStyling);
12256
+ if (this.clientStylingUrl)
12257
+ setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
12202
12258
  }
12203
- // end custom styling area
12204
12259
  }
12205
12260
  render() {
12206
- return (index.h("div", { key: '581989035aa42a397cd39a4cdd929ea91190494c', class: "LotteryTicketControllerContainer", ref: el => this.stylingContainer = el }, index.h("helper-accordion", { key: '724d50d1532510344ed7acd57c3c5faef17aef8c', "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, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent }, index.h("div", { key: 'ba851ea2792641971a5552a94558fe8d28068187', slot: "accordionContent" }, index.h("lottery-ticket", { key: '199abc15160d60499d7d1d1d14084f64a6314c53', endpoint: this.endpoint, "game-id": this.gameId, "ticket-id": this.ticketId, "number-of-grids": this.numberOfGrids, language: this.language, "translation-url": this.translationUrl, "reset-button": this.resetButton, "auto-pick": this.autoPick, "client-styling": this.clientStyling, "client-styling-url-content": this.clientStylingUrlContent })))));
12261
+ return (index.h("div", { key: '28756fcff01b738bfe8339114445032a5da757c2', class: "LotteryTicketControllerContainer", ref: el => this.stylingContainer = el }, index.h("helper-accordion", { key: '18a566d1c97ccbf74cd759215df3a18faf5c43dc', "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, "translation-url": this.translationUrl, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource }, index.h("div", { key: '3a056f64dc8572b66f50cb151adde2caea2cd427', slot: "accordionContent" }, index.h("lottery-ticket", { key: '06a0696b79840c05381429b1b87af94b478b09f0', endpoint: this.endpoint, "game-id": this.gameId, "ticket-id": this.ticketId, "number-of-grids": this.numberOfGrids, language: this.language, "translation-url": this.translationUrl, "reset-button": this.resetButton, "auto-pick": this.autoPick, "client-styling": this.clientStyling, "client-styling-url": this.clientStylingUrl, "mb-source": this.mbSource })))));
12207
12262
  }
12263
+ static get watchers() { return {
12264
+ "clientStyling": ["handleClientStylingChange"],
12265
+ "clientStylingUrl": ["handleClientStylingUrlChange"],
12266
+ "mbSource": ["handleMbSourceChange"]
12267
+ }; }
12208
12268
  };
12209
12269
  LotteryTicketController.style = LotteryTicketControllerStyle0;
12210
12270