@everymatrix/casino-challenges-overlay 0.21.17 → 0.21.19
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/dist/casino-challenges-overlay/casino-challenge-details-events_23.entry.js +1 -1
- package/dist/casino-challenges-overlay/casino-challenges-overlay-241ddb3f.js +1 -0
- package/dist/casino-challenges-overlay/index.esm.js +1 -1
- package/dist/cjs/casino-challenge-details-events_23.cjs.entry.js +11 -5
- package/dist/cjs/casino-challenges-overlay-ba80fe26.js +669 -0
- package/dist/cjs/index.cjs.js +1 -1
- package/dist/collection/assets/bg-icon.svg +1 -1
- package/dist/collection/assets/join.svg +7 -0
- package/dist/collection/components/casino-challenges-overlay/casino-challenges-overlay.css +8 -0
- package/dist/collection/components/casino-challenges-overlay/casino-challenges-overlay.js +9 -5
- package/dist/esm/casino-challenge-details-events_23.entry.js +12 -6
- package/dist/esm/casino-challenges-overlay-241ddb3f.js +664 -0
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/dist/casino-challenges-overlay/casino-challenges-overlay-b8bd0c04.js +0 -1
- package/dist/cjs/casino-challenges-overlay-f9d1f322.js +0 -664
- package/dist/esm/casino-challenges-overlay-b8bd0c04.js +0 -659
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const casinoChallengesOverlay = require('./casino-challenges-overlay-
|
|
5
|
+
const casinoChallengesOverlay = require('./casino-challenges-overlay-ba80fe26.js');
|
|
6
6
|
require('./index-6300a889.js');
|
|
7
7
|
|
|
8
8
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<svg width="55" height="32" viewBox="0 0 55 32" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
2
|
-
<rect width="55" height="32" rx="16" fill="url(#pattern0_2154_4439)"/>
|
|
2
|
+
<rect width="55" height="32" rx="16" fill="url(#pattern0_2154_4439) none"/>
|
|
3
3
|
<defs>
|
|
4
4
|
<pattern id="pattern0_2154_4439" patternContentUnits="objectBoundingBox" width="1" height="1">
|
|
5
5
|
<use xlink:href="#image0_2154_4439" transform="matrix(0.001413 0 0 0.0023871 -0.144639 0.107658)"/>
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
<svg width="22" height="24" viewBox="0 0 22 24" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path
|
|
3
|
+
transform="translate(0 4)"
|
|
4
|
+
fill="#000000"
|
|
5
|
+
d="M4.50391 2.08691C4.5912 0.816495 6.00585 0.0999604 7.10059 0.735352L16.6416 6.27148L16.8291 6.39551C17.0071 6.531 17.1575 6.70082 17.2705 6.89551C17.4212 7.15509 17.5009 7.44987 17.501 7.75C17.501 8.05035 17.4213 8.34573 17.2705 8.60547C17.1197 8.86521 16.9024 9.08059 16.6416 9.22949L7.10059 14.7656C5.97264 15.4194 4.5 14.6365 4.5 13.2871V2.21191L4.50391 2.08691Z"
|
|
6
|
+
/>
|
|
7
|
+
</svg>
|
|
@@ -37,6 +37,14 @@
|
|
|
37
37
|
letter-spacing: -0.22px;
|
|
38
38
|
text-transform: uppercase;
|
|
39
39
|
}
|
|
40
|
+
.circle__content .join-icon {
|
|
41
|
+
width: 22px;
|
|
42
|
+
height: 24px;
|
|
43
|
+
background: var(--emw--color-join-icon, linear-gradient(101deg, #ff9400 12.92%, #ffe24a 72.12%, #fef746 99.3%));
|
|
44
|
+
-webkit-mask: var(--join-icon-mask) no-repeat center/contain;
|
|
45
|
+
mask: var(--join-icon-mask) no-repeat center/contain;
|
|
46
|
+
filter: var(--emw--join-icon-box-shadow, drop-shadow(0 3px 4px rgba(0, 0, 0, 0.4)));
|
|
47
|
+
}
|
|
40
48
|
.circle__img {
|
|
41
49
|
position: absolute;
|
|
42
50
|
left: 0;
|
|
@@ -3,6 +3,7 @@ import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../.
|
|
|
3
3
|
import bgIcon from "../../assets/bg-icon.svg";
|
|
4
4
|
import bellIcon from "../../assets/bell.svg";
|
|
5
5
|
import giftIcon from "../../assets/gift.svg";
|
|
6
|
+
import joinIcon from "../../assets/join.svg";
|
|
6
7
|
import { resolveTranslationUrl, translate } from "../../utils/locale.utils";
|
|
7
8
|
import { EChallengeProgressLevelStatus, EChallengeProgressStatus, EChallengeRewardType, EChallengesTabs, EFeatureFlags } from "../../utils/types";
|
|
8
9
|
import "../../../../../casino-challenges-overlay-modal/dist/types/index";
|
|
@@ -394,21 +395,24 @@ export class CasinoChallengesOverlay {
|
|
|
394
395
|
}
|
|
395
396
|
render() {
|
|
396
397
|
var _a, _b, _c;
|
|
397
|
-
|
|
398
|
+
let currProgress = this.completedLevelId ? 100 : this.progress;
|
|
398
399
|
const dot = this.getCapsuleDotPosition(currProgress);
|
|
399
400
|
const hasActiveProgress = this.inProgressCount > 0;
|
|
400
401
|
const activeProgressId = hasActiveProgress
|
|
401
402
|
? (_a = this.activeChallenge) === null || _a === void 0 ? void 0 : _a.Id
|
|
402
403
|
: (_c = (_b = this.challenges) === null || _b === void 0 ? void 0 : _b.find(this.isActiveChallenge)) === null || _c === void 0 ? void 0 : _c.Id;
|
|
403
|
-
|
|
404
|
+
if (!hasActiveProgress) {
|
|
405
|
+
currProgress = 100;
|
|
406
|
+
}
|
|
407
|
+
return (h("div", { key: 'b2f7821020d8a4b0e19ba22ba7e100f7977e5440', ref: (el) => (this.stylingContainer = el) }, h("div", { key: 'f902ff6a4ae2c5a473c1104bf2885949320cc70d', class: "container", onClick: this.handleClick }, h("div", { key: '89152c3831113c328b5f354a88cd212612c24244', class: "circle", style: {
|
|
404
408
|
'--progress': `${currProgress}%`
|
|
405
|
-
} }, h("img", { key: '
|
|
409
|
+
} }, h("img", { key: '3dc55842963560598fef9d3186cf3f37a035e4b5', class: "circle__img", src: bgIcon }), h("div", { key: '9244e9d61490cc44803a2a4c01679b377734f384', class: "circle__content" }, hasActiveProgress ? (h("span", null, Math.floor(currProgress), "%")) : (h("span", { class: "join-icon", style: { '--join-icon-mask': `url(${joinIcon})` } }))), dot && (h("div", { key: '291b8c266815b80ca4121227132581df8146ccd9', class: "dot", style: {
|
|
406
410
|
left: `${dot.x}px`,
|
|
407
411
|
top: `${dot.y}px`
|
|
408
|
-
} }))), hasActiveProgress && (h("div", { key: '
|
|
412
|
+
} }))), hasActiveProgress && (h("div", { key: '33b0e12cc8dfc8344ca4a27d904515d65c6cf5a7', class: {
|
|
409
413
|
badge: true,
|
|
410
414
|
new: this.isNew
|
|
411
|
-
} }, this.renderBadgeContent()))), h("casino-challenges-overlay-modal", { key: '
|
|
415
|
+
} }, this.renderBadgeContent()))), h("casino-challenges-overlay-modal", { key: '4cc75815533a7eb1a844660aeda1ab4b5efad2d5', isOpen: this.showModal, handleClick: this.closeModal, reward: this.modalReward, addition: this.modalAddition, isFreeSpinsGranted: this.modalIsFreeSpinsGranted, bonusProgramGames: this.modalBonusProgramGames, errored: this.modalErrored, orderNumber: this.modalOrderNumber, translationUrl: this.translationUrl, language: this.language, mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl }), this.extendedIngameWidget && (h("casino-challenges-overlay-drawer", { key: 'a437ea7454628d3c68a43bb03b450320828af481', mbSource: this.mbSource, clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, translationUrl: this.translationUrl, language: this.language, isOpen: this.showDrawer, handleClose: this.closeDrawer, challenges: this.challenges, initialProgressId: activeProgressId, enabledWidgetTabs: this.enabledWidgetTabs }))));
|
|
412
416
|
}
|
|
413
417
|
static get is() { return "casino-challenges-overlay"; }
|
|
414
418
|
static get encapsulation() { return "shadow"; }
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { r as registerInstance, h, H as Host, c as createEvent, g as getElement } from './index-b4a452f5.js';
|
|
2
|
-
import { s as setClientStyling, a as setClientStylingURL, b as setStreamStyling } from './casino-challenges-overlay-
|
|
3
|
-
export { C as casino_challenges_overlay } from './casino-challenges-overlay-
|
|
2
|
+
import { s as setClientStyling, a as setClientStylingURL, b as setStreamStyling } from './casino-challenges-overlay-241ddb3f.js';
|
|
3
|
+
export { C as casino_challenges_overlay } from './casino-challenges-overlay-241ddb3f.js';
|
|
4
4
|
|
|
5
5
|
const DEFAULT_LANGUAGE$3 = 'en';
|
|
6
6
|
const TRANSLATIONS$3 = {
|
|
@@ -5092,6 +5092,12 @@ const CasinoChallengesOverlayModal = class {
|
|
|
5092
5092
|
this.checkIsMobile = () => {
|
|
5093
5093
|
this.isMobile = window.innerWidth <= 768 || window.innerHeight < 660;
|
|
5094
5094
|
};
|
|
5095
|
+
this.renderLevelNumberLine = () => {
|
|
5096
|
+
const level = translate('level', this.language);
|
|
5097
|
+
if (!level)
|
|
5098
|
+
return '';
|
|
5099
|
+
return `${level} ${this.orderNumber} ${translate('completed', this.language)}`;
|
|
5100
|
+
};
|
|
5095
5101
|
this.mbSource = undefined;
|
|
5096
5102
|
this.clientStyling = undefined;
|
|
5097
5103
|
this.clientStylingUrl = undefined;
|
|
@@ -5166,17 +5172,17 @@ const CasinoChallengesOverlayModal = class {
|
|
|
5166
5172
|
}
|
|
5167
5173
|
render() {
|
|
5168
5174
|
var _a;
|
|
5169
|
-
return (h("div", { key: '
|
|
5175
|
+
return (h("div", { key: '6824bc8814d29ff948e0f2f359a252e627563e65', ref: (el) => (this.stylingContainer = el), class: {
|
|
5170
5176
|
ModalOverlay: true,
|
|
5171
5177
|
Mobile: this.isMobile,
|
|
5172
5178
|
Open: this.isOpen
|
|
5173
|
-
} }, h("div", { key: '
|
|
5179
|
+
} }, h("div", { key: 'fa8d34624a19d1e4b020e96b1ddda4431212d887', class: "ModalWinAnimation" }), h("div", { key: 'de3257f178b672deb881008f7b658d8b9f87fe3b', class: "ModalWrapper" }, h("div", { key: 'b4e419a0b7601ab033f55dbcabce45a5b55e4d28', class: "ModalContent GradientBorder" }, h("div", { key: '129b2e410322e368af824e742a071d9cf603baf8', class: "InnerContainer" }, !this.errored && (h("div", { key: 'd34e9b8b7fefd9a1764866608d57df749aeda92a', class: "ImageWrapper" }, h("img", { key: 'ad762e23947067630c2230d6bbbcaf4ed4a2a02b', src: giftboxSvg, alt: "gift-box-icon" }))), h("h1", { key: '17bf86ab541c1c9b9d8da9ae80dc03d7b97a9d17', class: "ModalHeader" }, translate(this.errored ? 'errorTitle' : 'congrats', this.language)), this.errored ? (h("div", { class: "ModalErrorMessage" }, translate('errorSubTitle', this.language))) : (h("div", { class: "ModalSubtitle" }, this.renderLevelNumberLine(), h("div", null, translate('youWon', this.language)), h("div", { class: "ModalReward" }, this.reward), this.isFreeSpinsGranted && (h("div", { class: "ModalAddition" }, translate('playNowOrLater', this.language))), h("div", { class: "ModalAddition" }, translate('rewardInLobby', this.language)))), this.addition && (h("div", { key: '595839da89f0efad0974e9fdf4950924cec0f311', class: "ModalAddition" }, h("div", { key: '23e6272316625e2132cc2129e5e2b1edfa007045' }, translate('physicalReward', this.language)), h("span", { key: '8823d18428fdc98fb7072c655a97791c37606d80' }, translate('linkText', this.language)))), h("button", { key: 'e8433be561238c3a8debcb4729d14fd39f6aaa26', class: "ModalAction", onClick: this.handleClick }, this.errored ? translate('errorBtnText', this.language) : translate('continue', this.language)), this.isFreeSpinsGranted && ((_a = this.bonusProgramGames) === null || _a === void 0 ? void 0 : _a.length) > 0 && (h("div", { key: '5dd51a8bd8adb11ace9b53e034ae8848f4b62c6b', class: "ModalSliderWrapper" }, h("div", { key: 'ce01d40f1b50b94b0c6feee89aae72abcca70318', class: "ModalSlider", ref: (el) => (this.sliderContainer = el), onPointerDown: this.onPointerDown, onPointerMove: this.onPointerMove, onPointerUp: this.onPointerUp, onPointerLeave: this.onPointerUp }, this.bonusProgramGames.map((item) => (h("div", { class: "ModalSlide", key: item.GameSlug, "data-slug": item.GameSlug }, h("div", { class: "ModalSlideImageWrapper" }, h("img", { src: item.Thumbnail, alt: "" })), h("div", { class: "ModalSlideSpins" }, translate('useSpinsNow', this.language), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "6", height: "10", viewBox: "0 0 6 10", fill: "none" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M0.195262 0.195262C0.455612 -0.0650874 0.877722 -0.0650874 1.13807 0.195262L5.13807 4.19526C5.39842 4.45561 5.39842 4.87772 5.13807 5.13807L1.13807 9.13807C0.877722 9.39842 0.455612 9.39842 0.195262 9.13807C-0.0650874 8.87772 -0.0650874 8.45561 0.195262 8.19526L3.72386 4.66667L0.195262 1.13807C-0.0650874 0.877722 -0.0650874 0.455612 0.195262 0.195262Z", fill: "white" }))))))), this.bonusProgramGames.length > 1 && (h("div", { key: '65a943274a45300a78187859f0801639b824a5e9' }, h("button", { key: 'ba2dd62f4996c110a7742f8b08f3415324122450', class: {
|
|
5174
5180
|
prev: true,
|
|
5175
5181
|
disabled: this.currentIndex === 0
|
|
5176
|
-
}, onClick: this.prev }, h("svg", { key: '
|
|
5182
|
+
}, onClick: this.prev }, h("svg", { key: 'fc642e0d6ec383ac7fc5e292f2a67decc4ca6934', xmlns: "http://www.w3.org/2000/svg", width: "6", height: "10", viewBox: "0 0 6 10", fill: "none" }, h("path", { key: '986491bc4163bbf5d2570a9faeaa59fdbea02e4f', d: "M5 1L1 5L5 9", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("button", { key: 'c5d591044f4eaa88f19439b3d5925ad975445121', class: {
|
|
5177
5183
|
next: true,
|
|
5178
5184
|
disabled: this.currentIndex === this.bonusProgramGames.length - 1
|
|
5179
|
-
}, onClick: this.next }, h("svg", { key: '
|
|
5185
|
+
}, onClick: this.next }, h("svg", { key: 'bd08a79b7818a1ffa0d8719ec3fb476fd3239f41', xmlns: "http://www.w3.org/2000/svg", width: "6", height: "10", viewBox: "0 0 6 10", fill: "none" }, h("path", { key: '46c0e58123f6a78e5f6def9816941c64be2a167d', d: "M1 1L5 5L1 9", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }))), h("div", { key: 'c597fcea75343d0a133f48e579786d632674404a', class: "ModalSliderDots" }, this.bonusProgramGames.map((_, i) => (h("span", { class: {
|
|
5180
5186
|
ModalSliderDot: true,
|
|
5181
5187
|
active: i === this.currentIndex
|
|
5182
5188
|
}, onClick: () => {
|