hr-design-system-handlebars 1.114.118 → 1.114.119

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 (22) hide show
  1. package/CHANGELOG.md +13 -0
  2. package/dist/assets/index.css +3 -3
  3. package/dist/assets/js/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js +2 -2
  4. package/dist/assets/js/components/external-service/externalServiceDs.feature.js +5 -5
  5. package/dist/views/components/content/copytext/components/externalservice.hbs +1 -1
  6. package/dist/views/components/content/copytext/copytext_body.hbs +2 -2
  7. package/dist/views/components/external-service/external_service.hbs +3 -3
  8. package/dist/views/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
  9. package/dist/views/components/teaser/teaser_external_service.hbs +1 -1
  10. package/dist/views_static/components/content/copytext/components/externalservice.hbs +1 -1
  11. package/dist/views_static/components/content/copytext/copytext_body.hbs +2 -2
  12. package/dist/views_static/components/external-service/external_service.hbs +3 -3
  13. package/dist/views_static/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
  14. package/dist/views_static/components/teaser/teaser_external_service.hbs +1 -1
  15. package/package.json +1 -1
  16. package/src/stories/views/components/content/copytext/components/externalservice.hbs +1 -1
  17. package/src/stories/views/components/content/copytext/copytext_body.hbs +2 -2
  18. package/src/stories/views/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js +2 -2
  19. package/src/stories/views/components/external-service/externalServiceDs.feature.js +5 -5
  20. package/src/stories/views/components/external-service/external_service.hbs +3 -3
  21. package/src/stories/views/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
  22. package/src/stories/views/components/teaser/teaser_external_service.hbs +1 -1
package/CHANGELOG.md CHANGED
@@ -1,3 +1,16 @@
1
+ # v1.114.119 (Fri Mar 07 2025)
2
+
3
+ #### 🐛 Bug Fix
4
+
5
+ - change _isFirst to _loadLazy & set _LoadLazy in Teaser to false [#1260](https://github.com/mumprod/hr-design-system-handlebars/pull/1260) (saad.elbaciri@hr.de [@selbaciri](https://github.com/selbaciri))
6
+
7
+ #### Authors: 2
8
+
9
+ - Saad El Baciri ([@selbaciri](https://github.com/selbaciri))
10
+ - selbaciri (saad.elbaciri@hr.de)
11
+
12
+ ---
13
+
1
14
  # v1.114.118 (Thu Mar 06 2025)
2
15
 
3
16
  #### 🐛 Bug Fix
@@ -3860,7 +3860,7 @@ article #commentList {
3860
3860
  border-bottom-color: var(--color-secondary-ds);
3861
3861
  }
3862
3862
  .counter-reset {
3863
- counter-reset: cnt1741267255954;
3863
+ counter-reset: cnt1741357520030;
3864
3864
  }
3865
3865
  .animate-delay-100 {
3866
3866
  --tw-animate-delay: 100ms;
@@ -4305,7 +4305,7 @@ html { scroll-behavior: smooth; }
4305
4305
  --tw-ring-color: rgba(255, 255, 255, 0.5);
4306
4306
  }
4307
4307
  .-ordered {
4308
- counter-increment: cnt1741267255954 1;
4308
+ counter-increment: cnt1741357520030 1;
4309
4309
  }
4310
4310
  .-ordered::before {
4311
4311
  position: absolute;
@@ -4323,7 +4323,7 @@ html { scroll-behavior: smooth; }
4323
4323
  --tw-text-opacity: 1;
4324
4324
  color: rgba(0, 0, 0, 1);
4325
4325
  color: rgba(0, 0, 0, var(--tw-text-opacity));
4326
- content: counter(cnt1741267255954);
4326
+ content: counter(cnt1741357520030);
4327
4327
  }
4328
4328
  /*! ****************************/
4329
4329
  /*! DataPolicy stuff */
@@ -1,4 +1,4 @@
1
- const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, isFirst) {
1
+ const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, lazyLoad) {
2
2
 
3
3
  const { element: rootElement } = context
4
4
  let aspectRatio = configAR
@@ -67,7 +67,7 @@ const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHe
67
67
  iframe.setAttribute('frameborder', '0')
68
68
  iframe.src = embedCode
69
69
  iframe.id = 'datawrapper-chart-' + uniqueId
70
- if (!isFirst) {
70
+ if (lazyLoad) {
71
71
  iframe.loading = "lazy";
72
72
  }
73
73
 
@@ -23,7 +23,7 @@ const ExternalService = function (context) {
23
23
  dataPolicyCheck = options.dataPolicyCheck || false,
24
24
  id = options.id,
25
25
  iFrameConfig = options.iFrameConfig,
26
- isFirst = options.isFirst
26
+ lazyLoad = options.lazyLoad
27
27
  let acceptButton,
28
28
  acceptAlwaysCheckbox = hr$('.js-dataPolicy-acceptPermanentely', rootElement)[0]
29
29
  let embedCode = options.embedCode,
@@ -193,7 +193,7 @@ const ExternalService = function (context) {
193
193
  iframe.src = cleanUrl;
194
194
  iframe.style.width = "100%";
195
195
  iframe.style.border = "0";
196
- if (!isFirst) {
196
+ if (lazyLoad) {
197
197
  iframe.loading = "lazy";
198
198
  }
199
199
  rootElement.appendChild(iframe);
@@ -241,7 +241,7 @@ const ExternalService = function (context) {
241
241
  if (iFrameConfig.noResponsiveIframe == 'true') {
242
242
 
243
243
  //Klassisches Iframe mit AR-Wrapper oder fester Höhe
244
- noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, isFirst)
244
+ noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, lazyLoad)
245
245
  noResponsiveIframe.createNoResponsiveIframe()
246
246
 
247
247
  if (iFrameConfig.refreshContent == 'true') {
@@ -291,7 +291,7 @@ const ExternalService = function (context) {
291
291
  iframe.setAttribute('frameborder', '0')
292
292
  iframe.src = embedCode
293
293
  iframe.id = 'datawrapper-chart-' + uniqueId
294
- if (!isFirst) {
294
+ if (lazyLoad) {
295
295
  iframe.loading = "lazy";
296
296
  }
297
297
  rootElement.insertBefore(iframe, null)
@@ -402,7 +402,7 @@ const ExternalService = function (context) {
402
402
 
403
403
  const loadIframe = function () {
404
404
  console.log('load iframe ' + id)
405
- const loadingAttribute = isFirst ? "" : "loading='lazy'";
405
+ const loadingAttribute = lazyLoad ? "loading='lazy'" : "";
406
406
  iframe = "<iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>"
407
407
  if (iFrameConfig.aspectRatio) {
408
408
  iframe = "<div class='!h-full'><div class='" + getAspectRatioClass() + "'><iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div></div>"
@@ -1,5 +1,5 @@
1
1
  {{#with this.toModel.externalService}}
2
2
 
3
- {{> components/external-service/external_service _isFirst=../_isFirst }}
3
+ {{> components/external-service/external_service _lazyLoad=../_lazyLoad }}
4
4
 
5
5
  {{/with}}
@@ -5,7 +5,7 @@
5
5
  {{~#if @first~}}
6
6
  {{~#with this.paragraphBoxItem }}
7
7
  {{~#if this.isExternalService}}
8
- {{> components/content/copytext/components/externalservice _isFirst=true }}
8
+ {{> components/content/copytext/components/externalservice _lazyLoad=false }}
9
9
  {{/if~}}
10
10
  {{~/with}}
11
11
  {{else}}
@@ -59,7 +59,7 @@
59
59
  {{> components/content/copytext/components/voting }}
60
60
  {{/if~}}
61
61
  {{~#if this.isExternalService}}
62
- {{> components/content/copytext/components/externalservice _isFirst=false }}
62
+ {{> components/content/copytext/components/externalservice _lazyLoad=true }}
63
63
  {{/if~}}
64
64
  {{~#if this.isContentNav}}
65
65
  {{#with this.toModel.contentNavigationTeaser}}
@@ -1,6 +1,6 @@
1
1
  {{#if this.externalServiceConfig.makeConfigurable}}
2
2
  <!-- Embedding via JS with DataPolicyCheck-->
3
- {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
3
+ {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _lazyLoad=_lazyLoad}}
4
4
 
5
5
  {{else}}
6
6
 
@@ -11,13 +11,13 @@
11
11
  <!-- Embedding via Iframe -->
12
12
  <div class="{{#if this.fixedHeight}}overflow-y-hidden{{else}}overflow-hidden{{/if}}" {{#if this.fixedHeight}}style="height:{{this.fixedHeight}}px;"{{/if}}>
13
13
  {{#unless this.fixedHeight}}<div class="{{~inline-switch this.aspectRatio '["16x9","16x7","4x3","100x27","100","9x16","7x16"]' '["ar-16-9","ar-16-7","ar-4-3","ar-100-27","ar-1-1","ar-9-16","ar-7-16","ar-16-9"]'~}}">{{/unless}}
14
- <iframe {{#unless _isFirst}} loading='lazy' {{/unless}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
14
+ <iframe {{#if _lazyLoad}} loading='lazy' {{/if}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
15
15
  {{#unless this.fixedHeight}}</div>{{/unless}}
16
16
  </div>
17
17
  {{else}}
18
18
  <!-- Embedding via JS without DataPolicyCheck-->
19
19
  <div class="c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
20
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
20
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
21
21
  </div>
22
22
  {{/if}}
23
23
  {{~> components/external-service/components/external_service_caption ~}}
@@ -2,7 +2,7 @@
2
2
  {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}
3
3
  <div class="c-externalService c-externalService__{{this.externalServiceConfig.externalServiceId}}{{#unless
4
4
  this.fixedHeight }} -noFixedHeight{{/unless}} js-load"
5
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
5
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
6
6
  "fixedHeight":"{{this.fixedHeight}}"{{~else~}}{{~#if this.aspectRatio}}"aspectRatio":"{{this.aspectRatio}}"{{~else~}}"aspectRatio":"16x9"{{/if}}{{~/if}},"noResponsiveIframe":"{{{this.setResponsiveIframe}}}","webcomponent":"{{{this.setWebcomponent}}}"{{~#if this.setTimedReloadIframe}},"refreshContent":"{{{this.setTimedReloadIframe}}}","refreshIntervall":"{{this.setTimeForReload}}"{{~/if}} }}'>
7
7
  {{~> components/external-service/components/external_service_data_policy ~}}
8
8
  </div>
@@ -1,6 +1,6 @@
1
1
  <div class="grid-cols-12 col-span-12 px-5 sm:px-0{{~inline-switch this.teasersize '["50"]' '[" md:col-span-6",""]'}}">
2
2
 
3
- {{> components/external-service/external_service _isTeaser="true"}}
3
+ {{> components/external-service/external_service _isTeaser="true" _lazyLoad=false}}
4
4
 
5
5
  {{> components/teaser/components/teaser_featured_content _size=this.realTeaserSize}}
6
6
 
@@ -1,5 +1,5 @@
1
1
  {{#with this.toModel.externalService}}
2
2
 
3
- {{> components/external-service/external_service _isFirst=../_isFirst }}
3
+ {{> components/external-service/external_service _lazyLoad=../_lazyLoad }}
4
4
 
5
5
  {{/with}}
@@ -5,7 +5,7 @@
5
5
  {{~#if @first~}}
6
6
  {{~#with this.paragraphBoxItem }}
7
7
  {{~#if this.isExternalService}}
8
- {{> components/content/copytext/components/externalservice _isFirst=true }}
8
+ {{> components/content/copytext/components/externalservice _lazyLoad=false }}
9
9
  {{/if~}}
10
10
  {{~/with}}
11
11
  {{else}}
@@ -59,7 +59,7 @@
59
59
  {{> components/content/copytext/components/voting }}
60
60
  {{/if~}}
61
61
  {{~#if this.isExternalService}}
62
- {{> components/content/copytext/components/externalservice _isFirst=false }}
62
+ {{> components/content/copytext/components/externalservice _lazyLoad=true }}
63
63
  {{/if~}}
64
64
  {{~#if this.isContentNav}}
65
65
  {{#with this.toModel.contentNavigationTeaser}}
@@ -1,6 +1,6 @@
1
1
  {{#if this.externalServiceConfig.makeConfigurable}}
2
2
  <!-- Embedding via JS with DataPolicyCheck-->
3
- {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
3
+ {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _lazyLoad=_lazyLoad}}
4
4
 
5
5
  {{else}}
6
6
 
@@ -11,13 +11,13 @@
11
11
  <!-- Embedding via Iframe -->
12
12
  <div class="{{#if this.fixedHeight}}overflow-y-hidden{{else}}overflow-hidden{{/if}}" {{#if this.fixedHeight}}style="height:{{this.fixedHeight}}px;"{{/if}}>
13
13
  {{#unless this.fixedHeight}}<div class="{{~inline-switch this.aspectRatio '["16x9","16x7","4x3","100x27","100","9x16","7x16"]' '["ar-16-9","ar-16-7","ar-4-3","ar-100-27","ar-1-1","ar-9-16","ar-7-16","ar-16-9"]'~}}">{{/unless}}
14
- <iframe {{#unless _isFirst}} loading='lazy' {{/unless}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
14
+ <iframe {{#if _lazyLoad}} loading='lazy' {{/if}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
15
15
  {{#unless this.fixedHeight}}</div>{{/unless}}
16
16
  </div>
17
17
  {{else}}
18
18
  <!-- Embedding via JS without DataPolicyCheck-->
19
19
  <div class="c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
20
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
20
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
21
21
  </div>
22
22
  {{/if}}
23
23
  {{~> components/external-service/components/external_service_caption ~}}
@@ -2,7 +2,7 @@
2
2
  {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}
3
3
  <div class="c-externalService c-externalService__{{this.externalServiceConfig.externalServiceId}}{{#unless
4
4
  this.fixedHeight }} -noFixedHeight{{/unless}} js-load"
5
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
5
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
6
6
  "fixedHeight":"{{this.fixedHeight}}"{{~else~}}{{~#if this.aspectRatio}}"aspectRatio":"{{this.aspectRatio}}"{{~else~}}"aspectRatio":"16x9"{{/if}}{{~/if}},"noResponsiveIframe":"{{{this.setResponsiveIframe}}}","webcomponent":"{{{this.setWebcomponent}}}"{{~#if this.setTimedReloadIframe}},"refreshContent":"{{{this.setTimedReloadIframe}}}","refreshIntervall":"{{this.setTimeForReload}}"{{~/if}} }}'>
7
7
  {{~> components/external-service/components/external_service_data_policy ~}}
8
8
  </div>
@@ -1,6 +1,6 @@
1
1
  <div class="grid-cols-12 col-span-12 px-5 sm:px-0{{~inline-switch this.teasersize '["50"]' '[" md:col-span-6",""]'}}">
2
2
 
3
- {{> components/external-service/external_service _isTeaser="true"}}
3
+ {{> components/external-service/external_service _isTeaser="true" _lazyLoad=false}}
4
4
 
5
5
  {{> components/teaser/components/teaser_featured_content _size=this.realTeaserSize}}
6
6
 
package/package.json CHANGED
@@ -6,7 +6,7 @@
6
6
  "license": "MIT",
7
7
  "main": "dist/index.js",
8
8
  "repository": "https://github.com/szuelch/hr-design-system-handlebars",
9
- "version": "1.114.118",
9
+ "version": "1.114.119",
10
10
  "scripts": {
11
11
  "test": "echo \"Error: no test specified\" && exit 1",
12
12
  "storybook": "storybook dev -p 6006 public",
@@ -1,5 +1,5 @@
1
1
  {{#with this.toModel.externalService}}
2
2
 
3
- {{> components/external-service/external_service _isFirst=../_isFirst }}
3
+ {{> components/external-service/external_service _lazyLoad=../_lazyLoad }}
4
4
 
5
5
  {{/with}}
@@ -5,7 +5,7 @@
5
5
  {{~#if @first~}}
6
6
  {{~#with this.paragraphBoxItem }}
7
7
  {{~#if this.isExternalService}}
8
- {{> components/content/copytext/components/externalservice _isFirst=true }}
8
+ {{> components/content/copytext/components/externalservice _lazyLoad=false }}
9
9
  {{/if~}}
10
10
  {{~/with}}
11
11
  {{else}}
@@ -59,7 +59,7 @@
59
59
  {{> components/content/copytext/components/voting }}
60
60
  {{/if~}}
61
61
  {{~#if this.isExternalService}}
62
- {{> components/content/copytext/components/externalservice _isFirst=false }}
62
+ {{> components/content/copytext/components/externalservice _lazyLoad=true }}
63
63
  {{/if~}}
64
64
  {{~#if this.isContentNav}}
65
65
  {{#with this.toModel.contentNavigationTeaser}}
@@ -1,4 +1,4 @@
1
- const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, isFirst) {
1
+ const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, lazyLoad) {
2
2
 
3
3
  const { element: rootElement } = context
4
4
  let aspectRatio = configAR
@@ -67,7 +67,7 @@ const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHe
67
67
  iframe.setAttribute('frameborder', '0')
68
68
  iframe.src = embedCode
69
69
  iframe.id = 'datawrapper-chart-' + uniqueId
70
- if (!isFirst) {
70
+ if (lazyLoad) {
71
71
  iframe.loading = "lazy";
72
72
  }
73
73
 
@@ -23,7 +23,7 @@ const ExternalService = function (context) {
23
23
  dataPolicyCheck = options.dataPolicyCheck || false,
24
24
  id = options.id,
25
25
  iFrameConfig = options.iFrameConfig,
26
- isFirst = options.isFirst
26
+ lazyLoad = options.lazyLoad
27
27
  let acceptButton,
28
28
  acceptAlwaysCheckbox = hr$('.js-dataPolicy-acceptPermanentely', rootElement)[0]
29
29
  let embedCode = options.embedCode,
@@ -193,7 +193,7 @@ const ExternalService = function (context) {
193
193
  iframe.src = cleanUrl;
194
194
  iframe.style.width = "100%";
195
195
  iframe.style.border = "0";
196
- if (!isFirst) {
196
+ if (lazyLoad) {
197
197
  iframe.loading = "lazy";
198
198
  }
199
199
  rootElement.appendChild(iframe);
@@ -241,7 +241,7 @@ const ExternalService = function (context) {
241
241
  if (iFrameConfig.noResponsiveIframe == 'true') {
242
242
 
243
243
  //Klassisches Iframe mit AR-Wrapper oder fester Höhe
244
- noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, isFirst)
244
+ noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, lazyLoad)
245
245
  noResponsiveIframe.createNoResponsiveIframe()
246
246
 
247
247
  if (iFrameConfig.refreshContent == 'true') {
@@ -291,7 +291,7 @@ const ExternalService = function (context) {
291
291
  iframe.setAttribute('frameborder', '0')
292
292
  iframe.src = embedCode
293
293
  iframe.id = 'datawrapper-chart-' + uniqueId
294
- if (!isFirst) {
294
+ if (lazyLoad) {
295
295
  iframe.loading = "lazy";
296
296
  }
297
297
  rootElement.insertBefore(iframe, null)
@@ -402,7 +402,7 @@ const ExternalService = function (context) {
402
402
 
403
403
  const loadIframe = function () {
404
404
  console.log('load iframe ' + id)
405
- const loadingAttribute = isFirst ? "" : "loading='lazy'";
405
+ const loadingAttribute = lazyLoad ? "loading='lazy'" : "";
406
406
  iframe = "<iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>"
407
407
  if (iFrameConfig.aspectRatio) {
408
408
  iframe = "<div class='!h-full'><div class='" + getAspectRatioClass() + "'><iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div></div>"
@@ -1,6 +1,6 @@
1
1
  {{#if this.externalServiceConfig.makeConfigurable}}
2
2
  <!-- Embedding via JS with DataPolicyCheck-->
3
- {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
3
+ {{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _lazyLoad=_lazyLoad}}
4
4
 
5
5
  {{else}}
6
6
 
@@ -11,13 +11,13 @@
11
11
  <!-- Embedding via Iframe -->
12
12
  <div class="{{#if this.fixedHeight}}overflow-y-hidden{{else}}overflow-hidden{{/if}}" {{#if this.fixedHeight}}style="height:{{this.fixedHeight}}px;"{{/if}}>
13
13
  {{#unless this.fixedHeight}}<div class="{{~inline-switch this.aspectRatio '["16x9","16x7","4x3","100x27","100","9x16","7x16"]' '["ar-16-9","ar-16-7","ar-4-3","ar-100-27","ar-1-1","ar-9-16","ar-7-16","ar-16-9"]'~}}">{{/unless}}
14
- <iframe {{#unless _isFirst}} loading='lazy' {{/unless}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
14
+ <iframe {{#if _lazyLoad}} loading='lazy' {{/if}} frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
15
15
  {{#unless this.fixedHeight}}</div>{{/unless}}
16
16
  </div>
17
17
  {{else}}
18
18
  <!-- Embedding via JS without DataPolicyCheck-->
19
19
  <div class="c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
20
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
20
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
21
21
  </div>
22
22
  {{/if}}
23
23
  {{~> components/external-service/components/external_service_caption ~}}
@@ -2,7 +2,7 @@
2
2
  {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}
3
3
  <div class="c-externalService c-externalService__{{this.externalServiceConfig.externalServiceId}}{{#unless
4
4
  this.fixedHeight }} -noFixedHeight{{/unless}} js-load"
5
- data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
5
+ data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","lazyLoad":{{_lazyLoad}},"dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.isWhitelisted}},"iFrameConfig": { {{~#if this.fixedHeight~}}
6
6
  "fixedHeight":"{{this.fixedHeight}}"{{~else~}}{{~#if this.aspectRatio}}"aspectRatio":"{{this.aspectRatio}}"{{~else~}}"aspectRatio":"16x9"{{/if}}{{~/if}},"noResponsiveIframe":"{{{this.setResponsiveIframe}}}","webcomponent":"{{{this.setWebcomponent}}}"{{~#if this.setTimedReloadIframe}},"refreshContent":"{{{this.setTimedReloadIframe}}}","refreshIntervall":"{{this.setTimeForReload}}"{{~/if}} }}'>
7
7
  {{~> components/external-service/components/external_service_data_policy ~}}
8
8
  </div>
@@ -1,6 +1,6 @@
1
1
  <div class="grid-cols-12 col-span-12 px-5 sm:px-0{{~inline-switch this.teasersize '["50"]' '[" md:col-span-6",""]'}}">
2
2
 
3
- {{> components/external-service/external_service _isTeaser="true"}}
3
+ {{> components/external-service/external_service _isTeaser="true" _lazyLoad=false}}
4
4
 
5
5
  {{> components/teaser/components/teaser_featured_content _size=this.realTeaserSize}}
6
6