@everymatrix/bonus-elevate-levels 1.43.4 → 1.45.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/bonus-elevate-levels/bonus-elevate-levels.esm.js +1 -1
- package/dist/bonus-elevate-levels/p-35063d92.entry.js +1 -0
- package/dist/bonus-elevate-levels/p-6e37b540.js +2 -0
- package/dist/bonus-elevate-levels/p-e1255160.js +1 -0
- package/dist/cjs/app-globals-3a1e7e63.js +5 -0
- package/dist/cjs/bonus-elevate-levels.cjs.js +17 -11
- package/dist/cjs/bonus-elevate-levels_5.cjs.entry.js +330 -345
- package/dist/cjs/index-39b21e10.js +1626 -0
- package/dist/cjs/loader.cjs.js +7 -13
- package/dist/collection/collection-manifest.json +6 -6
- package/dist/collection/components/bonus-elevate-levels/bonus-elevate-levels.js +233 -236
- package/dist/collection/components/bonus-elevate-levels/index.js +1 -0
- package/dist/collection/components/elevate-level-list/elevate-level-list.css +2 -2
- package/dist/collection/components/elevate-level-list/elevate-level-list.js +228 -219
- package/dist/collection/components/elevate-level-presentation/elevate-level-presentation.js +42 -36
- package/dist/collection/components/elevate-levels-data/elevate-levels-data.js +84 -74
- package/dist/collection/utils/locale.utils.js +42 -42
- package/dist/collection/utils/prototype-collector.js +3 -3
- package/dist/collection/utils/utils.js +21 -21
- package/dist/esm/app-globals-0f993ce5.js +3 -0
- package/dist/esm/bonus-elevate-levels.js +14 -11
- package/dist/esm/bonus-elevate-levels_5.entry.js +330 -345
- package/dist/esm/index-ed3d1f59.js +1597 -0
- package/dist/esm/loader.js +7 -13
- package/dist/stencil.config.dev.js +17 -0
- package/dist/stencil.config.js +14 -21
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/bonus-elevate-levels/.stencil/packages/stencil/bonus-elevate-levels/stencil.config.d.ts +2 -0
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-monorepo/packages/stencil/bonus-elevate-levels/.stencil/packages/stencil/bonus-elevate-levels/stencil.config.dev.d.ts +2 -0
- package/dist/types/components/bonus-elevate-levels/bonus-elevate-levels.d.ts +46 -46
- package/dist/types/components/bonus-elevate-levels/index.d.ts +1 -0
- package/dist/types/components/elevate-level-list/elevate-level-list.d.ts +40 -40
- package/dist/types/components/elevate-level-presentation/elevate-level-presentation.d.ts +5 -5
- package/dist/types/components/elevate-levels-data/elevate-levels-data.d.ts +7 -7
- package/dist/types/components.d.ts +33 -2
- package/dist/types/models/elevate-levels.d.ts +8 -8
- package/dist/types/stencil-public-runtime.d.ts +142 -33
- package/dist/types/utils/locale.utils.d.ts +3 -3
- package/dist/types/utils/utils.d.ts +2 -2
- package/loader/cdn.js +1 -3
- package/loader/index.cjs.js +1 -3
- package/loader/index.d.ts +13 -1
- package/loader/index.es2017.js +1 -3
- package/loader/index.js +1 -3
- package/loader/package.json +1 -0
- package/package.json +8 -4
- package/dist/bonus-elevate-levels/p-cb878291.entry.js +0 -1
- package/dist/bonus-elevate-levels/p-de8a59e4.js +0 -1
- package/dist/cjs/index-5ab5af9f.js +0 -1685
- package/dist/components/bonus-elevate-levels.d.ts +0 -11
- package/dist/components/bonus-elevate-levels.js +0 -141
- package/dist/components/elevate-level-list.d.ts +0 -11
- package/dist/components/elevate-level-list.js +0 -6
- package/dist/components/elevate-level-list2.js +0 -198
- package/dist/components/elevate-level-presentation.d.ts +0 -11
- package/dist/components/elevate-level-presentation.js +0 -6
- package/dist/components/elevate-level-presentation2.js +0 -31
- package/dist/components/elevate-levels-data.d.ts +0 -11
- package/dist/components/elevate-levels-data.js +0 -6
- package/dist/components/elevate-levels-data2.js +0 -102
- package/dist/components/general-styling-wrapper.js +0 -6
- package/dist/components/general-styling-wrapper2.js +0 -103
- package/dist/components/index.d.ts +0 -26
- package/dist/components/index.js +0 -1
- package/dist/esm/index-8f57d3b4.js +0 -1657
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/css-shim.js +0 -1
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/types/Users/adrian.pripon/Documents/Work/widgets-stencil/packages/bonus-elevate-levels/.stencil/packages/bonus-elevate-levels/stencil.config.d.ts +0 -2
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface BonusElevateLevels extends Components.BonusElevateLevels, HTMLElement {}
|
|
4
|
-
export const BonusElevateLevels: {
|
|
5
|
-
prototype: BonusElevateLevels;
|
|
6
|
-
new (): BonusElevateLevels;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,141 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
|
-
import { t as translate, T as TRANSLATIONS, d as defineCustomElement$5 } from './elevate-level-list2.js';
|
|
3
|
-
import { d as defineCustomElement$4 } from './elevate-level-presentation2.js';
|
|
4
|
-
import { d as defineCustomElement$3 } from './elevate-levels-data2.js';
|
|
5
|
-
import { d as defineCustomElement$2 } from './general-styling-wrapper2.js';
|
|
6
|
-
|
|
7
|
-
const bonusElevateLevelsCss = ":host{display:block}.ElevateLevelContent{padding:20px;position:relative}.ElevateLevelContent .Privileges{padding-bottom:30px}.ElevateLevelContent .tc{position:absolute;right:10px;bottom:10px;text-align:right;display:none}";
|
|
8
|
-
|
|
9
|
-
const BonusElevateLevels$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
10
|
-
constructor() {
|
|
11
|
-
super();
|
|
12
|
-
this.__registerHost();
|
|
13
|
-
this.__attachShadow();
|
|
14
|
-
/**
|
|
15
|
-
* Client custom styling via string
|
|
16
|
-
*/
|
|
17
|
-
this.clientStyling = '';
|
|
18
|
-
/**
|
|
19
|
-
* Client custom styling via url
|
|
20
|
-
*/
|
|
21
|
-
this.clientStylingUrl = '';
|
|
22
|
-
/**
|
|
23
|
-
* Language of the widget
|
|
24
|
-
*/
|
|
25
|
-
this.language = 'en';
|
|
26
|
-
/**
|
|
27
|
-
* The translationUrl
|
|
28
|
-
*/
|
|
29
|
-
this.translationUrl = '';
|
|
30
|
-
/**
|
|
31
|
-
* Used in elevate level list
|
|
32
|
-
*/
|
|
33
|
-
this.elevateLevels = [];
|
|
34
|
-
}
|
|
35
|
-
selectedLevelChangedHandler(event) {
|
|
36
|
-
if (event.detail) {
|
|
37
|
-
this.currentLevel = Object.assign({}, event.detail.level);
|
|
38
|
-
}
|
|
39
|
-
}
|
|
40
|
-
selectedLevelIdChangedHandler() {
|
|
41
|
-
if (this.selectedLevelId && this.elevateLevels) {
|
|
42
|
-
const currentLevel = this.elevateLevels.filter((item) => {
|
|
43
|
-
return item.id == this.selectedLevelId;
|
|
44
|
-
})[0];
|
|
45
|
-
this.currentLevel = Object.assign({}, currentLevel);
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
onSessionOrEndpointChange() {
|
|
49
|
-
this.elevateLevelParamProxy = Object.assign(Object.assign({}, this.elevateLevelParamProxy), { endpoint: this.endpoint, language: this.language });
|
|
50
|
-
}
|
|
51
|
-
elevateLevelsDataChangeHandler(event) {
|
|
52
|
-
if (!event.detail) {
|
|
53
|
-
return;
|
|
54
|
-
}
|
|
55
|
-
if (event.detail.currentLevel) {
|
|
56
|
-
this.currentLevel = Object.assign({}, event.detail.currentLevel);
|
|
57
|
-
}
|
|
58
|
-
if (event.detail.elevateLevels) {
|
|
59
|
-
this.elevateLevels = [...event.detail.elevateLevels];
|
|
60
|
-
}
|
|
61
|
-
if (event.detail.clearError) {
|
|
62
|
-
this.errorMessage = null;
|
|
63
|
-
}
|
|
64
|
-
if (event.detail.errorMessage) {
|
|
65
|
-
if (event.detail.errorMessage['errorWhenLoadElevateLevels']) {
|
|
66
|
-
this.errorMessage = translate('loadElevateLevelErrorMessage', this.language);
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
onTCClick() {
|
|
71
|
-
window.postMessage({ type: 'termAndConditionClicked' }, window.location.href);
|
|
72
|
-
}
|
|
73
|
-
componentWillLoad() {
|
|
74
|
-
this.elevateLevelParamProxy = {
|
|
75
|
-
endpoint: this.endpoint, language: this.language, selectedLevelId: this.selectedLevelId,
|
|
76
|
-
showDefault: this.showDefault
|
|
77
|
-
};
|
|
78
|
-
}
|
|
79
|
-
render() {
|
|
80
|
-
return (h("div", { class: "ElevateLevelContent" }, h("elevate-levels-data", { scopeParams: this.elevateLevelParamProxy }), h("div", { class: "LevelContent" }, this.elevateLevels ?
|
|
81
|
-
h("elevate-level-list", { language: this.language, selectedLevelId: this.selectedLevelId, levels: this.elevateLevels }) : translate('noLevelsSet', this.language), this.currentLevel &&
|
|
82
|
-
h("elevate-level-presentation", { elevateLevel: this.currentLevel })), this.errorMessage && h("div", null, this.errorMessage), h("general-styling-wrapper", { clientStyling: this.clientStyling, clientStylingUrl: this.clientStylingUrl, targetTranslations: TRANSLATIONS, translationUrl: this.translationUrl })));
|
|
83
|
-
}
|
|
84
|
-
static get watchers() { return {
|
|
85
|
-
"selectedLevelId": ["selectedLevelIdChangedHandler"],
|
|
86
|
-
"elevateLevels": ["selectedLevelIdChangedHandler"],
|
|
87
|
-
"endpoint": ["onSessionOrEndpointChange"],
|
|
88
|
-
"language": ["onSessionOrEndpointChange"]
|
|
89
|
-
}; }
|
|
90
|
-
static get style() { return bonusElevateLevelsCss; }
|
|
91
|
-
}, [1, "bonus-elevate-levels", {
|
|
92
|
-
"clientStyling": [513, "client-styling"],
|
|
93
|
-
"clientStylingUrl": [513, "client-styling-url"],
|
|
94
|
-
"endpoint": [513],
|
|
95
|
-
"language": [513],
|
|
96
|
-
"translationUrl": [513, "translation-url"],
|
|
97
|
-
"selectedLevelId": [1537, "selected-level-id"],
|
|
98
|
-
"showDefault": [4, "show-default"],
|
|
99
|
-
"elevateLevelParamProxy": [32],
|
|
100
|
-
"elevateLevels": [32],
|
|
101
|
-
"currentLevel": [32],
|
|
102
|
-
"errorMessage": [32]
|
|
103
|
-
}, [[0, "selectedLevelChanged", "selectedLevelChangedHandler"], [2, "elevateLevelsDataChange", "elevateLevelsDataChangeHandler"]]]);
|
|
104
|
-
function defineCustomElement$1() {
|
|
105
|
-
if (typeof customElements === "undefined") {
|
|
106
|
-
return;
|
|
107
|
-
}
|
|
108
|
-
const components = ["bonus-elevate-levels", "elevate-level-list", "elevate-level-presentation", "elevate-levels-data", "general-styling-wrapper"];
|
|
109
|
-
components.forEach(tagName => { switch (tagName) {
|
|
110
|
-
case "bonus-elevate-levels":
|
|
111
|
-
if (!customElements.get(tagName)) {
|
|
112
|
-
customElements.define(tagName, BonusElevateLevels$1);
|
|
113
|
-
}
|
|
114
|
-
break;
|
|
115
|
-
case "elevate-level-list":
|
|
116
|
-
if (!customElements.get(tagName)) {
|
|
117
|
-
defineCustomElement$5();
|
|
118
|
-
}
|
|
119
|
-
break;
|
|
120
|
-
case "elevate-level-presentation":
|
|
121
|
-
if (!customElements.get(tagName)) {
|
|
122
|
-
defineCustomElement$4();
|
|
123
|
-
}
|
|
124
|
-
break;
|
|
125
|
-
case "elevate-levels-data":
|
|
126
|
-
if (!customElements.get(tagName)) {
|
|
127
|
-
defineCustomElement$3();
|
|
128
|
-
}
|
|
129
|
-
break;
|
|
130
|
-
case "general-styling-wrapper":
|
|
131
|
-
if (!customElements.get(tagName)) {
|
|
132
|
-
defineCustomElement$2();
|
|
133
|
-
}
|
|
134
|
-
break;
|
|
135
|
-
} });
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
const BonusElevateLevels = BonusElevateLevels$1;
|
|
139
|
-
const defineCustomElement = defineCustomElement$1;
|
|
140
|
-
|
|
141
|
-
export { BonusElevateLevels, defineCustomElement };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface ElevateLevelList extends Components.ElevateLevelList, HTMLElement {}
|
|
4
|
-
export const ElevateLevelList: {
|
|
5
|
-
prototype: ElevateLevelList;
|
|
6
|
-
new (): ElevateLevelList;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,198 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const DEFAULT_LANGUAGE = 'en';
|
|
4
|
-
const SUPPORTED_LANGUAGES = ['ro', 'en', 'fr', 'hr', 'tr'];
|
|
5
|
-
const TRANSLATIONS = {
|
|
6
|
-
en: {
|
|
7
|
-
level: 'level',
|
|
8
|
-
seeAll: 'See All',
|
|
9
|
-
termsAndConditions: 'Terms & Conditions',
|
|
10
|
-
loadElevateLevelErrorMessage: 'Error when load elevate levels',
|
|
11
|
-
noLevelsSet: 'There is no level set',
|
|
12
|
-
points: 'Points',
|
|
13
|
-
},
|
|
14
|
-
fr: {
|
|
15
|
-
level: 'level',
|
|
16
|
-
seeAll: 'See All',
|
|
17
|
-
termsAndConditions: 'Terms & Conditions',
|
|
18
|
-
loadElevateLevelErrorMessage: 'Error when load elevate levels',
|
|
19
|
-
noLevelsSet: 'There is no level set',
|
|
20
|
-
points: 'Points',
|
|
21
|
-
},
|
|
22
|
-
hr: {
|
|
23
|
-
level: 'Razina',
|
|
24
|
-
seeAll: 'Vidi sve',
|
|
25
|
-
privilegesFor: 'Privilegije za',
|
|
26
|
-
termsAndConditions: 'Uvjeti i odredbe',
|
|
27
|
-
noLevelsSet: 'There is no level set',
|
|
28
|
-
points: 'Points',
|
|
29
|
-
},
|
|
30
|
-
ro: {
|
|
31
|
-
level: 'level',
|
|
32
|
-
seeAll: 'See All',
|
|
33
|
-
termsAndConditions: 'Terms & Conditions',
|
|
34
|
-
loadElevateLevelErrorMessage: 'Error when load elevate levels',
|
|
35
|
-
noLevelsSet: 'There is no level set',
|
|
36
|
-
points: 'Points',
|
|
37
|
-
},
|
|
38
|
-
tr: {
|
|
39
|
-
level: 'level',
|
|
40
|
-
seeAll: 'See All',
|
|
41
|
-
termsAndConditions: 'Terms & Conditions',
|
|
42
|
-
loadElevateLevelErrorMessage: 'Error when load elevate levels',
|
|
43
|
-
noLevelsSet: 'There is no level set',
|
|
44
|
-
points: 'Points',
|
|
45
|
-
}
|
|
46
|
-
};
|
|
47
|
-
const translate = (key, customLang) => {
|
|
48
|
-
const lang = customLang;
|
|
49
|
-
return TRANSLATIONS[lang !== undefined && (SUPPORTED_LANGUAGES.includes(lang) || TRANSLATIONS[lang]) ? lang : DEFAULT_LANGUAGE][key];
|
|
50
|
-
};
|
|
51
|
-
|
|
52
|
-
/**
|
|
53
|
-
* @name isMobile
|
|
54
|
-
* @description A method that returns if the browser used to access the app is from a mobile device or not
|
|
55
|
-
* @param {String} userAgent window.navigator.userAgent
|
|
56
|
-
* @returns {Boolean} true or false
|
|
57
|
-
*/
|
|
58
|
-
const isMobile = (userAgent) => {
|
|
59
|
-
return !!(userAgent.toLowerCase().match(/android/i) ||
|
|
60
|
-
userAgent.toLowerCase().match(/blackberry|bb/i) ||
|
|
61
|
-
userAgent.toLowerCase().match(/iphone|ipad|ipod/i) ||
|
|
62
|
-
userAgent.toLowerCase().match(/windows phone|windows mobile|iemobile|wpdesktop/i));
|
|
63
|
-
};
|
|
64
|
-
var MOVE_TO;
|
|
65
|
-
(function (MOVE_TO) {
|
|
66
|
-
MOVE_TO[MOVE_TO["slideToRight"] = 1] = "slideToRight";
|
|
67
|
-
MOVE_TO[MOVE_TO["slideToLeft"] = -1] = "slideToLeft";
|
|
68
|
-
})(MOVE_TO || (MOVE_TO = {}));
|
|
69
|
-
|
|
70
|
-
const elevateLevelListCss = "elevate-level-list{display:flex;flex-direction:row}.LevelItemsWrapper{display:flex;flex:1;margin-top:10px;min-height:30px;transition-property:all;position:relative;height:138px;overflow-x:hidden}.Mobile.LevelItems{overflow-x:hidden}.LevelItems{overflow-x:auto;display:flex;flex-direction:row;gap:10px;left:0;position:absolute;transition:left 0.5s ease-in-out}.LevelItems .Item:hover,.LevelItems .Item.Active{background-color:var(--emfe-w-color-gray-50, #f4f4f4);box-shadow:0px 4px 13px 0px rgba(0, 0, 0, 0.25)}.LevelItems .Item{width:86px;height:125px;border-radius:15px;text-align:center;display:flex;flex-direction:column;cursor:pointer}.LevelItems .Item .LevelName{font-size:13px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.LevelItems .Item .LevelPoints{color:var(--emfe-w-color-gray-100, #767171);font-size:10px}.LevelItems .Item .LevelImg{width:65px;height:68px;margin:11px auto}.SliderButton{display:flex;width:29px;align-items:center;cursor:pointer}.SliderButton.Disabled svg{stroke:var(--emfe-w-color-gray-50, #cbc5c5)}.SliderButton.Hidden{display:none}";
|
|
71
|
-
|
|
72
|
-
const ElevateLevelList = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
73
|
-
constructor() {
|
|
74
|
-
super();
|
|
75
|
-
this.__registerHost();
|
|
76
|
-
this.selectedLevelChanged = createEvent(this, "selectedLevelChanged", 7);
|
|
77
|
-
this.isShowSliderButton = false;
|
|
78
|
-
this.offset = 0;
|
|
79
|
-
this.minOffset = 0;
|
|
80
|
-
this.isMobile = isMobile(window.navigator.userAgent);
|
|
81
|
-
}
|
|
82
|
-
onLevelClicked(elevateLevel) {
|
|
83
|
-
this.selectedLevelChanged.emit({ level: elevateLevel });
|
|
84
|
-
this.selectedLevelId = elevateLevel.id;
|
|
85
|
-
}
|
|
86
|
-
levelsChangedHandler() {
|
|
87
|
-
this.initOffsetOfLevelItems();
|
|
88
|
-
}
|
|
89
|
-
initOffsetOfLevelItems() {
|
|
90
|
-
if (!this.levels || this.levels.length == 0 || !this.selectedLevelId) {
|
|
91
|
-
return;
|
|
92
|
-
}
|
|
93
|
-
const currentLevelIndex = this.levels.findIndex((item) => {
|
|
94
|
-
return this.selectedLevelId == item.id;
|
|
95
|
-
});
|
|
96
|
-
this.onLevelClicked(this.levels[currentLevelIndex == -1 ? 0 : currentLevelIndex]);
|
|
97
|
-
//do not need change the slider offset when level items less than moveCountForOneTouch
|
|
98
|
-
if (this.levels.length <= this.moveCountForOneTouch) {
|
|
99
|
-
return;
|
|
100
|
-
}
|
|
101
|
-
//to avoid the slider do not move when currentLevelIndex = moveCountForOneTouch - 1
|
|
102
|
-
let newOffset = Math.floor((currentLevelIndex == -1 ? 1 : currentLevelIndex + 1) / this.moveCountForOneTouch)
|
|
103
|
-
* this.moveCountForOneTouch * this.childElementWidth * (-1);
|
|
104
|
-
this.offset = newOffset <= this.minOffset ? this.minOffset : (newOffset >= 0 ? 0 : newOffset);
|
|
105
|
-
}
|
|
106
|
-
onTouchStart(e) {
|
|
107
|
-
this.touchPosStart = { clientX: e.touches[0].clientX, clientY: e.touches[0].clientY };
|
|
108
|
-
}
|
|
109
|
-
onTouchMove(e) {
|
|
110
|
-
this.touchPosEnd = { clientX: e.touches[0].clientX, clientY: e.touches[0].clientY };
|
|
111
|
-
const diffX = this.touchPosEnd.clientX - this.touchPosStart.clientX;
|
|
112
|
-
const diffY = this.touchPosEnd.clientY - this.touchPosStart.clientY;
|
|
113
|
-
if (Math.abs(diffX) > Math.abs(diffY)) {
|
|
114
|
-
this.slideTo(diffX > 0 ? MOVE_TO.slideToRight : MOVE_TO.slideToLeft);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
slideTo(direction) {
|
|
118
|
-
let newOffset = this.levelsElement.offsetLeft +
|
|
119
|
-
(this.childElementWidth) * this.moveCountForOneTouch * direction;
|
|
120
|
-
if (newOffset % this.childElementWidth != 0) {
|
|
121
|
-
const leftOfPreNode = (Math.floor(newOffset / this.childElementWidth)) * this.childElementWidth;
|
|
122
|
-
const leftOfNextNode = (Math.ceil(newOffset / this.childElementWidth)) * this.childElementWidth;
|
|
123
|
-
//touchmove to right, get left of pre-node; touchmove to left, get left of next-node
|
|
124
|
-
newOffset = direction == MOVE_TO.slideToRight ? leftOfPreNode : leftOfNextNode;
|
|
125
|
-
}
|
|
126
|
-
this.offset = newOffset < this.minOffset ? this.minOffset : (newOffset >= 0 ? 0 : newOffset);
|
|
127
|
-
}
|
|
128
|
-
initLevelSlider() {
|
|
129
|
-
var _a;
|
|
130
|
-
if (!((_a = this.levelsElement) === null || _a === void 0 ? void 0 : _a.firstElementChild)) {
|
|
131
|
-
console.log('Widget[elevate-level-list] DOM is not ready.');
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
this.isShowSliderButton = !this.isMobile && (this.levelsElement.clientWidth > this.levelsElement.parentElement.clientWidth);
|
|
135
|
-
this.minOffset = this.levelsElement.parentElement.clientWidth - this.levelsElement.clientWidth;
|
|
136
|
-
this.childElementWidth = this.levelsElement.firstElementChild.clientWidth;
|
|
137
|
-
this.moveCountForOneTouch = Math.ceil(this.levelsElement.parentElement.clientWidth / this.childElementWidth) - 1;
|
|
138
|
-
const childElementCount = this.levelsElement.childElementCount;
|
|
139
|
-
this.childElementWidth += (this.levelsElement.clientWidth - this.childElementWidth * childElementCount) / (childElementCount - 1);
|
|
140
|
-
}
|
|
141
|
-
debounce(callback, delay) {
|
|
142
|
-
{
|
|
143
|
-
let timer;
|
|
144
|
-
return () => {
|
|
145
|
-
clearTimeout(timer);
|
|
146
|
-
timer = setTimeout(() => {
|
|
147
|
-
callback();
|
|
148
|
-
}, delay);
|
|
149
|
-
};
|
|
150
|
-
}
|
|
151
|
-
}
|
|
152
|
-
;
|
|
153
|
-
handleResize() {
|
|
154
|
-
this.debounce(this.initLevelSlider.bind(this), 200)();
|
|
155
|
-
}
|
|
156
|
-
componentDidRender() {
|
|
157
|
-
this.host.componentOnReady().then(() => {
|
|
158
|
-
this.initLevelSlider();
|
|
159
|
-
});
|
|
160
|
-
}
|
|
161
|
-
render() {
|
|
162
|
-
return (h(Host, null, this.levels && [
|
|
163
|
-
h("div", { class: `SliderButton LeftButton ${this.offset == 0 ? 'Disabled' : ''} ${this.isShowSliderButton ? '' : 'Hidden'}`, onClick: () => this.slideTo(MOVE_TO.slideToRight) }, h("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M15 19l-7-7 7-7" }))),
|
|
164
|
-
h("div", { class: 'LevelItemsWrapper' }, h("div", { style: { 'left': `${this.offset}px` }, class: `LevelItems ${this.isMobile ? 'Mobile' : ''}`, id: 'levelItems', ref: (el) => { this.levelsElement = el; } }, this.levels.map((level, idx) => {
|
|
165
|
-
return (h("div", { class: `Item ${this.selectedLevelId == level.id ? 'Active' : ''}`, onClick: this.onLevelClicked.bind(this, level) }, h("img", { alt: `Presentation Icon for ${level.presentation.displayName}`, class: "LevelImg", src: level.presentation.asset }), h("span", { class: "LevelName", title: level.presentation.displayName }, level.presentation.displayName), h("span", { class: "LevelPoints" }, idx == 0 ? '' : '>', level.firstEntryPoints, ' ', translate('points', this.language))));
|
|
166
|
-
}))),
|
|
167
|
-
h("div", { class: `SliderButton RightButton ${this.offset <= this.minOffset ? 'Disabled' : ''} ${this.isShowSliderButton ? '' : 'Hidden'}`, onClick: () => this.slideTo(MOVE_TO.slideToLeft) }, h("svg", { fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M9 5l7 7-7 7" })))
|
|
168
|
-
]));
|
|
169
|
-
}
|
|
170
|
-
get host() { return this; }
|
|
171
|
-
static get watchers() { return {
|
|
172
|
-
"selectedLevelId": ["levelsChangedHandler"]
|
|
173
|
-
}; }
|
|
174
|
-
static get style() { return elevateLevelListCss; }
|
|
175
|
-
}, [0, "elevate-level-list", {
|
|
176
|
-
"levels": [16],
|
|
177
|
-
"language": [1],
|
|
178
|
-
"selectedLevelId": [1537, "selected-level-id"],
|
|
179
|
-
"isShowSliderButton": [32],
|
|
180
|
-
"touchPosStart": [32],
|
|
181
|
-
"touchPosEnd": [32],
|
|
182
|
-
"offset": [32]
|
|
183
|
-
}, [[1, "touchstart", "onTouchStart"], [1, "touchmove", "onTouchMove"], [9, "resize", "handleResize"]]]);
|
|
184
|
-
function defineCustomElement() {
|
|
185
|
-
if (typeof customElements === "undefined") {
|
|
186
|
-
return;
|
|
187
|
-
}
|
|
188
|
-
const components = ["elevate-level-list"];
|
|
189
|
-
components.forEach(tagName => { switch (tagName) {
|
|
190
|
-
case "elevate-level-list":
|
|
191
|
-
if (!customElements.get(tagName)) {
|
|
192
|
-
customElements.define(tagName, ElevateLevelList);
|
|
193
|
-
}
|
|
194
|
-
break;
|
|
195
|
-
} });
|
|
196
|
-
}
|
|
197
|
-
|
|
198
|
-
export { ElevateLevelList as E, TRANSLATIONS as T, defineCustomElement as d, translate as t };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface ElevateLevelPresentation extends Components.ElevateLevelPresentation, HTMLElement {}
|
|
4
|
-
export const ElevateLevelPresentation: {
|
|
5
|
-
prototype: ElevateLevelPresentation;
|
|
6
|
-
new (): ElevateLevelPresentation;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { E as ElevateLevelPresentation$1, d as defineCustomElement$1 } from './elevate-level-presentation2.js';
|
|
2
|
-
|
|
3
|
-
const ElevateLevelPresentation = ElevateLevelPresentation$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { ElevateLevelPresentation, defineCustomElement };
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const elevateLevelPresentationCss = ":host{display:block}.PriviliegeList{padding-inline-start:5px}.PriviliegeList li{display:flex}.PriviliegeList li .Img{width:80px}.PriviliegeList li .Img img{width:60px;margin:10px}.PriviliegeList li .Content h4{text-transform:capitalize;margin-block-start:10px}";
|
|
4
|
-
|
|
5
|
-
const ElevateLevelPresentation = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
6
|
-
constructor() {
|
|
7
|
-
super();
|
|
8
|
-
this.__registerHost();
|
|
9
|
-
}
|
|
10
|
-
render() {
|
|
11
|
-
return h(Host, null, h("div", { class: "Row Desc" }, h("h3", null, this.elevateLevel.presentation.displayName), h("p", null, h("span", { class: "TxtDesc", innerHTML: this.elevateLevel.presentation.description }))));
|
|
12
|
-
}
|
|
13
|
-
static get style() { return elevateLevelPresentationCss; }
|
|
14
|
-
}, [0, "elevate-level-presentation", {
|
|
15
|
-
"elevateLevel": [16]
|
|
16
|
-
}]);
|
|
17
|
-
function defineCustomElement() {
|
|
18
|
-
if (typeof customElements === "undefined") {
|
|
19
|
-
return;
|
|
20
|
-
}
|
|
21
|
-
const components = ["elevate-level-presentation"];
|
|
22
|
-
components.forEach(tagName => { switch (tagName) {
|
|
23
|
-
case "elevate-level-presentation":
|
|
24
|
-
if (!customElements.get(tagName)) {
|
|
25
|
-
customElements.define(tagName, ElevateLevelPresentation);
|
|
26
|
-
}
|
|
27
|
-
break;
|
|
28
|
-
} });
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
export { ElevateLevelPresentation as E, defineCustomElement as d };
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface ElevateLevelsData extends Components.ElevateLevelsData, HTMLElement {}
|
|
4
|
-
export const ElevateLevelsData: {
|
|
5
|
-
prototype: ElevateLevelsData;
|
|
6
|
-
new (): ElevateLevelsData;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, createEvent } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
function createCommonjsModule(fn, basedir, module) {
|
|
4
|
-
return module = {
|
|
5
|
-
path: basedir,
|
|
6
|
-
exports: {},
|
|
7
|
-
require: function (path, base) {
|
|
8
|
-
return commonjsRequire();
|
|
9
|
-
}
|
|
10
|
-
}, fn(module, module.exports), module.exports;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
function commonjsRequire () {
|
|
14
|
-
throw new Error('Dynamic requires are not currently supported by @rollup/plugin-commonjs');
|
|
15
|
-
}
|
|
16
|
-
|
|
17
|
-
var browser = createCommonjsModule(function (module, exports) {
|
|
18
|
-
|
|
19
|
-
// ref: https://github.com/tc39/proposal-global
|
|
20
|
-
var getGlobal = function () {
|
|
21
|
-
// the only reliable means to get the global object is
|
|
22
|
-
// `Function('return this')()`
|
|
23
|
-
// However, this causes CSP violations in Chrome apps.
|
|
24
|
-
if (typeof self !== 'undefined') { return self; }
|
|
25
|
-
if (typeof window !== 'undefined') { return window; }
|
|
26
|
-
if (typeof global !== 'undefined') { return global; }
|
|
27
|
-
throw new Error('unable to locate global object');
|
|
28
|
-
};
|
|
29
|
-
|
|
30
|
-
var global = getGlobal();
|
|
31
|
-
|
|
32
|
-
module.exports = exports = global.fetch;
|
|
33
|
-
|
|
34
|
-
// Needed for TypeScript and Webpack.
|
|
35
|
-
if (global.fetch) {
|
|
36
|
-
exports.default = global.fetch.bind(global);
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
exports.Headers = global.Headers;
|
|
40
|
-
exports.Request = global.Request;
|
|
41
|
-
exports.Response = global.Response;
|
|
42
|
-
});
|
|
43
|
-
|
|
44
|
-
const elevateLevelsDataCss = ":host{display:block}";
|
|
45
|
-
|
|
46
|
-
const ElevateLevelsData = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
47
|
-
constructor() {
|
|
48
|
-
super();
|
|
49
|
-
this.__registerHost();
|
|
50
|
-
this.elevateLevelsDataChange = createEvent(this, "elevateLevelsDataChange", 7);
|
|
51
|
-
}
|
|
52
|
-
async componentWillRender() {
|
|
53
|
-
//load data
|
|
54
|
-
if (!this.scopeParams.endpoint) {
|
|
55
|
-
return;
|
|
56
|
-
}
|
|
57
|
-
const endpoint = this.scopeParams.endpoint;
|
|
58
|
-
let url = new URL(`${endpoint}/v1/elevate/levels?language=${this.scopeParams.language}`);
|
|
59
|
-
await browser(url.href)
|
|
60
|
-
.then((res) => res.json())
|
|
61
|
-
.then((res) => {
|
|
62
|
-
const elevateLevels = res.data.sort((a, b) => {
|
|
63
|
-
return a.firstEntryPoints < b.firstEntryPoints ? -1 : 1;
|
|
64
|
-
});
|
|
65
|
-
let selectedLevelId = this.scopeParams.selectedLevelId;
|
|
66
|
-
// if selected level is not set, set first(basic) as default
|
|
67
|
-
if (!selectedLevelId && this.scopeParams.showDefault && elevateLevels.length > 0) {
|
|
68
|
-
selectedLevelId = elevateLevels[0].id;
|
|
69
|
-
}
|
|
70
|
-
if (selectedLevelId) {
|
|
71
|
-
// get current level by name
|
|
72
|
-
const currentLevel = elevateLevels.filter((item) => {
|
|
73
|
-
return item.id == selectedLevelId;
|
|
74
|
-
})[0];
|
|
75
|
-
this.elevateLevelsDataChange.emit({ currentLevel: currentLevel });
|
|
76
|
-
}
|
|
77
|
-
this.elevateLevelsDataChange.emit({ 'clearError': true });
|
|
78
|
-
this.elevateLevelsDataChange.emit({ 'elevateLevels': elevateLevels });
|
|
79
|
-
}).catch((err) => {
|
|
80
|
-
this.elevateLevelsDataChange.emit({ errorMessage: { type: 'errorWhenLoadElevateLevels', err } });
|
|
81
|
-
console.error(err);
|
|
82
|
-
});
|
|
83
|
-
}
|
|
84
|
-
static get style() { return elevateLevelsDataCss; }
|
|
85
|
-
}, [0, "elevate-levels-data", {
|
|
86
|
-
"scopeParams": [1544, "scope-params"]
|
|
87
|
-
}]);
|
|
88
|
-
function defineCustomElement() {
|
|
89
|
-
if (typeof customElements === "undefined") {
|
|
90
|
-
return;
|
|
91
|
-
}
|
|
92
|
-
const components = ["elevate-levels-data"];
|
|
93
|
-
components.forEach(tagName => { switch (tagName) {
|
|
94
|
-
case "elevate-levels-data":
|
|
95
|
-
if (!customElements.get(tagName)) {
|
|
96
|
-
customElements.define(tagName, ElevateLevelsData);
|
|
97
|
-
}
|
|
98
|
-
break;
|
|
99
|
-
} });
|
|
100
|
-
}
|
|
101
|
-
|
|
102
|
-
export { ElevateLevelsData as E, defineCustomElement as d };
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { G as GeneralStylingWrapper$1, d as defineCustomElement$1 } from './general-styling-wrapper2.js';
|
|
2
|
-
|
|
3
|
-
const GeneralStylingWrapper = GeneralStylingWrapper$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { GeneralStylingWrapper, defineCustomElement };
|
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
|
|
2
|
-
|
|
3
|
-
const mergeTranslations = (url, target) => {
|
|
4
|
-
return new Promise((resolve) => {
|
|
5
|
-
fetch(url)
|
|
6
|
-
.then((res) => res.json())
|
|
7
|
-
.then((data) => {
|
|
8
|
-
Object.keys(data).forEach((item) => {
|
|
9
|
-
target[item] = target[item] ? target[item] : {};
|
|
10
|
-
for (let key in data[item]) {
|
|
11
|
-
target[item][key] = data[item][key];
|
|
12
|
-
}
|
|
13
|
-
});
|
|
14
|
-
resolve(true);
|
|
15
|
-
});
|
|
16
|
-
});
|
|
17
|
-
};
|
|
18
|
-
|
|
19
|
-
const generalStylingWrapperCss = ":host{display:block}";
|
|
20
|
-
|
|
21
|
-
const GeneralStylingWrapper = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
|
|
22
|
-
constructor() {
|
|
23
|
-
super();
|
|
24
|
-
this.__registerHost();
|
|
25
|
-
/**
|
|
26
|
-
* Client custom styling via inline styles
|
|
27
|
-
*/
|
|
28
|
-
this.clientStyling = '';
|
|
29
|
-
/**
|
|
30
|
-
* Client custom styling via url
|
|
31
|
-
*/
|
|
32
|
-
this.clientStylingUrl = '';
|
|
33
|
-
/**
|
|
34
|
-
* Translation via url
|
|
35
|
-
*/
|
|
36
|
-
this.translationUrl = '';
|
|
37
|
-
this.stylingAppends = false;
|
|
38
|
-
this.setClientStyling = () => {
|
|
39
|
-
let sheet = document.createElement('style');
|
|
40
|
-
sheet.innerHTML = this.clientStyling;
|
|
41
|
-
this.el.prepend(sheet);
|
|
42
|
-
};
|
|
43
|
-
this.setClientStylingURL = () => {
|
|
44
|
-
let url = new URL(this.clientStylingUrl);
|
|
45
|
-
let cssFile = document.createElement('style');
|
|
46
|
-
fetch(url.href)
|
|
47
|
-
.then((res) => res.text())
|
|
48
|
-
.then((data) => {
|
|
49
|
-
cssFile.innerHTML = data;
|
|
50
|
-
setTimeout(() => {
|
|
51
|
-
this.el.prepend(cssFile);
|
|
52
|
-
}, 1);
|
|
53
|
-
})
|
|
54
|
-
.catch((err) => {
|
|
55
|
-
console.log('error ', err);
|
|
56
|
-
});
|
|
57
|
-
};
|
|
58
|
-
}
|
|
59
|
-
componentDidRender() {
|
|
60
|
-
// start custom styling area
|
|
61
|
-
if (!this.stylingAppends) {
|
|
62
|
-
if (this.clientStyling)
|
|
63
|
-
this.setClientStyling();
|
|
64
|
-
if (this.clientStylingUrl)
|
|
65
|
-
this.setClientStylingURL();
|
|
66
|
-
this.stylingAppends = true;
|
|
67
|
-
}
|
|
68
|
-
// end custom styling area
|
|
69
|
-
}
|
|
70
|
-
async componentWillLoad() {
|
|
71
|
-
const promises = [];
|
|
72
|
-
if (this.translationUrl) {
|
|
73
|
-
const translationPromise = mergeTranslations(this.translationUrl, this.targetTranslations);
|
|
74
|
-
promises.push(translationPromise);
|
|
75
|
-
}
|
|
76
|
-
return await Promise.all(promises);
|
|
77
|
-
}
|
|
78
|
-
render() {
|
|
79
|
-
return (h("div", { class: "StyleShell" }, h("slot", { name: "mainContent" })));
|
|
80
|
-
}
|
|
81
|
-
get el() { return this; }
|
|
82
|
-
static get style() { return generalStylingWrapperCss; }
|
|
83
|
-
}, [4, "general-styling-wrapper", {
|
|
84
|
-
"clientStyling": [1, "client-styling"],
|
|
85
|
-
"clientStylingUrl": [1, "client-styling-url"],
|
|
86
|
-
"translationUrl": [1, "translation-url"],
|
|
87
|
-
"targetTranslations": [16]
|
|
88
|
-
}]);
|
|
89
|
-
function defineCustomElement() {
|
|
90
|
-
if (typeof customElements === "undefined") {
|
|
91
|
-
return;
|
|
92
|
-
}
|
|
93
|
-
const components = ["general-styling-wrapper"];
|
|
94
|
-
components.forEach(tagName => { switch (tagName) {
|
|
95
|
-
case "general-styling-wrapper":
|
|
96
|
-
if (!customElements.get(tagName)) {
|
|
97
|
-
customElements.define(tagName, GeneralStylingWrapper);
|
|
98
|
-
}
|
|
99
|
-
break;
|
|
100
|
-
} });
|
|
101
|
-
}
|
|
102
|
-
|
|
103
|
-
export { GeneralStylingWrapper as G, defineCustomElement as d };
|