hr-design-system-handlebars 1.114.116 → 1.114.118
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/CHANGELOG.md +25 -0
- package/dist/assets/index.css +3 -3
- package/dist/assets/js/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js +4 -1
- package/dist/assets/js/components/external-service/externalServiceDs.feature.js +14 -6
- package/dist/views/components/content/copytext/components/externalservice.hbs +1 -1
- package/dist/views/components/content/copytext/copytext_body.hbs +66 -58
- package/dist/views/components/external-service/components/external_service_data_policy.hbs +4 -4
- package/dist/views/components/external-service/external_service.hbs +3 -3
- package/dist/views/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
- package/dist/views/components/forms/webform.hbs +4 -4
- package/dist/views/components/newsletter/components/newsletter_form.hbs +2 -4
- package/dist/views/components/voting/voting.hbs +4 -4
- package/dist/views_static/components/content/copytext/components/externalservice.hbs +1 -1
- package/dist/views_static/components/content/copytext/copytext_body.hbs +66 -58
- package/dist/views_static/components/external-service/components/external_service_data_policy.hbs +4 -4
- package/dist/views_static/components/external-service/external_service.hbs +3 -3
- package/dist/views_static/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
- package/dist/views_static/components/forms/webform.hbs +4 -4
- package/dist/views_static/components/newsletter/components/newsletter_form.hbs +2 -4
- package/dist/views_static/components/voting/voting.hbs +4 -4
- package/package.json +1 -1
- package/src/stories/views/components/content/copytext/components/externalservice.hbs +1 -1
- package/src/stories/views/components/content/copytext/copytext_body.hbs +66 -58
- package/src/stories/views/components/external-service/components/external_service_data_policy.hbs +4 -4
- package/src/stories/views/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js +4 -1
- package/src/stories/views/components/external-service/externalServiceDs.feature.js +14 -6
- package/src/stories/views/components/external-service/external_service.hbs +3 -3
- package/src/stories/views/components/external-service/external_service_with_datapolicy_check.hbs +1 -1
- package/src/stories/views/components/forms/webform.hbs +4 -4
- package/src/stories/views/components/newsletter/components/newsletter_form.hbs +2 -4
- package/src/stories/views/components/voting/voting.hbs +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,28 @@
|
|
|
1
|
+
# v1.114.118 (Thu Mar 06 2025)
|
|
2
|
+
|
|
3
|
+
#### 🐛 Bug Fix
|
|
4
|
+
|
|
5
|
+
- DPE-3524: Lazy Loading für Ext. Dienste [#1259](https://github.com/mumprod/hr-design-system-handlebars/pull/1259) (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
|
+
|
|
14
|
+
# v1.114.117 (Thu Mar 06 2025)
|
|
15
|
+
|
|
16
|
+
#### 🐛 Bug Fix
|
|
17
|
+
|
|
18
|
+
- Converting no-js hint blocks back to noscript [#1258](https://github.com/mumprod/hr-design-system-handlebars/pull/1258) ([@Paul-Atreidis](https://github.com/Paul-Atreidis))
|
|
19
|
+
|
|
20
|
+
#### Authors: 1
|
|
21
|
+
|
|
22
|
+
- [@Paul-Atreidis](https://github.com/Paul-Atreidis)
|
|
23
|
+
|
|
24
|
+
---
|
|
25
|
+
|
|
1
26
|
# v1.114.116 (Tue Mar 04 2025)
|
|
2
27
|
|
|
3
28
|
#### 🐛 Bug Fix
|
package/dist/assets/index.css
CHANGED
|
@@ -3860,7 +3860,7 @@ article #commentList {
|
|
|
3860
3860
|
border-bottom-color: var(--color-secondary-ds);
|
|
3861
3861
|
}
|
|
3862
3862
|
.counter-reset {
|
|
3863
|
-
counter-reset:
|
|
3863
|
+
counter-reset: cnt1741267255954;
|
|
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:
|
|
4308
|
+
counter-increment: cnt1741267255954 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(
|
|
4326
|
+
content: counter(cnt1741267255954);
|
|
4327
4327
|
}
|
|
4328
4328
|
/*! ****************************/
|
|
4329
4329
|
/*! DataPolicy stuff */
|
package/dist/assets/js/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode) {
|
|
1
|
+
const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, isFirst) {
|
|
2
2
|
|
|
3
3
|
const { element: rootElement } = context
|
|
4
4
|
let aspectRatio = configAR
|
|
@@ -67,6 +67,9 @@ 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) {
|
|
71
|
+
iframe.loading = "lazy";
|
|
72
|
+
}
|
|
70
73
|
|
|
71
74
|
div.appendChild(iframe)
|
|
72
75
|
parentDiv.appendChild(div)
|
|
@@ -22,7 +22,8 @@ const ExternalService = function (context) {
|
|
|
22
22
|
embedType = options.embedType,
|
|
23
23
|
dataPolicyCheck = options.dataPolicyCheck || false,
|
|
24
24
|
id = options.id,
|
|
25
|
-
iFrameConfig = options.iFrameConfig
|
|
25
|
+
iFrameConfig = options.iFrameConfig,
|
|
26
|
+
isFirst = options.isFirst
|
|
26
27
|
let acceptButton,
|
|
27
28
|
acceptAlwaysCheckbox = hr$('.js-dataPolicy-acceptPermanentely', rootElement)[0]
|
|
28
29
|
let embedCode = options.embedCode,
|
|
@@ -192,6 +193,9 @@ const ExternalService = function (context) {
|
|
|
192
193
|
iframe.src = cleanUrl;
|
|
193
194
|
iframe.style.width = "100%";
|
|
194
195
|
iframe.style.border = "0";
|
|
196
|
+
if (!isFirst) {
|
|
197
|
+
iframe.loading = "lazy";
|
|
198
|
+
}
|
|
195
199
|
rootElement.appendChild(iframe);
|
|
196
200
|
|
|
197
201
|
window.addEventListener("message", function (e) {
|
|
@@ -237,7 +241,7 @@ const ExternalService = function (context) {
|
|
|
237
241
|
if (iFrameConfig.noResponsiveIframe == 'true') {
|
|
238
242
|
|
|
239
243
|
//Klassisches Iframe mit AR-Wrapper oder fester Höhe
|
|
240
|
-
noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode)
|
|
244
|
+
noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, isFirst)
|
|
241
245
|
noResponsiveIframe.createNoResponsiveIframe()
|
|
242
246
|
|
|
243
247
|
if (iFrameConfig.refreshContent == 'true') {
|
|
@@ -287,6 +291,9 @@ const ExternalService = function (context) {
|
|
|
287
291
|
iframe.setAttribute('frameborder', '0')
|
|
288
292
|
iframe.src = embedCode
|
|
289
293
|
iframe.id = 'datawrapper-chart-' + uniqueId
|
|
294
|
+
if (!isFirst) {
|
|
295
|
+
iframe.loading = "lazy";
|
|
296
|
+
}
|
|
290
297
|
rootElement.insertBefore(iframe, null)
|
|
291
298
|
|
|
292
299
|
loadScript(
|
|
@@ -395,15 +402,16 @@ const ExternalService = function (context) {
|
|
|
395
402
|
|
|
396
403
|
const loadIframe = function () {
|
|
397
404
|
console.log('load iframe ' + id)
|
|
398
|
-
|
|
405
|
+
const loadingAttribute = isFirst ? "" : "loading='lazy'";
|
|
406
|
+
iframe = "<iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>"
|
|
399
407
|
if (iFrameConfig.aspectRatio) {
|
|
400
|
-
iframe = "<div class='!h-full'><div class='" + getAspectRatioClass() + "'><iframe id='i_frame' data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div></div>"
|
|
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>"
|
|
401
409
|
//TODO Weiche Animation der Inhalte
|
|
402
410
|
} else {
|
|
403
411
|
if (iFrameConfig.fixedHeight) {
|
|
404
|
-
iframe = "<div style='height:" + iFrameConfig.fixedHeight + "px'><iframe data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
412
|
+
iframe = "<div style='height:" + iFrameConfig.fixedHeight + "px'><iframe data-isloaded='0' "+ loadingAttribute +" src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
405
413
|
} else {
|
|
406
|
-
iframe = "<div class='!h-full'><iframe data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
414
|
+
iframe = "<div class='!h-full'><iframe data-isloaded='0' "+ loadingAttribute +" src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
407
415
|
}
|
|
408
416
|
}
|
|
409
417
|
replaceAnimated(rootElement, iframe, false)
|
|
@@ -2,64 +2,72 @@
|
|
|
2
2
|
{{> components/content/copytext/components/headline }}
|
|
3
3
|
{{/if}}
|
|
4
4
|
{{#unless this.isInfoBox}}
|
|
5
|
-
{{~#
|
|
6
|
-
{{~#
|
|
7
|
-
{{
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
{{~#
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
{{
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
{{
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
{{
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
{{
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
{{
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
{{
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
{{
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
{{
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
{{
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
{{
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
{{
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
{{
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
{{
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
{{
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
{{
|
|
59
|
-
{{
|
|
60
|
-
{{/
|
|
61
|
-
|
|
62
|
-
|
|
5
|
+
{{~#if @first~}}
|
|
6
|
+
{{~#with this.paragraphBoxItem }}
|
|
7
|
+
{{~#if this.isExternalService}}
|
|
8
|
+
{{> components/content/copytext/components/externalservice _isFirst=true }}
|
|
9
|
+
{{/if~}}
|
|
10
|
+
{{~/with}}
|
|
11
|
+
{{else}}
|
|
12
|
+
{{~#with this.paragraphBoxItem }}
|
|
13
|
+
{{~#if this.isImage}}
|
|
14
|
+
{{~> components/content/copytext/components/image/image _isWebview=../_isWebview _isTickerCopytext=../_isTickerCopytext}}
|
|
15
|
+
{{/if~}}
|
|
16
|
+
{{~#if this.isContentBox}}
|
|
17
|
+
{{~> components/content/copytext/components/contentbox/contentbox _isWebview=../_isWebview ~}}
|
|
18
|
+
{{/if~}}
|
|
19
|
+
{{~#if this.isAccordion}}
|
|
20
|
+
{{~> components/content/copytext/components/accordion/accordion ~}}
|
|
21
|
+
{{/if~}}
|
|
22
|
+
{{~#if this.isGallery}}
|
|
23
|
+
{{> components/content/copytext/components/gallery/gallery _isTickerCopytext=../_isTickerCopytext }}
|
|
24
|
+
{{/if~}}
|
|
25
|
+
{{~#if this.isFileDownload}}
|
|
26
|
+
{{> components/content/copytext/components/filedownload }}
|
|
27
|
+
{{/if~}}
|
|
28
|
+
{{~#if this.isMap}}
|
|
29
|
+
{{> components/content/copytext/components/map }}
|
|
30
|
+
{{/if~}}
|
|
31
|
+
{{~#if this.isWebForm}}
|
|
32
|
+
{{> components/forms/webform }}
|
|
33
|
+
{{/if~}}
|
|
34
|
+
{{~#if this.isNewsletter}}
|
|
35
|
+
{{> components/newsletter/newsletter }}
|
|
36
|
+
{{/if~}}
|
|
37
|
+
{{~#if this.isAudioOnDemand}}
|
|
38
|
+
{{> components/content/copytext/components/audio _isTickerCopytext=../_isTickerCopytext }}
|
|
39
|
+
{{/if~}}
|
|
40
|
+
{{~#if this.isAudioEventLivestream}}
|
|
41
|
+
{{> components/content/copytext/components/audioeventlivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
42
|
+
{{/if~}}
|
|
43
|
+
{{~#if this.isPodcastEpisode}}
|
|
44
|
+
{{> components/content/copytext/components/podcastepisode }}
|
|
45
|
+
{{/if~}}
|
|
46
|
+
{{~#if this.isVideoOnDemand}}
|
|
47
|
+
{{> components/content/copytext/components/video/video _isTickerCopytext=../_isTickerCopytext }}
|
|
48
|
+
{{/if~}}
|
|
49
|
+
{{~#if this.isLivestream}}
|
|
50
|
+
{{> components/content/copytext/components/videolivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
51
|
+
{{/if~}}
|
|
52
|
+
{{~#if this.isTweet}}
|
|
53
|
+
{{> components/content/copytext/components/tweet }}
|
|
54
|
+
{{~/if}}
|
|
55
|
+
{{~#if this.isRadioPlaylist}}
|
|
56
|
+
{{> components/content/copytext/components/radioplaylist }}
|
|
57
|
+
{{~/if}}
|
|
58
|
+
{{~#if this.isVoting}}
|
|
59
|
+
{{> components/content/copytext/components/voting }}
|
|
60
|
+
{{/if~}}
|
|
61
|
+
{{~#if this.isExternalService}}
|
|
62
|
+
{{> components/content/copytext/components/externalservice _isFirst=false }}
|
|
63
|
+
{{/if~}}
|
|
64
|
+
{{~#if this.isContentNav}}
|
|
65
|
+
{{#with this.toModel.contentNavigationTeaser}}
|
|
66
|
+
{{~> components/teaser/content_nav/teaser_content_nav _isCopytext=true ~}}
|
|
67
|
+
{{/with}}
|
|
68
|
+
{{/if~}}
|
|
69
|
+
{{~/with}}
|
|
70
|
+
{{/if}}
|
|
63
71
|
{{/unless}}
|
|
64
72
|
|
|
65
73
|
{{~#with this.paragraphTeaserItem }}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<h3 class="text-2xl font-headingSerif">
|
|
3
3
|
{{loca "ext_service_datapolicy_headline" this.externalServiceConfig.externalServiceName}}
|
|
4
4
|
</h3>
|
|
5
|
-
|
|
5
|
+
|
|
6
6
|
<p class="pt-4 text-base font-copy">
|
|
7
7
|
{{loca "ext_service_datapolicy_text" this.externalServiceConfig.externalServiceName}}
|
|
8
8
|
</p>
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
{{#*inline "htmlProperties"}}{{/inline}}
|
|
25
25
|
</div>
|
|
26
26
|
</div>
|
|
27
|
-
|
|
28
|
-
<
|
|
27
|
+
|
|
28
|
+
<noscript>
|
|
29
29
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
30
30
|
<p class="font-bold">Hinweis</p>
|
|
31
31
|
<p class="pt-4 text-base font-copy">
|
|
@@ -40,5 +40,5 @@
|
|
|
40
40
|
{{#*inline "htmlProperties"~}}
|
|
41
41
|
{{~/inline}}
|
|
42
42
|
</div>
|
|
43
|
-
</
|
|
43
|
+
</noscript>
|
|
44
44
|
</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}}
|
|
3
|
+
{{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
|
|
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 frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
|
|
14
|
+
<iframe {{#unless _isFirst}} loading='lazy' {{/unless}} 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}}","dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
|
|
20
|
+
data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"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}}","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}}","isFirst":{{_isFirst}},"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>
|
|
@@ -30,19 +30,19 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/forms/components/fields _formId=(joinStrings 'form' (getRandom)) }}
|
|
32
32
|
{{#if this.hasSpamProtection }}
|
|
33
|
-
<
|
|
33
|
+
<noscript>
|
|
34
34
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
35
35
|
<p class="font-bold">Hinweis</p>
|
|
36
36
|
<p>Bitte aktivieren Sie JavaScript, um dieses Formular absenden zu können.</p>
|
|
37
37
|
</div>
|
|
38
|
-
</
|
|
38
|
+
</noscript>
|
|
39
39
|
{{else}}
|
|
40
|
-
<
|
|
40
|
+
<noscript>
|
|
41
41
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
42
42
|
<p class="font-bold">Hinweis</p>
|
|
43
43
|
<p>Javascript ist deaktiviert. Das Formular kann aber weiterhin normal benutzt werden.</p>
|
|
44
44
|
</div>
|
|
45
|
-
</
|
|
45
|
+
</noscript>
|
|
46
46
|
{{/if}}
|
|
47
47
|
|
|
48
48
|
{{> components/forms/components/controls }}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
<h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
|
|
2
2
|
{{this.title}}
|
|
3
3
|
</h3>
|
|
4
|
-
<div id="newsletter_form">
|
|
5
4
|
<div id="formWrapper">
|
|
6
5
|
<form class="relative flex flex-col justify-center overflow-hidden group"
|
|
7
6
|
id="form{{nextRandom}}"
|
|
@@ -53,11 +52,10 @@
|
|
|
53
52
|
</div>
|
|
54
53
|
</form>
|
|
55
54
|
</div>
|
|
56
|
-
|
|
57
|
-
<div id="newsletter_form_hint">
|
|
55
|
+
<noscript>
|
|
58
56
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
59
57
|
<p class="font-bold">Hinweis</p>
|
|
60
58
|
<p>Bitte aktivieren Sie JavaScript, um den Newsletter zu abonnieren.</p>
|
|
61
59
|
<p>Alternativ können Sie die verfügbaren Newsletter-Abonnements des HR <a href="https://hessenschau-nl.sr.de/newsletter-login.php" class="" target="_blank"><strong>hier</strong></a> abschließen / verwalten / beenden. </p>
|
|
62
60
|
</div>
|
|
63
|
-
</
|
|
61
|
+
</noscript>
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/voting/components/voting_header _isTeaser=../../_isTeaser _title=../this.title _topline=../this.topline}}
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
<div class="js-voting-form__bottomWrapper">
|
|
35
35
|
{{#if this.shorttext}}
|
|
36
36
|
<p class="mt-3 text-base font-copy sm:text-lg dark:text-text-dark">{{this.shorttext}}</p>
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
{{> components/voting/components/voting_submit _label="Abstimmen" _addClass="js-voting-submit-button"}}
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
64
|
-
|
|
64
|
+
|
|
65
65
|
<script type="text/html" class="js-successMessage">
|
|
66
66
|
{{#if this.is2FSecured}}
|
|
67
67
|
{{> components/voting/voting_result
|
|
@@ -112,12 +112,12 @@
|
|
|
112
112
|
{{> components/voting/voting_result _hideVotingResult=this.hideVotingResult}}
|
|
113
113
|
{{/unless}}
|
|
114
114
|
{{/with}}
|
|
115
|
-
<
|
|
115
|
+
<noscript>
|
|
116
116
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
117
117
|
<p class="font-bold">Hinweis</p>
|
|
118
118
|
<p>Bitte aktivieren Sie JavaScript, um bei einem Voting abstimmen zu können.</p>
|
|
119
119
|
</div>
|
|
120
|
-
</
|
|
120
|
+
</noscript>
|
|
121
121
|
{{/components/forms/components/backgroundBox }}
|
|
122
122
|
|
|
123
123
|
{{!--Featured Content--}}
|
|
@@ -2,64 +2,72 @@
|
|
|
2
2
|
{{> components/content/copytext/components/headline }}
|
|
3
3
|
{{/if}}
|
|
4
4
|
{{#unless this.isInfoBox}}
|
|
5
|
-
{{~#
|
|
6
|
-
{{~#
|
|
7
|
-
{{
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
{{~#
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
{{
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
{{
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
{{
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
{{
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
{{
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
{{
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
{{
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
{{
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
{{
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
{{
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
{{
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
{{
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
{{
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
{{
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
{{
|
|
59
|
-
{{
|
|
60
|
-
{{/
|
|
61
|
-
|
|
62
|
-
|
|
5
|
+
{{~#if @first~}}
|
|
6
|
+
{{~#with this.paragraphBoxItem }}
|
|
7
|
+
{{~#if this.isExternalService}}
|
|
8
|
+
{{> components/content/copytext/components/externalservice _isFirst=true }}
|
|
9
|
+
{{/if~}}
|
|
10
|
+
{{~/with}}
|
|
11
|
+
{{else}}
|
|
12
|
+
{{~#with this.paragraphBoxItem }}
|
|
13
|
+
{{~#if this.isImage}}
|
|
14
|
+
{{~> components/content/copytext/components/image/image _isWebview=../_isWebview _isTickerCopytext=../_isTickerCopytext}}
|
|
15
|
+
{{/if~}}
|
|
16
|
+
{{~#if this.isContentBox}}
|
|
17
|
+
{{~> components/content/copytext/components/contentbox/contentbox _isWebview=../_isWebview ~}}
|
|
18
|
+
{{/if~}}
|
|
19
|
+
{{~#if this.isAccordion}}
|
|
20
|
+
{{~> components/content/copytext/components/accordion/accordion ~}}
|
|
21
|
+
{{/if~}}
|
|
22
|
+
{{~#if this.isGallery}}
|
|
23
|
+
{{> components/content/copytext/components/gallery/gallery _isTickerCopytext=../_isTickerCopytext }}
|
|
24
|
+
{{/if~}}
|
|
25
|
+
{{~#if this.isFileDownload}}
|
|
26
|
+
{{> components/content/copytext/components/filedownload }}
|
|
27
|
+
{{/if~}}
|
|
28
|
+
{{~#if this.isMap}}
|
|
29
|
+
{{> components/content/copytext/components/map }}
|
|
30
|
+
{{/if~}}
|
|
31
|
+
{{~#if this.isWebForm}}
|
|
32
|
+
{{> components/forms/webform }}
|
|
33
|
+
{{/if~}}
|
|
34
|
+
{{~#if this.isNewsletter}}
|
|
35
|
+
{{> components/newsletter/newsletter }}
|
|
36
|
+
{{/if~}}
|
|
37
|
+
{{~#if this.isAudioOnDemand}}
|
|
38
|
+
{{> components/content/copytext/components/audio _isTickerCopytext=../_isTickerCopytext }}
|
|
39
|
+
{{/if~}}
|
|
40
|
+
{{~#if this.isAudioEventLivestream}}
|
|
41
|
+
{{> components/content/copytext/components/audioeventlivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
42
|
+
{{/if~}}
|
|
43
|
+
{{~#if this.isPodcastEpisode}}
|
|
44
|
+
{{> components/content/copytext/components/podcastepisode }}
|
|
45
|
+
{{/if~}}
|
|
46
|
+
{{~#if this.isVideoOnDemand}}
|
|
47
|
+
{{> components/content/copytext/components/video/video _isTickerCopytext=../_isTickerCopytext }}
|
|
48
|
+
{{/if~}}
|
|
49
|
+
{{~#if this.isLivestream}}
|
|
50
|
+
{{> components/content/copytext/components/videolivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
51
|
+
{{/if~}}
|
|
52
|
+
{{~#if this.isTweet}}
|
|
53
|
+
{{> components/content/copytext/components/tweet }}
|
|
54
|
+
{{~/if}}
|
|
55
|
+
{{~#if this.isRadioPlaylist}}
|
|
56
|
+
{{> components/content/copytext/components/radioplaylist }}
|
|
57
|
+
{{~/if}}
|
|
58
|
+
{{~#if this.isVoting}}
|
|
59
|
+
{{> components/content/copytext/components/voting }}
|
|
60
|
+
{{/if~}}
|
|
61
|
+
{{~#if this.isExternalService}}
|
|
62
|
+
{{> components/content/copytext/components/externalservice _isFirst=false }}
|
|
63
|
+
{{/if~}}
|
|
64
|
+
{{~#if this.isContentNav}}
|
|
65
|
+
{{#with this.toModel.contentNavigationTeaser}}
|
|
66
|
+
{{~> components/teaser/content_nav/teaser_content_nav _isCopytext=true ~}}
|
|
67
|
+
{{/with}}
|
|
68
|
+
{{/if~}}
|
|
69
|
+
{{~/with}}
|
|
70
|
+
{{/if}}
|
|
63
71
|
{{/unless}}
|
|
64
72
|
|
|
65
73
|
{{~#with this.paragraphTeaserItem }}
|
package/dist/views_static/components/external-service/components/external_service_data_policy.hbs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<h3 class="text-2xl font-headingSerif">
|
|
3
3
|
{{loca "ext_service_datapolicy_headline" this.externalServiceConfig.externalServiceName}}
|
|
4
4
|
</h3>
|
|
5
|
-
|
|
5
|
+
|
|
6
6
|
<p class="pt-4 text-base font-copy">
|
|
7
7
|
{{loca "ext_service_datapolicy_text" this.externalServiceConfig.externalServiceName}}
|
|
8
8
|
</p>
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
{{#*inline "htmlProperties"}}{{/inline}}
|
|
25
25
|
</div>
|
|
26
26
|
</div>
|
|
27
|
-
|
|
28
|
-
<
|
|
27
|
+
|
|
28
|
+
<noscript>
|
|
29
29
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
30
30
|
<p class="font-bold">Hinweis</p>
|
|
31
31
|
<p class="pt-4 text-base font-copy">
|
|
@@ -40,5 +40,5 @@
|
|
|
40
40
|
{{#*inline "htmlProperties"~}}
|
|
41
41
|
{{~/inline}}
|
|
42
42
|
</div>
|
|
43
|
-
</
|
|
43
|
+
</noscript>
|
|
44
44
|
</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}}
|
|
3
|
+
{{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
|
|
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 frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
|
|
14
|
+
<iframe {{#unless _isFirst}} loading='lazy' {{/unless}} 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}}","dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
|
|
20
|
+
data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
|
|
21
21
|
</div>
|
|
22
22
|
{{/if}}
|
|
23
23
|
{{~> components/external-service/components/external_service_caption ~}}
|
package/dist/views_static/components/external-service/external_service_with_datapolicy_check.hbs
CHANGED
|
@@ -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}}","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}}","isFirst":{{_isFirst}},"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>
|
|
@@ -30,19 +30,19 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/forms/components/fields _formId=(joinStrings 'form' (getRandom)) }}
|
|
32
32
|
{{#if this.hasSpamProtection }}
|
|
33
|
-
<
|
|
33
|
+
<noscript>
|
|
34
34
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
35
35
|
<p class="font-bold">Hinweis</p>
|
|
36
36
|
<p>Bitte aktivieren Sie JavaScript, um dieses Formular absenden zu können.</p>
|
|
37
37
|
</div>
|
|
38
|
-
</
|
|
38
|
+
</noscript>
|
|
39
39
|
{{else}}
|
|
40
|
-
<
|
|
40
|
+
<noscript>
|
|
41
41
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
42
42
|
<p class="font-bold">Hinweis</p>
|
|
43
43
|
<p>Javascript ist deaktiviert. Das Formular kann aber weiterhin normal benutzt werden.</p>
|
|
44
44
|
</div>
|
|
45
|
-
</
|
|
45
|
+
</noscript>
|
|
46
46
|
{{/if}}
|
|
47
47
|
|
|
48
48
|
{{> components/forms/components/controls }}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
<h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
|
|
2
2
|
{{this.title}}
|
|
3
3
|
</h3>
|
|
4
|
-
<div id="newsletter_form">
|
|
5
4
|
<div id="formWrapper">
|
|
6
5
|
<form class="relative flex flex-col justify-center overflow-hidden group"
|
|
7
6
|
id="form{{nextRandom}}"
|
|
@@ -53,11 +52,10 @@
|
|
|
53
52
|
</div>
|
|
54
53
|
</form>
|
|
55
54
|
</div>
|
|
56
|
-
|
|
57
|
-
<div id="newsletter_form_hint">
|
|
55
|
+
<noscript>
|
|
58
56
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
59
57
|
<p class="font-bold">Hinweis</p>
|
|
60
58
|
<p>Bitte aktivieren Sie JavaScript, um den Newsletter zu abonnieren.</p>
|
|
61
59
|
<p>Alternativ können Sie die verfügbaren Newsletter-Abonnements des HR <a href="https://hessenschau-nl.sr.de/newsletter-login.php" class="" target="_blank"><strong>hier</strong></a> abschließen / verwalten / beenden. </p>
|
|
62
60
|
</div>
|
|
63
|
-
</
|
|
61
|
+
</noscript>
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/voting/components/voting_header _isTeaser=../../_isTeaser _title=../this.title _topline=../this.topline}}
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
<div class="js-voting-form__bottomWrapper">
|
|
35
35
|
{{#if this.shorttext}}
|
|
36
36
|
<p class="mt-3 text-base font-copy sm:text-lg dark:text-text-dark">{{this.shorttext}}</p>
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
{{> components/voting/components/voting_submit _label="Abstimmen" _addClass="js-voting-submit-button"}}
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
64
|
-
|
|
64
|
+
|
|
65
65
|
<script type="text/html" class="js-successMessage">
|
|
66
66
|
{{#if this.is2FSecured}}
|
|
67
67
|
{{> components/voting/voting_result
|
|
@@ -112,12 +112,12 @@
|
|
|
112
112
|
{{> components/voting/voting_result _hideVotingResult=this.hideVotingResult}}
|
|
113
113
|
{{/unless}}
|
|
114
114
|
{{/with}}
|
|
115
|
-
<
|
|
115
|
+
<noscript>
|
|
116
116
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
117
117
|
<p class="font-bold">Hinweis</p>
|
|
118
118
|
<p>Bitte aktivieren Sie JavaScript, um bei einem Voting abstimmen zu können.</p>
|
|
119
119
|
</div>
|
|
120
|
-
</
|
|
120
|
+
</noscript>
|
|
121
121
|
{{/components/forms/components/backgroundBox }}
|
|
122
122
|
|
|
123
123
|
{{!--Featured Content--}}
|
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.
|
|
9
|
+
"version": "1.114.118",
|
|
10
10
|
"scripts": {
|
|
11
11
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
12
12
|
"storybook": "storybook dev -p 6006 public",
|
|
@@ -2,64 +2,72 @@
|
|
|
2
2
|
{{> components/content/copytext/components/headline }}
|
|
3
3
|
{{/if}}
|
|
4
4
|
{{#unless this.isInfoBox}}
|
|
5
|
-
{{~#
|
|
6
|
-
{{~#
|
|
7
|
-
{{
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
{{~#
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
{{
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
{{
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
{{
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
{{
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
{{
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
{{
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
{{
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
{{
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
{{
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
{{
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
{{
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
{{
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
{{
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
{{
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
{{
|
|
59
|
-
{{
|
|
60
|
-
{{/
|
|
61
|
-
|
|
62
|
-
|
|
5
|
+
{{~#if @first~}}
|
|
6
|
+
{{~#with this.paragraphBoxItem }}
|
|
7
|
+
{{~#if this.isExternalService}}
|
|
8
|
+
{{> components/content/copytext/components/externalservice _isFirst=true }}
|
|
9
|
+
{{/if~}}
|
|
10
|
+
{{~/with}}
|
|
11
|
+
{{else}}
|
|
12
|
+
{{~#with this.paragraphBoxItem }}
|
|
13
|
+
{{~#if this.isImage}}
|
|
14
|
+
{{~> components/content/copytext/components/image/image _isWebview=../_isWebview _isTickerCopytext=../_isTickerCopytext}}
|
|
15
|
+
{{/if~}}
|
|
16
|
+
{{~#if this.isContentBox}}
|
|
17
|
+
{{~> components/content/copytext/components/contentbox/contentbox _isWebview=../_isWebview ~}}
|
|
18
|
+
{{/if~}}
|
|
19
|
+
{{~#if this.isAccordion}}
|
|
20
|
+
{{~> components/content/copytext/components/accordion/accordion ~}}
|
|
21
|
+
{{/if~}}
|
|
22
|
+
{{~#if this.isGallery}}
|
|
23
|
+
{{> components/content/copytext/components/gallery/gallery _isTickerCopytext=../_isTickerCopytext }}
|
|
24
|
+
{{/if~}}
|
|
25
|
+
{{~#if this.isFileDownload}}
|
|
26
|
+
{{> components/content/copytext/components/filedownload }}
|
|
27
|
+
{{/if~}}
|
|
28
|
+
{{~#if this.isMap}}
|
|
29
|
+
{{> components/content/copytext/components/map }}
|
|
30
|
+
{{/if~}}
|
|
31
|
+
{{~#if this.isWebForm}}
|
|
32
|
+
{{> components/forms/webform }}
|
|
33
|
+
{{/if~}}
|
|
34
|
+
{{~#if this.isNewsletter}}
|
|
35
|
+
{{> components/newsletter/newsletter }}
|
|
36
|
+
{{/if~}}
|
|
37
|
+
{{~#if this.isAudioOnDemand}}
|
|
38
|
+
{{> components/content/copytext/components/audio _isTickerCopytext=../_isTickerCopytext }}
|
|
39
|
+
{{/if~}}
|
|
40
|
+
{{~#if this.isAudioEventLivestream}}
|
|
41
|
+
{{> components/content/copytext/components/audioeventlivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
42
|
+
{{/if~}}
|
|
43
|
+
{{~#if this.isPodcastEpisode}}
|
|
44
|
+
{{> components/content/copytext/components/podcastepisode }}
|
|
45
|
+
{{/if~}}
|
|
46
|
+
{{~#if this.isVideoOnDemand}}
|
|
47
|
+
{{> components/content/copytext/components/video/video _isTickerCopytext=../_isTickerCopytext }}
|
|
48
|
+
{{/if~}}
|
|
49
|
+
{{~#if this.isLivestream}}
|
|
50
|
+
{{> components/content/copytext/components/videolivestream _isTickerCopytext=../_isTickerCopytext }}
|
|
51
|
+
{{/if~}}
|
|
52
|
+
{{~#if this.isTweet}}
|
|
53
|
+
{{> components/content/copytext/components/tweet }}
|
|
54
|
+
{{~/if}}
|
|
55
|
+
{{~#if this.isRadioPlaylist}}
|
|
56
|
+
{{> components/content/copytext/components/radioplaylist }}
|
|
57
|
+
{{~/if}}
|
|
58
|
+
{{~#if this.isVoting}}
|
|
59
|
+
{{> components/content/copytext/components/voting }}
|
|
60
|
+
{{/if~}}
|
|
61
|
+
{{~#if this.isExternalService}}
|
|
62
|
+
{{> components/content/copytext/components/externalservice _isFirst=false }}
|
|
63
|
+
{{/if~}}
|
|
64
|
+
{{~#if this.isContentNav}}
|
|
65
|
+
{{#with this.toModel.contentNavigationTeaser}}
|
|
66
|
+
{{~> components/teaser/content_nav/teaser_content_nav _isCopytext=true ~}}
|
|
67
|
+
{{/with}}
|
|
68
|
+
{{/if~}}
|
|
69
|
+
{{~/with}}
|
|
70
|
+
{{/if}}
|
|
63
71
|
{{/unless}}
|
|
64
72
|
|
|
65
73
|
{{~#with this.paragraphTeaserItem }}
|
package/src/stories/views/components/external-service/components/external_service_data_policy.hbs
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
<h3 class="text-2xl font-headingSerif">
|
|
3
3
|
{{loca "ext_service_datapolicy_headline" this.externalServiceConfig.externalServiceName}}
|
|
4
4
|
</h3>
|
|
5
|
-
|
|
5
|
+
|
|
6
6
|
<p class="pt-4 text-base font-copy">
|
|
7
7
|
{{loca "ext_service_datapolicy_text" this.externalServiceConfig.externalServiceName}}
|
|
8
8
|
</p>
|
|
@@ -24,8 +24,8 @@
|
|
|
24
24
|
{{#*inline "htmlProperties"}}{{/inline}}
|
|
25
25
|
</div>
|
|
26
26
|
</div>
|
|
27
|
-
|
|
28
|
-
<
|
|
27
|
+
|
|
28
|
+
<noscript>
|
|
29
29
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
30
30
|
<p class="font-bold">Hinweis</p>
|
|
31
31
|
<p class="pt-4 text-base font-copy">
|
|
@@ -40,5 +40,5 @@
|
|
|
40
40
|
{{#*inline "htmlProperties"~}}
|
|
41
41
|
{{~/inline}}
|
|
42
42
|
</div>
|
|
43
|
-
</
|
|
43
|
+
</noscript>
|
|
44
44
|
</div>
|
package/src/stories/views/components/external-service/dataWrapperNoResponsiveIframe.subfeature.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode) {
|
|
1
|
+
const DataWrapperNoResponsiveIframe = function (context, configAR, configFixedHeight, id, embedCode, isFirst) {
|
|
2
2
|
|
|
3
3
|
const { element: rootElement } = context
|
|
4
4
|
let aspectRatio = configAR
|
|
@@ -67,6 +67,9 @@ 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) {
|
|
71
|
+
iframe.loading = "lazy";
|
|
72
|
+
}
|
|
70
73
|
|
|
71
74
|
div.appendChild(iframe)
|
|
72
75
|
parentDiv.appendChild(div)
|
|
@@ -22,7 +22,8 @@ const ExternalService = function (context) {
|
|
|
22
22
|
embedType = options.embedType,
|
|
23
23
|
dataPolicyCheck = options.dataPolicyCheck || false,
|
|
24
24
|
id = options.id,
|
|
25
|
-
iFrameConfig = options.iFrameConfig
|
|
25
|
+
iFrameConfig = options.iFrameConfig,
|
|
26
|
+
isFirst = options.isFirst
|
|
26
27
|
let acceptButton,
|
|
27
28
|
acceptAlwaysCheckbox = hr$('.js-dataPolicy-acceptPermanentely', rootElement)[0]
|
|
28
29
|
let embedCode = options.embedCode,
|
|
@@ -192,6 +193,9 @@ const ExternalService = function (context) {
|
|
|
192
193
|
iframe.src = cleanUrl;
|
|
193
194
|
iframe.style.width = "100%";
|
|
194
195
|
iframe.style.border = "0";
|
|
196
|
+
if (!isFirst) {
|
|
197
|
+
iframe.loading = "lazy";
|
|
198
|
+
}
|
|
195
199
|
rootElement.appendChild(iframe);
|
|
196
200
|
|
|
197
201
|
window.addEventListener("message", function (e) {
|
|
@@ -237,7 +241,7 @@ const ExternalService = function (context) {
|
|
|
237
241
|
if (iFrameConfig.noResponsiveIframe == 'true') {
|
|
238
242
|
|
|
239
243
|
//Klassisches Iframe mit AR-Wrapper oder fester Höhe
|
|
240
|
-
noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode)
|
|
244
|
+
noResponsiveIframe = new DataWrapperNoResponsiveIframe(context, iFrameConfig.aspectRatio, iFrameConfig.fixedHeight, uniqueId, embedCode, isFirst)
|
|
241
245
|
noResponsiveIframe.createNoResponsiveIframe()
|
|
242
246
|
|
|
243
247
|
if (iFrameConfig.refreshContent == 'true') {
|
|
@@ -287,6 +291,9 @@ const ExternalService = function (context) {
|
|
|
287
291
|
iframe.setAttribute('frameborder', '0')
|
|
288
292
|
iframe.src = embedCode
|
|
289
293
|
iframe.id = 'datawrapper-chart-' + uniqueId
|
|
294
|
+
if (!isFirst) {
|
|
295
|
+
iframe.loading = "lazy";
|
|
296
|
+
}
|
|
290
297
|
rootElement.insertBefore(iframe, null)
|
|
291
298
|
|
|
292
299
|
loadScript(
|
|
@@ -395,15 +402,16 @@ const ExternalService = function (context) {
|
|
|
395
402
|
|
|
396
403
|
const loadIframe = function () {
|
|
397
404
|
console.log('load iframe ' + id)
|
|
398
|
-
|
|
405
|
+
const loadingAttribute = isFirst ? "" : "loading='lazy'";
|
|
406
|
+
iframe = "<iframe id='i_frame' "+ loadingAttribute +" data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>"
|
|
399
407
|
if (iFrameConfig.aspectRatio) {
|
|
400
|
-
iframe = "<div class='!h-full'><div class='" + getAspectRatioClass() + "'><iframe id='i_frame' data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div></div>"
|
|
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>"
|
|
401
409
|
//TODO Weiche Animation der Inhalte
|
|
402
410
|
} else {
|
|
403
411
|
if (iFrameConfig.fixedHeight) {
|
|
404
|
-
iframe = "<div style='height:" + iFrameConfig.fixedHeight + "px'><iframe data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
412
|
+
iframe = "<div style='height:" + iFrameConfig.fixedHeight + "px'><iframe data-isloaded='0' "+ loadingAttribute +" src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
405
413
|
} else {
|
|
406
|
-
iframe = "<div class='!h-full'><iframe data-isloaded='0' src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
414
|
+
iframe = "<div class='!h-full'><iframe data-isloaded='0' "+ loadingAttribute +" src='" + embedCode + "' frameborder='0' class='w-full h-full' webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>"
|
|
407
415
|
}
|
|
408
416
|
}
|
|
409
417
|
replaceAnimated(rootElement, iframe, false)
|
|
@@ -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}}
|
|
3
|
+
{{> components/external-service/external_service_with_datapolicy_check _isTeaser=_isTeaser _isFirst=_isFirst}}
|
|
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 frameborder="0" width="100%" height="100%" src="{{{this.serviceUrl}}}" webkitallowfullscreen mozallowfullscreen allowfullscreen scrolling='no'></iframe>
|
|
14
|
+
<iframe {{#unless _isFirst}} loading='lazy' {{/unless}} 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}}","dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
|
|
20
|
+
data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","isFirst":{{_isFirst}},"dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
|
|
21
21
|
</div>
|
|
22
22
|
{{/if}}
|
|
23
23
|
{{~> components/external-service/components/external_service_caption ~}}
|
package/src/stories/views/components/external-service/external_service_with_datapolicy_check.hbs
CHANGED
|
@@ -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}}","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}}","isFirst":{{_isFirst}},"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>
|
|
@@ -30,19 +30,19 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/forms/components/fields _formId=(joinStrings 'form' (getRandom)) }}
|
|
32
32
|
{{#if this.hasSpamProtection }}
|
|
33
|
-
<
|
|
33
|
+
<noscript>
|
|
34
34
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
35
35
|
<p class="font-bold">Hinweis</p>
|
|
36
36
|
<p>Bitte aktivieren Sie JavaScript, um dieses Formular absenden zu können.</p>
|
|
37
37
|
</div>
|
|
38
|
-
</
|
|
38
|
+
</noscript>
|
|
39
39
|
{{else}}
|
|
40
|
-
<
|
|
40
|
+
<noscript>
|
|
41
41
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
42
42
|
<p class="font-bold">Hinweis</p>
|
|
43
43
|
<p>Javascript ist deaktiviert. Das Formular kann aber weiterhin normal benutzt werden.</p>
|
|
44
44
|
</div>
|
|
45
|
-
</
|
|
45
|
+
</noscript>
|
|
46
46
|
{{/if}}
|
|
47
47
|
|
|
48
48
|
{{> components/forms/components/controls }}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
<h3 class="mb-6 text-2xl md:text-3xl font-headingSerif sm:mb-12 text-text dark:text-text-dark">
|
|
2
2
|
{{this.title}}
|
|
3
3
|
</h3>
|
|
4
|
-
<div id="newsletter_form">
|
|
5
4
|
<div id="formWrapper">
|
|
6
5
|
<form class="relative flex flex-col justify-center overflow-hidden group"
|
|
7
6
|
id="form{{nextRandom}}"
|
|
@@ -53,11 +52,10 @@
|
|
|
53
52
|
</div>
|
|
54
53
|
</form>
|
|
55
54
|
</div>
|
|
56
|
-
|
|
57
|
-
<div id="newsletter_form_hint">
|
|
55
|
+
<noscript>
|
|
58
56
|
<div class="p-4 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
59
57
|
<p class="font-bold">Hinweis</p>
|
|
60
58
|
<p>Bitte aktivieren Sie JavaScript, um den Newsletter zu abonnieren.</p>
|
|
61
59
|
<p>Alternativ können Sie die verfügbaren Newsletter-Abonnements des HR <a href="https://hessenschau-nl.sr.de/newsletter-login.php" class="" target="_blank"><strong>hier</strong></a> abschließen / verwalten / beenden. </p>
|
|
62
60
|
</div>
|
|
63
|
-
</
|
|
61
|
+
</noscript>
|
|
@@ -30,7 +30,7 @@
|
|
|
30
30
|
>
|
|
31
31
|
{{> components/voting/components/voting_header _isTeaser=../../_isTeaser _title=../this.title _topline=../this.topline}}
|
|
32
32
|
|
|
33
|
-
|
|
33
|
+
|
|
34
34
|
<div class="js-voting-form__bottomWrapper">
|
|
35
35
|
{{#if this.shorttext}}
|
|
36
36
|
<p class="mt-3 text-base font-copy sm:text-lg dark:text-text-dark">{{this.shorttext}}</p>
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
{{> components/voting/components/voting_submit _label="Abstimmen" _addClass="js-voting-submit-button"}}
|
|
62
62
|
</div>
|
|
63
63
|
</div>
|
|
64
|
-
|
|
64
|
+
|
|
65
65
|
<script type="text/html" class="js-successMessage">
|
|
66
66
|
{{#if this.is2FSecured}}
|
|
67
67
|
{{> components/voting/voting_result
|
|
@@ -112,12 +112,12 @@
|
|
|
112
112
|
{{> components/voting/voting_result _hideVotingResult=this.hideVotingResult}}
|
|
113
113
|
{{/unless}}
|
|
114
114
|
{{/with}}
|
|
115
|
-
<
|
|
115
|
+
<noscript>
|
|
116
116
|
<div class="p-4 mt-6 mb-3 text-orange-700 bg-orange-100 border-l-4 border-orange-500" role="alert">
|
|
117
117
|
<p class="font-bold">Hinweis</p>
|
|
118
118
|
<p>Bitte aktivieren Sie JavaScript, um bei einem Voting abstimmen zu können.</p>
|
|
119
119
|
</div>
|
|
120
|
-
</
|
|
120
|
+
</noscript>
|
|
121
121
|
{{/components/forms/components/backgroundBox }}
|
|
122
122
|
|
|
123
123
|
{{!--Featured Content--}}
|