@everymatrix/general-stories 1.59.0 → 1.59.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (30) hide show
  1. package/dist/cjs/{general-stories-adf85cfe.js → general-stories-bf174914.js} +4 -3
  2. package/dist/cjs/general-stories.cjs.entry.js +1 -1
  3. package/dist/cjs/general-stories.cjs.js +1 -1
  4. package/dist/cjs/index.cjs.js +1 -1
  5. package/dist/cjs/loader.cjs.js +1 -1
  6. package/dist/collection/components/general-stories/general-stories.css +15 -8
  7. package/dist/collection/components/general-stories/general-stories.js +4 -2
  8. package/dist/esm/{general-stories-86c14f96.js → general-stories-01c6529e.js} +4 -3
  9. package/dist/esm/general-stories.entry.js +1 -1
  10. package/dist/esm/general-stories.js +1 -1
  11. package/dist/esm/index.js +1 -1
  12. package/dist/esm/loader.js +1 -1
  13. package/dist/general-stories/general-stories.esm.js +1 -1
  14. package/dist/general-stories/index.esm.js +1 -1
  15. package/dist/general-stories/p-bf862936.js +1 -0
  16. package/dist/general-stories/p-f0be7584.entry.js +1 -0
  17. package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/stencil.config.d.ts +2 -0
  18. package/dist/types/Users/maria.bumbar/Desktop/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/stencil.config.dev.d.ts +2 -0
  19. package/package.json +1 -1
  20. package/dist/general-stories/p-50bf099a.entry.js +0 -1
  21. package/dist/general-stories/p-e3154c53.js +0 -1
  22. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/stencil.config.d.ts +0 -2
  23. package/dist/types/builds/emfe-widgets/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/stencil.config.dev.d.ts +0 -2
  24. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/libs/common/src/storybook/storybook-utils.d.ts +0 -0
  25. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/storybook/main.d.ts +0 -0
  26. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/packages/stencil/general-stories/storybook/preview.d.ts +0 -0
  27. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/tools/plugins/index.d.ts +0 -0
  28. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/tools/plugins/stencil-clean-deps-plugin.d.ts +0 -0
  29. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/tools/plugins/vite-chunk-plugin.d.ts +0 -0
  30. /package/dist/types/{builds/emfe-widgets → Users/maria.bumbar/Desktop}/widgets-monorepo/packages/stencil/general-stories/.stencil/tools/plugins/vite-clean-deps-plugin.d.ts +0 -0
@@ -142,7 +142,7 @@ function setStreamStyling(stylingContainer, domain, subscription) {
142
142
  }
143
143
  }
144
144
 
145
- const generalStoriesCss = ".ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px;position:relative;display:inline-block;border-radius:50%}.StoryThumbnailContainer.Highlighted::before{content:\"\";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-3px;left:-3px;width:111%;height:103%}.StoryThumbnailContainer.Viewed::before{content:\"\";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-3px;left:-2px;width:111%;height:96%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}";
145
+ const generalStoriesCss = ".ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px 5px 10px;position:relative;display:inline-block;border-radius:50%;height:35px;width:35px}.StoryThumbnailContainer.Highlighted::before{content:\"\";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailContainer.Viewed::before{content:\"\";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1;font-size:8px;min-width:35px;min-height:35px;max-width:35px;max-height:35px}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}";
146
146
  const GeneralStoriesStyle0 = generalStoriesCss;
147
147
 
148
148
  const GeneralStories = class {
@@ -236,6 +236,7 @@ const GeneralStories = class {
236
236
  this.clientStylingUrl = '';
237
237
  this.translationUrl = '';
238
238
  this.progressBarDuration = 10;
239
+ this.stylingContainer = undefined;
239
240
  this.currentStory = undefined;
240
241
  this.currentStoryId = null;
241
242
  this.progress = 0;
@@ -321,10 +322,10 @@ const GeneralStories = class {
321
322
  }
322
323
  render() {
323
324
  if (this.hasErrors) {
324
- return (index.h("div", { class: "GeneralStoriesError" }, index.h("div", { class: "Title" }, translate('error', this.language))));
325
+ return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "GeneralStoriesError" }, index.h("div", { class: "Title" }, translate('error', this.language)))));
325
326
  }
326
327
  if (this.isLoading) {
327
- return (index.h("div", { class: "GeneralStoriesLoading" }, index.h("div", { class: "Title" }, translate('generalStoriesLoading', this.language))));
328
+ return (index.h("div", { ref: el => this.stylingContainer = el }, index.h("div", { class: "GeneralStoriesLoading" }, index.h("div", { class: "Title" }, translate('generalStoriesLoading', this.language)))));
328
329
  }
329
330
  if (!this.isLoading) {
330
331
  return (index.h("div", { ref: el => this.stylingContainer = el }, this.currentStoryId ?
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const generalStories = require('./general-stories-adf85cfe.js');
5
+ const generalStories = require('./general-stories-bf174914.js');
6
6
  require('./index-5b8c1770.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([["general-stories.cjs",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
22
+ return index.bootstrapLazy([["general-stories.cjs",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"stylingContainer":[32],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
23
23
  });
24
24
 
25
25
  exports.setNonce = index.setNonce;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const generalStories = require('./general-stories-adf85cfe.js');
5
+ const generalStories = require('./general-stories-bf174914.js');
6
6
  require('./index-5b8c1770.js');
7
7
 
8
8
 
@@ -8,7 +8,7 @@ const appGlobals = require('./app-globals-3a1e7e63.js');
8
8
  const defineCustomElements = async (win, options) => {
9
9
  if (typeof window === 'undefined') return undefined;
10
10
  await appGlobals.globalScripts();
11
- return index.bootstrapLazy([["general-stories.cjs",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
11
+ return index.bootstrapLazy([["general-stories.cjs",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"stylingContainer":[32],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
12
12
  };
13
13
 
14
14
  exports.setNonce = index.setNonce;
@@ -6,20 +6,22 @@
6
6
  }
7
7
 
8
8
  .StoryThumbnailContainer {
9
- margin: 5px;
9
+ margin: 5px 5px 10px;
10
10
  position: relative;
11
11
  display: inline-block;
12
12
  border-radius: 50%;
13
+ height: 35px;
14
+ width: 35px;
13
15
  }
14
16
  .StoryThumbnailContainer.Highlighted::before {
15
17
  content: "";
16
18
  position: absolute;
17
19
  border-radius: 50%;
18
20
  background: linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));
19
- top: -3px;
20
- left: -3px;
21
- width: 111%;
22
- height: 103%;
21
+ top: -2px;
22
+ left: -2px;
23
+ width: 122%;
24
+ height: 119%;
23
25
  }
24
26
  .StoryThumbnailContainer.Viewed::before {
25
27
  content: "";
@@ -28,10 +30,10 @@
28
30
  height: 50px;
29
31
  width: 50px;
30
32
  background: var(--emw--color-grey-150, #828282);
31
- top: -3px;
33
+ top: -2px;
32
34
  left: -2px;
33
- width: 111%;
34
- height: 96%;
35
+ width: 122%;
36
+ height: 119%;
35
37
  }
36
38
 
37
39
  .StoryThumbnailImage {
@@ -40,6 +42,11 @@
40
42
  border-radius: 50%;
41
43
  position: relative;
42
44
  z-index: 1;
45
+ font-size: 8px;
46
+ min-width: 35px;
47
+ min-height: 35px;
48
+ max-width: 35px;
49
+ max-height: 35px;
43
50
  }
44
51
  .StoryThumbnailImage.Highlighted, .StoryThumbnailImage.Viewed {
45
52
  border: 2px solid var(--emw--color-white, #ffffff);
@@ -92,6 +92,7 @@ export class GeneralStories {
92
92
  this.clientStylingUrl = '';
93
93
  this.translationUrl = '';
94
94
  this.progressBarDuration = 10;
95
+ this.stylingContainer = undefined;
95
96
  this.currentStory = undefined;
96
97
  this.currentStoryId = null;
97
98
  this.progress = 0;
@@ -177,10 +178,10 @@ export class GeneralStories {
177
178
  }
178
179
  render() {
179
180
  if (this.hasErrors) {
180
- return (h("div", { class: "GeneralStoriesError" }, h("div", { class: "Title" }, translate('error', this.language))));
181
+ return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GeneralStoriesError" }, h("div", { class: "Title" }, translate('error', this.language)))));
181
182
  }
182
183
  if (this.isLoading) {
183
- return (h("div", { class: "GeneralStoriesLoading" }, h("div", { class: "Title" }, translate('generalStoriesLoading', this.language))));
184
+ return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GeneralStoriesLoading" }, h("div", { class: "Title" }, translate('generalStoriesLoading', this.language)))));
184
185
  }
185
186
  if (!this.isLoading) {
186
187
  return (h("div", { ref: el => this.stylingContainer = el }, this.currentStoryId ?
@@ -355,6 +356,7 @@ export class GeneralStories {
355
356
  }
356
357
  static get states() {
357
358
  return {
359
+ "stylingContainer": {},
358
360
  "currentStory": {},
359
361
  "currentStoryId": {},
360
362
  "progress": {},
@@ -140,7 +140,7 @@ function setStreamStyling(stylingContainer, domain, subscription) {
140
140
  }
141
141
  }
142
142
 
143
- const generalStoriesCss = ".ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px;position:relative;display:inline-block;border-radius:50%}.StoryThumbnailContainer.Highlighted::before{content:\"\";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-3px;left:-3px;width:111%;height:103%}.StoryThumbnailContainer.Viewed::before{content:\"\";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-3px;left:-2px;width:111%;height:96%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}";
143
+ const generalStoriesCss = ".ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px 5px 10px;position:relative;display:inline-block;border-radius:50%;height:35px;width:35px}.StoryThumbnailContainer.Highlighted::before{content:\"\";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailContainer.Viewed::before{content:\"\";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1;font-size:8px;min-width:35px;min-height:35px;max-width:35px;max-height:35px}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}";
144
144
  const GeneralStoriesStyle0 = generalStoriesCss;
145
145
 
146
146
  const GeneralStories = class {
@@ -234,6 +234,7 @@ const GeneralStories = class {
234
234
  this.clientStylingUrl = '';
235
235
  this.translationUrl = '';
236
236
  this.progressBarDuration = 10;
237
+ this.stylingContainer = undefined;
237
238
  this.currentStory = undefined;
238
239
  this.currentStoryId = null;
239
240
  this.progress = 0;
@@ -319,10 +320,10 @@ const GeneralStories = class {
319
320
  }
320
321
  render() {
321
322
  if (this.hasErrors) {
322
- return (h("div", { class: "GeneralStoriesError" }, h("div", { class: "Title" }, translate('error', this.language))));
323
+ return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GeneralStoriesError" }, h("div", { class: "Title" }, translate('error', this.language)))));
323
324
  }
324
325
  if (this.isLoading) {
325
- return (h("div", { class: "GeneralStoriesLoading" }, h("div", { class: "Title" }, translate('generalStoriesLoading', this.language))));
326
+ return (h("div", { ref: el => this.stylingContainer = el }, h("div", { class: "GeneralStoriesLoading" }, h("div", { class: "Title" }, translate('generalStoriesLoading', this.language)))));
326
327
  }
327
328
  if (!this.isLoading) {
328
329
  return (h("div", { ref: el => this.stylingContainer = el }, this.currentStoryId ?
@@ -1,2 +1,2 @@
1
- export { G as general_stories } from './general-stories-86c14f96.js';
1
+ export { G as general_stories } from './general-stories-01c6529e.js';
2
2
  import './index-b4964764.js';
@@ -16,5 +16,5 @@ var patchBrowser = () => {
16
16
 
17
17
  patchBrowser().then(async (options) => {
18
18
  await globalScripts();
19
- return bootstrapLazy([["general-stories",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
19
+ return bootstrapLazy([["general-stories",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"stylingContainer":[32],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
20
20
  });
package/dist/esm/index.js CHANGED
@@ -1,2 +1,2 @@
1
- export { G as GeneralStories } from './general-stories-86c14f96.js';
1
+ export { G as GeneralStories } from './general-stories-01c6529e.js';
2
2
  import './index-b4964764.js';
@@ -5,7 +5,7 @@ import { g as globalScripts } from './app-globals-0f993ce5.js';
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await globalScripts();
8
- return bootstrapLazy([["general-stories",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
8
+ return bootstrapLazy([["general-stories",[[1,"general-stories",{"cmsEndpoint":[513,"cms-endpoint"],"language":[513],"cmsEnv":[513,"cms-env"],"mbSource":[1,"mb-source"],"clientStyling":[513,"client-styling"],"clientStylingUrl":[513,"client-styling-url"],"translationUrl":[513,"translation-url"],"progressBarDuration":[514,"progress-bar-duration"],"stylingContainer":[32],"currentStory":[32],"currentStoryId":[32],"progress":[32],"touchPosStart":[32],"touchPosEnd":[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{"clientStyling":["handleClientStylingChange"],"clientStylingUrl":["handleClientStylingChangeURL"],"translationUrl":["handleNewTranslations"],"progress":["handleTimeEnds"]}]]]], options);
9
9
  };
10
10
 
11
11
  export { defineCustomElements };
@@ -1 +1 @@
1
- import{p as n,b as t}from"./p-c85b316a.js";export{s as setNonce}from"./p-c85b316a.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,r={};return""!==t&&(r.resourcesUrl=new URL(".",t).href),n(r)})().then((async n=>(await r(),t([["p-50bf099a",[[1,"general-stories",{cmsEndpoint:[513,"cms-endpoint"],language:[513],cmsEnv:[513,"cms-env"],mbSource:[1,"mb-source"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],progressBarDuration:[514,"progress-bar-duration"],currentStory:[32],currentStoryId:[32],progress:[32],touchPosStart:[32],touchPosEnd:[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"],progress:["handleTimeEnds"]}]]]],n))));
1
+ import{p as n,b as t}from"./p-c85b316a.js";export{s as setNonce}from"./p-c85b316a.js";import{g as r}from"./p-e1255160.js";(()=>{const t=import.meta.url,r={};return""!==t&&(r.resourcesUrl=new URL(".",t).href),n(r)})().then((async n=>(await r(),t([["p-f0be7584",[[1,"general-stories",{cmsEndpoint:[513,"cms-endpoint"],language:[513],cmsEnv:[513,"cms-env"],mbSource:[1,"mb-source"],clientStyling:[513,"client-styling"],clientStylingUrl:[513,"client-styling-url"],translationUrl:[513,"translation-url"],progressBarDuration:[514,"progress-bar-duration"],stylingContainer:[32],currentStory:[32],currentStoryId:[32],progress:[32],touchPosStart:[32],touchPosEnd:[32]},[[1,"touchstart","onTouchStart"],[1,"touchmove","onTouchMove"],[1,"touchend","onTouchEnd"]],{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"],progress:["handleTimeEnds"]}]]]],n))));
@@ -1 +1 @@
1
- export{G as GeneralStories}from"./p-e3154c53.js";import"./p-c85b316a.js";
1
+ export{G as GeneralStories}from"./p-bf862936.js";import"./p-c85b316a.js";
@@ -0,0 +1 @@
1
+ import{r as t,h as i}from"./p-c85b316a.js";const e={en:{error:"Error",generalStoriesLoading:"Loading, please wait ...",loadMore:"Load More"},hu:{error:"Hiba",generalStoriesLoading:"Betöltés, kérjük várjon ...",loadMore:"Továbbiak betöltése"},ro:{error:"Eroare",generalStoriesLoading:"Se încarcă, vă rugăm așteptați ...",loadMore:"Încarcă mai multe"},fr:{error:"Erreur",generalStoriesLoading:"Chargement, veuillez patienter ...",loadMore:"Charger plus"},ar:{error:"خطأ",generalStoriesLoading:"جار التحميل، يرجى الانتظار ...",loadMore:"تحميل المزيد"},hr:{error:"Greška",generalStoriesLoading:"Učitavanje, molimo pričekajte ...",loadMore:"Učitaj više"}},o=t=>new Promise((i=>{fetch(t).then((t=>t.json())).then((t=>{Object.keys(t).forEach((i=>{e[i]||(e[i]={});for(let o in t[i])e[i][o]=t[i][o]})),i(!0)}))})),r=(t,i)=>e[void 0!==i&&i in e?i:"en"][t];function s(t,i){if(t){const e=document.createElement("style");e.innerHTML=i,t.appendChild(e)}}function n(t,i){const e=new URL(i);fetch(e.href).then((t=>t.text())).then((i=>{const e=document.createElement("style");e.innerHTML=i,t&&t.appendChild(e)})).catch((t=>{console.error("There was an error while trying to load client styling from URL",t)}))}const a=class{constructor(e){t(this,e),this.hasErrors=!1,this.isLoading=!0,this.isSwipe=!1,this.getStories=()=>{let t=new URL(`${this.cmsEndpoint}/${this.language}/stories`);return t.searchParams.append("env",this.cmsEnv),t.searchParams.append("device",(()=>{const t=(()=>{let t=window.navigator.userAgent;return t.toLowerCase().match(/android/i)?"Android":t.toLowerCase().match(/iphone/i)?"iPhone":t.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(t)return"PC"===t?"dk":"mtWeb"})()),t.searchParams.append("language",this.language),new Promise(((i,e)=>{this.isLoading=!0,fetch(t.href).then((t=>t.json())).then((t=>{this.stories=t,this.stories.forEach((t=>{t.viewed=!1})),this.isLoading=!1,i(!0)})).catch((t=>{console.log(t),this.isLoading=!1,this.hasErrors=!0,e(t)}))}))},this.navigateToExternalStoryLink=()=>{window.postMessage({type:"OpenStoryLink",url:this.currentStory.storyUrl},window.location.href)},this.openFullScreenStory=t=>{this.currentStoryId=t,this.currentStory=this.stories.find((i=>i.id===t)),this.markStoryAsViewed(t),this.startProgress()},this.closeFullScreenView=()=>{this.markStoryAsViewed(this.currentStoryId.toString()),this.currentStoryId=null,this.progress=0,clearInterval(this.intervalId)},this.markStoryAsViewed=t=>{const i=this.stories.findIndex((i=>i.id===t));if(i>-1){const[t]=this.stories.splice(i,1);t.viewed=!0,this.stories=[...this.stories,t]}},this.changeStory=(t,i)=>{const e="next"===i?Number(t.index)+1:Number(t.index)-1;if(e>this.stories.length-1||e<0)this.markStoryAsViewed(t.index),this.closeFullScreenView();else{const t=this.stories.find((t=>t.index===e));this.currentStory=t,this.currentStoryId=t.id,this.progress=0,this.markStoryAsViewed(t.id)}},this.startProgress=()=>{const t=100/(1e3*this.progressBarDuration)*100;this.intervalId=setInterval((()=>{this.progress>=100?clearInterval(this.intervalId):this.progress+=t}),100)},this.Thumbnail=({props:t})=>i("div",{class:"StoryThumbnailContainer "+(t.viewed?"Viewed":"Highlighted"),onTouchStart:()=>this.openFullScreenStory(t.id)},i("img",{class:"StoryThumbnailImage "+(t.viewed?"Viewed":"Highlighted"),src:t.icon,alt:"story-icon"})),this.cmsEndpoint=void 0,this.language="en",this.cmsEnv="stage",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.progressBarDuration=10,this.stylingContainer=void 0,this.currentStory=void 0,this.currentStoryId=null,this.progress=0,this.touchPosStart=void 0,this.touchPosEnd=void 0}handleClientStylingChange(t,i){t!=i&&s(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(t,i){t!=i&&this.clientStylingUrl&&n(this.stylingContainer,this.clientStylingUrl)}handleNewTranslations(){this.isLoading=!0,o(this.translationUrl).then((()=>{this.isLoading=!1}))}handleTimeEnds(t){t>=100&&this.changeStory(this.currentStory,"next")}async componentWillLoad(){this.cmsEndpoint&&this.language&&await this.getStories(),this.translationUrl.length>2&&await o(this.translationUrl)}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(t,i){if(window.emMessageBus){const e=document.createElement("style");window.emMessageBus.subscribe(i,(i=>{e.innerHTML=i,t&&t.appendChild(e)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&s(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&n(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}onTouchStart(t){this.touchPosStart={clientX:t.touches[0].clientX,clientY:t.touches[0].clientY}}onTouchMove(t){this.touchPosEnd={clientX:t.touches[0].clientX,clientY:t.touches[0].clientY},Math.abs(this.touchPosEnd.clientX-this.touchPosStart.clientX)>50&&(this.isSwipe=!0)}onTouchEnd(t){if(this.isSwipe)this.touchPosEnd={clientX:t.changedTouches[0].clientX,clientY:t.changedTouches[0].clientY},this.changeStory(this.currentStory,this.touchPosEnd.clientX-this.touchPosStart.clientX>0?"previous":"next");else{const i=window.innerWidth;this.changeStory(this.currentStory,t.changedTouches[0].clientX>i/2?"next":"previous")}}render(){return this.hasErrors?i("div",{ref:t=>this.stylingContainer=t},i("div",{class:"GeneralStoriesError"},i("div",{class:"Title"},r("error",this.language)))):this.isLoading?i("div",{ref:t=>this.stylingContainer=t},i("div",{class:"GeneralStoriesLoading"},i("div",{class:"Title"},r("generalStoriesLoading",this.language)))):this.isLoading?void 0:i("div",{ref:t=>this.stylingContainer=t},this.currentStoryId?i("div",{class:"FullScreenStory"},i("div",{class:"FullScreenHeader"},i("div",{class:"ProgressBarContainer"},i("div",{class:"ProgressBar",style:{width:`${this.progress}%`}})),i("div",{id:"close",class:"CloseStoryButton",onTouchStart:this.closeFullScreenView},i("svg",{fill:"none",stroke:"#ffffff",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},i("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M6 18L18 6M6 6l12 12"})))),"video"===this.currentStory.type?i("video",{autoPlay:!0},i("source",{src:this.currentStory.url,type:"video/mp4"})):i("img",{src:this.currentStory.url,alt:"story-image"}),this.currentStory.storyUrl&&i("div",{class:"LoadMoreButtonBackground"},i("button",{onTouchStart:this.navigateToExternalStoryLink,class:"LoadMoreButton"},r("loadMore",this.language)))):i("div",{class:"ImageContainer"},this.stories.map((t=>i(this.Thumbnail,{props:t})))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"],progress:["handleTimeEnds"]}}};a.style='.ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px 5px 10px;position:relative;display:inline-block;border-radius:50%;height:35px;width:35px}.StoryThumbnailContainer.Highlighted::before{content:"";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailContainer.Viewed::before{content:"";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-2px;left:-2px;width:122%;height:119%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1;font-size:8px;min-width:35px;min-height:35px;max-width:35px;max-height:35px}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}';export{a as G}
@@ -0,0 +1 @@
1
+ export{G as general_stories}from"./p-bf862936.js";import"./p-c85b316a.js";
@@ -0,0 +1,2 @@
1
+ import { Config } from '../../../../../../../../../../../stencil-public-runtime';
2
+ export declare const config: Config;
@@ -0,0 +1,2 @@
1
+ import { Config } from '../../../../../../../../../../../stencil-public-runtime';
2
+ export declare const config: Config;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@everymatrix/general-stories",
3
- "version": "1.59.0",
3
+ "version": "1.59.2",
4
4
  "main": "./dist/index.cjs.js",
5
5
  "module": "./dist/index.js",
6
6
  "es2015": "./dist/esm/index.mjs",
@@ -1 +0,0 @@
1
- export{G as general_stories}from"./p-e3154c53.js";import"./p-c85b316a.js";
@@ -1 +0,0 @@
1
- import{r as t,h as i}from"./p-c85b316a.js";const e={en:{error:"Error",generalStoriesLoading:"Loading, please wait ...",loadMore:"Load More"},hu:{error:"Hiba",generalStoriesLoading:"Betöltés, kérjük várjon ...",loadMore:"Továbbiak betöltése"},ro:{error:"Eroare",generalStoriesLoading:"Se încarcă, vă rugăm așteptați ...",loadMore:"Încarcă mai multe"},fr:{error:"Erreur",generalStoriesLoading:"Chargement, veuillez patienter ...",loadMore:"Charger plus"},ar:{error:"خطأ",generalStoriesLoading:"جار التحميل، يرجى الانتظار ...",loadMore:"تحميل المزيد"},hr:{error:"Greška",generalStoriesLoading:"Učitavanje, molimo pričekajte ...",loadMore:"Učitaj više"}},o=t=>new Promise((i=>{fetch(t).then((t=>t.json())).then((t=>{Object.keys(t).forEach((i=>{e[i]||(e[i]={});for(let o in t[i])e[i][o]=t[i][o]})),i(!0)}))})),r=(t,i)=>e[void 0!==i&&i in e?i:"en"][t];function s(t,i){if(t){const e=document.createElement("style");e.innerHTML=i,t.appendChild(e)}}function n(t,i){const e=new URL(i);fetch(e.href).then((t=>t.text())).then((i=>{const e=document.createElement("style");e.innerHTML=i,t&&t.appendChild(e)})).catch((t=>{console.error("There was an error while trying to load client styling from URL",t)}))}const a=class{constructor(e){t(this,e),this.hasErrors=!1,this.isLoading=!0,this.isSwipe=!1,this.getStories=()=>{let t=new URL(`${this.cmsEndpoint}/${this.language}/stories`);return t.searchParams.append("env",this.cmsEnv),t.searchParams.append("device",(()=>{const t=(()=>{let t=window.navigator.userAgent;return t.toLowerCase().match(/android/i)?"Android":t.toLowerCase().match(/iphone/i)?"iPhone":t.toLowerCase().match(/ipad|ipod/i)?"iPad":"PC"})();if(t)return"PC"===t?"dk":"mtWeb"})()),t.searchParams.append("language",this.language),new Promise(((i,e)=>{this.isLoading=!0,fetch(t.href).then((t=>t.json())).then((t=>{this.stories=t,this.stories.forEach((t=>{t.viewed=!1})),this.isLoading=!1,i(!0)})).catch((t=>{console.log(t),this.isLoading=!1,this.hasErrors=!0,e(t)}))}))},this.navigateToExternalStoryLink=()=>{window.postMessage({type:"OpenStoryLink",url:this.currentStory.storyUrl},window.location.href)},this.openFullScreenStory=t=>{this.currentStoryId=t,this.currentStory=this.stories.find((i=>i.id===t)),this.markStoryAsViewed(t),this.startProgress()},this.closeFullScreenView=()=>{this.markStoryAsViewed(this.currentStoryId.toString()),this.currentStoryId=null,this.progress=0,clearInterval(this.intervalId)},this.markStoryAsViewed=t=>{const i=this.stories.findIndex((i=>i.id===t));if(i>-1){const[t]=this.stories.splice(i,1);t.viewed=!0,this.stories=[...this.stories,t]}},this.changeStory=(t,i)=>{const e="next"===i?Number(t.index)+1:Number(t.index)-1;if(e>this.stories.length-1||e<0)this.markStoryAsViewed(t.index),this.closeFullScreenView();else{const t=this.stories.find((t=>t.index===e));this.currentStory=t,this.currentStoryId=t.id,this.progress=0,this.markStoryAsViewed(t.id)}},this.startProgress=()=>{const t=100/(1e3*this.progressBarDuration)*100;this.intervalId=setInterval((()=>{this.progress>=100?clearInterval(this.intervalId):this.progress+=t}),100)},this.Thumbnail=({props:t})=>i("div",{class:"StoryThumbnailContainer "+(t.viewed?"Viewed":"Highlighted"),onTouchStart:()=>this.openFullScreenStory(t.id)},i("img",{class:"StoryThumbnailImage "+(t.viewed?"Viewed":"Highlighted"),src:t.icon,alt:"story-icon"})),this.cmsEndpoint=void 0,this.language="en",this.cmsEnv="stage",this.mbSource=void 0,this.clientStyling="",this.clientStylingUrl="",this.translationUrl="",this.progressBarDuration=10,this.currentStory=void 0,this.currentStoryId=null,this.progress=0,this.touchPosStart=void 0,this.touchPosEnd=void 0}handleClientStylingChange(t,i){t!=i&&s(this.stylingContainer,this.clientStyling)}handleClientStylingChangeURL(t,i){t!=i&&this.clientStylingUrl&&n(this.stylingContainer,this.clientStylingUrl)}handleNewTranslations(){this.isLoading=!0,o(this.translationUrl).then((()=>{this.isLoading=!1}))}handleTimeEnds(t){t>=100&&this.changeStory(this.currentStory,"next")}async componentWillLoad(){this.cmsEndpoint&&this.language&&await this.getStories(),this.translationUrl.length>2&&await o(this.translationUrl)}componentDidLoad(){this.stylingContainer&&(null!=window.emMessageBus?function(t,i){if(window.emMessageBus){const e=document.createElement("style");window.emMessageBus.subscribe(i,(i=>{e.innerHTML=i,t&&t.appendChild(e)}))}}(this.stylingContainer,`${this.mbSource}.Style`):(this.clientStyling&&s(this.stylingContainer,this.clientStyling),this.clientStylingUrl&&n(this.stylingContainer,this.clientStylingUrl)))}disconnectedCallback(){this.stylingSubscription&&this.stylingSubscription.unsubscribe()}onTouchStart(t){this.touchPosStart={clientX:t.touches[0].clientX,clientY:t.touches[0].clientY}}onTouchMove(t){this.touchPosEnd={clientX:t.touches[0].clientX,clientY:t.touches[0].clientY},Math.abs(this.touchPosEnd.clientX-this.touchPosStart.clientX)>50&&(this.isSwipe=!0)}onTouchEnd(t){if(this.isSwipe)this.touchPosEnd={clientX:t.changedTouches[0].clientX,clientY:t.changedTouches[0].clientY},this.changeStory(this.currentStory,this.touchPosEnd.clientX-this.touchPosStart.clientX>0?"previous":"next");else{const i=window.innerWidth;this.changeStory(this.currentStory,t.changedTouches[0].clientX>i/2?"next":"previous")}}render(){return this.hasErrors?i("div",{class:"GeneralStoriesError"},i("div",{class:"Title"},r("error",this.language))):this.isLoading?i("div",{class:"GeneralStoriesLoading"},i("div",{class:"Title"},r("generalStoriesLoading",this.language))):this.isLoading?void 0:i("div",{ref:t=>this.stylingContainer=t},this.currentStoryId?i("div",{class:"FullScreenStory"},i("div",{class:"FullScreenHeader"},i("div",{class:"ProgressBarContainer"},i("div",{class:"ProgressBar",style:{width:`${this.progress}%`}})),i("div",{id:"close",class:"CloseStoryButton",onTouchStart:this.closeFullScreenView},i("svg",{fill:"none",stroke:"#ffffff",viewBox:"0 0 24 24",xmlns:"http://www.w3.org/2000/svg"},i("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M6 18L18 6M6 6l12 12"})))),"video"===this.currentStory.type?i("video",{autoPlay:!0},i("source",{src:this.currentStory.url,type:"video/mp4"})):i("img",{src:this.currentStory.url,alt:"story-image"}),this.currentStory.storyUrl&&i("div",{class:"LoadMoreButtonBackground"},i("button",{onTouchStart:this.navigateToExternalStoryLink,class:"LoadMoreButton"},r("loadMore",this.language)))):i("div",{class:"ImageContainer"},this.stories.map((t=>i(this.Thumbnail,{props:t})))))}static get watchers(){return{clientStyling:["handleClientStylingChange"],clientStylingUrl:["handleClientStylingChangeURL"],translationUrl:["handleNewTranslations"],progress:["handleTimeEnds"]}}};a.style='.ImageContainer{display:flex;flex-direction:row;background-color:var(--emw--color-background, #0E1511);overflow:auto}.StoryThumbnailContainer{margin:5px;position:relative;display:inline-block;border-radius:50%}.StoryThumbnailContainer.Highlighted::before{content:"";position:absolute;border-radius:50%;background:linear-gradient(to bottom, var(--emw--color-primary, #22B04E), var(--emw--color-secondary, #E1A749));top:-3px;left:-3px;width:111%;height:103%}.StoryThumbnailContainer.Viewed::before{content:"";position:absolute;border-radius:50%;height:50px;width:50px;background:var(--emw--color-grey-150, #828282);top:-3px;left:-2px;width:111%;height:96%}.StoryThumbnailImage{height:35px;width:35px;border-radius:50%;position:relative;z-index:1}.StoryThumbnailImage.Highlighted,.StoryThumbnailImage.Viewed{border:2px solid var(--emw--color-white, #ffffff)}.FullScreenHeader{position:fixed;top:0;background:linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));top:0px;width:100%;display:flex;flex-direction:column;padding:10px 0;z-index:5;height:30px}.FullScreenHeader .CloseStoryButton{position:absolute;right:0;width:20px;margin-right:20px;margin-top:8px;z-index:50}.FullScreenHeader .ProgressBarContainer{width:90%;height:2px;position:relative;top:0;background-color:var(--emw--color-grey-150, #828282);border-radius:10px;overflow:hidden;margin:0 auto}.FullScreenHeader .ProgressBarContainer .ProgressBar{height:100%;background:var(--emw--color-white, #ffffff);width:0%;transition:width 0.1s linear}.FullScreenStory{position:fixed;top:0;width:100%;height:100%;background-color:var(--emw--color-grey-400, #24211f);display:flex;align-items:center;justify-content:center;overflow:hidden;z-index:300}.FullScreenStory video{height:100vh;width:100vw}.FullScreenStory img{width:100%;height:100%;object-fit:contain}.FullScreenStory .LoadMoreButtonBackground{width:100%;height:15%;background:linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));position:absolute;bottom:0;display:flex;justify-content:center}.FullScreenStory .LoadMoreButtonBackground .LoadMoreButton{width:auto;font-size:var(--emw--font-size-small, 14px);font-family:inherit;background-color:var(--emw--color-grey-50, #F9F8F8);box-shadow:0px 0px 7px 1px var(--emw--color-grey-400, #24211f);color:var(--emw--color-black, #000000);border-radius:50px;position:absolute;bottom:15px;padding:10px 20px}';export{a as G}
@@ -1,2 +0,0 @@
1
- import { Config } from '../../../../../../../../../../stencil-public-runtime';
2
- export declare const config: Config;
@@ -1,2 +0,0 @@
1
- import { Config } from '../../../../../../../../../../stencil-public-runtime';
2
- export declare const config: Config;