@everymatrix/bonus-elevate-powerups 0.0.16 → 0.0.18

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 (26) hide show
  1. package/dist/bonus-elevate-powerups/bonus-elevate-powerups-31713cf4.js +1 -0
  2. package/dist/bonus-elevate-powerups/bonus-elevate-powerups.esm.js +1 -1
  3. package/dist/bonus-elevate-powerups/bonus-elevate-powerups_5.entry.js +3 -3
  4. package/dist/bonus-elevate-powerups/index.esm.js +1 -1
  5. package/dist/cjs/{bonus-elevate-powerups-5d4f1cfd.js → bonus-elevate-powerups-59f31a54.js} +51 -19
  6. package/dist/cjs/bonus-elevate-powerups.cjs.js +1 -1
  7. package/dist/cjs/bonus-elevate-powerups_5.cjs.entry.js +10 -3
  8. package/dist/cjs/index.cjs.js +1 -1
  9. package/dist/cjs/loader.cjs.js +1 -1
  10. package/dist/collection/components/bonus-elevate-powerups/bonus-elevate-powerups.css +18 -4
  11. package/dist/collection/components/bonus-elevate-powerups/bonus-elevate-powerups.js +67 -18
  12. package/dist/collection/components/time-count/time-count.js +30 -3
  13. package/dist/collection/utils/locale.utils.js +2 -0
  14. package/dist/collection/utils/utils.js +2 -2
  15. package/dist/esm/{bonus-elevate-powerups-550b383c.js → bonus-elevate-powerups-31713cf4.js} +51 -20
  16. package/dist/esm/bonus-elevate-powerups.js +1 -1
  17. package/dist/esm/bonus-elevate-powerups_5.entry.js +11 -3
  18. package/dist/esm/index.js +1 -1
  19. package/dist/esm/loader.js +1 -1
  20. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/bonus-elevate-powerups/.stencil/libs/common/src/types/casino/powerups.d.ts +7 -6
  21. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/bonus-elevate-powerups/.stencil/libs/common/src/types/casino/tournaments.d.ts +111 -0
  22. package/dist/types/components/bonus-elevate-powerups/bonus-elevate-powerups.d.ts +8 -4
  23. package/dist/types/components/time-count/time-count.d.ts +3 -1
  24. package/dist/types/components.d.ts +8 -2
  25. package/package.json +1 -1
  26. package/dist/bonus-elevate-powerups/bonus-elevate-powerups-550b383c.js +0 -1
@@ -122,13 +122,13 @@ function getAdoptStyleSubscription(stylingContainer, domain) {
122
122
 
123
123
  var MultiplierMode;
124
124
  (function (MultiplierMode) {
125
- MultiplierMode[MultiplierMode["COINS"] = 1] = "COINS";
126
- MultiplierMode[MultiplierMode["XP"] = 2] = "XP";
125
+ MultiplierMode["COINS"] = "coins";
126
+ MultiplierMode["XP"] = "xp";
127
127
  })(MultiplierMode || (MultiplierMode = {}));
128
128
  var BoostingPeriodMode;
129
129
  (function (BoostingPeriodMode) {
130
- BoostingPeriodMode[BoostingPeriodMode["TIME_PERIOD"] = 1] = "TIME_PERIOD";
131
- BoostingPeriodMode[BoostingPeriodMode["NUMBER_OF_ROUNDS"] = 2] = "NUMBER_OF_ROUNDS";
130
+ BoostingPeriodMode["TIME_PERIOD"] = "timePeriod";
131
+ BoostingPeriodMode["NUMBER_OF_ROUNDS"] = "numberOfRounds";
132
132
  })(BoostingPeriodMode || (BoostingPeriodMode = {}));
133
133
  var PowerUpStatus;
134
134
  (function (PowerUpStatus) {
@@ -147,14 +147,33 @@ const TRANSLATIONS = {
147
147
  rounds: 'Rounds',
148
148
  coins: 'Coins',
149
149
  xp: 'XP',
150
+ expiresIn: 'EXPIRES IN ',
150
151
  nothingHere: 'Nothing here -- yet!',
151
152
  noPowerUps: 'No power-ups have been used at the moment.',
152
153
  gotoShop: 'Go to shop to check power-ups availability.',
153
154
  termsCon: 'Read full Terms & Conditions',
154
155
  games: 'Games',
155
156
  selectGameToActive: 'Select the game to activate power-up',
157
+ days: 'days'
156
158
  }
157
159
  };
160
+ const getTranslations = (url) => {
161
+ return new Promise((resolve) => {
162
+ fetch(url)
163
+ .then((res) => res.json())
164
+ .then((data) => {
165
+ Object.keys(data).forEach((lang) => {
166
+ if (!TRANSLATIONS[lang]) {
167
+ TRANSLATIONS[lang] = {};
168
+ }
169
+ for (let key in data[lang]) {
170
+ TRANSLATIONS[lang][key] = data[lang][key];
171
+ }
172
+ });
173
+ resolve(true);
174
+ });
175
+ });
176
+ };
158
177
  const translate = (key, customLang, values) => {
159
178
  const lang = customLang;
160
179
  let translation = TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
@@ -180,15 +199,15 @@ const ClearSearch = `<svg width="52" height="52" viewBox="0 0 52 52" fill="none"
180
199
 
181
200
  const powerUpSearchConditions = {
182
201
  expand: "games",
183
- fields: "id,powerUpID,displayName,termsUrl,description,status,multiplier,boostingPeriod,currentTime,expireTime,games(id,gameId,name,thumbnail,launchUrl)",
202
+ fields: "id,powerUpID,displayName,termsUrl,description,status,multiplier,boostingPeriod,currentTime,expireTime,games(id,gameId,name,slug,thumbnail)",
184
203
  status: `${PowerUpStatus.ACTIVE},${PowerUpStatus.ACTIVATED}`
185
204
  };
186
205
  const powerUpGameSearchConditions = {
187
206
  expand: "games",
188
- fields: "id,powerUpID,games(id,gameId,name,thumbnail,launchUrl)"
207
+ fields: "id,powerUpID,games(id,gameId,slug,name,thumbnail)"
189
208
  };
190
209
 
191
- const bonusElevatePowerupsCss = ":host{display:block;font-family:inherit;--game-amount-line:4}@media screen and (max-width: 768px){.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:32%}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{padding:8px}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{margin:8px}}@media screen and (max-width: 470px){.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:45%}.PowerUpsContainer .PowerUps .PowerUpItem.Card{max-height:600px;height:fit-content;flex-direction:column}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft{gap:10px}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{height:51%;overflow:auto}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{width:auto;margin:auto}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft .Game,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight .Game{width:45%}}.PowerUpsContainer{font-size:0.95rem;display:flex;flex-direction:column;min-height:300px}.PowerUpsContainer .EmptyPowerups{align-items:center;justify-content:center;font-weight:400;font-size:1.2em;line-height:24px;text-align:center;vertical-align:middle;width:max-content;margin:auto;display:flex;flex-direction:column;padding:50px}.PowerUpsContainer .EmptyPowerups .Icon,.PowerUpsContainer .EmptyPowerups .NoPowerTitle{text-align:center}.PowerUpsContainer .EmptyPowerups .Icon svg,.PowerUpsContainer .EmptyPowerups .NoPowerTitle svg{width:40px}.PowerUpsContainer .EmptyPowerups .NoPowerTitle{font-size:1.2em;font-weight:bold;margin:10px}.PowerUpsContainer .PowerUps{width:100%;gap:12px;display:flex;flex-direction:column}.PowerUpsContainer .PowerUps .Card{width:100%;height:307px;gap:12px;border-radius:12px;border:2px solid var(--emw--button-border-color-secondary, rgba(188, 252, 177, 0.0509803922));display:flex;flex-direction:row}.PowerUpsContainer .PowerUps .Card .CardLeft,.PowerUpsContainer .PowerUps .Card .CardRight{display:flex;flex-direction:column}.PowerUpsContainer .PowerUps .Card .CardLeft{padding:20px;width:35%;display:flex;flex-direction:column;justify-content:space-between}.PowerUpsContainer .PowerUps .Card .CardLeft .MainInfo{display:flex;flex-direction:column;gap:12px}.PowerUpsContainer .PowerUps .Card .CardRight{padding:10px}.PowerUpsContainer .PowerUps .Card .Description{color:#C8D6CE;overflow-y:auto;height:calc(100% - 60px)}.PowerUpsContainer .PowerUps .Card .CardLeft .DisplayName{width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:22px;gap:12px}.PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier{text-transform:uppercase;font-size:0.85em;color:var(--emw--color-gray-dark, #727672)}.PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier .ExpireCount{background-image:linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange2, #E0A84E) 100%)}.PowerUpsContainer .PowerUps .Card .CardLeft .ExpireCount,.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC{display:inline-block;-webkit-background-clip:text;background-clip:text;color:transparent}.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC{text-transform:uppercase;background-image:linear-gradient(180deg, var(--emw--color-powup-green, #24B24E) 0%, var(--emw--color-powup-light-green, #18CE51) 100%);font-size:0.8em;font-weight:bold}.PowerUpsContainer .PowerUps .Card .GamesContent{margin:20px;flex:1;gap:12px;display:flex;border-radius:8px;border:2px solid var(--emw--color-powup-light-green-0D, rgba(188, 252, 177, 0.0509803922))}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle{display:flex;flex-direction:row}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle .Title2{text-transform:capitalize}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle .GamesAmount{opacity:0.8}.PowerUpsContainer .PowerUps .Card .GamesContent .GameTitleTip{color:var(--emw--color-powup-gray-green, #C8D6CE);font-size:0.8rem}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList{display:flex;justify-content:center;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--emw--background-gray-color, gray) transparent}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList::-webkit-scrollbar-track{background-color:transparent;border-radius:5px}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games{padding:0;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;gap:calc(30px / (var(--game-amount-line) - 1))}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:calc((100% - 30px) / var(--game-amount-line));cursor:pointer;position:relative}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game .GameMask{transition:opacity;transition-duration:0.2s;opacity:0;position:absolute;width:70%;height:100%}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .mask-filter{opacity:1}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover img{opacity:0.4;filter:blur(1.5px)}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .GameMask{opacity:1;mix-blend-mode:screen;background-color:var(--emw--color-powup-green, #24B24E);display:flex;justify-content:center;align-items:center;position:absolute;width:100%;left:0;height:100%;top:0;border-radius:8px}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .GameMask .PlayBtn{border:2px solid var(--emw--color-powup-gray, #f0f0f0);padding:5px 3px;border-radius:3px}.PowerUpsContainer .Pagination{display:flex;justify-content:center}";
210
+ const bonusElevatePowerupsCss = ":host{display:block;font-family:inherit;--game-amount-line:4}@media screen and (max-width: 768px){.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:32%}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{padding:8px}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{margin:8px}}@media screen and (max-width: 470px){.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:45%}.PowerUpsContainer .PowerUps .PowerUpItem.Card{max-height:600px;height:fit-content;flex-direction:column}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft{gap:10px;min-width:320px}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{height:51%;overflow:auto}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight{width:auto;margin:auto}.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft .Game,.PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight .Game{width:45%}}.PowerUpsContainer{font-size:0.95rem;display:flex;flex-direction:column;min-height:300px}.PowerUpsContainer .EmptyPowerups{align-items:center;justify-content:center;font-weight:400;font-size:1.2em;line-height:24px;text-align:center;vertical-align:middle;width:max-content;margin:auto;display:flex;flex-direction:column;padding:50px}.PowerUpsContainer .EmptyPowerups .Icon,.PowerUpsContainer .EmptyPowerups .NoPowerTitle{text-align:center}.PowerUpsContainer .EmptyPowerups .Icon svg,.PowerUpsContainer .EmptyPowerups .NoPowerTitle svg{width:40px}.PowerUpsContainer .EmptyPowerups .NoPowerTitle{font-size:1.2em;font-weight:bold;margin:10px}.PowerUpsContainer .PowerUps{width:100%;gap:12px;display:flex;flex-direction:column}.PowerUpsContainer .PowerUps time-count{margin-left:3px}.PowerUpsContainer .PowerUps .Card{width:100%;max-height:307px;gap:12px;border-radius:12px;border:2px solid var(--emw--button-border-color-secondary, rgba(188, 252, 177, 0.0509803922));display:flex;flex-direction:row}.PowerUpsContainer .PowerUps .Card .CardLeft,.PowerUpsContainer .PowerUps .Card .CardRight{display:flex;flex-direction:column}.PowerUpsContainer .PowerUps .Card .CardLeft{padding:20px;width:35%;display:flex;min-width:339px;flex-direction:column;justify-content:space-between}.PowerUpsContainer .PowerUps .Card .CardLeft .MainInfo{display:flex;flex-direction:column;gap:12px}.PowerUpsContainer .PowerUps .Card .CardRight{padding:10px}.PowerUpsContainer .PowerUps .Card .Description{color:var(--emw--color-gray-150, #c8d6ce);line-height:1.2rem;flex:1}.PowerUpsContainer .PowerUps .Card .CardLeft .DisplayName{width:100%;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;height:22px;gap:12px}.PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier{text-transform:uppercase;font-size:0.85em;color:var(--emw--color-gray-dark, #727672)}.PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier .ExpireCount{background-image:linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange2, #E0A84E) 100%)}.PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier .ExpireCount .Label{text-transform:uppercase}.PowerUpsContainer .PowerUps .Card .CardLeft .ExpireCount,.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC{display:inline-block;-webkit-background-clip:text;background-clip:text;color:transparent}.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC{text-transform:uppercase;background-image:linear-gradient(180deg, var(--emw--color-powup-green, #24B24E) 0%, var(--emw--color-powup-light-green, #18CE51) 100%);font-size:0.8em;font-weight:bold}.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC a{color:var(--emw--color-powup-light-green, #18CE51)}.PowerUpsContainer .PowerUps .Card .CardLeft .TermsC span{cursor:pointer}.PowerUpsContainer .PowerUps .Card .GamesContent{margin:20px;flex:1;gap:12px;display:flex;border-radius:8px;border:2px solid var(--emw--color-powup-light-green-0D, rgba(188, 252, 177, 0.0509803922))}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle{display:flex;flex-direction:row}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle .Title2{text-transform:capitalize}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesTitle .GamesAmount{opacity:0.8}.PowerUpsContainer .PowerUps .Card .GamesContent .GameTitleTip{color:var(--emw--color-powup-gray-green, #C8D6CE);font-size:0.8rem}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList{display:flex;justify-content:center;flex:1;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--emw--background-gray-color, gray) transparent}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList::-webkit-scrollbar-track{background-color:transparent;border-radius:5px}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games{padding:0;display:flex;align-items:flex-start;justify-content:flex-start;flex-wrap:wrap;gap:calc(30px / (var(--game-amount-line) - 1))}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game{width:calc((100% - 30px) / var(--game-amount-line));cursor:pointer;position:relative}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game .GameMask{transition:opacity;transition-duration:0.2s;opacity:0;position:absolute;width:70%;height:100%}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .mask-filter{opacity:1}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover img{opacity:0.4;filter:blur(1.5px)}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .GameMask{opacity:1;mix-blend-mode:screen;background-color:var(--emw--color-powup-green, #24B24E);display:flex;justify-content:center;align-items:center;position:absolute;width:100%;left:0;height:100%;top:0;border-radius:8px}.PowerUpsContainer .PowerUps .Card .GamesContent .GamesList .Games .Game:hover .GameMask .PlayBtn{border:2px solid var(--emw--color-powup-gray, #f0f0f0);padding:5px 3px;border-radius:3px}.PowerUpsContainer .Pagination{display:flex;justify-content:center}";
192
211
  const BonusElevatePowerupsStyle0 = bonusElevatePowerupsCss;
193
212
 
194
213
  const BonusElevatePowerups = class {
@@ -199,14 +218,15 @@ const BonusElevatePowerups = class {
199
218
  this.mbSource = undefined;
200
219
  this.clientStyling = undefined;
201
220
  this.clientStylingUrl = undefined;
221
+ this.translationUrl = '';
202
222
  this.language = 'en';
203
223
  this.endpoint = undefined;
204
224
  this.session = undefined;
205
- this.pageSize = 20;
225
+ this.limit = 10;
226
+ this.openTermsPage = true;
206
227
  this.isLoading = true;
207
228
  this.powerups = [];
208
229
  this.offset = 0;
209
- this.limit = this.pageSize;
210
230
  this.total = undefined;
211
231
  }
212
232
  onReloadPageByType(e) {
@@ -260,8 +280,11 @@ const BonusElevatePowerups = class {
260
280
  }
261
281
  }
262
282
  }
263
- onGamesHover(game) {
264
- window.postMessage({ type: 'PowerUpHover', game }, '*');
283
+ onGameClick(game) {
284
+ window.postMessage({ type: 'EngagementSuiteGameRedirect', data: { Slug: game.slug } });
285
+ }
286
+ onTermsUrlClick(termsUrl) {
287
+ window.postMessage({ type: 'onPowerupTermsUrlClicked', termsUrl }, '*');
265
288
  }
266
289
  async loadMoreGames(powerup) {
267
290
  var _a;
@@ -269,11 +292,11 @@ const BonusElevatePowerups = class {
269
292
  return; // All games already loaded
270
293
  }
271
294
  try {
272
- const url = new URL(`${this.endpoint}/v1/elevate/powerups?pagination=games(limit=20,offset=${powerup.games.items.length})`);
295
+ const url = new URL(`${this.endpoint}/v1/elevate/powerups/available?pagination=games(limit=20,offset=${powerup.games.items.length})`);
273
296
  const options = {
274
297
  headers: { 'x-SessionId': this.session },
275
298
  };
276
- url.searchParams.append('filter', `powerUpID=${powerup.powerUpID}`);
299
+ url.searchParams.append('filter', `id=${powerup.powerUpID}`);
277
300
  Object.entries(powerUpGameSearchConditions).forEach(([key, value]) => {
278
301
  url.searchParams.append(key, value);
279
302
  });
@@ -330,15 +353,16 @@ const BonusElevatePowerups = class {
330
353
  });
331
354
  }
332
355
  render() {
333
- return index.h("div", { key: 'b40ca849d3de46834e9c7b6dee8d275756921d07', class: `PowerUpsContainer`, ref: (el) => (this.stylingContainer = el) }, this.isLoading
356
+ return index.h("div", { key: '7de60fedad83668fcff2f4a1ea02b489b80d3b12', class: `PowerUpsContainer`, ref: (el) => (this.stylingContainer = el) }, this.isLoading
334
357
  ? index.h("p", null, "Loading...")
335
358
  : !this.total ?
336
359
  index.h("div", { class: 'EmptyPowerups' }, index.h("div", { class: 'Icon', innerHTML: ClearSearch }), index.h("span", { class: 'NoPowerTitle' }, translate('nothingHere', this.language)), index.h("span", null, translate('noPowerUps')), index.h("span", null, translate('gotoShop')), index.h("div", null))
337
360
  : [index.h("div", { class: 'PowerUps' }, this.powerups.map(powerup => {
338
361
  var _a, _b;
339
- return index.h("div", { class: 'PowerUpItem Card', "data-powerup-id": powerup.id }, index.h("div", { class: 'CardLeft' }, index.h("div", { class: 'MainInfo' }, index.h("div", { class: 'DisplayName' }, " ", powerup.displayName || 'Title', " "), index.h("div", { class: 'Title2 PowerUpMultiplier' }, index.h("span", { class: 'BoostingPeriod' }, index.h("span", { class: 'Period' }, powerup.boostingPeriod.minutes || powerup.boostingPeriod.numberOfRounds, " "), powerup.boostingPeriod.mode === BoostingPeriodMode.TIME_PERIOD ? translate('min') : translate('rounds'), " "), index.h("span", { class: 'Multiplier' }, "| X", powerup.multiplier.coefficient, " "), index.h("span", { class: 'MultiplierMode' }, "| ", powerup.multiplier.mode === MultiplierMode.XP ? translate('xp') : translate('coins'), " "), "| ", index.h("span", { class: 'ExpireCount' }, " ", index.h("time-count", { "expire-time": powerup.expireTime }))), index.h("div", { class: 'Description' }, "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aperiam autem corporis est harum minus, nam neque nisi quibusdam quod reiciendis rerum saepe temporibus veritatis voluptas! Aperiam cupiditate optio rem?")), index.h("div", { class: 'TermsC' }, translate('termsCon', this.language))), index.h("div", { class: 'GamesContent CardRight' }, index.h("div", { class: 'GamesTitle' }, index.h("span", { class: 'Title2' }, " ", translate('games', this.language)), index.h("span", { class: 'GamesAmount' }, "( ", (_a = powerup.games) === null || _a === void 0 ? void 0 :
340
- _a.total, " )")), index.h("div", { class: 'GameTitleTip' }, translate('selectGameToActive', this.language)), index.h("div", { class: 'GamesList' }, index.h("div", { class: 'Games' }, (_b = powerup.games) === null || _b === void 0 ? void 0 : _b.items.map(g => {
341
- return index.h("div", { class: 'Game' }, index.h("ui-image", { src: g.thumbnail }), index.h("div", { class: 'GameMask', onClick: this.onGamesHover.bind(this, g) }, index.h("span", { class: 'PlayBtn' }, "Start Now!")));
362
+ return index.h("div", { class: 'PowerUpItem Card', "data-powerup-id": powerup.id }, index.h("div", { class: 'CardLeft' }, index.h("div", { class: 'MainInfo' }, index.h("div", { class: 'DisplayName' }, " ", powerup.displayName || '-', " "), index.h("div", { class: 'Title2 PowerUpMultiplier' }, index.h("span", { class: 'BoostingPeriod' }, index.h("span", { class: 'Period' }, powerup.boostingPeriod.minutes || powerup.boostingPeriod.numberOfRounds, " "), powerup.boostingPeriod.mode === BoostingPeriodMode.TIME_PERIOD ? translate('min', this.language) : translate('rounds', this.language), " "), index.h("span", { class: 'Multiplier' }, "| X ", powerup.multiplier.coefficient, " "), index.h("span", { class: 'MultiplierMode' }, "| ", translate(powerup.multiplier.mode, this.language), " "), powerup.expireTime && [index.h("span", null, " | "), index.h("span", { class: 'ExpireCount' }, index.h("time-count", { "expire-time": powerup.expireTime, language: this.language }))]), index.h("div", { class: 'Description' }, powerup.description)), index.h("div", { class: 'TermsC' }, this.openTermsPage
363
+ ? index.h("a", { href: powerup.termsUrl ? powerup.termsUrl : '#', target: '_blank' }, translate('termsCon', this.language))
364
+ : index.h("span", { onClick: this.onTermsUrlClick.bind(this, powerup.termsUrl) }, translate('termsCon', this.language), " "))), index.h("div", { class: 'GamesContent CardRight' }, index.h("div", { class: 'GamesTitle' }, index.h("span", { class: 'Title2' }, " ", translate('games', this.language)), index.h("span", { class: 'GamesAmount' }, " ( ", ((_a = powerup.games) === null || _a === void 0 ? void 0 : _a.total) || 0, " ) ")), index.h("div", { class: 'GameTitleTip' }, translate('selectGameToActive', this.language)), index.h("div", { class: 'GamesList' }, index.h("div", { class: 'Games' }, (_b = powerup.games) === null || _b === void 0 ? void 0 : _b.items.map(g => {
365
+ return index.h("div", { class: 'Game' }, index.h("ui-image", { src: g.thumbnail }), index.h("div", { class: 'GameMask', onClick: this.onGameClick.bind(this, g) }, index.h("span", { class: 'PlayBtn' }, "Start Now!")));
342
366
  })))));
343
367
  })), index.h("div", { class: 'Pagination' }, this.total && this.total > this.limit &&
344
368
  index.h("bonus-pagination-nav", { offset: this.offset, limit: this.limit, "secondary-arrows-active": true, "table-id": this.tableId, total: this.total }))]);
@@ -361,7 +385,13 @@ const BonusElevatePowerups = class {
361
385
  setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
362
386
  }
363
387
  }
364
- componentWillLoad() {
388
+ handleNewTranslations() {
389
+ getTranslations(this.translationUrl);
390
+ }
391
+ async componentWillLoad() {
392
+ if (this.translationUrl) {
393
+ await getTranslations(this.translationUrl);
394
+ }
365
395
  this.loadData().catch(console.error);
366
396
  }
367
397
  componentDidLoad() {
@@ -391,9 +421,11 @@ const BonusElevatePowerups = class {
391
421
  "endpoint": ["loadData", "handleDataConfigChange"],
392
422
  "clientStyling": ["handleClientStylingChange"],
393
423
  "clientStylingUrl": ["handleClientStylingUrlChange"],
394
- "mbSource": ["handleMbSourceChange"]
424
+ "mbSource": ["handleMbSourceChange"],
425
+ "translationUrl": ["handleNewTranslations"]
395
426
  }; }
396
427
  };
397
428
  BonusElevatePowerups.style = BonusElevatePowerupsStyle0;
398
429
 
399
430
  exports.BonusElevatePowerups = BonusElevatePowerups;
431
+ exports.translate = translate;
@@ -19,7 +19,7 @@ var patchBrowser = () => {
19
19
 
20
20
  patchBrowser().then(async (options) => {
21
21
  await appGlobals.globalScripts();
22
- return index.bootstrapLazy([["bonus-elevate-powerups_5.cjs",[[1,"bonus-elevate-powerups",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"endpoint":[513],"session":[513],"pageSize":[514,"page-size"],"isLoading":[32],"powerups":[32],"offset":[32],"limit":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData","handleDataConfigChange"],"endpoint":["loadData","handleDataConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"bonus-pagination-nav",{"total":[1538],"limit":[1538],"offset":[1538],"tableId":[1537,"table-id"],"language":[1537],"translationUrl":[513,"translation-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"displayPageNumbers":[1540,"display-page-numbers"],"displayRangeOfTotal":[1540,"display-range-of-total"],"navItemAccount":[1538,"nav-item-account"],"endPageIndex":[32],"pagesArray":[32],"currentPage":[32],"showAsEllipsisMid":[32]},[[8,"paginationReset","pageLimitChangedHandler"],[8,"pageLimitChanged","pageLimitChangedHandler"]]],[0,"time-count",{"expireTime":[1,"expire-time"],"displayTime":[32]},null,{"expireTime":["startTimeChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
22
+ return index.bootstrapLazy([["bonus-elevate-powerups_5.cjs",[[1,"bonus-elevate-powerups",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[1538],"openTermsPage":[4,"open-terms-page"],"isLoading":[32],"powerups":[32],"offset":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData","handleDataConfigChange"],"endpoint":["loadData","handleDataConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"bonus-pagination-nav",{"total":[1538],"limit":[1538],"offset":[1538],"tableId":[1537,"table-id"],"language":[1537],"translationUrl":[513,"translation-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"displayPageNumbers":[1540,"display-page-numbers"],"displayRangeOfTotal":[1540,"display-range-of-total"],"navItemAccount":[1538,"nav-item-account"],"endPageIndex":[32],"pagesArray":[32],"currentPage":[32],"showAsEllipsisMid":[32]},[[8,"paginationReset","pageLimitChangedHandler"],[8,"pageLimitChanged","pageLimitChangedHandler"]]],[0,"time-count",{"expireTime":[1,"expire-time"],"language":[1],"displayTime":[32],"isExpireInDay1":[32]},null,{"expireTime":["startTimeChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const bonusElevatePowerups = require('./bonus-elevate-powerups-5d4f1cfd.js');
5
+ const bonusElevatePowerups = require('./bonus-elevate-powerups-59f31a54.js');
6
6
  const index = require('./index-3dbb4007.js');
7
7
 
8
8
  const DEFAULT_LANGUAGE = 'en';
@@ -5886,7 +5886,9 @@ const TimeCount = class {
5886
5886
  constructor(hostRef) {
5887
5887
  index.registerInstance(this, hostRef);
5888
5888
  this.expireTime = undefined;
5889
+ this.language = 'en';
5889
5890
  this.displayTime = undefined;
5891
+ this.isExpireInDay1 = false;
5890
5892
  }
5891
5893
  componentWillLoad() {
5892
5894
  this.timer = setInterval(() => this.updateDisplayTime(), 1000);
@@ -5910,6 +5912,7 @@ const TimeCount = class {
5910
5912
  return;
5911
5913
  }
5912
5914
  const duration = hooks.duration(start.diff(now));
5915
+ this.isExpireInDay1 = duration.asDays() > 1;
5913
5916
  // If the time has already passed
5914
5917
  if (duration.asMilliseconds() <= 0) {
5915
5918
  this.displayTime = '00:00:00';
@@ -5918,7 +5921,7 @@ const TimeCount = class {
5918
5921
  }
5919
5922
  const hours = Math.floor(duration.asHours());
5920
5923
  if (hours >= 48) {
5921
- this.displayTime = `${Math.floor(duration.asDays())} days`;
5924
+ this.displayTime = `${Math.floor(duration.asDays())} ${bonusElevatePowerups.translate('days', this.language)}`;
5922
5925
  }
5923
5926
  else if (hours >= 24) {
5924
5927
  this.displayTime = '1 day';
@@ -5931,7 +5934,11 @@ const TimeCount = class {
5931
5934
  }
5932
5935
  }
5933
5936
  render() {
5934
- return index.h("span", { key: 'b242dc33814c57b4d72e2ef165dc116187e3312e' }, this.displayTime);
5937
+ return [
5938
+ this.isExpireInDay1 &&
5939
+ index.h("span", { key: '8432bdb52f3b5ecd2600c68179a0ee55d785c20c', class: 'Label' }, bonusElevatePowerups.translate('expiresIn', this.language)),
5940
+ index.h("span", { key: 'fbec64ff41b9dbddd5ef6913e6f778771f55e143', class: 'TimeCountDown' }, this.displayTime)
5941
+ ];
5935
5942
  }
5936
5943
  static get watchers() { return {
5937
5944
  "expireTime": ["startTimeChanged"]
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const bonusElevatePowerups = require('./bonus-elevate-powerups-5d4f1cfd.js');
5
+ const bonusElevatePowerups = require('./bonus-elevate-powerups-59f31a54.js');
6
6
  require('./index-3dbb4007.js');
7
7
 
8
8
 
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy([["bonus-elevate-powerups_5.cjs",[[1,"bonus-elevate-powerups",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"language":[513],"endpoint":[513],"session":[513],"pageSize":[514,"page-size"],"isLoading":[32],"powerups":[32],"offset":[32],"limit":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData","handleDataConfigChange"],"endpoint":["loadData","handleDataConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"bonus-pagination-nav",{"total":[1538],"limit":[1538],"offset":[1538],"tableId":[1537,"table-id"],"language":[1537],"translationUrl":[513,"translation-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"displayPageNumbers":[1540,"display-page-numbers"],"displayRangeOfTotal":[1540,"display-range-of-total"],"navItemAccount":[1538,"nav-item-account"],"endPageIndex":[32],"pagesArray":[32],"currentPage":[32],"showAsEllipsisMid":[32]},[[8,"paginationReset","pageLimitChangedHandler"],[8,"pageLimitChanged","pageLimitChangedHandler"]]],[0,"time-count",{"expireTime":[1,"expire-time"],"displayTime":[32]},null,{"expireTime":["startTimeChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
11
+ return index.bootstrapLazy([["bonus-elevate-powerups_5.cjs",[[1,"bonus-elevate-powerups",{"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"language":[513],"endpoint":[513],"session":[513],"limit":[1538],"openTermsPage":[4,"open-terms-page"],"isLoading":[32],"powerups":[32],"offset":[32],"total":[32]},[[8,"reloadPageByType","onReloadPageByType"]],{"offset":["loadData"],"limit":["loadData"],"language":["loadData"],"session":["loadData","handleDataConfigChange"],"endpoint":["loadData","handleDataConfigChange"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingUrlChange"],"mbSource":["handleMbSourceChange"],"translationUrl":["handleNewTranslations"]}],[0,"ui-image",{"src":[1],"width":[1],"height":[1],"alt":[1],"styles":[8],"detectDistance":[1,"detect-distance"],"imgLoaded":[32],"shouldLoad":[32]},null,{"src":["handleSrc"]}],[0,"bonus-pagination-nav",{"total":[1538],"limit":[1538],"offset":[1538],"tableId":[1537,"table-id"],"language":[1537],"translationUrl":[513,"translation-url"],"arrowsActive":[1540,"arrows-active"],"secondaryArrowsActive":[1540,"secondary-arrows-active"],"displayPageNumbers":[1540,"display-page-numbers"],"displayRangeOfTotal":[1540,"display-range-of-total"],"navItemAccount":[1538,"nav-item-account"],"endPageIndex":[32],"pagesArray":[32],"currentPage":[32],"showAsEllipsisMid":[32]},[[8,"paginationReset","pageLimitChangedHandler"],[8,"pageLimitChanged","pageLimitChangedHandler"]]],[0,"time-count",{"expireTime":[1,"expire-time"],"language":[1],"displayTime":[32],"isExpireInDay1":[32]},null,{"expireTime":["startTimeChanged"]}],[0,"ui-skeleton",{"structure":[1],"width":[1],"height":[1],"borderRadius":[8,"border-radius"],"marginBottom":[8,"margin-bottom"],"marginTop":[8,"margin-top"],"marginLeft":[8,"margin-left"],"marginRight":[8,"margin-right"],"animation":[4],"rows":[2],"size":[1]},null,{"structure":["handleStructureChange"]}]]]], options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
@@ -26,6 +26,7 @@
26
26
  }
27
27
  .PowerUpsContainer .PowerUps .PowerUpItem.Card .CardLeft {
28
28
  gap: 10px;
29
+ min-width: 320px;
29
30
  }
30
31
  .PowerUpsContainer .PowerUps .PowerUpItem.Card .CardRight {
31
32
  height: 51%;
@@ -76,9 +77,12 @@
76
77
  display: flex;
77
78
  flex-direction: column;
78
79
  }
80
+ .PowerUpsContainer .PowerUps time-count {
81
+ margin-left: 3px;
82
+ }
79
83
  .PowerUpsContainer .PowerUps .Card {
80
84
  width: 100%;
81
- height: 307px;
85
+ max-height: 307px;
82
86
  gap: 12px;
83
87
  border-radius: 12px;
84
88
  border: 2px solid var(--emw--button-border-color-secondary, rgba(188, 252, 177, 0.0509803922));
@@ -93,6 +97,7 @@
93
97
  padding: 20px;
94
98
  width: 35%;
95
99
  display: flex;
100
+ min-width: 339px;
96
101
  flex-direction: column;
97
102
  justify-content: space-between;
98
103
  }
@@ -105,9 +110,9 @@
105
110
  padding: 10px;
106
111
  }
107
112
  .PowerUpsContainer .PowerUps .Card .Description {
108
- color: #C8D6CE;
109
- overflow-y: auto;
110
- height: calc(100% - 60px);
113
+ color: var(--emw--color-gray-150, #c8d6ce);
114
+ line-height: 1.2rem;
115
+ flex: 1;
111
116
  }
112
117
  .PowerUpsContainer .PowerUps .Card .CardLeft .DisplayName {
113
118
  width: 100%;
@@ -125,6 +130,9 @@
125
130
  .PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier .ExpireCount {
126
131
  background-image: linear-gradient(180deg, var(--emw--color-powup-orange1, #EA9018) 0%, var(--emw--color-powup-orange2, #E0A84E) 100%);
127
132
  }
133
+ .PowerUpsContainer .PowerUps .Card .CardLeft .PowerUpMultiplier .ExpireCount .Label {
134
+ text-transform: uppercase;
135
+ }
128
136
  .PowerUpsContainer .PowerUps .Card .CardLeft .ExpireCount, .PowerUpsContainer .PowerUps .Card .CardLeft .TermsC {
129
137
  display: inline-block;
130
138
  -webkit-background-clip: text;
@@ -137,6 +145,12 @@
137
145
  font-size: 0.8em;
138
146
  font-weight: bold;
139
147
  }
148
+ .PowerUpsContainer .PowerUps .Card .CardLeft .TermsC a {
149
+ color: var(--emw--color-powup-light-green, #18CE51);
150
+ }
151
+ .PowerUpsContainer .PowerUps .Card .CardLeft .TermsC span {
152
+ cursor: pointer;
153
+ }
140
154
  .PowerUpsContainer .PowerUps .Card .GamesContent {
141
155
  margin: 20px;
142
156
  flex: 1;
@@ -1,7 +1,7 @@
1
1
  import { h } from "@stencil/core";
2
2
  import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
3
- import { BoostingPeriodMode, MultiplierMode } from "../../../../../../../../libs/common/src/types/casino/powerups";
4
- import { translate } from "../../utils/locale.utils";
3
+ import { BoostingPeriodMode } from "../../../../../../../../libs/common/src/types/casino/powerups";
4
+ import { getTranslations, translate } from "../../utils/locale.utils";
5
5
  import ClearSearch from "../../assets/clear-search.svg";
6
6
  import "../../../../../bonus-pagination-nav/dist/types/index";
7
7
  import "../../../../../ui-image/dist/types/index";
@@ -13,14 +13,15 @@ export class BonusElevatePowerups {
13
13
  this.mbSource = undefined;
14
14
  this.clientStyling = undefined;
15
15
  this.clientStylingUrl = undefined;
16
+ this.translationUrl = '';
16
17
  this.language = 'en';
17
18
  this.endpoint = undefined;
18
19
  this.session = undefined;
19
- this.pageSize = 20;
20
+ this.limit = 10;
21
+ this.openTermsPage = true;
20
22
  this.isLoading = true;
21
23
  this.powerups = [];
22
24
  this.offset = 0;
23
- this.limit = this.pageSize;
24
25
  this.total = undefined;
25
26
  }
26
27
  onReloadPageByType(e) {
@@ -74,8 +75,11 @@ export class BonusElevatePowerups {
74
75
  }
75
76
  }
76
77
  }
77
- onGamesHover(game) {
78
- window.postMessage({ type: 'PowerUpHover', game }, '*');
78
+ onGameClick(game) {
79
+ window.postMessage({ type: 'EngagementSuiteGameRedirect', data: { Slug: game.slug } });
80
+ }
81
+ onTermsUrlClick(termsUrl) {
82
+ window.postMessage({ type: 'onPowerupTermsUrlClicked', termsUrl }, '*');
79
83
  }
80
84
  async loadMoreGames(powerup) {
81
85
  var _a;
@@ -83,11 +87,11 @@ export class BonusElevatePowerups {
83
87
  return; // All games already loaded
84
88
  }
85
89
  try {
86
- const url = new URL(`${this.endpoint}/v1/elevate/powerups?pagination=games(limit=20,offset=${powerup.games.items.length})`);
90
+ const url = new URL(`${this.endpoint}/v1/elevate/powerups/available?pagination=games(limit=20,offset=${powerup.games.items.length})`);
87
91
  const options = {
88
92
  headers: { 'x-SessionId': this.session },
89
93
  };
90
- url.searchParams.append('filter', `powerUpID=${powerup.powerUpID}`);
94
+ url.searchParams.append('filter', `id=${powerup.powerUpID}`);
91
95
  Object.entries(powerUpGameSearchConditions).forEach(([key, value]) => {
92
96
  url.searchParams.append(key, value);
93
97
  });
@@ -144,15 +148,16 @@ export class BonusElevatePowerups {
144
148
  });
145
149
  }
146
150
  render() {
147
- return h("div", { key: 'b40ca849d3de46834e9c7b6dee8d275756921d07', class: `PowerUpsContainer`, ref: (el) => (this.stylingContainer = el) }, this.isLoading
151
+ return h("div", { key: '7de60fedad83668fcff2f4a1ea02b489b80d3b12', class: `PowerUpsContainer`, ref: (el) => (this.stylingContainer = el) }, this.isLoading
148
152
  ? h("p", null, "Loading...")
149
153
  : !this.total ?
150
154
  h("div", { class: 'EmptyPowerups' }, h("div", { class: 'Icon', innerHTML: ClearSearch }), h("span", { class: 'NoPowerTitle' }, translate('nothingHere', this.language)), h("span", null, translate('noPowerUps')), h("span", null, translate('gotoShop')), h("div", null))
151
155
  : [h("div", { class: 'PowerUps' }, this.powerups.map(powerup => {
152
156
  var _a, _b;
153
- return h("div", { class: 'PowerUpItem Card', "data-powerup-id": powerup.id }, h("div", { class: 'CardLeft' }, h("div", { class: 'MainInfo' }, h("div", { class: 'DisplayName' }, " ", powerup.displayName || 'Title', " "), h("div", { class: 'Title2 PowerUpMultiplier' }, h("span", { class: 'BoostingPeriod' }, h("span", { class: 'Period' }, powerup.boostingPeriod.minutes || powerup.boostingPeriod.numberOfRounds, " "), powerup.boostingPeriod.mode === BoostingPeriodMode.TIME_PERIOD ? translate('min') : translate('rounds'), " "), h("span", { class: 'Multiplier' }, "| X", powerup.multiplier.coefficient, " "), h("span", { class: 'MultiplierMode' }, "| ", powerup.multiplier.mode === MultiplierMode.XP ? translate('xp') : translate('coins'), " "), "| ", h("span", { class: 'ExpireCount' }, " ", h("time-count", { "expire-time": powerup.expireTime }))), h("div", { class: 'Description' }, "Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aperiam autem corporis est harum minus, nam neque nisi quibusdam quod reiciendis rerum saepe temporibus veritatis voluptas! Aperiam cupiditate optio rem?")), h("div", { class: 'TermsC' }, translate('termsCon', this.language))), h("div", { class: 'GamesContent CardRight' }, h("div", { class: 'GamesTitle' }, h("span", { class: 'Title2' }, " ", translate('games', this.language)), h("span", { class: 'GamesAmount' }, "( ", (_a = powerup.games) === null || _a === void 0 ? void 0 :
154
- _a.total, " )")), h("div", { class: 'GameTitleTip' }, translate('selectGameToActive', this.language)), h("div", { class: 'GamesList' }, h("div", { class: 'Games' }, (_b = powerup.games) === null || _b === void 0 ? void 0 : _b.items.map(g => {
155
- return h("div", { class: 'Game' }, h("ui-image", { src: g.thumbnail }), h("div", { class: 'GameMask', onClick: this.onGamesHover.bind(this, g) }, h("span", { class: 'PlayBtn' }, "Start Now!")));
157
+ return h("div", { class: 'PowerUpItem Card', "data-powerup-id": powerup.id }, h("div", { class: 'CardLeft' }, h("div", { class: 'MainInfo' }, h("div", { class: 'DisplayName' }, " ", powerup.displayName || '-', " "), h("div", { class: 'Title2 PowerUpMultiplier' }, h("span", { class: 'BoostingPeriod' }, h("span", { class: 'Period' }, powerup.boostingPeriod.minutes || powerup.boostingPeriod.numberOfRounds, " "), powerup.boostingPeriod.mode === BoostingPeriodMode.TIME_PERIOD ? translate('min', this.language) : translate('rounds', this.language), " "), h("span", { class: 'Multiplier' }, "| X ", powerup.multiplier.coefficient, " "), h("span", { class: 'MultiplierMode' }, "| ", translate(powerup.multiplier.mode, this.language), " "), powerup.expireTime && [h("span", null, " | "), h("span", { class: 'ExpireCount' }, h("time-count", { "expire-time": powerup.expireTime, language: this.language }))]), h("div", { class: 'Description' }, powerup.description)), h("div", { class: 'TermsC' }, this.openTermsPage
158
+ ? h("a", { href: powerup.termsUrl ? powerup.termsUrl : '#', target: '_blank' }, translate('termsCon', this.language))
159
+ : h("span", { onClick: this.onTermsUrlClick.bind(this, powerup.termsUrl) }, translate('termsCon', this.language), " "))), h("div", { class: 'GamesContent CardRight' }, h("div", { class: 'GamesTitle' }, h("span", { class: 'Title2' }, " ", translate('games', this.language)), h("span", { class: 'GamesAmount' }, " ( ", ((_a = powerup.games) === null || _a === void 0 ? void 0 : _a.total) || 0, " ) ")), h("div", { class: 'GameTitleTip' }, translate('selectGameToActive', this.language)), h("div", { class: 'GamesList' }, h("div", { class: 'Games' }, (_b = powerup.games) === null || _b === void 0 ? void 0 : _b.items.map(g => {
160
+ return h("div", { class: 'Game' }, h("ui-image", { src: g.thumbnail }), h("div", { class: 'GameMask', onClick: this.onGameClick.bind(this, g) }, h("span", { class: 'PlayBtn' }, "Start Now!")));
156
161
  })))));
157
162
  })), h("div", { class: 'Pagination' }, this.total && this.total > this.limit &&
158
163
  h("bonus-pagination-nav", { offset: this.offset, limit: this.limit, "secondary-arrows-active": true, "table-id": this.tableId, total: this.total }))]);
@@ -175,7 +180,13 @@ export class BonusElevatePowerups {
175
180
  setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
176
181
  }
177
182
  }
178
- componentWillLoad() {
183
+ handleNewTranslations() {
184
+ getTranslations(this.translationUrl);
185
+ }
186
+ async componentWillLoad() {
187
+ if (this.translationUrl) {
188
+ await getTranslations(this.translationUrl);
189
+ }
179
190
  this.loadData().catch(console.error);
180
191
  }
181
192
  componentDidLoad() {
@@ -262,6 +273,24 @@ export class BonusElevatePowerups {
262
273
  "attribute": "client-styling-url",
263
274
  "reflect": true
264
275
  },
276
+ "translationUrl": {
277
+ "type": "string",
278
+ "mutable": false,
279
+ "complexType": {
280
+ "original": "string",
281
+ "resolved": "string",
282
+ "references": {}
283
+ },
284
+ "required": false,
285
+ "optional": false,
286
+ "docs": {
287
+ "tags": [],
288
+ "text": ""
289
+ },
290
+ "attribute": "translation-url",
291
+ "reflect": true,
292
+ "defaultValue": "''"
293
+ },
265
294
  "language": {
266
295
  "type": "string",
267
296
  "mutable": false,
@@ -314,9 +343,9 @@ export class BonusElevatePowerups {
314
343
  "attribute": "session",
315
344
  "reflect": true
316
345
  },
317
- "pageSize": {
346
+ "limit": {
318
347
  "type": "number",
319
- "mutable": false,
348
+ "mutable": true,
320
349
  "complexType": {
321
350
  "original": "number",
322
351
  "resolved": "number",
@@ -328,9 +357,27 @@ export class BonusElevatePowerups {
328
357
  "tags": [],
329
358
  "text": ""
330
359
  },
331
- "attribute": "page-size",
360
+ "attribute": "limit",
332
361
  "reflect": true,
333
- "defaultValue": "20"
362
+ "defaultValue": "10"
363
+ },
364
+ "openTermsPage": {
365
+ "type": "boolean",
366
+ "mutable": false,
367
+ "complexType": {
368
+ "original": "boolean",
369
+ "resolved": "boolean",
370
+ "references": {}
371
+ },
372
+ "required": false,
373
+ "optional": false,
374
+ "docs": {
375
+ "tags": [],
376
+ "text": ""
377
+ },
378
+ "attribute": "open-terms-page",
379
+ "reflect": false,
380
+ "defaultValue": "true"
334
381
  }
335
382
  };
336
383
  }
@@ -339,7 +386,6 @@ export class BonusElevatePowerups {
339
386
  "isLoading": {},
340
387
  "powerups": {},
341
388
  "offset": {},
342
- "limit": {},
343
389
  "total": {}
344
390
  };
345
391
  }
@@ -374,6 +420,9 @@ export class BonusElevatePowerups {
374
420
  }, {
375
421
  "propName": "mbSource",
376
422
  "methodName": "handleMbSourceChange"
423
+ }, {
424
+ "propName": "translationUrl",
425
+ "methodName": "handleNewTranslations"
377
426
  }];
378
427
  }
379
428
  static get listeners() {
@@ -1,9 +1,12 @@
1
1
  import { h } from "@stencil/core";
2
2
  import moment from "moment";
3
+ import { translate } from "../../utils/locale.utils";
3
4
  export class TimeCount {
4
5
  constructor() {
5
6
  this.expireTime = undefined;
7
+ this.language = 'en';
6
8
  this.displayTime = undefined;
9
+ this.isExpireInDay1 = false;
7
10
  }
8
11
  componentWillLoad() {
9
12
  this.timer = setInterval(() => this.updateDisplayTime(), 1000);
@@ -27,6 +30,7 @@ export class TimeCount {
27
30
  return;
28
31
  }
29
32
  const duration = moment.duration(start.diff(now));
33
+ this.isExpireInDay1 = duration.asDays() > 1;
30
34
  // If the time has already passed
31
35
  if (duration.asMilliseconds() <= 0) {
32
36
  this.displayTime = '00:00:00';
@@ -35,7 +39,7 @@ export class TimeCount {
35
39
  }
36
40
  const hours = Math.floor(duration.asHours());
37
41
  if (hours >= 48) {
38
- this.displayTime = `${Math.floor(duration.asDays())} days`;
42
+ this.displayTime = `${Math.floor(duration.asDays())} ${translate('days', this.language)}`;
39
43
  }
40
44
  else if (hours >= 24) {
41
45
  this.displayTime = '1 day';
@@ -48,7 +52,11 @@ export class TimeCount {
48
52
  }
49
53
  }
50
54
  render() {
51
- return h("span", { key: 'b242dc33814c57b4d72e2ef165dc116187e3312e' }, this.displayTime);
55
+ return [
56
+ this.isExpireInDay1 &&
57
+ h("span", { key: '8432bdb52f3b5ecd2600c68179a0ee55d785c20c', class: 'Label' }, translate('expiresIn', this.language)),
58
+ h("span", { key: 'fbec64ff41b9dbddd5ef6913e6f778771f55e143', class: 'TimeCountDown' }, this.displayTime)
59
+ ];
52
60
  }
53
61
  static get is() { return "time-count"; }
54
62
  static get properties() {
@@ -69,12 +77,31 @@ export class TimeCount {
69
77
  },
70
78
  "attribute": "expire-time",
71
79
  "reflect": false
80
+ },
81
+ "language": {
82
+ "type": "string",
83
+ "mutable": false,
84
+ "complexType": {
85
+ "original": "string",
86
+ "resolved": "string",
87
+ "references": {}
88
+ },
89
+ "required": false,
90
+ "optional": false,
91
+ "docs": {
92
+ "tags": [],
93
+ "text": ""
94
+ },
95
+ "attribute": "language",
96
+ "reflect": false,
97
+ "defaultValue": "'en'"
72
98
  }
73
99
  };
74
100
  }
75
101
  static get states() {
76
102
  return {
77
- "displayTime": {}
103
+ "displayTime": {},
104
+ "isExpireInDay1": {}
78
105
  };
79
106
  }
80
107
  static get watchers() {
@@ -5,12 +5,14 @@ const TRANSLATIONS = {
5
5
  rounds: 'Rounds',
6
6
  coins: 'Coins',
7
7
  xp: 'XP',
8
+ expiresIn: 'EXPIRES IN ',
8
9
  nothingHere: 'Nothing here -- yet!',
9
10
  noPowerUps: 'No power-ups have been used at the moment.',
10
11
  gotoShop: 'Go to shop to check power-ups availability.',
11
12
  termsCon: 'Read full Terms & Conditions',
12
13
  games: 'Games',
13
14
  selectGameToActive: 'Select the game to activate power-up',
15
+ days: 'days'
14
16
  }
15
17
  };
16
18
  export const getTranslations = (url) => {