hr-design-system-handlebars 1.102.5 → 1.103.0

package/src/stories/views/components/button/link_button.mdx

@@ -72,15 +72,13 @@ Ein Link-Button wird mit der Handlebar Komponente `link_button` eingebunden. Wie
 Komponente lediglich das Grundgerüst eines Buttons dar. Die Beschriftung und/oder ein Icon müssen mit Subkomponenten hinzugefügt
 werden.
 
-<div class="bg-blue-200 !mt-4 p-4">
-  <h4 class="!text-stone-950 font-bold">Hinweis</h4>
+<div className="bg-blue-200 !mt-4 p-4">
+  <h4 className="!text-stone-950 font-bold">Hinweis</h4>
 
-  <p>
     Sowohl die Link-Button-Komponente als auch die Subkomponenten Button-Label und Button-Icon
     sind standardmäßig bereits gestyled. Das setzen von zusätzlichen Style Klassen über den
-    Parameter <pre class="inline">\_css</pre> ist zwar bei jeder Komponente möglich, sollte aber
+    Parameter <code>\_css</code> ist zwar bei jeder Komponente möglich, sollte aber
     nur dann gemacht werden, wenn es gar nicht anders geht.
-  </p>
 </div>
 
 ### Button mit Text

package/src/stories/views/components/button/link_button.stories.js

@@ -1,43 +1,52 @@
+import snapshotsJson from './fixtures/link_button.json'
+import { getSnapshotsTemplate } from '/src/assets/js/utils.js'
 const handlebars = require('hrHandlebars')
 
-const buttonWithLabelTemplate = (args) => {
-    let hbsTemplate = handlebars.compile(`
+const hbsTemplates = []
+hbsTemplates['buttonWithLabel'] = handlebars.compile(`
     {{#> components/button/link_button}}
         {{> components/button/components/button_label}}
     {{/components/button/link_button}}
   `)
-    return hbsTemplate({ ...args })
-}
-
-const buttonWithLabelTemplateOnBackground = (args) => {
-    let hbsTemplate = handlebars.compile(`
+hbsTemplates['buttonWithLabelOnBackground'] = handlebars.compile(`
     <div class="bg-primary p-4">
         {{#> components/button/link_button}}
             {{> components/button/components/button_label}}
         {{/components/button/link_button}}
     </div>
   `)
-    return hbsTemplate({ ...args })
-}
-
-const buttonWithLabelAndIconRightTemplate = (args) => {
-    let hbsTemplate = handlebars.compile(`
+hbsTemplates['buttonWithLabelAndIconRight'] = handlebars.compile(`
     {{#> components/button/link_button}}
         {{> components/button/components/button_label}}
         {{> components/button/components/button_icon }}
     {{/components/button/link_button}}
   `)
-    return hbsTemplate({ ...args })
-}
-
-const buttonWithLabelAndIconLeftTemplate = (args) => {
-    let hbsTemplate = handlebars.compile(`
+hbsTemplates['buttonWithLabelAndIconLeft'] = handlebars.compile(`
     {{#> components/button/link_button~}}
         {{> components/button/components/button_icon }}
         {{> components/button/components/button_label}}
     {{~/components/button/link_button}}
   `)
-    return hbsTemplate({ ...args })
+
+const buttonWithLabelTemplate = (args) => {
+
+    return hbsTemplates['buttonWithLabel']({ ...args })
+}
+
+const buttonWithLabelTemplateOnBackground = (args) => {
+    return hbsTemplates['buttonWithLabelOnBackground']({ ...args })
+}
+
+const buttonWithLabelAndIconRightTemplate = (args) => {
+    return hbsTemplates['buttonWithLabelAndIconRight']({ ...args })
+}
+
+const buttonWithLabelAndIconLeftTemplate = (args) => {
+    return hbsTemplates['buttonWithLabelAndIconLeft']({ ...args })
+}
+
+const snapshotTemplate = (args) => {
+    return getSnapshotsTemplate({ hbsTemplates, args })
 }
 
 export default {
@@ -175,6 +184,7 @@ export default {
         controls: {
             sort: 'alpha',
         },
+        chromatic: { disableSnapshot: true }
     },
 }
 
@@ -182,10 +192,7 @@ export const Spielplatz = {
     render: buttonWithLabelTemplate.bind({}),
     name: 'Spielplatz',
 
-    args: {
-        _size: 'md',
-        _label: 'Button',
-    },
+    args: snapshotsJson['button-md'].args,
 }
 
 export const ButtonLg = {
@@ -202,10 +209,7 @@ export const ButtonLg = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Large',
-    },
+    args: snapshotsJson['button-lg'].args,
 }
 
 export const ButtonMd = {
@@ -222,10 +226,7 @@ export const ButtonMd = {
         },
     },
 
-    args: {
-        _size: 'md',
-        _label: 'Medium',
-    },
+    args: snapshotsJson['button-md'].args,
 }
 
 export const ButtonSm = {
@@ -242,10 +243,7 @@ export const ButtonSm = {
         },
     },
 
-    args: {
-        _size: 'sm',
-        _label: 'Small',
-    },
+    args: snapshotsJson['button-sm'].args,
 }
 
 export const ButtonPrimary = {
@@ -262,10 +260,7 @@ export const ButtonPrimary = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Primary',
-    },
+    args: snapshotsJson['button-primary'].args,
 }
 
 export const ButtonSecondary = {
@@ -282,11 +277,7 @@ export const ButtonSecondary = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Secondary',
-        _variant: 'secondary',
-    },
+    args: snapshotsJson['button-secondary'].args,
 }
 
 export const ButtonSecondaryWhite = {
@@ -303,12 +294,7 @@ export const ButtonSecondaryWhite = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Secondary',
-        _variant: 'secondary',
-        _onWhite: true,
-    },
+    args: snapshotsJson['button-secondary-on-white'].args,
 }
 
 export const ButtonTertiary = {
@@ -325,11 +311,7 @@ export const ButtonTertiary = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Tertiary',
-        _variant: 'tertiary',
-    },
+    args: snapshotsJson['button-tertiary'].args,
 }
 
 export const ButtonPrimaryDisabled = {
@@ -346,11 +328,7 @@ export const ButtonPrimaryDisabled = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Primary',
-        _disabled: true,
-    },
+    args: snapshotsJson['button-primary-disabled'].args,
 }
 
 export const ButtonSecondaryDisabled = {
@@ -367,12 +345,7 @@ export const ButtonSecondaryDisabled = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Secondary',
-        _variant: 'secondary',
-        _disabled: true,
-    },
+    args: snapshotsJson['button-secondary-disabled'].args,
 }
 
 export const ButtonTertiaryDisabled = {
@@ -389,12 +362,7 @@ export const ButtonTertiaryDisabled = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Tertiary',
-        _variant: 'tertiary',
-        _disabled: true,
-    },
+    args: snapshotsJson['button-tertiary-disabled'].args,
 }
 
 export const ButtonIconRechts = {
@@ -411,11 +379,7 @@ export const ButtonIconRechts = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Icon rechts',
-        _icon: 'arrow-right',
-    },
+    args: snapshotsJson['button-icon-right'].args,
 }
 
 export const ButtonIconLinks = {
@@ -432,11 +396,7 @@ export const ButtonIconLinks = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Icon links',
-        _icon: 'arrow-left',
-    },
+    args: snapshotsJson['button-icon-left'].args,
 }
 
 export const ButtonPrimaryAufFarbigemHintergrund = {
@@ -457,11 +417,7 @@ export const ButtonPrimaryAufFarbigemHintergrund = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Primary',
-        _onBackground: true,
-    },
+    args: snapshotsJson['button-primary-background'].args,
 }
 
 export const ButtonSecondaryAufFarbigemHintergrund = {
@@ -482,12 +438,7 @@ export const ButtonSecondaryAufFarbigemHintergrund = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Secondary',
-        _variant: 'secondary',
-        _onBackground: true,
-    },
+    args: snapshotsJson['button-secondary-background'].args,
 }
 
 export const ButtonTertiaryAufFarbigemHintergrund = {
@@ -508,10 +459,29 @@ export const ButtonTertiaryAufFarbigemHintergrund = {
         },
     },
 
-    args: {
-        _size: 'lg',
-        _label: 'Tertiary',
-        _variant: 'tertiary',
-        _onBackground: true,
+    args: snapshotsJson['button-tertiary-background'].args,
+}
+
+export const Snapshot = {
+    render: snapshotTemplate.bind({}),
+    name: 'Snapshot',
+
+    argTypes: {
+        _size: {
+            control: false,
+        },
+
+        _variant: {
+            control: false,
+        },
+
+        _onBackground: {
+            control: false,
+        },
     },
+
+    args: snapshotsJson,
+    parameters: {
+        chromatic: { disableSnapshot: false },
+    }
 }

package/src/stories/views/components/dataPolicySettings/dataPolicySettingsDs.feature.js

@@ -18,29 +18,29 @@ const DataPolicySettings = function (context) {
         providerTitle = hr$('.js-providerTitle', container)[0]
 
     let isWebview = window.parent.document.documentElement.classList.contains('webview'),
-        appSettingsCookie = {},
-        dataSettingsCookie = {}
+        appSettingsCookie = {}
 
-    //Überprüfung ob die alten Cookies zusammengeführt werden müssen
+    //Überprüfung ein Settings-Cookie da ist
     const checkForExistingCookies = function () {
     
         if (getJSONCookie('hrSettings')) {
             getAllToggleValuesFromSettings()
         }
         else {
-            console.log("hessenschau neu => wenn kein hrSettings erzeugt wurde")
-            //Wenn kein Cookie vorhanden wird diese initial über die Checkbox "Dienst ist initial immer aktiviert (Whitelist)" 
+            console.log("Kein Cookie vorhanden");
+            //Wenn kein Cookie vorhanden wird diese initial über die Checkbox "Dienst ist initial immer aktiviert (Whitelist)"
             //im Konfig-Dokument bestückt.
-            for (let i = 0; i < toggleSwitches.length; ++i) {
-                    if (toggleSwitches[i].getAttribute('data-whitelist') == "true") {
-                        setCookieForSettings(toggleSwitches[i].id, true)
-                    }
-                    else {
-                        setCookieForSettings(toggleSwitches[i].id, false)
-                    }
+            for (var i = 0; i < toggleSwitches.length; ++i) {
+              if (toggleSwitches[i].getAttribute('data-whitelist') == "true") {
+                toggleSwitches[i].checked = true;
+              }
+              else{
+                toggleSwitches[i].checked = false;
+              }
+              setAllToggleEventListeners(toggleSwitches[i]);
+              initializeAllToggleEventListeners(i);
             }
-            setAllToggleValuesFromSettings()
-            changeProviderTitle()
+        changeProviderTitle();
         }
     }
 
@@ -56,49 +56,45 @@ const DataPolicySettings = function (context) {
     const getAllToggleValuesFromSettings = function () {
         setAllToggleValuesFromSettings()
         changeProviderTitle()
-        //initial alles deaktivieren
-        //hr-settings schreiben
-
     }
 
     const setAllToggleValuesFromSettings = function () {
-        dataSettingsCookie = getJSONCookie('hrSettings') || {}
-        let settingId
-        let settingState
-        for (let i = 0; i < toggleSwitches.length; ++i) {
-            settingId = toggleSwitches[i].id
-            settingState = dataSettingsCookie.settingId
-            document.getElementById(toggleSwitches[i].id).checked = settingState
-
-            setAllToggleEventListeners(toggleSwitches[i])
-            initializeAllToggleEventListeners(i)
-
-            if (isCookieSetForSettings(toggleSwitches[i].id)) {
-                toggleSwitches[i].checked = true
-            } 
-        }
-        checkWhiteListAttribute()
-        toggleAllSwitch.checked = allTogglesExternalServiceChecked()
-    }
-    const checkWhiteListAttribute = function() {
-        for (let i = 0; i < toggleSwitches.length; ++i) {
-            if (toggleSwitches[i].getAttribute('data-whitelist') == 'true') {
-                toggleSwitches[i].checked = true
-                setCookieForSettings(toggleSwitches[i].id, toggleSwitches[i].checked)
-            } else {
-                toggleSwitches[i].checked = false;
-                setCookieForSettings(toggleSwitches[i].id, toggleSwitches[i].checked);
+        var id;
+        console.log("Setze alle Settings-Regler")
+        for (var i = 0; i < toggleSwitches.length; ++i) {
+          id = toggleSwitches[i].id;
+          if(settingsCookie.isSettingsCookieExistent(id)){
+            console.log("Dienst "+ id + " ist im Cookie enthalten und hat den Wert " + settingsCookie.isSettingsCookieAccepted(id))
+            if(settingsCookie.isSettingsCookieAccepted(id)) {
+              console.log("Aktiviere den Toggle")
+              toggleSwitches[i].checked = true;
+            }
+            else{
+              console.log("Deaktiviere den Toggle")
+              toggleSwitches[i].checked = false;
             }
+          }
+          else{
+            console.log("Dienst "+ id + " ist im Cookie nicht enthalten, prüfe daher den Default")
+            var whiteList = document.getElementById(id).getAttribute("data-whitelist")
+            if(whiteList == 'true'){
+              console.log("Ist per Default eingeschaltet")
+              console.log("Aktiviere den Toggle")
+              toggleSwitches[i].checked = true;
+            }
+            else{
+              console.log("Ist per Default ausgeschaltet")
+              console.log("Deaktiviere den Toggle")
+              toggleSwitches[i].checked = false;
+            }
+    
+          }
+          setAllToggleEventListeners(toggleSwitches[i]);
+          initializeAllToggleEventListeners(i);
         }
+        toggleAllSwitch.checked = allTogglesExternalServiceChecked()
     }
-    const isCookieSetForSettings = function (externalService) {
-        return settingsCookie.isSettingsCookieAccepted(externalService)
-    }
-
-    const isCookieExistForSettings = function (externalService) {
-        return settingsCookie.isSettingsCookieExistent(externalService)
-    }
-
+    
     const initializeAllToggleEventListeners = function (serviceId) {
         listen(
             'hr:externalService-activate-' + toggleSwitches[serviceId].id,

package/src/stories/views/components/externalService/externalServiceDs.feature.js

@@ -27,7 +27,7 @@ const ExternalService = function (context) {
         acceptAlwaysCheckbox = hr$('.js-dataPolicy-acceptPermanentely', rootElement)[0]
     let embedCode = options.embedCode,
         iframe,
-        settingsCookie,
+        settingsCookie = new SettingsCookie(),
         noResponsiveIframe,
         contentRefresher,
         gemeindewahlergebnis,
@@ -354,13 +354,31 @@ const ExternalService = function (context) {
 
     const initDataPolicy = function () {
         if (dataPolicyCheck) {
-            settingsCookie = new SettingsCookie()
             acceptButton = hr$('.js-dataPolicy-accept', rootElement)[0]
             listen('click', handleDatapolicy, acceptButton)
-            if (settingsCookie.isSettingsCookieAccepted(id)) {
-                    loadServiceWithDataPolicyButton()
-            } else {
-                    dataPolicyBox.style.visibility = 'visible'
+            if(settingsCookie.isSettingsCookieExistent(id)){
+                console.log("Dienst "+ id + " ist im Cookie enthalten und hat den Wert " + settingsCookie.isSettingsCookieAccepted(id))
+                if(settingsCookie.isSettingsCookieAccepted(id)) {
+                  console.log("Lade den Dienst")
+                  loadServiceWithDataPolicyButton();
+                }
+                else {
+                  console.log("Zeige Datapolicy-Box")
+                  dataPolicyBox.style.visibility = 'visible';
+                }
+            }
+              else{
+                console.log("Dienst "+ id + " ist im Cookie nicht enthalten, prüfe daher den Default")
+                if(whiteList){
+                  console.log("Ist per Default eingeschaltet")
+                  console.log("Lade den Dienst")
+                  loadServiceWithDataPolicyButton();
+                }
+                else{
+                  console.log("Ist per Default ausgeschaltet")
+                  console.log("Zeige Datapolicy-Box")
+                  dataPolicyBox.style.visibility = 'visible';
+                }
             }
             listen('hr:externalService-activate-' + id, loadServiceWithDataPolicyButton)
             listen('hr:externalService-deactivate-' + id, removeExternalService)

package/src/stories/views/components/externalService/external_service.hbs

@@ -17,7 +17,7 @@
             {{else}}
                 <!-- Embedding via JS without DataPolicyCheck-->  
                 <div class="c-externalService__{{this.externalServiceConfig.externalServiceId}} js-load"
-                    data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": false,"iFrameConfig":{}}'>
+                    data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType": "{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": false,"whiteList": false,"iFrameConfig":{}}'>
                 </div>  
             {{/if}}    
             {{~> components/externalService/components/external_service_caption ~}}

package/src/stories/views/components/externalService/external_service_with_datapolicy_check.hbs

@@ -2,7 +2,7 @@
         {{~> components/base/a11y/hiddenText _locaTag="story_externalservice_intro_sr" ~}}        
         <div class="c-externalService c-externalService__{{this.externalServiceConfig.externalServiceId}}{{#unless
                 this.fixedHeight }} -noFixedHeight{{/unless}} js-load"
-             data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": true,"iFrameConfig": { {{#if this.fixedHeight}}
+             data-hr-external-service-ds='{"id":"{{this.externalServiceConfig.externalServiceId}}","embedCode":"{{this.serviceUrl}}","embedType":"{{this.externalServiceConfig.externalServiceEmbedType}}","dataPolicyCheck": true, "whiteList":{{this.externalServiceConfig.makeDatapolicyCheck}},"iFrameConfig": { {{#if this.fixedHeight}}
                 "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}} }}'>
             {{~> components/externalService/components/external_service_data_policy ~}}
         </div>

package/src/stories/views/components/grid/grid.stories.js

@@ -79,6 +79,9 @@ const Template11 = ({ text, ...args }) => {
 export default {
     title: 'Komponenten/Grid',
     argTypes: {},
+    parameters: {
+        chromatic: { disableSnapshot: true }
+    },
 }
 
 export const Grid100 = {

package/src/stories/views/components/label/fixtures/label.json

@@ -0,0 +1 @@
+{"config":{"template":"label"},"label-download":{"args":{"_type":"download","_text":"Download"}},"label-breakingnews":{"args":{"_type":"breakingnews","_text":"Eilmeldung"}},"label-event":{"args":{"_type":"event","_text":"Event"}},"label-infografik":{"args":{"_type":"infografik","_text":"Infografik"}},"label-comment":{"args":{"_type":"comment","_text":"Kommentar"}},"label-liveticker":{"args":{"_type":"liveticker","_text":"Liveticker"}},"label-media":{"args":{"_type":"media","_text":"Media"}},"label-pm":{"args":{"_type":"pm","_text":"Pressemitteilung"}},"label-program":{"args":{"_type":"program","_text":"Sendung"}},"label-kurzmeldung":{"args":{"_type":"kurzmeldung","_text":"Kurzmeldung"}}}

package/src/stories/views/components/label/label.stories.js

@@ -1,9 +1,21 @@
-import label from './label.hbs'
+import fixtures from './fixtures/label.json'
+import { getSnapshotsTemplate } from '/src/assets/js/utils.js'
 
-const Template = ({ _type, ...args }) => {
+const handlebars = require('hrHandlebars')
+
+const hbsTemplates = []
+hbsTemplates['label'] = handlebars.compile(`
+    {{> components/label/label}}
+  `)
+
+const Template = (args) => {
     // You can either use a function to create DOM elements or use a plain html string!
     // return `<div>${label}</div>`;
-    return label({ _type, ...args })
+    return hbsTemplates['label']({ ...args })
+}
+
+const snapshotTemplate = (args) => {
+    return getSnapshotsTemplate({ hbsTemplates, args })
 }
 
 export default {
@@ -73,6 +85,12 @@ export default {
                     summary: 'media',
                 },
             },
+            parameters: {
+                controls: {
+                    sort: 'alpha',
+                },
+                chromatic: { disableSnapshot: true }
+            },
         },
 
         _text: {
@@ -181,3 +199,13 @@ export const Kurzmeldung = {
         _text: 'Kurzmeldung',
     },
 }
+
+export const Snapshot = {
+    render: snapshotTemplate.bind({}),
+    name: 'Snapshot',
+
+    args: fixtures,
+    parameters: {
+        chromatic: { disableSnapshot: false },
+    }
+}

package/src/stories/views/components/mediaplayer/fixtures/mediaplayer_button.json

@@ -0,0 +1 @@
+{"config":{"template":"button"},"button-video":{"args":{"_icon":"play_button","_label":"Video","_isLivestream":false}},"button-audio":{"args":{"_icon":"audio_button","_label":"Audio","_isLivestream":false}},"button-podcast":{"args":{"_icon":"podcast-button","_label":"Podcast","_isLivestream":false}},"button-video-livestream":{"args":{"_icon":"play_button","_label":"Video - Livestream","_isLivestream":true}},"button-audio-livestream":{"args":{"_icon":"audio_button","_label":"Audio - Livestream","_isLivestream":true}}}

package/src/stories/views/components/mediaplayer/fixtures/mediaplayer_snapshots.json

@@ -0,0 +1 @@
+{"config":{"template":"mediaplayer"},"video":{"config":{"renderSnapshotItemWrapper":false},"args":{"_isTeaser":false,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","videoLanguageCode":"de","media":[{"url":"https://hr-vh.akamaihd.net/i/video/as/hessenschau/2022_03/hrLogo_220317201045_L422955_,480x270-50p-700kbit,512x288-25p-500kbit,640x360-50p-1200kbit,960x540-50p-1600kbit,1280x720-50p-3200kbit,1920x1080-50p-5000kbit,.mp4.csmil/master.m3u8","mimeType":"application/vnd.apple.mpegurl","isAdaptiveQualitySelectable":true,"audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt","url":"https://hr-a.akamaihd.net/video/as/hessenschau/2022_03/hrLogo_220317201045_L422955_512x288-25p-500kbit.vtt"}]}],"meta":{"durationSeconds":1644,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Auszubildende dringend gesucht | hessenschau vom 17.03.2022","synopsis":"Erstaufnahme der Geflüchteten in Gießen / Bund-Länder-Treffen zu Geflüchteten aus der Ukraine / Zu wenig Lebensmittelkontrollen / Mehr Ausbildungsplätze als Bewerber / Dokumentation über Sinti und Roma / Nachwuchs im Frankfurter Zoo / Eintracht vor dem Europa League-Spiel"},"pluginData":{},"geoBlocked":false},"playerId":"8423","type":"videoOndemand","typeLabel":"Video-On-Demand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":true,"isPlayerDebug":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":false,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","videoLanguageCode":"de","media":[{"url":"https://hr-vh.akamaihd.net/i/video/as/hessenschau/2022_03/hrLogo_220317201045_L422955_,480x270-50p-700kbit,512x288-25p-500kbit,640x360-50p-1200kbit,960x540-50p-1600kbit,1280x720-50p-3200kbit,1920x1080-50p-5000kbit,.mp4.csmil/master.m3u8","mimeType":"application/vnd.apple.mpegurl","isAdaptiveQualitySelectable":true,"audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt","url":"https://hr-a.akamaihd.net/video/as/hessenschau/2022_03/hrLogo_220317201045_L422955_512x288-25p-500kbit.vtt"}]}],"meta":{"durationSeconds":1644,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Auszubildende dringend gesucht | hessenschau vom 17.03.2022","synopsis":"Erstaufnahme der Geflüchteten in Gießen / Bund-Länder-Treffen zu Geflüchteten aus der Ukraine / Zu wenig Lebensmittelkontrollen / Mehr Ausbildungsplätze als Bewerber / Dokumentation über Sinti und Roma / Nachwuchs im Frankfurter Zoo / Eintracht vor dem Europa League-Spiel"},"pluginData":{},"geoBlocked":false},"playerId":"8423","type":"videoOndemand","typeLabel":"Video-On-Demand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":false,"isPlayerDebug":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}}},"video_livestream":{"config":{"renderSnapshotItemWrapper":false},"args":{"_isTeaser":false,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"isDvrEnabled":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","videoLanguageCode":"de","media":[{"url":"https://hrhlsde.akamaized.net/hls/live/2024526/hrhlsde/index.m3u8","mimeType":"application/vnd.apple.mpegurl","maxHResolutionPx":8000,"isAdaptiveQualitySelectable":true,"audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt"}]}],"live":{"dvrWindowSeconds":7200},"meta":{"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Jetzt hr-fernsehen live sehen!"},"pluginData":{},"geoBlocked":false},"playerId":"6819","type":"videoLivestream","typeLabel":"Video-Livestream","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","teaserSize":"100","realTeaserSize":"100","isAutoplay":true,"isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"isDvrEnabled":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedVideoView":true,"isForcedAutoplay":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","videoLanguageCode":"de","media":[{"url":"https://hrhlsde.akamaized.net/hls/live/2024526/hrhlsde/index.m3u8","mimeType":"application/vnd.apple.mpegurl","maxHResolutionPx":8000,"isAdaptiveQualitySelectable":true,"audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt"}]}],"live":{"dvrWindowSeconds":7200},"meta":{"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Jetzt hr-fernsehen live sehen!"},"pluginData":{},"geoBlocked":false},"playerId":"6819","type":"videoLivestream","typeLabel":"Video-Livestream","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","teaserSize":"100","realTeaserSize":"100","isAutoplay":false,"isDarkmodeAllowed":true}}},"audio":{"config":{"renderSnapshotItemWrapper":false},"args":{"_isTeaser":false,"_isAudioView":true,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","typeLabel":"Audio-Ondemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":true,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":false,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false},"trackingAgf@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hr-a.akamaihd.net/audio/sport/2022_03/220317235611_Hinteregger.mp3","mimeType":"audio/mp3","audios":[{"kind":"standard","languageCode":"de"}]}]}],"meta":{"durationSeconds":20,"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Das Eintracht-Tor in der Reportage: \"Hinteregger schädelt den rein\"","synopsis":"Eintracht Frankfurt steht im Viertelfinale der Europa League. Hier gibt es die emotionale Audio-Reportage des Hinteregger-Treffers."},"pluginData":{},"geoBlocked":false},"playerId":"2565","type":"audioOndemand","typeLabel":"Audio-Ondemand","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":false,"teaserSize":"100","realTeaserSize":"100","isDarkmodeAllowed":true}}},"audio_event_livestream":{"config":{"renderSnapshotItemWrapper":false},"args":{"_isTeaser":false,"_isAudioView":true,"ardPlayerConfig":{"playerConfig":{"generic":{"isAutoplay":true,"isDvrEnabled":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":true,"isForcedVideoView":true},"pluginData":{"trackingAti@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hlshr3.akamaized.net/hls/live/2016536/hr3/master.m3u8","mimeType":"application/vnd.apple.mpegurl","audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt"}]}],"live":{"dvrWindowSeconds":7200},"meta":{"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Test Audio Event","synopsis":"Das Sicherheitspersonal hat am frühen Dienstagmorgen seinen Warnstreik am Frankfurter Flughafen gestartet. Reisende ab Frankfurt können sich den Weg zum Airport direkt sparen. Ein spezielles Team kümmert sich um Gestrandete."},"pluginData":{},"geoBlocked":false},"playerId":"1694","type":"audioLivestream","typeLabel":"Audio-Event-Livestream","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":true,"teaserSize":"50","realTeaserSize":"50","isDarkmodeAllowed":true},"ardPlayerJsonConfig":{"playerConfig":{"generic":{"isAutoplay":false,"isDvrEnabled":true,"imageTemplateConfig":{"size":[{"minWidth":0,"value":"480/270"},{"minWidth":480,"value":"640/360"},{"minWidth":640,"value":"960/540"},{"minWidth":960,"value":"1920/1080"}]}},"web":{"baseUrl":"./vendor/ardplayer/","isForcedAutoplay":false,"isForcedVideoView":false},"pluginData":{"trackingAti@all":{"isEnabled":false}}},"mediaCollection":{"streams":[{"kind":"main","isAudioOnly":true,"media":[{"url":"https://hlshr3.akamaized.net/hls/live/2016536/hr3/master.m3u8","mimeType":"application/vnd.apple.mpegurl","audios":[{"kind":"standard","languageCode":"de"}]}]}],"subTitles":[{"kind":"normal","languageCode":"de","sources":[{"kind":"webvtt"}]}],"live":{"dvrWindowSeconds":7200},"meta":{"images":[{"kind":"preview","url":"https://picsum.photos/id/101/{size}"}],"title":"Test Audio Event","synopsis":"Das Sicherheitspersonal hat am frühen Dienstagmorgen seinen Warnstreik am Frankfurter Flughafen gestartet. Reisende ab Frankfurt können sich den Weg zum Airport direkt sparen. Ein spezielles Team kümmert sich um Gestrandete."},"pluginData":{},"geoBlocked":false},"playerId":"1694","type":"audioLivestream","typeLabel":"Audio-Event-Livestream","cssUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.3be63dd6.css","jsUrl":"./vendor/ardplayer/ardplayer-hr-6.9.2.930e5d37.js","isAutoplay":false,"teaserSize":"50","realTeaserSize":"50","isDarkmodeAllowed":true}}}}