@everymatrix/gamification-dropdown 1.54.12 → 1.56.0
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/cjs/{gamification-dropdown-756a43c2.js → gamification-dropdown-b8288984.js} +86 -30
- package/dist/cjs/gamification-dropdown.cjs.js +2 -2
- package/dist/cjs/gamification-dropdown_4.cjs.entry.js +4 -4
- package/dist/cjs/{index-547b95bf.js → index-ec2fd1aa.js} +11 -3
- package/dist/cjs/index.cjs.js +2 -2
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{player-elevate-card-items-705345d8.js → player-elevate-card-items-a73ef8aa.js} +1 -1
- package/dist/cjs/player-elevate-card.cjs.entry.js +2 -2
- package/dist/cjs/player-elevate-pointcard.cjs.entry.js +2 -2
- package/dist/collection/components/gamification-dropdown/gamification-dropdown.js +51 -29
- package/dist/esm/{gamification-dropdown-370424de.js → gamification-dropdown-246b88da.js} +86 -30
- package/dist/esm/gamification-dropdown.js +3 -3
- package/dist/esm/gamification-dropdown_4.entry.js +4 -4
- package/dist/esm/{index-1ed44842.js → index-30fda5fb.js} +11 -3
- package/dist/esm/index.js +2 -2
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{player-elevate-card-items-4e46b4c8.js → player-elevate-card-items-be1e68f1.js} +1 -1
- package/dist/esm/player-elevate-card.entry.js +2 -2
- package/dist/esm/player-elevate-pointcard.entry.js +2 -2
- package/dist/gamification-dropdown/gamification-dropdown.esm.js +1 -1
- package/dist/gamification-dropdown/index.esm.js +1 -1
- package/dist/gamification-dropdown/{p-1c00c3b4.entry.js → p-750bfdce.entry.js} +1 -1
- package/dist/gamification-dropdown/p-9ccf7a30.js +1 -0
- package/dist/gamification-dropdown/{p-17c6de19.entry.js → p-b06e6dd1.entry.js} +1 -1
- package/dist/gamification-dropdown/{p-e4f069bf.js → p-c3422048.js} +1 -1
- package/dist/gamification-dropdown/{p-5cfad4de.entry.js → p-d3088e7c.entry.js} +1 -1
- package/dist/gamification-dropdown/{p-6854f53c.js → p-dec0ad6f.js} +2 -2
- package/dist/types/components/gamification-dropdown/gamification-dropdown.d.ts +9 -4
- package/dist/types/components.d.ts +8 -0
- package/package.json +1 -1
- package/dist/gamification-dropdown/p-7fd023ad.js +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
const index = require('./index-
|
|
3
|
+
const index = require('./index-ec2fd1aa.js');
|
|
4
4
|
|
|
5
5
|
const DEFAULT_LANGUAGE = 'en';
|
|
6
6
|
let TRANSLATIONS = {
|
|
@@ -45,6 +45,63 @@ const translate = (key, customLang) => {
|
|
|
45
45
|
return TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
|
|
46
46
|
};
|
|
47
47
|
|
|
48
|
+
/**
|
|
49
|
+
* @name setClientStyling
|
|
50
|
+
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
51
|
+
* @param {HTMLElement} stylingContainer The reference element of the widget
|
|
52
|
+
* @param {string} clientStyling The style content
|
|
53
|
+
*/
|
|
54
|
+
function setClientStyling(stylingContainer, clientStyling) {
|
|
55
|
+
if (stylingContainer) {
|
|
56
|
+
const sheet = document.createElement('style');
|
|
57
|
+
sheet.innerHTML = clientStyling;
|
|
58
|
+
stylingContainer.appendChild(sheet);
|
|
59
|
+
}
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* @name setClientStylingURL
|
|
64
|
+
* @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
|
|
65
|
+
* @param {HTMLElement} stylingContainer The reference element of the widget
|
|
66
|
+
* @param {string} clientStylingUrl The URL of the style content
|
|
67
|
+
*/
|
|
68
|
+
function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
69
|
+
const url = new URL(clientStylingUrl);
|
|
70
|
+
|
|
71
|
+
fetch(url.href)
|
|
72
|
+
.then((res) => res.text())
|
|
73
|
+
.then((data) => {
|
|
74
|
+
const cssFile = document.createElement('style');
|
|
75
|
+
cssFile.innerHTML = data;
|
|
76
|
+
if (stylingContainer) {
|
|
77
|
+
stylingContainer.appendChild(cssFile);
|
|
78
|
+
}
|
|
79
|
+
})
|
|
80
|
+
.catch((err) => {
|
|
81
|
+
console.error('There was an error while trying to load client styling from URL', err);
|
|
82
|
+
});
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
/**
|
|
86
|
+
* @name setStreamLibrary
|
|
87
|
+
* @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
|
|
88
|
+
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
89
|
+
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
90
|
+
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
91
|
+
*/
|
|
92
|
+
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
93
|
+
if (window.emMessageBus) {
|
|
94
|
+
const sheet = document.createElement('style');
|
|
95
|
+
|
|
96
|
+
window.emMessageBus.subscribe(domain, (data) => {
|
|
97
|
+
sheet.innerHTML = data;
|
|
98
|
+
if (stylingContainer) {
|
|
99
|
+
stylingContainer.appendChild(sheet);
|
|
100
|
+
}
|
|
101
|
+
});
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
|
|
48
105
|
const gamificationDropdownCss = ":host{display:block}.GamificationDropdownContainer{position:relative}.GamificationDropdownContainer .GamificationDropdown{position:absolute;left:0;z-index:200;overflow:hidden;cursor:pointer}.GamificationDropdownButton{cursor:pointer;font-size:14px;height:20px;background-color:unset;color:var(--emw--color-typography, #FFFFFF);padding:0;border:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;line-height:0}.GamificationDropdownButton:hover{color:var(--emw--color-primary, #52d004)}.GamificationDropdownButton:hover svg{fill:var(--emw--color-primary, #52d004)}.GamificationDropdownButton.IsOpen{color:var(--emw--color-primary, #52d004)}.GamificationDropdownButton.IsOpen svg{fill:var(--emw--color-primary, #52d004)}.GamificationDropdownButton .TriangleActive,.GamificationDropdownButton .TriangleInactive{display:block;transition:all 0.2s}.GamificationDropdownButton .TriangleActive{transform:scale(1.1) rotateX(180deg) translateY(3px);fill:var(--emw--color-primary, #52d004);margin-top:4px}.GamificationDropdownButton svg{fill:var(--emw--color-typography, #FFFFFF);margin-left:8px;width:16px}";
|
|
49
106
|
const GamificationDropdownStyle0 = gamificationDropdownCss;
|
|
50
107
|
|
|
@@ -73,25 +130,6 @@ const GamificationDropdown = class {
|
|
|
73
130
|
this.translationUrl = '';
|
|
74
131
|
this.isOpen = false;
|
|
75
132
|
this.isLoading = false;
|
|
76
|
-
this.stylingAppends = false;
|
|
77
|
-
this.setClientStyling = () => {
|
|
78
|
-
let sheet = document.createElement('style');
|
|
79
|
-
sheet.innerHTML = this.clientStyling;
|
|
80
|
-
this.stylingContainer.prepend(sheet);
|
|
81
|
-
};
|
|
82
|
-
this.setClientStylingURL = () => {
|
|
83
|
-
let url = new URL(this.clientStylingUrl);
|
|
84
|
-
let cssFile = document.createElement('style');
|
|
85
|
-
fetch(url.href)
|
|
86
|
-
.then((res) => res.text())
|
|
87
|
-
.then((data) => {
|
|
88
|
-
cssFile.innerHTML = data;
|
|
89
|
-
setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
|
|
90
|
-
})
|
|
91
|
-
.catch((err) => {
|
|
92
|
-
console.log('error ', err);
|
|
93
|
-
});
|
|
94
|
-
};
|
|
95
133
|
this.navigateToGamification = () => {
|
|
96
134
|
window.postMessage({ type: 'NavigateToGamification' }, window.location.href);
|
|
97
135
|
this.isOpen = false;
|
|
@@ -120,6 +158,17 @@ const GamificationDropdown = class {
|
|
|
120
158
|
this.isLoading = false;
|
|
121
159
|
});
|
|
122
160
|
}
|
|
161
|
+
handleClientStylingChange(newValue, oldValue) {
|
|
162
|
+
if (newValue != oldValue) {
|
|
163
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
handleClientStylingChangeURL(newValue, oldValue) {
|
|
167
|
+
if (newValue != oldValue) {
|
|
168
|
+
if (this.clientStylingUrl)
|
|
169
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
170
|
+
}
|
|
171
|
+
}
|
|
123
172
|
async componentWillLoad() {
|
|
124
173
|
if (this.translationUrl.length > 2) {
|
|
125
174
|
await getTranslations(this.translationUrl);
|
|
@@ -128,16 +177,21 @@ const GamificationDropdown = class {
|
|
|
128
177
|
return this.fetchPointsData();
|
|
129
178
|
}
|
|
130
179
|
}
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
this.
|
|
138
|
-
|
|
180
|
+
componentDidLoad() {
|
|
181
|
+
if (this.stylingContainer) {
|
|
182
|
+
if (window.emMessageBus != undefined) {
|
|
183
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
|
|
184
|
+
}
|
|
185
|
+
else {
|
|
186
|
+
if (this.clientStyling)
|
|
187
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
188
|
+
if (this.clientStylingUrl)
|
|
189
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
190
|
+
}
|
|
139
191
|
}
|
|
140
|
-
|
|
192
|
+
}
|
|
193
|
+
disconnectedCallback() {
|
|
194
|
+
this.stylingSubscription && this.stylingSubscription.unsubscribe();
|
|
141
195
|
}
|
|
142
196
|
fetchPointsData() {
|
|
143
197
|
let url = new URL(`${this.endpoint}/v1/elevate/playerInfo`);
|
|
@@ -178,7 +232,9 @@ const GamificationDropdown = class {
|
|
|
178
232
|
}
|
|
179
233
|
get el() { return index.getElement(this); }
|
|
180
234
|
static get watchers() { return {
|
|
181
|
-
"translationUrl": ["handleNewTranslations"]
|
|
235
|
+
"translationUrl": ["handleNewTranslations"],
|
|
236
|
+
"clientStyling": ["handleClientStylingChange"],
|
|
237
|
+
"clientStylingUrl": ["handleClientStylingChangeURL"]
|
|
182
238
|
}; }
|
|
183
239
|
};
|
|
184
240
|
GamificationDropdown.style = GamificationDropdownStyle0;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-ec2fd1aa.js');
|
|
6
6
|
const appGlobals = require('./app-globals-3a1e7e63.js');
|
|
7
7
|
|
|
8
8
|
/*
|
|
@@ -19,7 +19,7 @@ var patchBrowser = () => {
|
|
|
19
19
|
|
|
20
20
|
patchBrowser().then(async (options) => {
|
|
21
21
|
await appGlobals.globalScripts();
|
|
22
|
-
return index.bootstrapLazy([["gamification-dropdown_4.cjs",[[1,"gamification-dropdown",{"endpoint":[513],"language":[513],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"isOpen":[32],"isLoading":[32],"
|
|
22
|
+
return index.bootstrapLazy([["gamification-dropdown_4.cjs",[[1,"gamification-dropdown",{"endpoint":[513],"language":[513],"session":[513],"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"isOpen":[32],"isLoading":[32],"loyaltyPoints":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}],[1,"player-elevate-loyaltycard",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"dateFormat":[513,"date-format"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"player-elevate-card-data",{"params":[8],"playerElevateLevel":[32],"pointExpireString":[32]},[[9,"resize","handleWindowResizs"],[8,"redeemGiftButton","redeemGiftButtonHandler"]],{"params":["onParamsChanged"]}]]],["player-elevate-card.cjs",[[1,"player-elevate-card",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"dateFormat":[513,"date-format"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerLevelFlag":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}]]],["player-elevate-pointcard.cjs",[[1,"player-elevate-pointcard",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"cardTitle":[513,"card-title"],"buttonType":[513,"button-type"],"dateFormat":[513,"date-format"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32],"elevateSPTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}]]]], options);
|
|
23
23
|
});
|
|
24
24
|
|
|
25
25
|
exports.setNonce = index.setNonce;
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const gamificationDropdown = require('./gamification-dropdown-
|
|
6
|
-
const index = require('./index-
|
|
7
|
-
const playerElevateCardItems = require('./player-elevate-card-items-
|
|
5
|
+
const gamificationDropdown = require('./gamification-dropdown-b8288984.js');
|
|
6
|
+
const index = require('./index-ec2fd1aa.js');
|
|
7
|
+
const playerElevateCardItems = require('./player-elevate-card-items-a73ef8aa.js');
|
|
8
8
|
|
|
9
9
|
const mergeTranslations = (url, target) => {
|
|
10
10
|
return new Promise((resolve) => {
|
|
@@ -619,7 +619,7 @@ const PlayerElevateLoyaltycard = class {
|
|
|
619
619
|
render() {
|
|
620
620
|
const backgroundOuterImagePath = index.getAssetPath('../static/card-ground.svg');
|
|
621
621
|
const backgroundInnerImagePath = index.getAssetPath('../static/card-ground-over.svg');
|
|
622
|
-
return (index.h("div", { key: '
|
|
622
|
+
return (index.h("div", { key: '39295a651da66747a20554699bba5f96b8ad5c35', class: `ElevateCardWrapper ${this.theme}` }, index.h("div", { key: '78c34fe054fc2459f8af3354116cd21a68ce01be', class: "LoyaltyCard Outer", style: { 'backgroundImage': `url(${backgroundOuterImagePath}` } }, index.h("general-styling-wrapper", { key: 'be6efc6da4c3ccf4cc3ece8ecc73561bae75aa20', clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, targetTranslations: playerElevateCardItems.TRANSLATIONS, translationUrl: this.translationUrl }), index.h("player-elevate-card-data", { key: 'b53e4b59d4ee55a2f567efa09afab3d72969e6e4', params: this.paramProxy }), index.h("div", { key: '1f3e504440bab2df3a181058fad7149c85c48c14', class: 'OuterCover Inner', style: { 'backgroundImage': `url(${backgroundInnerImagePath}` } }, index.h("div", { key: 'a07c6cd95770dc1bfd3da78b1c7cc8e1367321b1', class: 'Content Row' }, this.playerElevateLevel && (index.h(index.Fragment, { key: '5c104f5ba1a018219c6ed5f6e50af99b035a0344' }, index.h("div", { key: 'bd94591e6ab9298ab7c769fa48efaf314dc1a63b', class: "PlayerImg" }, index.h(playerElevateCardItems.PlayerAvatar, { key: '928849ce86d8c7a483eba7850efc83f8149bae43', onlyBadge: true, loyaltyIconUrl: this.playerElevateLevel.presentation.asset })), index.h("div", { key: '37192c9b8502eb3c7d93914369df2d784c17e9f7', class: `LevelInfo ${this.playerElevateLevel.name}` }, index.h(playerElevateCardItems.PlayerElevateLoyaltyLevel, { key: '2684a177f4bb1053c4587fd4158666fb35ca23f4', hideInfo: true, level: this.playerElevateLevel.name, expireTime: this.playerElevateLevel.expireTime, dateFormat: this.dateFormat }), index.h("div", { key: '173a37c63868f2d900c12af3ffc2d9a4a57550e4', class: 'PointsRange' }, index.h(playerElevateCardItems.PlayerPoints, { key: 'a7111154f7dc547e0b05c70d24508bdd75c5d882', loyaltyPoints: this.playerElevateLevel.loyaltyPoints, language: this.language }), index.h(playerElevateCardItems.PlayerPoints, { key: 'ad31574e7db81a7ecb7a06b28b1d4968cbcab93e', loyaltyPoints: this.getNextLevelPoints(), language: this.language })), index.h(playerElevateCardItems.PlayerLoyaltyProcess, { key: '88ddfdb326edfb1de9519da6b3d0e5b514725e27' }), index.h("div", { key: 'b9c79555a8001bd2c754d7573df04016da235c84', class: "NextLevelTip" }, this.getNextLevelTips()), this.pointExpireString && (index.h("div", { key: '02da725060c9db4a8c1c2e8bad3426894d7f8f2c', class: 'PointsInfo ExpirationPoints' }, this.pointExpireString, " "))))))))));
|
|
623
623
|
}
|
|
624
624
|
static get watchers() { return {
|
|
625
625
|
"session": ["onSessionOrEndpointChange"],
|
|
@@ -21,7 +21,7 @@ function _interopNamespace(e) {
|
|
|
21
21
|
}
|
|
22
22
|
|
|
23
23
|
const NAMESPACE = 'gamification-dropdown';
|
|
24
|
-
const BUILD = /* gamification-dropdown */ { allRenderFn: false, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad:
|
|
24
|
+
const BUILD = /* gamification-dropdown */ { allRenderFn: false, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: true, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: true, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, lifecycleDOMEvents: false, member: true, method: false, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: false, propMutable: false, propNumber: false, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: true, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: false, watchCallback: true };
|
|
25
25
|
|
|
26
26
|
/*
|
|
27
27
|
Stencil Client Platform v4.26.0 | MIT Licensed | https://stenciljs.com
|
|
@@ -1268,6 +1268,9 @@ var postUpdateComponent = (hostRef) => {
|
|
|
1268
1268
|
{
|
|
1269
1269
|
addHydratedFlag(elm);
|
|
1270
1270
|
}
|
|
1271
|
+
{
|
|
1272
|
+
safeCall(instance, "componentDidLoad", void 0, elm);
|
|
1273
|
+
}
|
|
1271
1274
|
endPostUpdate();
|
|
1272
1275
|
{
|
|
1273
1276
|
hostRef.$onReadyResolve$(elm);
|
|
@@ -1595,6 +1598,9 @@ var setContentReference = (elm) => {
|
|
|
1595
1598
|
insertBefore(elm, contentRefElm, elm.firstChild);
|
|
1596
1599
|
};
|
|
1597
1600
|
var disconnectInstance = (instance, elm) => {
|
|
1601
|
+
{
|
|
1602
|
+
safeCall(instance, "disconnectedCallback", void 0, elm || instance);
|
|
1603
|
+
}
|
|
1598
1604
|
};
|
|
1599
1605
|
var disconnectedCallback = async (elm) => {
|
|
1600
1606
|
if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
|
|
@@ -1605,8 +1611,10 @@ var disconnectedCallback = async (elm) => {
|
|
|
1605
1611
|
hostRef.$rmListeners$ = void 0;
|
|
1606
1612
|
}
|
|
1607
1613
|
}
|
|
1608
|
-
if (hostRef == null ? void 0 : hostRef.$lazyInstance$)
|
|
1609
|
-
hostRef.$
|
|
1614
|
+
if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
|
|
1615
|
+
disconnectInstance(hostRef.$lazyInstance$, elm);
|
|
1616
|
+
} else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
|
|
1617
|
+
hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
|
|
1610
1618
|
}
|
|
1611
1619
|
}
|
|
1612
1620
|
if (rootAppliedStyles.has(elm)) {
|
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const gamificationDropdown = require('./gamification-dropdown-
|
|
6
|
-
require('./index-
|
|
5
|
+
const gamificationDropdown = require('./gamification-dropdown-b8288984.js');
|
|
6
|
+
require('./index-ec2fd1aa.js');
|
|
7
7
|
|
|
8
8
|
|
|
9
9
|
|
package/dist/cjs/loader.cjs.js
CHANGED
|
@@ -2,13 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
5
|
+
const index = require('./index-ec2fd1aa.js');
|
|
6
6
|
const appGlobals = require('./app-globals-3a1e7e63.js');
|
|
7
7
|
|
|
8
8
|
const defineCustomElements = async (win, options) => {
|
|
9
9
|
if (typeof window === 'undefined') return undefined;
|
|
10
10
|
await appGlobals.globalScripts();
|
|
11
|
-
return index.bootstrapLazy([["gamification-dropdown_4.cjs",[[1,"gamification-dropdown",{"endpoint":[513],"language":[513],"session":[513],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"isOpen":[32],"isLoading":[32],"
|
|
11
|
+
return index.bootstrapLazy([["gamification-dropdown_4.cjs",[[1,"gamification-dropdown",{"endpoint":[513],"language":[513],"session":[513],"mbSource":[513,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"isOpen":[32],"isLoading":[32],"loyaltyPoints":[32]},null,{"translationUrl":["handleNewTranslations"],"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"]}],[1,"player-elevate-loyaltycard",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"dateFormat":[513,"date-format"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}],[4,"general-styling-wrapper",{"clientStyling":[1,"client-styling"],"clientStylingUrl":[1,"client-styling-url"],"translationUrl":[1,"translation-url"],"targetTranslations":[16]}],[0,"player-elevate-card-data",{"params":[8],"playerElevateLevel":[32],"pointExpireString":[32]},[[9,"resize","handleWindowResizs"],[8,"redeemGiftButton","redeemGiftButtonHandler"]],{"params":["onParamsChanged"]}]]],["player-elevate-card.cjs",[[1,"player-elevate-card",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"dateFormat":[513,"date-format"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerLevelFlag":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}]]],["player-elevate-pointcard.cjs",[[1,"player-elevate-pointcard",{"endpoint":[513],"theme":[513],"session":[513],"playerAvatarUrl":[513,"player-avatar-url"],"language":[513],"playerName":[513,"player-name"],"cardTitle":[513,"card-title"],"buttonType":[513,"button-type"],"dateFormat":[513,"date-format"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"pointExpireString":[32],"playerElevateLevel":[32],"elevateWalletTotal":[32],"elevateSPTotal":[32]},[[0,"playerElevateLeveLoaded","playerElevateLeveLoadedHandler"]],{"session":["onSessionOrEndpointChange"],"endpoint":["onSessionOrEndpointChange"],"language":["onSessionOrEndpointChange"]}]]]], options);
|
|
12
12
|
};
|
|
13
13
|
|
|
14
14
|
exports.setNonce = index.setNonce;
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
6
|
-
const playerElevateCardItems = require('./player-elevate-card-items-
|
|
5
|
+
const index = require('./index-ec2fd1aa.js');
|
|
6
|
+
const playerElevateCardItems = require('./player-elevate-card-items-a73ef8aa.js');
|
|
7
7
|
|
|
8
8
|
const playerElevateCardCss = "@container (max-width: 270px) {\n .Card .Inner {\n flex-direction: column;\n }\n .Card .Inner .Content {\n padding: 9px;\n }\n .Inner .Row .ExpirationPoints {\n order: 1;\n }\n}\n.Card .PlayerImg {\n order: 0;\n}\n.Card .ExpirationPoints {\n order: 3;\n}\n.Card .LevelInfo {\n order: 2;\n}\n.Card .Inner .Row .PlayerImg {\n flex-direction: column;\n}\n.Card .Inner .Row .PointsInfo {\n width: 100%;\n text-align: center;\n display: flex;\n flex-direction: column;\n max-height: 50%;\n}\n.Card .Inner .PlayerAvatar .Badge {\n background-size: contain;\n background-repeat: no-repeat;\n position: absolute;\n right: 5px;\n bottom: -5px;\n width: 40%;\n height: 40%;\n overflow: visible;\n}\n.Card .Inner .Row .ExpirationPoints {\n text-align: left;\n color: var(--emw--color-red, red);\n}\n.Card .Inner .Row .Points {\n text-wrap: nowrap;\n}\n.Card .Inner .LevelInfo .ElevateLevel {\n flex-direction: column;\n}\n.Card .Inner .LevelInfo .ElevateLevel .LevelName {\n width: calc(100% - 20px);\n text-align: left;\n font-size: 13px;\n padding-left: 20px;\n margin: 10px 0;\n}\n.Card .Inner .LevelInfo .ElevateLevel .ExpirationDate {\n text-align: center;\n font-size: smaller;\n}\n.Card .Inner .LevelInfo .ElevateLevel .ExpireTime {\n margin-left: 5px;\n}";
|
|
9
9
|
const PlayerElevateCardStyle0 = playerElevateCardCss;
|
|
@@ -2,8 +2,8 @@
|
|
|
2
2
|
|
|
3
3
|
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
4
|
|
|
5
|
-
const index = require('./index-
|
|
6
|
-
const playerElevateCardItems = require('./player-elevate-card-items-
|
|
5
|
+
const index = require('./index-ec2fd1aa.js');
|
|
6
|
+
const playerElevateCardItems = require('./player-elevate-card-items-a73ef8aa.js');
|
|
7
7
|
|
|
8
8
|
const playerElevatePointcardCss = ":host{display:block}.PointsCard .Inner .Row .ExpirationPoints{text-align:left}.PointsCard .Inner .PlayerAvatar .Avatar{display:none}.PointsCard .Inner .PlayerAvatar .Badge{border-radius:50%;background-size:contain;width:100%;height:100%;position:inherit}.PointsCard .Inner .PointsTxt{display:flex;flex-direction:row;justify-content:space-between}.PointsCard .Inner .DetailButton{background:linear-gradient(283.85deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.47%), linear-gradient(117.99deg, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 33.89%), linear-gradient(268.18deg, rgba(255, 255, 255, 0.6) -17.36%, rgba(239, 239, 239, 0) 15.78%), linear-gradient(0deg, rgba(255, 255, 255, 0.6), rgba(255, 255, 255, 0.6));border-radius:5px;box-shadow:0px 4px 4px 0px rgba(0, 0, 0, 0.25);border:2px solid;font-size:11px;width:108px;padding:4px;cursor:pointer;margin-top:5px;height:16px;min-width:45px;text-align:center}.PointsCard .Inner .DetailButton span{color:var(--emw--color-gray-150, #6D6D6D)}.PointsCard .Inner .DetailButton span{display:inline-block;vertical-align:middle}.PointsCard .Inner .DetailButton:hover span{color:var(--emw--color-gray-150, #6D6D6D)}.PointsCard .Inner .LevelInfo{gap:15px;width:70%}.PointsCard .Inner .LevelInfo .PointsTxt{font-size:15px}.PointsCard .Inner .LevelInfo .PointsTxt.Label{display:none}.PointsCard .Inner .LevelInfo .PointsTxt.SPPoints{padding-top:15px}.PointsCard .Inner .LevelInfo .PointsTxt .TC{font-size:x-small;color:var(--emw--color-gray-300, #58586B);display:flex;align-content:center;height:100%;flex-wrap:wrap;text-decoration:underline;cursor:pointer;display:none}";
|
|
9
9
|
const PlayerElevatePointcardStyle0 = playerElevatePointcardCss;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
2
|
import { getTranslations, translate } from "../../utils/locale.utils";
|
|
3
|
+
import { setClientStyling, setClientStylingURL, setStreamStyling } from "../../../../../../../../libs/common/src/styling/index";
|
|
3
4
|
import "../../../../../player-elevate-card/dist/types/index";
|
|
4
5
|
export class GamificationDropdown {
|
|
5
6
|
constructor() {
|
|
@@ -25,25 +26,6 @@ export class GamificationDropdown {
|
|
|
25
26
|
this.translationUrl = '';
|
|
26
27
|
this.isOpen = false;
|
|
27
28
|
this.isLoading = false;
|
|
28
|
-
this.stylingAppends = false;
|
|
29
|
-
this.setClientStyling = () => {
|
|
30
|
-
let sheet = document.createElement('style');
|
|
31
|
-
sheet.innerHTML = this.clientStyling;
|
|
32
|
-
this.stylingContainer.prepend(sheet);
|
|
33
|
-
};
|
|
34
|
-
this.setClientStylingURL = () => {
|
|
35
|
-
let url = new URL(this.clientStylingUrl);
|
|
36
|
-
let cssFile = document.createElement('style');
|
|
37
|
-
fetch(url.href)
|
|
38
|
-
.then((res) => res.text())
|
|
39
|
-
.then((data) => {
|
|
40
|
-
cssFile.innerHTML = data;
|
|
41
|
-
setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
|
|
42
|
-
})
|
|
43
|
-
.catch((err) => {
|
|
44
|
-
console.log('error ', err);
|
|
45
|
-
});
|
|
46
|
-
};
|
|
47
29
|
this.navigateToGamification = () => {
|
|
48
30
|
window.postMessage({ type: 'NavigateToGamification' }, window.location.href);
|
|
49
31
|
this.isOpen = false;
|
|
@@ -72,6 +54,17 @@ export class GamificationDropdown {
|
|
|
72
54
|
this.isLoading = false;
|
|
73
55
|
});
|
|
74
56
|
}
|
|
57
|
+
handleClientStylingChange(newValue, oldValue) {
|
|
58
|
+
if (newValue != oldValue) {
|
|
59
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
handleClientStylingChangeURL(newValue, oldValue) {
|
|
63
|
+
if (newValue != oldValue) {
|
|
64
|
+
if (this.clientStylingUrl)
|
|
65
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
66
|
+
}
|
|
67
|
+
}
|
|
75
68
|
async componentWillLoad() {
|
|
76
69
|
if (this.translationUrl.length > 2) {
|
|
77
70
|
await getTranslations(this.translationUrl);
|
|
@@ -80,16 +73,21 @@ export class GamificationDropdown {
|
|
|
80
73
|
return this.fetchPointsData();
|
|
81
74
|
}
|
|
82
75
|
}
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
this.
|
|
90
|
-
|
|
76
|
+
componentDidLoad() {
|
|
77
|
+
if (this.stylingContainer) {
|
|
78
|
+
if (window.emMessageBus != undefined) {
|
|
79
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`, this.stylingSubscription);
|
|
80
|
+
}
|
|
81
|
+
else {
|
|
82
|
+
if (this.clientStyling)
|
|
83
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
84
|
+
if (this.clientStylingUrl)
|
|
85
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
86
|
+
}
|
|
91
87
|
}
|
|
92
|
-
|
|
88
|
+
}
|
|
89
|
+
disconnectedCallback() {
|
|
90
|
+
this.stylingSubscription && this.stylingSubscription.unsubscribe();
|
|
93
91
|
}
|
|
94
92
|
fetchPointsData() {
|
|
95
93
|
let url = new URL(`${this.endpoint}/v1/elevate/playerInfo`);
|
|
@@ -201,6 +199,25 @@ export class GamificationDropdown {
|
|
|
201
199
|
"reflect": true,
|
|
202
200
|
"defaultValue": "''"
|
|
203
201
|
},
|
|
202
|
+
"mbSource": {
|
|
203
|
+
"type": "string",
|
|
204
|
+
"mutable": false,
|
|
205
|
+
"complexType": {
|
|
206
|
+
"original": "string",
|
|
207
|
+
"resolved": "string",
|
|
208
|
+
"references": {}
|
|
209
|
+
},
|
|
210
|
+
"required": false,
|
|
211
|
+
"optional": false,
|
|
212
|
+
"docs": {
|
|
213
|
+
"tags": [],
|
|
214
|
+
"text": "Client custom styling via streamStyling"
|
|
215
|
+
},
|
|
216
|
+
"getter": false,
|
|
217
|
+
"setter": false,
|
|
218
|
+
"attribute": "mb-source",
|
|
219
|
+
"reflect": true
|
|
220
|
+
},
|
|
204
221
|
"clientStyling": {
|
|
205
222
|
"type": "string",
|
|
206
223
|
"mutable": false,
|
|
@@ -267,7 +284,6 @@ export class GamificationDropdown {
|
|
|
267
284
|
return {
|
|
268
285
|
"isOpen": {},
|
|
269
286
|
"isLoading": {},
|
|
270
|
-
"stylingAppends": {},
|
|
271
287
|
"loyaltyPoints": {}
|
|
272
288
|
};
|
|
273
289
|
}
|
|
@@ -276,6 +292,12 @@ export class GamificationDropdown {
|
|
|
276
292
|
return [{
|
|
277
293
|
"propName": "translationUrl",
|
|
278
294
|
"methodName": "handleNewTranslations"
|
|
295
|
+
}, {
|
|
296
|
+
"propName": "clientStyling",
|
|
297
|
+
"methodName": "handleClientStylingChange"
|
|
298
|
+
}, {
|
|
299
|
+
"propName": "clientStylingUrl",
|
|
300
|
+
"methodName": "handleClientStylingChangeURL"
|
|
279
301
|
}];
|
|
280
302
|
}
|
|
281
303
|
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { r as registerInstance, h, g as getElement } from './index-
|
|
1
|
+
import { r as registerInstance, h, g as getElement } from './index-30fda5fb.js';
|
|
2
2
|
|
|
3
3
|
const DEFAULT_LANGUAGE = 'en';
|
|
4
4
|
let TRANSLATIONS = {
|
|
@@ -43,6 +43,63 @@ const translate = (key, customLang) => {
|
|
|
43
43
|
return TRANSLATIONS[(lang !== undefined) && (lang in TRANSLATIONS) ? lang : DEFAULT_LANGUAGE][key];
|
|
44
44
|
};
|
|
45
45
|
|
|
46
|
+
/**
|
|
47
|
+
* @name setClientStyling
|
|
48
|
+
* @description Method used to create and append to the passed element of the widget a style element with the content received
|
|
49
|
+
* @param {HTMLElement} stylingContainer The reference element of the widget
|
|
50
|
+
* @param {string} clientStyling The style content
|
|
51
|
+
*/
|
|
52
|
+
function setClientStyling(stylingContainer, clientStyling) {
|
|
53
|
+
if (stylingContainer) {
|
|
54
|
+
const sheet = document.createElement('style');
|
|
55
|
+
sheet.innerHTML = clientStyling;
|
|
56
|
+
stylingContainer.appendChild(sheet);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* @name setClientStylingURL
|
|
62
|
+
* @description Method used to create and append to the passed element of the widget a style element with the content fetched from a given URL
|
|
63
|
+
* @param {HTMLElement} stylingContainer The reference element of the widget
|
|
64
|
+
* @param {string} clientStylingUrl The URL of the style content
|
|
65
|
+
*/
|
|
66
|
+
function setClientStylingURL(stylingContainer, clientStylingUrl) {
|
|
67
|
+
const url = new URL(clientStylingUrl);
|
|
68
|
+
|
|
69
|
+
fetch(url.href)
|
|
70
|
+
.then((res) => res.text())
|
|
71
|
+
.then((data) => {
|
|
72
|
+
const cssFile = document.createElement('style');
|
|
73
|
+
cssFile.innerHTML = data;
|
|
74
|
+
if (stylingContainer) {
|
|
75
|
+
stylingContainer.appendChild(cssFile);
|
|
76
|
+
}
|
|
77
|
+
})
|
|
78
|
+
.catch((err) => {
|
|
79
|
+
console.error('There was an error while trying to load client styling from URL', err);
|
|
80
|
+
});
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
/**
|
|
84
|
+
* @name setStreamLibrary
|
|
85
|
+
* @description Method used to create and append to the passed element of the widget a style element with content fetched from the MessageBus
|
|
86
|
+
* @param {HTMLElement} stylingContainer The highest element of the widget
|
|
87
|
+
* @param {string} domain The domain from where the content should be fetched (e.g. 'Casino.Style', 'App.Style', 'casino-footer.style', etc.)
|
|
88
|
+
* @param {ref} subscription A reference to a variable where the subscription should be saved for unsubscribing when no longer needed
|
|
89
|
+
*/
|
|
90
|
+
function setStreamStyling(stylingContainer, domain, subscription) {
|
|
91
|
+
if (window.emMessageBus) {
|
|
92
|
+
const sheet = document.createElement('style');
|
|
93
|
+
|
|
94
|
+
window.emMessageBus.subscribe(domain, (data) => {
|
|
95
|
+
sheet.innerHTML = data;
|
|
96
|
+
if (stylingContainer) {
|
|
97
|
+
stylingContainer.appendChild(sheet);
|
|
98
|
+
}
|
|
99
|
+
});
|
|
100
|
+
}
|
|
101
|
+
}
|
|
102
|
+
|
|
46
103
|
const gamificationDropdownCss = ":host{display:block}.GamificationDropdownContainer{position:relative}.GamificationDropdownContainer .GamificationDropdown{position:absolute;left:0;z-index:200;overflow:hidden;cursor:pointer}.GamificationDropdownButton{cursor:pointer;font-size:14px;height:20px;background-color:unset;color:var(--emw--color-typography, #FFFFFF);padding:0;border:none;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:flex;align-items:center;justify-content:center;line-height:0}.GamificationDropdownButton:hover{color:var(--emw--color-primary, #52d004)}.GamificationDropdownButton:hover svg{fill:var(--emw--color-primary, #52d004)}.GamificationDropdownButton.IsOpen{color:var(--emw--color-primary, #52d004)}.GamificationDropdownButton.IsOpen svg{fill:var(--emw--color-primary, #52d004)}.GamificationDropdownButton .TriangleActive,.GamificationDropdownButton .TriangleInactive{display:block;transition:all 0.2s}.GamificationDropdownButton .TriangleActive{transform:scale(1.1) rotateX(180deg) translateY(3px);fill:var(--emw--color-primary, #52d004);margin-top:4px}.GamificationDropdownButton svg{fill:var(--emw--color-typography, #FFFFFF);margin-left:8px;width:16px}";
|
|
47
104
|
const GamificationDropdownStyle0 = gamificationDropdownCss;
|
|
48
105
|
|
|
@@ -71,25 +128,6 @@ const GamificationDropdown = class {
|
|
|
71
128
|
this.translationUrl = '';
|
|
72
129
|
this.isOpen = false;
|
|
73
130
|
this.isLoading = false;
|
|
74
|
-
this.stylingAppends = false;
|
|
75
|
-
this.setClientStyling = () => {
|
|
76
|
-
let sheet = document.createElement('style');
|
|
77
|
-
sheet.innerHTML = this.clientStyling;
|
|
78
|
-
this.stylingContainer.prepend(sheet);
|
|
79
|
-
};
|
|
80
|
-
this.setClientStylingURL = () => {
|
|
81
|
-
let url = new URL(this.clientStylingUrl);
|
|
82
|
-
let cssFile = document.createElement('style');
|
|
83
|
-
fetch(url.href)
|
|
84
|
-
.then((res) => res.text())
|
|
85
|
-
.then((data) => {
|
|
86
|
-
cssFile.innerHTML = data;
|
|
87
|
-
setTimeout(() => { this.stylingContainer.prepend(cssFile); }, 1);
|
|
88
|
-
})
|
|
89
|
-
.catch((err) => {
|
|
90
|
-
console.log('error ', err);
|
|
91
|
-
});
|
|
92
|
-
};
|
|
93
131
|
this.navigateToGamification = () => {
|
|
94
132
|
window.postMessage({ type: 'NavigateToGamification' }, window.location.href);
|
|
95
133
|
this.isOpen = false;
|
|
@@ -118,6 +156,17 @@ const GamificationDropdown = class {
|
|
|
118
156
|
this.isLoading = false;
|
|
119
157
|
});
|
|
120
158
|
}
|
|
159
|
+
handleClientStylingChange(newValue, oldValue) {
|
|
160
|
+
if (newValue != oldValue) {
|
|
161
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
162
|
+
}
|
|
163
|
+
}
|
|
164
|
+
handleClientStylingChangeURL(newValue, oldValue) {
|
|
165
|
+
if (newValue != oldValue) {
|
|
166
|
+
if (this.clientStylingUrl)
|
|
167
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
168
|
+
}
|
|
169
|
+
}
|
|
121
170
|
async componentWillLoad() {
|
|
122
171
|
if (this.translationUrl.length > 2) {
|
|
123
172
|
await getTranslations(this.translationUrl);
|
|
@@ -126,16 +175,21 @@ const GamificationDropdown = class {
|
|
|
126
175
|
return this.fetchPointsData();
|
|
127
176
|
}
|
|
128
177
|
}
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
this.
|
|
136
|
-
|
|
178
|
+
componentDidLoad() {
|
|
179
|
+
if (this.stylingContainer) {
|
|
180
|
+
if (window.emMessageBus != undefined) {
|
|
181
|
+
setStreamStyling(this.stylingContainer, `${this.mbSource}.Style`);
|
|
182
|
+
}
|
|
183
|
+
else {
|
|
184
|
+
if (this.clientStyling)
|
|
185
|
+
setClientStyling(this.stylingContainer, this.clientStyling);
|
|
186
|
+
if (this.clientStylingUrl)
|
|
187
|
+
setClientStylingURL(this.stylingContainer, this.clientStylingUrl);
|
|
188
|
+
}
|
|
137
189
|
}
|
|
138
|
-
|
|
190
|
+
}
|
|
191
|
+
disconnectedCallback() {
|
|
192
|
+
this.stylingSubscription && this.stylingSubscription.unsubscribe();
|
|
139
193
|
}
|
|
140
194
|
fetchPointsData() {
|
|
141
195
|
let url = new URL(`${this.endpoint}/v1/elevate/playerInfo`);
|
|
@@ -176,7 +230,9 @@ const GamificationDropdown = class {
|
|
|
176
230
|
}
|
|
177
231
|
get el() { return getElement(this); }
|
|
178
232
|
static get watchers() { return {
|
|
179
|
-
"translationUrl": ["handleNewTranslations"]
|
|
233
|
+
"translationUrl": ["handleNewTranslations"],
|
|
234
|
+
"clientStyling": ["handleClientStylingChange"],
|
|
235
|
+
"clientStylingUrl": ["handleClientStylingChangeURL"]
|
|
180
236
|
}; }
|
|
181
237
|
};
|
|
182
238
|
GamificationDropdown.style = GamificationDropdownStyle0;
|