@everymatrix/casino-bonuses-controller 1.29.5 → 1.29.7
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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@everymatrix/casino-bonuses-controller",
|
|
3
|
-
"version": "1.29.
|
|
3
|
+
"version": "1.29.7",
|
|
4
4
|
"main": "index.js",
|
|
5
5
|
"svelte": "src/index.ts",
|
|
6
6
|
"scripts": {
|
|
@@ -35,5 +35,5 @@
|
|
|
35
35
|
"publishConfig": {
|
|
36
36
|
"access": "public"
|
|
37
37
|
},
|
|
38
|
-
"gitHead": "
|
|
38
|
+
"gitHead": "6774dd803fe9ab951334d05d7f0ec99f78b6c0a0"
|
|
39
39
|
}
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
let bonusStatus: string = 'active';
|
|
45
45
|
|
|
46
46
|
let isButtonClickable: boolean = true;
|
|
47
|
-
let StatusForFilter = ['active','completed','claimable'];
|
|
47
|
+
let StatusForFilter = ['active', 'completed', 'claimable'];
|
|
48
48
|
let forfeitWalletID = '';
|
|
49
49
|
if (isMobile(userAgent)) {
|
|
50
50
|
mobileView = true;
|
|
@@ -69,12 +69,12 @@
|
|
|
69
69
|
setTimeout(() => { customStylingContainer.appendChild(cssFile) }, 1);
|
|
70
70
|
});
|
|
71
71
|
}
|
|
72
|
-
const setTranslationUrl = ():void => {
|
|
72
|
+
const setTranslationUrl = (): void => {
|
|
73
73
|
let url:string = translationurl;
|
|
74
74
|
|
|
75
75
|
fetch(url).then((res:any) => res.json())
|
|
76
76
|
.then((res) => {
|
|
77
|
-
Object.keys(res).forEach((item:any):void => {
|
|
77
|
+
Object.keys(res).forEach((item:any): void => {
|
|
78
78
|
addNewMessages(item, res[item]);
|
|
79
79
|
});
|
|
80
80
|
}).catch((err:any) => {
|
|
@@ -95,7 +95,7 @@
|
|
|
95
95
|
}
|
|
96
96
|
})
|
|
97
97
|
|
|
98
|
-
const messageHandler = (e: any): void=>{
|
|
98
|
+
const messageHandler = (e: any): void => {
|
|
99
99
|
switch (e.data.type) {
|
|
100
100
|
case 'PaginationChange':
|
|
101
101
|
currentPage = e.data.page;
|
|
@@ -112,12 +112,11 @@
|
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
114
|
|
|
115
|
-
const init = async (): Promise<void> =>{
|
|
115
|
+
const init = async (): Promise<void> => {
|
|
116
116
|
getPage(1);
|
|
117
|
-
setLocale(lang);
|
|
118
117
|
}
|
|
119
118
|
|
|
120
|
-
const claimBonus = async (bonusCode: string,claimByCode?: boolean): Promise<any>=>{
|
|
119
|
+
const claimBonus = async (bonusCode: string, claimByCode?: boolean): Promise<any>=> {
|
|
121
120
|
isButtonClickable = false;
|
|
122
121
|
const response = await claimBonusRequest(bonusCode);
|
|
123
122
|
if(!response.success) {
|
|
@@ -125,7 +124,7 @@
|
|
|
125
124
|
if(claimByCode){
|
|
126
125
|
invalidBonusCode = true;
|
|
127
126
|
}else{
|
|
128
|
-
window.postMessage({ type:'OnBonusClaimError',message:errorMessage,bonusCode:bonusCode});
|
|
127
|
+
window.postMessage({ type:'OnBonusClaimError', message:errorMessage, bonusCode:bonusCode});
|
|
129
128
|
}
|
|
130
129
|
}else{
|
|
131
130
|
invalidBonusCode = false;
|
|
@@ -134,7 +133,7 @@
|
|
|
134
133
|
window.postMessage({ type:'OnBonusClaimedDone'});
|
|
135
134
|
isButtonClickable = true;
|
|
136
135
|
};
|
|
137
|
-
const claimBonusRequest = async (bonusCode: string): Promise<any> =>{
|
|
136
|
+
const claimBonusRequest = async (bonusCode: string): Promise<any> => {
|
|
138
137
|
return await fetchBase(endpoint + "/v1/bonus/claim", {
|
|
139
138
|
method: "PUT",
|
|
140
139
|
body: JSON.stringify({
|
|
@@ -148,7 +147,7 @@
|
|
|
148
147
|
}
|
|
149
148
|
});
|
|
150
149
|
}
|
|
151
|
-
const forfeitBonus = async (bonusCode: string): Promise<any> =>{
|
|
150
|
+
const forfeitBonus = async (bonusCode: string): Promise<any> => {
|
|
152
151
|
isButtonClickable = false;
|
|
153
152
|
const response = await forfeitBonusRequest(bonusCode);
|
|
154
153
|
if(!response.success) {
|
|
@@ -182,14 +181,14 @@
|
|
|
182
181
|
window.postMessage({ type: 'OnBonusForfeitedDone'});
|
|
183
182
|
bonusModal = false;
|
|
184
183
|
}
|
|
185
|
-
const getPage = async (pageNumber: number): Promise<any> =>{
|
|
184
|
+
const getPage = async (pageNumber: number): Promise<any> => {
|
|
186
185
|
if(currentPage !== pageNumber){
|
|
187
186
|
currentPage = pageNumber;
|
|
188
187
|
}
|
|
189
188
|
const offset = (pageNumber - 1) * Number(limit);
|
|
190
189
|
isLoading = true;
|
|
191
190
|
bonuses = [];
|
|
192
|
-
const response = await getBonuses(endpoint, session,offset, {
|
|
191
|
+
const response = await getBonuses(endpoint, session, offset, {
|
|
193
192
|
lang,
|
|
194
193
|
limit
|
|
195
194
|
});
|
|
@@ -298,6 +297,7 @@
|
|
|
298
297
|
$: classWithPartMatchMobile = (partAndClass, extraClass = '') =>
|
|
299
298
|
classWithPart(`${partAndClass}${mobileView ? ` ${partAndClass}Mobile` : ''}`, extraClass);
|
|
300
299
|
|
|
300
|
+
$: lang && setLocale(lang);
|
|
301
301
|
$: initialLoad = endpoint && session && lang && limit;
|
|
302
302
|
$: initialLoad && init();
|
|
303
303
|
$: clientstyling && customStylingContainer && setClientStyling();
|
|
@@ -309,7 +309,9 @@
|
|
|
309
309
|
<div {...classWithPartMatchMobile('BonusFilterWrapper')}>
|
|
310
310
|
<div class="BonusFilterContainer" part="BonusFilterContainer">
|
|
311
311
|
{#each StatusForFilter as status}
|
|
312
|
-
<button type="button" {...classWithPartMatchMobile('BonusStatusFilter')} class:active={status === bonusStatus} on:click={() => {bonusStatus = status; getPage(1)}} disabled={isLoading}>
|
|
312
|
+
<button type="button" {...classWithPartMatchMobile('BonusStatusFilter')} class:active={status === bonusStatus} on:click={() => {bonusStatus = status; getPage(1)}} disabled={isLoading}>
|
|
313
|
+
{$_(`bonusCard.${status}`)}
|
|
314
|
+
</button>
|
|
313
315
|
{/each}
|
|
314
316
|
</div>
|
|
315
317
|
</div>
|
|
@@ -318,7 +320,7 @@
|
|
|
318
320
|
<label for="BonusCode"><span class="Asterisk">*</span>{$_(`bonus.bonusCode`)}</label>
|
|
319
321
|
<div {...classWithPartMatchMobile('BonusCodeWrapper')} >
|
|
320
322
|
<input {...classWithPartMatchMobile('BonusCodeInput')} bind:value={bonusCode} on:keyup={validateBonusCode} type="text" id="BonusCode" placeholder={$_(`bonus.placeholder`)}/>
|
|
321
|
-
<button {...classWithPartMatchMobile('BonusClaimButton')} disabled={invalidBonusField || !isButtonClickable} on:click={()=>{claimBonus(bonusCode,true)}}>{$_(`bonus.claim`)}</button>
|
|
323
|
+
<button {...classWithPartMatchMobile('BonusClaimButton')} disabled={invalidBonusField || !isButtonClickable} on:click={() => {claimBonus(bonusCode, true)}}>{$_(`bonus.claim`)}</button>
|
|
322
324
|
</div>
|
|
323
325
|
{#if invalidBonusCode}
|
|
324
326
|
<p class="InvalidBonusCodeMessage" part="InvalidBonusCodeMessage">{$_(`bonus.invalidBonusCode`)}</p>
|
|
@@ -386,7 +388,7 @@
|
|
|
386
388
|
<p {...classWithPart('ModalText')}>{$_('bonus.forfeitMessage')}</p>
|
|
387
389
|
<div {...classWithPart('ModalButtons')}>
|
|
388
390
|
<button {...classWithPart('ModalCancel')} on:click={closeBonusModal}>{$_('bonus.forfeitCancel')}</button>
|
|
389
|
-
<button {...classWithPart('ModalConfirm')} on:click={()=>forfeitBonus(forfeitWalletID)}>{$_('bonus.forfeitConfirm')}</button>
|
|
391
|
+
<button {...classWithPart('ModalConfirm')} on:click={() => forfeitBonus(forfeitWalletID)}>{$_('bonus.forfeitConfirm')}</button>
|
|
390
392
|
</div>
|
|
391
393
|
</div>
|
|
392
394
|
</div>
|
|
@@ -433,24 +435,24 @@
|
|
|
433
435
|
text-align: center;
|
|
434
436
|
}
|
|
435
437
|
.BonusesFirst, .BonusesPrev, .BonusesNext, .BonusesLast {
|
|
436
|
-
color: var(--emfe-w-bonus-pagination-primary,var(--emfe-w-color-blue, #00AEEF));
|
|
438
|
+
color: var(--emfe-w-bonus-pagination-primary, var(--emfe-w-color-blue, #00AEEF));
|
|
437
439
|
font-size: 16px;
|
|
438
440
|
cursor: pointer;
|
|
439
441
|
padding: 5px 10px;
|
|
440
442
|
font-weight: 700;
|
|
441
443
|
&.Inactive {
|
|
442
|
-
color: var(--emfe-w-bonus-pagination-inactive-text,var(--emfe-w-color-gray-100, #E6E6E6));
|
|
444
|
+
color: var(--emfe-w-bonus-pagination-inactive-text, var(--emfe-w-color-gray-100, #E6E6E6));
|
|
443
445
|
cursor: default;
|
|
444
446
|
}
|
|
445
447
|
}
|
|
446
448
|
.BonusesPage {
|
|
447
449
|
margin: 0 5px;
|
|
448
|
-
color: var(--emfe-w-bonus-pagination-text,var(--emfe-w-color-gray-300, #58586B));
|
|
450
|
+
color: var(--emfe-w-bonus-pagination-text, var(--emfe-w-color-gray-300, #58586B));
|
|
449
451
|
font-size: 16px;
|
|
450
452
|
cursor: pointer;
|
|
451
453
|
padding: 5px 10px;
|
|
452
454
|
&.BonusPageActive {
|
|
453
|
-
background-color: var(--emfe-w-bonus-pagination-active-bg,var(--emfe-w-color-white, #FFFFFF));
|
|
455
|
+
background-color: var(--emfe-w-bonus-pagination-active-bg, var(--emfe-w-color-white, #FFFFFF));
|
|
454
456
|
font-weight: 700;
|
|
455
457
|
}
|
|
456
458
|
}
|
|
@@ -468,8 +470,8 @@
|
|
|
468
470
|
height: 64px;
|
|
469
471
|
margin: 8px;
|
|
470
472
|
border-radius: 50%;
|
|
471
|
-
border: 6px solid var(--emfe-w-bonus-pagination-border,var(--emfe-w-color-blue, #00AEEF));
|
|
472
|
-
border-color: var(--emfe-w-bonus-pagination-border,var(--emfe-w-color-blue, #00AEEF)) transparent var(--emfe-w-bonus-pagination-primary,var(--emfe-w-color-blue, #00AEEF)) transparent;
|
|
473
|
+
border: 6px solid var(--emfe-w-bonus-pagination-border, var(--emfe-w-color-blue, #00AEEF));
|
|
474
|
+
border-color: var(--emfe-w-bonus-pagination-border, var(--emfe-w-color-blue, #00AEEF)) transparent var(--emfe-w-bonus-pagination-primary, var(--emfe-w-color-blue, #00AEEF)) transparent;
|
|
473
475
|
animation: LoaderForModal 1.2s linear infinite;
|
|
474
476
|
}
|
|
475
477
|
|
|
@@ -487,7 +489,7 @@
|
|
|
487
489
|
display: flex;
|
|
488
490
|
gap: 20px;
|
|
489
491
|
flex-wrap: wrap;
|
|
490
|
-
background: var(--emfe-w-bonus-calendar-bg,var(--emfe-w-color-gray-50, #F4F4F4));
|
|
492
|
+
background: var(--emfe-w-bonus-calendar-bg, var(--emfe-w-color-gray-50, #F4F4F4));
|
|
491
493
|
border-radius: 5px;
|
|
492
494
|
padding: 27px;
|
|
493
495
|
width: calc(50% - 20px);
|
|
@@ -516,11 +518,11 @@
|
|
|
516
518
|
font-size: 18px;
|
|
517
519
|
font-weight: 700;
|
|
518
520
|
width: 100%;
|
|
519
|
-
color: var(--emfe-w-bonus-calendar-text,var(--emfe-w-color-gray-300, #58586B));
|
|
521
|
+
color: var(--emfe-w-bonus-calendar-text, var(--emfe-w-color-gray-300, #58586B));
|
|
520
522
|
}
|
|
521
523
|
.BonusCalendarStartDate,
|
|
522
524
|
.BonusCalendarEndDate {
|
|
523
|
-
color: var(--emfe-w-bonus-calendar-text,var(--emfe-w-color-gray-300, #58586B));
|
|
525
|
+
color: var(--emfe-w-bonus-calendar-text, var(--emfe-w-color-gray-300, #58586B));
|
|
524
526
|
display: flex;
|
|
525
527
|
position: relative;
|
|
526
528
|
align-items: center;
|
|
@@ -551,20 +553,20 @@
|
|
|
551
553
|
input {
|
|
552
554
|
width: 100%;
|
|
553
555
|
height: 44px;
|
|
554
|
-
border: 1px solid var(--emfe-w-bonus-calendar-border,var(--emfe-w-color-gray-100, #E6E6E6));
|
|
556
|
+
border: 1px solid var(--emfe-w-bonus-calendar-border, var(--emfe-w-color-gray-100, #E6E6E6));
|
|
555
557
|
border-radius: 5px;
|
|
556
558
|
box-sizing: border-box;
|
|
557
559
|
padding: 5px 15px;
|
|
558
560
|
font-size: 16px;
|
|
559
561
|
line-height: 18px;
|
|
560
|
-
outline-color: var(--emfe-w-bonus-calendar-outline,var(--emfe-w-color-primary, #00AEEF));
|
|
562
|
+
outline-color: var(--emfe-w-bonus-calendar-outline, var(--emfe-w-color-primary, #00AEEF));
|
|
561
563
|
}
|
|
562
564
|
}
|
|
563
565
|
|
|
564
566
|
.BonusFilterButton {
|
|
565
567
|
flex: 2;
|
|
566
|
-
background: var(--emfe-w-bonus-filter-bg,var(--emfe-w-color-yellow, #F39C12));
|
|
567
|
-
outline: 5px solid var(--emfe-w-bonus-filter-outline,var(--emfe-w-color-yellow, rgba(243,156,18,0.3)));
|
|
568
|
+
background: var(--emfe-w-bonus-filter-bg, var(--emfe-w-color-yellow, #F39C12));
|
|
569
|
+
outline: 5px solid var(--emfe-w-bonus-filter-outline, var(--emfe-w-color-yellow, rgba(243, 156, 18, 0.3)));
|
|
568
570
|
border-radius: 9px;
|
|
569
571
|
border: 0;
|
|
570
572
|
width: 180px;
|
|
@@ -577,7 +579,7 @@
|
|
|
577
579
|
transition-property: outline, color, background;
|
|
578
580
|
box-sizing: border-box;
|
|
579
581
|
cursor: pointer;
|
|
580
|
-
color: var(--emfe-w-bonus-filter-text,var(--emfe-w-color-white, #FFFFFF));
|
|
582
|
+
color: var(--emfe-w-bonus-filter-text, var(--emfe-w-color-white, #FFFFFF));
|
|
581
583
|
align-self: end;
|
|
582
584
|
margin-bottom: 5px;
|
|
583
585
|
&[disabled] {
|
|
@@ -589,12 +591,12 @@
|
|
|
589
591
|
min-width: 100%;
|
|
590
592
|
}
|
|
591
593
|
&:hover {
|
|
592
|
-
background: var(--emfe-w-bonus-filter-bg,var(--emfe-w-color-yellow, #F38B12));
|
|
594
|
+
background: var(--emfe-w-bonus-filter-bg, var(--emfe-w-color-yellow, #F38B12));
|
|
593
595
|
outline: 0;
|
|
594
596
|
}
|
|
595
597
|
&:active {
|
|
596
|
-
background: var(--emfe-w-bonus-filter-bg,var(--emfe-w-color-yellow, #F38B12));
|
|
597
|
-
outline-color: var(--emfe-w-bonus-filter-outline,var(--emfe-w-color-yellow, rgba(243,156,18,0.6)));
|
|
598
|
+
background: var(--emfe-w-bonus-filter-bg, var(--emfe-w-color-yellow, #F38B12));
|
|
599
|
+
outline-color: var(--emfe-w-bonus-filter-outline, var(--emfe-w-color-yellow, rgba(243, 156, 18, 0.6)));
|
|
598
600
|
}
|
|
599
601
|
}
|
|
600
602
|
.BonusFilterWrapper {
|
|
@@ -614,11 +616,11 @@
|
|
|
614
616
|
.BonusFilterContainer {
|
|
615
617
|
display: flex;
|
|
616
618
|
gap: 5px;
|
|
617
|
-
border-bottom: 5px solid var(--emfe-w-bonus-filter-border,var(--emfe-w-color-green, #53B65A));
|
|
619
|
+
border-bottom: 5px solid var(--emfe-w-bonus-filter-border, var(--emfe-w-color-green, #53B65A));
|
|
618
620
|
width: 100%;
|
|
619
621
|
}
|
|
620
622
|
.BonusStatusFilter {
|
|
621
|
-
color: var(--emfe-w-bonus-status-filter-text,var(--emfe-w-color-gray-300, #6D6D6D));
|
|
623
|
+
color: var(--emfe-w-bonus-status-filter-text, var(--emfe-w-color-gray-300, #6D6D6D));
|
|
622
624
|
cursor: pointer;
|
|
623
625
|
width: 200px;
|
|
624
626
|
height: 50px;
|
|
@@ -628,8 +630,8 @@
|
|
|
628
630
|
transition-duration: 0.5s;
|
|
629
631
|
box-sizing: border-box;
|
|
630
632
|
padding: 15px;
|
|
631
|
-
background: var(--emfe-w-bonus-status-filter-bg,var(--emfe-w-color-white, #FFFFFF));
|
|
632
|
-
border: 1px solid var(--emfe-w-bonus-status-filter-border,var(--emfe-w-color-gray-300, #767171));
|
|
633
|
+
background: var(--emfe-w-bonus-status-filter-bg, var(--emfe-w-color-white, #FFFFFF));
|
|
634
|
+
border: 1px solid var(--emfe-w-bonus-status-filter-border, var(--emfe-w-color-gray-300, #767171));
|
|
633
635
|
border-bottom: 0;
|
|
634
636
|
border-radius: 5px 5px 0px 0px;
|
|
635
637
|
|
|
@@ -639,13 +641,13 @@
|
|
|
639
641
|
}
|
|
640
642
|
|
|
641
643
|
&.active {
|
|
642
|
-
color: var(--emfe-w-bonus-status-active-bg,var(--emfe-w-color-white, #FFFFFF));
|
|
643
|
-
background: var(--emfe-w-bonus-status-active-bg,var(--emfe-w-color-gray-300, #4E5662));
|
|
644
|
-
border: 0.5px solid var(--emfe-w-bonus-status-active-border,var(--emfe-w-color-gray-300, #767171));
|
|
644
|
+
color: var(--emfe-w-bonus-status-active-bg, var(--emfe-w-color-white, #FFFFFF));
|
|
645
|
+
background: var(--emfe-w-bonus-status-active-bg, var(--emfe-w-color-gray-300, #4E5662));
|
|
646
|
+
border: 0.5px solid var(--emfe-w-bonus-status-active-border, var(--emfe-w-color-gray-300, #767171));
|
|
645
647
|
}
|
|
646
648
|
}
|
|
647
649
|
.BonusPageNumber {
|
|
648
|
-
color: var(--emfe-w-bonus-page-number-text,var(--emfe-w-color-gray-150, #9C9C9C));
|
|
650
|
+
color: var(--emfe-w-bonus-page-number-text, var(--emfe-w-color-gray-150, #9C9C9C));
|
|
649
651
|
flex: 1;
|
|
650
652
|
display: flex;
|
|
651
653
|
flex-wrap: wrap;
|
|
@@ -659,15 +661,15 @@
|
|
|
659
661
|
padding: 10px;
|
|
660
662
|
text-align: center;
|
|
661
663
|
&.active {
|
|
662
|
-
color: var(--emfe-w-bonus-page-number-text,var(--emfe-w-color-white, #FFFFFF));
|
|
663
|
-
background: var(--emfe-w-bonus-page-number-active,var(--emfe-w-color-yellow, #F39C12));
|
|
664
|
+
color: var(--emfe-w-bonus-page-number-text, var(--emfe-w-color-white, #FFFFFF));
|
|
665
|
+
background: var(--emfe-w-bonus-page-number-active, var(--emfe-w-color-yellow, #F39C12));
|
|
664
666
|
border-radius: 50%;
|
|
665
667
|
}
|
|
666
668
|
}
|
|
667
669
|
}
|
|
668
670
|
|
|
669
671
|
.BonusCodeContainer {
|
|
670
|
-
color: var(--emfe-w-bonus-page-number-text,var(--emfe-w-color-black, #000000));
|
|
672
|
+
color: var(--emfe-w-bonus-page-number-text, var(--emfe-w-color-black, #000000));
|
|
671
673
|
display: flex;
|
|
672
674
|
flex-direction: column;
|
|
673
675
|
position: relative;
|
|
@@ -682,7 +684,7 @@
|
|
|
682
684
|
padding-bottom: 20px;
|
|
683
685
|
}
|
|
684
686
|
.Asterisk {
|
|
685
|
-
color : var(--emfe-w-bonus-card-red,var(--emfe-w-color-red, #FD2839));
|
|
687
|
+
color : var(--emfe-w-bonus-card-red, var(--emfe-w-color-red, #FD2839));
|
|
686
688
|
}
|
|
687
689
|
&.BonusCodeContainerMobile {
|
|
688
690
|
width: 100%;
|
|
@@ -699,14 +701,14 @@
|
|
|
699
701
|
.BonusCodeInput {
|
|
700
702
|
flex:3;
|
|
701
703
|
height: 50px;
|
|
702
|
-
border: 1px solid var(--emfe-w-bonus-code-border,var(--emfe-w-color-gray-50, #D1D1D1));
|
|
704
|
+
border: 1px solid var(--emfe-w-bonus-code-border, var(--emfe-w-color-gray-50, #D1D1D1));
|
|
703
705
|
border-radius: 5px;
|
|
704
706
|
box-sizing: border-box;
|
|
705
707
|
padding: 5px 15px;
|
|
706
708
|
font-size: 16px;
|
|
707
709
|
line-height: 18px;
|
|
708
710
|
&:focus {
|
|
709
|
-
outline-color: var(--emfe-w-bonus-code-outline,var(--emfe-w-color-gray-100, #C1C1C1));
|
|
711
|
+
outline-color: var(--emfe-w-bonus-code-outline, var(--emfe-w-color-gray-100, #C1C1C1));
|
|
710
712
|
}
|
|
711
713
|
&.BonusCodeInputMobile {
|
|
712
714
|
width: 100%;
|
|
@@ -714,8 +716,8 @@
|
|
|
714
716
|
}
|
|
715
717
|
|
|
716
718
|
.BonusClaimButton {
|
|
717
|
-
background: var(--emfe-w-bonus-claim-bg,var(--emfe-w-color-yellow, #F39C12));
|
|
718
|
-
outline: 5px solid var(--emfe-w-bonus-claim-outline,var(--emfe-w-color-yellow, rgba(243,156,18,0.3)));
|
|
719
|
+
background: var(--emfe-w-bonus-claim-bg, var(--emfe-w-color-yellow, #F39C12));
|
|
720
|
+
outline: 5px solid var(--emfe-w-bonus-claim-outline, var(--emfe-w-color-yellow, rgba(243, 156, 18, 0.3)));
|
|
719
721
|
border-radius: 9px;
|
|
720
722
|
border: 0;
|
|
721
723
|
width: 180px;
|
|
@@ -727,7 +729,7 @@
|
|
|
727
729
|
box-sizing: border-box;
|
|
728
730
|
margin-top:5px;
|
|
729
731
|
cursor: pointer;
|
|
730
|
-
color: var(--emfe-w-bonus-claim-text,var(--emfe-w-color-white, #FFFFFF));
|
|
732
|
+
color: var(--emfe-w-bonus-claim-text, var(--emfe-w-color-white, #FFFFFF));
|
|
731
733
|
&[disabled] {
|
|
732
734
|
opacity: 0.3;
|
|
733
735
|
cursor: not-allowed;
|
|
@@ -736,12 +738,12 @@
|
|
|
736
738
|
width: 100%;
|
|
737
739
|
}
|
|
738
740
|
&:hover {
|
|
739
|
-
background: var(--emfe-w-bonus-claim-hover-bg,var(--emfe-w-color-yellow, #F38B12));
|
|
741
|
+
background: var(--emfe-w-bonus-claim-hover-bg, var(--emfe-w-color-yellow, #F38B12));
|
|
740
742
|
outline: 0;
|
|
741
743
|
}
|
|
742
744
|
&:active {
|
|
743
|
-
background: var(--emfe-w-bonus-claim-active-bg,var(--emfe-w-color-yellow, #F38B12));
|
|
744
|
-
outline-color: var(--emfe-w-bonus-claim-active-outline,var(--emfe-w-color-white, rgba(243, 156, 18, 0.6)));
|
|
745
|
+
background: var(--emfe-w-bonus-claim-active-bg, var(--emfe-w-color-yellow, #F38B12));
|
|
746
|
+
outline-color: var(--emfe-w-bonus-claim-active-outline, var(--emfe-w-color-white, rgba(243, 156, 18, 0.6)));
|
|
745
747
|
}
|
|
746
748
|
}
|
|
747
749
|
}
|
|
@@ -765,20 +767,20 @@
|
|
|
765
767
|
right: 0;
|
|
766
768
|
bottom: 0;
|
|
767
769
|
left: 0;
|
|
768
|
-
background-color: var(--emfe-w-bonus-modal-bg,var(--emfe-w-color-black, rgba(0,0,0,0.7)));
|
|
770
|
+
background-color: var(--emfe-w-bonus-modal-bg, var(--emfe-w-color-black, rgba(0, 0, 0, 0.7)));
|
|
769
771
|
display: flex;
|
|
770
772
|
justify-content: center;
|
|
771
773
|
align-items: center;
|
|
772
774
|
z-index: 100;
|
|
773
775
|
.ModalContent {
|
|
774
|
-
background-color: var(--emfe-w-bonus-modal-bg,var(--emfe-w-color-white, #FFFFFF));
|
|
776
|
+
background-color: var(--emfe-w-bonus-modal-bg, var(--emfe-w-color-white, #FFFFFF));
|
|
775
777
|
position: relative;
|
|
776
778
|
padding: 30px;
|
|
777
|
-
border-top: 5px solid var(--emfe-w-bonus-modal-border,var(--emfe-w-color-primary, #00AEEF));
|
|
779
|
+
border-top: 5px solid var(--emfe-w-bonus-modal-border, var(--emfe-w-color-primary, #00AEEF));
|
|
778
780
|
border-radius: 5px;
|
|
779
781
|
}
|
|
780
782
|
.ModalBody {
|
|
781
|
-
background-color: var(--emfe-w-bonus-modal-bg,var(--emfe-w-color-gray-50, #F9F8F8));
|
|
783
|
+
background-color: var(--emfe-w-bonus-modal-bg, var(--emfe-w-color-gray-50, #F9F8F8));
|
|
782
784
|
padding: 30px;
|
|
783
785
|
text-align: center;
|
|
784
786
|
.ModalText {
|
|
@@ -791,8 +793,8 @@
|
|
|
791
793
|
}
|
|
792
794
|
.ModalCancel, .ModalConfirm {
|
|
793
795
|
background: transparent;
|
|
794
|
-
border: 1px solid var(--emfe-w-bonus-modal-border,var(--emfe-w-color-gray-300, #58586B));
|
|
795
|
-
color: var(--emfe-w-bonus-modal-text,var(--emfe-w-color-gray-300, #58586B));
|
|
796
|
+
border: 1px solid var(--emfe-w-bonus-modal-border, var(--emfe-w-color-gray-300, #58586B));
|
|
797
|
+
color: var(--emfe-w-bonus-modal-text, var(--emfe-w-color-gray-300, #58586B));
|
|
796
798
|
cursor: pointer;
|
|
797
799
|
border-radius: 5px;
|
|
798
800
|
width: 180px;
|
|
@@ -805,9 +807,9 @@
|
|
|
805
807
|
padding: 10px;
|
|
806
808
|
}
|
|
807
809
|
.ModalConfirm {
|
|
808
|
-
background: var(--emfe-w-bonus-modal-bg,var(--emfe-w-color-primary, #00AEEF));
|
|
809
|
-
border: 1px solid var(--emfe-w-bonus-modal-bg,var(--emfe-w-color-primary, #00AEEF));
|
|
810
|
-
color: var(--emfe-w-bonus-modal-text,var(--emfe-w-color-white, #FFFFFF));
|
|
810
|
+
background: var(--emfe-w-bonus-modal-bg, var(--emfe-w-color-primary, #00AEEF));
|
|
811
|
+
border: 1px solid var(--emfe-w-bonus-modal-bg, var(--emfe-w-color-primary, #00AEEF));
|
|
812
|
+
color: var(--emfe-w-bonus-modal-text, var(--emfe-w-color-white, #FFFFFF));
|
|
811
813
|
}
|
|
812
814
|
}
|
|
813
815
|
}
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
let isButtonClickable: boolean = true;
|
|
26
26
|
let showTerms: boolean = false;
|
|
27
27
|
let claimBonusError: boolean = false;
|
|
28
|
-
let bonusDescription:
|
|
28
|
+
let bonusDescription: any = {};
|
|
29
29
|
let currencySymbol: string;
|
|
30
30
|
let expiryTime: string;
|
|
31
31
|
let endTime: string = '';
|
|
@@ -39,18 +39,18 @@
|
|
|
39
39
|
let sliderOffset: number = 0;
|
|
40
40
|
|
|
41
41
|
const setTranslationUrl = (): void => {
|
|
42
|
-
let url:string = translationurl;
|
|
42
|
+
let url: string = translationurl;
|
|
43
43
|
|
|
44
|
-
fetch(url).then((res:any) => res.json())
|
|
44
|
+
fetch(url).then((res: any) => res.json())
|
|
45
45
|
.then((res) => {
|
|
46
|
-
Object.keys(res).forEach((item:any):void => {
|
|
46
|
+
Object.keys(res).forEach((item: any): void => {
|
|
47
47
|
addNewMessages(item, res[item]);
|
|
48
48
|
});
|
|
49
|
-
}).catch((err:any) => {
|
|
49
|
+
}).catch((err: any) => {
|
|
50
50
|
console.log(err);
|
|
51
51
|
});
|
|
52
52
|
}
|
|
53
|
-
Object.keys(TRANSLATIONS).forEach((item:any) => {
|
|
53
|
+
Object.keys(TRANSLATIONS).forEach((item: any) => {
|
|
54
54
|
addNewMessages(item, TRANSLATIONS[item]);
|
|
55
55
|
});
|
|
56
56
|
$:{
|
|
@@ -69,7 +69,7 @@
|
|
|
69
69
|
isMounted = false;
|
|
70
70
|
}
|
|
71
71
|
})
|
|
72
|
-
const init = (): void =>{
|
|
72
|
+
const init = (): void => {
|
|
73
73
|
try {
|
|
74
74
|
bonus = JSON.parse(rawbonus);
|
|
75
75
|
} catch (e){
|
|
@@ -87,11 +87,11 @@
|
|
|
87
87
|
}
|
|
88
88
|
setIntervalTime()
|
|
89
89
|
}
|
|
90
|
-
const getGames = (freeSpin: any):
|
|
90
|
+
const getGames = (freeSpin: any): Array<any> => {
|
|
91
91
|
if(!freeSpin || !freeSpin.vendorGamesDetail) return [];
|
|
92
92
|
let array = [];
|
|
93
93
|
if(Object.keys(freeSpin.vendorGamesDetail).length > 0){
|
|
94
|
-
Object.keys(freeSpin.vendorGamesDetail).forEach((vendor)=>{
|
|
94
|
+
Object.keys(freeSpin.vendorGamesDetail).forEach((vendor) => {
|
|
95
95
|
array = freeSpin.vendorGamesDetail[vendor];
|
|
96
96
|
});
|
|
97
97
|
}
|
|
@@ -101,7 +101,7 @@
|
|
|
101
101
|
if(!sourceLevels) return [];
|
|
102
102
|
const levels = []
|
|
103
103
|
let infiniteFlag = false;
|
|
104
|
-
sourceLevels.map((l,i)=> {
|
|
104
|
+
sourceLevels.map((l,i) => {
|
|
105
105
|
const { maxRepeats, completedTime, ...rest } = l;
|
|
106
106
|
if(maxRepeats === 0){
|
|
107
107
|
infiniteFlag = true;
|
|
@@ -120,18 +120,18 @@
|
|
|
120
120
|
return levels
|
|
121
121
|
}
|
|
122
122
|
|
|
123
|
-
const eventClaimBonus = (): void =>{
|
|
123
|
+
const eventClaimBonus = (): void => {
|
|
124
124
|
isButtonClickable = false;
|
|
125
125
|
claimBonusError = false;
|
|
126
|
-
window.postMessage({type:'OnBonusClaimed',bonusCode:bonus.code});
|
|
126
|
+
window.postMessage({type:'OnBonusClaimed',bonusCode: bonus.code});
|
|
127
127
|
}
|
|
128
128
|
|
|
129
|
-
const eventForfeitBonus = (): void =>{
|
|
129
|
+
const eventForfeitBonus = (): void => {
|
|
130
130
|
isButtonClickable = false;
|
|
131
|
-
window.postMessage({type:'OnBonusForfeit',bonus:bonus});
|
|
131
|
+
window.postMessage({type:'OnBonusForfeit',bonus: bonus});
|
|
132
132
|
}
|
|
133
133
|
|
|
134
|
-
const messageHandler = (e:any): void =>{
|
|
134
|
+
const messageHandler = (e: any): void => {
|
|
135
135
|
switch (e.data.type) {
|
|
136
136
|
case 'OnBonusClaimedDone':
|
|
137
137
|
isButtonClickable = true;
|
|
@@ -216,7 +216,7 @@
|
|
|
216
216
|
}
|
|
217
217
|
}
|
|
218
218
|
|
|
219
|
-
const getWagered = (bonus: any): number=>{
|
|
219
|
+
const getWagered = (bonus: any): number => {
|
|
220
220
|
let wagered = (bonus.initialWagerRequirementAmount * 10 - bonus.remainingWagerRequirementAmount * 10) / 10;
|
|
221
221
|
if(bonus.status === 'released'){
|
|
222
222
|
wagered += bonus.remainingAmount;
|
|
@@ -224,8 +224,8 @@
|
|
|
224
224
|
return wagered;
|
|
225
225
|
}
|
|
226
226
|
|
|
227
|
-
const getWageringWagered = (bonus: any):
|
|
228
|
-
return((bonus.wageringProgress?.currentLevelIncrement * 10 - bonus.wageringProgress?.gap * 10) / 10).toFixed(1);
|
|
227
|
+
const getWageringWagered = (bonus: any): string => {
|
|
228
|
+
return ((bonus.wageringProgress?.currentLevelIncrement * 10 - bonus.wageringProgress?.gap * 10) / 10).toFixed(1);
|
|
229
229
|
}
|
|
230
230
|
|
|
231
231
|
const getProgressValue = (bonus: any): number => {
|
|
@@ -247,17 +247,17 @@
|
|
|
247
247
|
return Number(wageredAmount);
|
|
248
248
|
}
|
|
249
249
|
|
|
250
|
-
const getTimeFormat = (time: string): string=> {
|
|
250
|
+
const getTimeFormat = (time: string): string => {
|
|
251
251
|
return moment(time).format('YYYY-MM-DD hh:mm:ss');
|
|
252
252
|
}
|
|
253
253
|
|
|
254
|
-
const getValidity = (bonus: any): string=>{
|
|
254
|
+
const getValidity = (bonus: any): string => {
|
|
255
255
|
if(!bonus.wallet) return;
|
|
256
256
|
let validity = bonus.wallet.validityMinutes;
|
|
257
257
|
return validity === 0 ? 'infinite' : Math.round(validity / 1440) + ' days';
|
|
258
258
|
}
|
|
259
259
|
|
|
260
|
-
const getProduct = (bonus: any): string=>{
|
|
260
|
+
const getProduct = (bonus: any): Array<string> => {
|
|
261
261
|
if(bonus.products){
|
|
262
262
|
return bonus.products;
|
|
263
263
|
}else{
|
|
@@ -367,15 +367,15 @@
|
|
|
367
367
|
])
|
|
368
368
|
}
|
|
369
369
|
}
|
|
370
|
-
const getBonusUrl = (bonus: any): void =>{
|
|
370
|
+
const getBonusUrl = (bonus: any): void => {
|
|
371
371
|
tcurl = bonus.url ? bonus.url : bonus.presentation?.url?.content;
|
|
372
372
|
}
|
|
373
373
|
|
|
374
|
-
const classWithPart = (partAndClass: any, extraClass: string = ''):
|
|
374
|
+
const classWithPart = (partAndClass: any, extraClass: string = ''): any => ({
|
|
375
375
|
part: partAndClass,
|
|
376
376
|
class: [partAndClass, extraClass].join(' '),
|
|
377
377
|
});
|
|
378
|
-
const gameClicked = (game:any): void => {
|
|
378
|
+
const gameClicked = (game: any): void => {
|
|
379
379
|
window.postMessage({ type: 'BonusGameAction', gameId: game.id, name: game.name, gameLaunchUrl: game.href }, window.location.href);
|
|
380
380
|
}
|
|
381
381
|
const enter = (index: number): void => {
|
|
@@ -409,12 +409,12 @@
|
|
|
409
409
|
}
|
|
410
410
|
|
|
411
411
|
const setClientStylingURL = (): void => {
|
|
412
|
-
let url:URL = new URL(clientstylingurl);
|
|
413
|
-
let cssFile:HTMLElement = document.createElement('style');
|
|
412
|
+
let url: URL = new URL(clientstylingurl);
|
|
413
|
+
let cssFile: HTMLElement = document.createElement('style');
|
|
414
414
|
|
|
415
415
|
fetch(url.href)
|
|
416
|
-
.then((res:any) => res.text())
|
|
417
|
-
.then((data:any) => {
|
|
416
|
+
.then((res: any) => res.text())
|
|
417
|
+
.then((data: any) => {
|
|
418
418
|
cssFile.innerHTML = data
|
|
419
419
|
|
|
420
420
|
setTimeout(() => { customStylingContainer.appendChild(cssFile) }, 1);
|
|
@@ -484,7 +484,7 @@
|
|
|
484
484
|
{expiryTime}
|
|
485
485
|
</span>
|
|
486
486
|
{:else if status === 'completed'}
|
|
487
|
-
<p {...classWithPart('BonusCardTitleSub')}>{bonus.status}</p>
|
|
487
|
+
<p {...classWithPart('BonusCardTitleSub')}>{$_(`bonusCard.${bonus.status}`)}</p>
|
|
488
488
|
{/if}
|
|
489
489
|
</div>
|
|
490
490
|
{#if showDataSection}
|
|
@@ -521,9 +521,9 @@
|
|
|
521
521
|
class:StatusCompleted={status === 'completed'}
|
|
522
522
|
class:StatusClaimable={status === 'claimable'}>
|
|
523
523
|
{#if status === 'active'}
|
|
524
|
-
{status}
|
|
524
|
+
{$_(`bonusCard.${status}`)}
|
|
525
525
|
{:else}
|
|
526
|
-
{bonus.status}
|
|
526
|
+
{$_(`bonusCard.${bonus.status}`)}
|
|
527
527
|
{/if}
|
|
528
528
|
</span>
|
|
529
529
|
</p>
|
package/src/translation.js
CHANGED
|
@@ -57,7 +57,14 @@ export const TRANSLATIONS = {
|
|
|
57
57
|
"betCount": "Bet Count",
|
|
58
58
|
"allRewards": "All Rewards",
|
|
59
59
|
"error": "Join failed, please try again.",
|
|
60
|
-
"playNow": "Play Now"
|
|
60
|
+
"playNow": "Play Now",
|
|
61
|
+
"active": "Active",
|
|
62
|
+
"expired": "Expired",
|
|
63
|
+
"forfeited": "Forfeited",
|
|
64
|
+
"released": "Released",
|
|
65
|
+
"closed": "Closed",
|
|
66
|
+
"completed": "Completed",
|
|
67
|
+
"claimable": "Claimable"
|
|
61
68
|
}
|
|
62
69
|
}
|
|
63
70
|
};
|