From a33657d4cab80f731970b3e39a1e713f47ac31f9 Mon Sep 17 00:00:00 2001
From: Troels Ugilt Jensen <6103205+tuj@users.noreply.github.com>
Date: Tue, 19 Aug 2025 13:29:12 +0200
Subject: [PATCH 01/11] 5185: Fixed issues with calendar single booking layout
---
CHANGELOG.md | 3 ++
build/calendar-config-develop.json | 6 +--
build/calendar-config-main.json | 6 +--
build/calendar.js | 2 +-
docker-compose.yml | 1 +
src/calendar/calendar-single-booking.js | 55 +++++++++++++++++--------
6 files changed, 49 insertions(+), 24 deletions(-)
diff --git a/CHANGELOG.md b/CHANGELOG.md
index d5bd659..06a64b9 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -4,6 +4,9 @@ All notable changes to this project will be documented in this file.
## Unreleased
+- [#188](https://github.com/os2display/display-templates/pull/188)
+ - Fixed issues with calendar single booking layout.
+
## [2.5.1] - 2025-06-23
- [#178](https://github.com/os2display/display-templates/pull/178)
diff --git a/build/calendar-config-develop.json b/build/calendar-config-develop.json
index 365c4f9..603695a 100644
--- a/build/calendar-config-develop.json
+++ b/build/calendar-config-develop.json
@@ -4,9 +4,9 @@
"id": "01FRJPF4XATRN8PBZ35XN84PS6",
"description": "Mulighed for at vise et kalenderfeed.",
"resources": {
- "component": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar.js?ts=1744372285281",
- "admin": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar-admin.json?ts=1744372285281",
- "schema": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar-schema.json?ts=1744372285281",
+ "component": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar.js?ts=1755602574017",
+ "admin": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar-admin.json?ts=1755602574017",
+ "schema": "https://raw.githubusercontent.com/os2display/display-templates/develop/build/calendar-schema.json?ts=1755602574017",
"assets": [],
"options": {},
"content": {}
diff --git a/build/calendar-config-main.json b/build/calendar-config-main.json
index 3dbed86..dbe820e 100644
--- a/build/calendar-config-main.json
+++ b/build/calendar-config-main.json
@@ -4,9 +4,9 @@
"id": "01FRJPF4XATRN8PBZ35XN84PS6",
"description": "Mulighed for at vise et kalenderfeed.",
"resources": {
- "component": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar.js?ts=1744372285281",
- "admin": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar-admin.json?ts=1744372285281",
- "schema": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar-schema.json?ts=1744372285281",
+ "component": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar.js?ts=1755602574017",
+ "admin": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar-admin.json?ts=1755602574017",
+ "schema": "https://raw.githubusercontent.com/os2display/display-templates/main/build/calendar-schema.json?ts=1755602574017",
"assets": [],
"options": {},
"content": {}
diff --git a/build/calendar.js b/build/calendar.js
index 598e4be..890c6ae 100644
--- a/build/calendar.js
+++ b/build/calendar.js
@@ -1,2 +1,2 @@
/*! For license information please see calendar.js.LICENSE.txt */
-(()=>{var e={5900:(e,t,r)=>{"use strict";r.d(t,{A:()=>a});var n=r(6314),i=r.n(n)()((function(e){return e[1]}));i.push([e.id,".template-calendar{background-position:center;background-repeat:no-repeat;background-size:cover}.template-calendar.media-contain{background-size:contain}",""]);const a=i},8070:(e,t,r)=>{"use strict";r.d(t,{A:()=>a});var n=r(6314),i=r.n(n)()((function(e){return e[1]}));i.push([e.id,'.slide{--color-white: #fff;--color-grey-100: hsl(0deg 0% 95%);--color-grey-200: hsl(0deg 0% 85%);--color-grey-300: hsl(0deg 0% 80%);--color-grey-400: hsl(0deg 0% 75%);--color-grey-500: hsl(0deg 0% 70%);--color-grey-600: hsl(0deg 0% 40%);--color-grey-700: hsl(0deg 0% 30%);--color-grey-800: hsl(0deg 0% 20%);--color-grey-900: hsl(0deg 0% 10%);--color-black: #000;--color-blue: hsl(219deg 89% 57%);--color-indigo: indigo;--color-purple: purple;--color-pink: pink;--color-red: red;--color-orange: orange;--color-yellow: yellow;--color-green: green;--color-teal: teal;--color-cyan: cyan;--color-gray: var(--color-grey-500);--color-gray-dark: var(--color-grey-900);--color-primary: var(--color-blue);--color-secondary: var(--color-orange);--color-success: var(--color-green);--color-info: var(--color-teal);--color-warning: var(--color-yellow);--color-danger: var(--color-red);--color-light: var(--color-white);--color-dark: var(--color-black);--bg-light: var(--color-light);--bg-dark: var(--color-dark);--bg-primary: var(--color-primary);--bg-secondary: var(--color-secondary);--bg-transparent: transparent;--text-light: var(--color-light);--text-dark: var(--color-dark);--color-red-oklch-ch: 0.25 29;--color-red-oklch-l: 50%;--color-red-oklch-c: 0.25;--color-red-oklch-h: 29;--color-red-50: oklch(95% calc(var(--color-red-oklch-c) - 0.20) var(--color-red-oklch-h));--color-red-100: oklch(90% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-200: oklch(85% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-300: oklch(80% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-400: oklch(70% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-500: oklch(60% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-600: oklch(var(--color-red-oklch-l) var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-700: oklch(40% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-800: oklch(30% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-900: oklch(20% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-red-950: oklch(15% var(--color-red-oklch-c) var(--color-red-oklch-h));--color-green-oklch-l: 50%;--color-green-oklch-c: 0.17;--color-green-oklch-h: 142;--color-green-50: oklch(95% calc(var(--color-green-oklch-c) - 0.15) var(--color-green-oklch-h));--color-green-100: oklch(90% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-200: oklch(85% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-300: oklch(80% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-400: oklch(70% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-500: oklch(60% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-600: oklch(var(--color-green-oklch-l) var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-700: oklch(40% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-800: oklch(30% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-900: oklch(20% var(--color-green-oklch-c) var(--color-green-oklch-h));--color-green-950: oklch(15% var(--color-green-oklch-c) var(--color-green-oklch-h));--font-family-base: system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-bold: 700;--line-height-base: 1.5;--line-height-sm: 1.25;--line-height-lg: 2;--font-size-base: 1rem;--font-size-multiplier-050: 0.5;--font-size-multiplier-075: 0.75;--font-size-multiplier-090: 0.9;--font-size-multiplier-125: 1.25;--font-size-multiplier-150: 1.5;--font-size-multiplier-175: 1.75;--font-size-multiplier-200: 2;--font-size-multiplier-250: 2.5;--font-size-xs: calc(var(--font-size-base) * var(--font-size-multiplier-050));--font-size-sm: calc(var(--font-size-base) * var(--font-size-multiplier-075));--font-size-m: calc(var(--font-size-base) * 1);--font-size-lg: calc(var(--font-size-base) * var(--font-size-multiplier-125));--font-size-xl: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125));--h6-font-size: calc(var(--font-size-base));--spacer: 12px;--margin-size-base: calc(var(--spacer) * 3);--padding-size-base: calc(var(--spacer) * 3);--box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);--box-shadow-sm: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--box-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, 0.175);--box-shadow-inset: inset 0 1px 2px rgba(0, 0, 0, 0.075);--border-size: 1px;--border-style: solid;--border-color: var(--color-grey-900);--border: var(--border-size) var(--border-style) var(--border-color);--border-radius-sm: 3px;--border-radius-md: 5px;--border-radius-lg: 7px;--background-color: var(--bg-light, hsl(0deg, 0%, 100%));--background-color-secondary: var(--color-grey-100, hsl(0deg, 0%, 95%));--text-color: var(--text-dark, hsl(0deg, 0%, 0%))}*,*::before,*::after{box-sizing:border-box}html{font-size:1.125rem;height:100%;background-color:var(--background-color);color:var(--text-color)}body{margin:0;height:100%}@keyframes h1-underline{0%{opacity:0;width:100%}40%{opacity:1;width:100%;margin-top:.938em;height:.375em}70%{opacity:1;width:100%;margin-top:.625em;height:.2em}100%{opacity:1;width:5em;margin-top:.625em}}.color-scheme-dark .slide{--background-color: var(--bg-dark, hsl(0deg, 0%, 10%));--background-color-secondary: var(--bg-dark-secondary, hsl(0deg, 0%, 20%));--text-color: var(--text-light, hsl(0deg, 0%, 100%));--border-color: var(--color-light);--color-grey-100: hsl(0deg 0% 10%);--color-grey-200: hsl(0deg 0% 15%);--color-grey-300: hsl(0deg 0% 20%);--color-grey-400: hsl(0deg 0% 25%);--color-grey-500: hsl(0deg 0% 30%);--color-grey-600: hsl(0deg 0% 45%);--color-grey-700: hsl(0deg 0% 60%);--color-grey-800: hsl(0deg 0% 75%);--color-grey-900: hsl(0deg 0% 90%)}@media screen and (min-width: 1921px)and (orientation: landscape){.slide{--font-size-base: 2rem;--spacer: 24px}}@media screen and (min-width: 1081px)and (orientation: portrait){.slide{--font-size-base: 2rem;--spacer: 24px}}.slide .font-size-xs{--font-size-base: var(--font-size-xs);--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125))}.slide .font-size-s{--font-size-base: var(--font-size-sm);--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125))}.slide .font-size-m{--font-size-base: var(--font-size-m);--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125))}.slide .font-size-lg{--font-size-base: var(--font-size-lg);--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125))}.slide .font-size-xl{--font-size-base: var(--font-size-xl);--h1-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-250));--h2-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-200));--h3-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-175));--h4-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-150));--h5-font-size: calc(var(--font-size-base) * var(--font-size-multiplier-125))}.slide h1{font-size:var(--h1-font-size)}.slide h2{font-size:var(--h2-font-size)}.slide h3{font-size:var(--h3-font-size)}.slide h4{font-size:var(--h4-font-size)}.slide h5{font-size:var(--h5-font-size)}.slide h6{font-size:var(--h6-font-size)}',""]);const a=i},6314:e=>{"use strict";e.exports=function(e){var t=[];return t.toString=function(){return this.map((function(t){var r=e(t);return t[2]?"@media ".concat(t[2]," {").concat(r,"}"):r})).join("")},t.i=function(e,r,n){"string"==typeof e&&(e=[[null,e,""]]);var i={};if(n)for(var a=0;a
+ n.charCodeAt(0)&&(n=n.trim()),n=[n],01?t-1:0),n=1;n=R.unix()})),Y=i.filter((function(e){return!$.includes(e)})),V=$.length>0,q=!V&&_?null:(null==w?void 0:w.length)>0,W=V?"var(--color-red-900)":"var(--color-green-900)",X=V?"var(--color-red-50)":"var(--color-green-50)";return t().createElement(bi,{className:"template-calendar calendar-single-booking ".concat(o.join(" "),"\n ").concat(b?"media-contain":""),style:u},t().createElement(yi,{style:{backgroundColor:W}},t().createElement(Ei,null,v&&t().createElement(Ti,{className:"subtitle"},v),t().createElement(Si,{className:"title"},p)),t().createElement(wi,null,t().createElement(ki,null,V?t().createElement(Zn,{style:{color:"var(--color-red-600)"}}):t().createElement(Wn,{style:{color:"var(--color-green-600)"}})),t().createElement(Ai,null,V?t().createElement(at,{id:"room_in_use",defaultMessage:"Optaget"}):t().createElement(at,{id:"room_available",defaultMessage:"Ledigt"}))),t().createElement(_i,{style:{backgroundColor:X}},t().createElement(Oi,null,R.locale(Pn()).format("dddd D. MMMM")),t().createElement(Ci,null,R.locale(Pn()).format("HH:mm")))),t().createElement(Pi,{className:"content"},V&&$.map((function(e){return t().createElement(Hi,{key:e.id,className:"content-item"},t().createElement(Ni,null,Hn(e.startTime)," - ",Hn(e.endTime)),t().createElement("h1",null,h(e.title)))})),!V&&t().createElement(t().Fragment,null,t().createElement(Hi,{className:"content-item"},!z&&!P&&!j&&t().createElement(t().Fragment,null,q&&t().createElement(t().Fragment,null,t().createElement("h1",null,t().createElement(at,{id:"instant_booking_available",defaultMessage:"Lokalet er ledigt"})),t().createElement("p",null,t().createElement(at,{id:"instant_booked_available_text",defaultMessage:"Straksbook lokalet. Vælg varighed."})),t().createElement(Ri,null,w.map((function(e){return t().createElement(Ii,{key:e.durationMinutes,onClick:function(){return function(e){S&&f&&y&&E&&(L(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_QUICK_BOOK",data:{interval:e}})}).then((function(e){return e.json()})).then((function(e){H(e),Li(f["@id"],e)})).catch((function(){U(!0),setTimeout((function(){return U(!1)}),1e4)})).finally((function(){L(!1)})))}(e)}},t().createElement(Mi,null),t().createElement("span",null,e.durationMinutes," min"))})))),!q&&t().createElement(t().Fragment,null,t().createElement("p",null,t().createElement(at,{id:"instant_booked_not_available",defaultMessage:"Straksbooking ikke tilgængeligt"})),t().createElement("div",{style:{fontSize:".5em"}},function(e){if(e<=0)return"";var t=Math.floor(e/86400),r=Math.floor((e-60*t*60*24)/3600),n=Math.floor((e-60*r*60)/60),i=e%60,a=" til næste begivenhed";return t>0?"".concat(t," dag").concat(t>1?"e":""," ").concat(a):r>0?"".concat(r," time").concat(r>1?"r":""," ").concat(a):n>0?"".concat(n," minut").concat(n>1?"ter":""," ").concat(a):i>0?"Mindre end et minut ".concat(a):""}(B)))),z&&!P&&!j&&t().createElement("p",null,t().createElement(at,{id:"instant_booking_processing",defaultMessage:"Booker lokale..."})),j&&t().createElement("p",null,t().createElement(at,{id:"instant_booking_error",defaultMessage:"Straksbooking fejlede. Prøv igen lidt senere."})),201===(null==P?void 0:P.status)&&t().createElement("p",null,t().createElement(at,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm")))),Y.length>0&&t().createElement(t().Fragment,null,t().createElement("h3",null,t().createElement(at,{id:"coming_events",defaultMessage:"Kommende begivenheder"})),function(e,r){var n=s()(),i=[];return e.length>0&&e.filter((function(e){return e.endTime>n.unix()&&e.endTime<=n.endOf("day").unix()})).forEach((function(e){i.length<3&&i.push(t().createElement(Hi,{key:e.id,className:"content-item"},t().createElement(Ni,null,Hn(e.startTime)," - ",Hn(e.endTime)),r(e.title)))})),i.concat()}(Y,h))))}Di.propTypes={slide:a().shape({"@id":a().string.isRequired,feed:a().shape({configuration:a().shape({resources:a().arrayOf(a().string)})})}).isRequired,run:a().string.isRequired,templateClasses:a().arrayOf(a().string),templateRootStyle:a().shape({}),calendarEvents:a().arrayOf(a().shape({id:a().string.isRequired,title:a().string,startTime:a().number.isRequired,endTime:a().number,resourceTitle:a().string,resourceId:a().string})).isRequired,content:a().shape({title:a().string,subTitle:a().string,resourceAvailableText:a().string,resourceUnavailableText:a().string,mediaContain:a().bool}).isRequired,getTitle:a().func.isRequired};const Fi=Di;var ji,Ui,Gi,$i,Yi,Vi,qi,Wi,Xi,Ki,Zi;function Ji(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Qi(r){var n,i=r.content,a=r.calendarEvents,o=r.templateClasses,l=void 0===o?[]:o,u=r.templateRootStyle,h=void 0===u?{}:u,f=r.getTitle,d=i.title,m=void 0===d?"":d,p=i.footerText,g=void 0===p?null:p,v=i.mediaContain;return(0,e.useEffect)((function(){s().extend(c())}),[]),t().createElement(ea,{className:"template-calendar calendar-multiple-days ".concat(l.join(" ")," ").concat(v?"media-contain":""),style:h},t().createElement(t().Fragment,null,t().createElement(ta,{className:"title"},m),t().createElement(ra,{className:"content"},(null==a?void 0:a.length)>0&&(n=function(e){var t=s()(),r={};return e.filter((function(e){return e.endTime>t.unix()})).forEach((function(e){var t=s()(1e3*e.startTime),n=t.locale(Pn()).format("dddd D. MMMM"),i=t.format("YYYY-MM-DD");Object.prototype.hasOwnProperty.call(r,i)||(r[i]={events:[],title:n}),r[i].events.push(e)})),r}(a),Object.keys(n).sort().map((function(r,i){return t().createElement(e.Fragment,{key:r},i<5&&t().createElement(na,{className:"content-col"},t().createElement(ia,{className:"col-title"},n[r].title),n[r].events.map((function(e){var r;return t().createElement(aa,{key:e.id,className:"col-item"},t().createElement(oa,{className:"col-item-time"},t().createElement("div",null,Hn(e.startTime)," -"),t().createElement("div",null,Hn(e.endTime))),t().createElement(sa,{className:"col-item-event"},t().createElement(la,null,f(e.title)),t().createElement(ca,null,null!==(r=e.resourceTitle)&&void 0!==r?r:e.resourceId)))}))))})))),g&&t().createElement(ua,{className:"footer"},g)))}var ea=Tn.div(ji||(ji=Ji(['\n font-family: var(--font-family-base);\n font-size: var(--font-size-base);\n height: 100%;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n /*\n --bg-color is local to this template file and is populated from configuration.\n --background-color serves as fallback to the global variable, that will serve a light og dark background color depending on the user preferences.\n */\n background-color: var(--bg-color, var(--background-color));\n background-image: var(--bg-image, none);\n color: var(--text-color);\n display: grid;\n grid-template-areas:\n "title"\n "content"\n "footer";\n grid-template-rows: 1fr 14fr 1fr;\n']))),ta=Tn.h1(Ui||(Ui=Ji(["\n grid-area: title;\n color: var(--color-primary);\n padding: 0 var(--padding-size-base);\n font-weight: var(--font-weight-light);\n font-size: var(--h2-font-size);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.5)\n calc(var(--padding-size-base) * 2) 0 calc(var(--padding-size-base) * 2);\n font-size: calc(var(--h1-font-size) * 2);\n }\n"]))),ra=Tn.div(Gi||(Gi=Ji(['\n grid-area: content;\n display: grid;\n grid-gap: 1px;\n grid-template-columns: repeat(5, 20%);\n overflow: hidden;\n position: relative;\n\n &:after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 20px;\n background: rgb(0, 0, 0);\n background: linear-gradient(\n 0deg,\n hsla(0, 0%, 18%, 1) 0%,\n hsla(0, 0%, 18%, 0) 100%\n );\n @media (orientation: portrait) {\n height: 30px;\n }\n }\n\n @media (orientation: portrait) {\n grid-template-rows: repeat(1fr, auto);\n grid-template-columns: revert;\n font-size: calc(var(--font-size-base) * 2);\n }\n']))),na=Tn.section($i||($i=Ji(["\n background-color: var(--color-grey-200);\n"]))),ia=Tn.p(Yi||(Yi=Ji(["\n background-color: var(--color-grey-100);\n padding: calc(var(--padding-size-base) * 0.5) var(--padding-size-base);\n margin: 0;\n font-weight: var(--font-weight-bold);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.1)\n calc(var(--padding-size-base) * 2);\n }\n"]))),aa=Tn.article(Vi||(Vi=Ji(["\n padding: calc(var(--padding-size-base) * 0.65) var(--padding-size-base);\n display: flex;\n background-color: var(--color-grey-300);\n\n &:nth-child(odd) {\n background-color: var(--color-grey-400);\n }\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 0.65)\n calc(var(--padding-size-base) * 2);\n }\n"]))),oa=Tn.div(qi||(qi=Ji(["\n line-height: 1.5;\n min-width: fit-content;\n\n @media (orientation: portrait) {\n div {\n display: inline-block;\n\n &:nth-last-of-type(1) {\n margin-left: 5px;\n }\n }\n }\n"]))),sa=Tn.div(Wi||(Wi=Ji(["\n padding: 0 calc(var(--padding-size-base) * 0.5) 0 var(--padding-size-base);\n line-height: 1.5;\n max-width: 100%;\n"]))),la=Tn.div(Xi||(Xi=Ji(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ca=Tn.div(Ki||(Ki=Ji(["\n opacity: 0.75;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ua=Tn.div(Zi||(Zi=Ji(["\n grid-area: footer;\n padding-left: var(--padding-size-base);\n display: flex;\n align-items: center;\n justify-content: center;\n @media (orientation: portrait) {\n font-size: calc(var(--font-size-base) * 2);\n }\n"])));Qi.propTypes={templateClasses:a().arrayOf(a().string),templateRootStyle:a().shape({}),calendarEvents:a().arrayOf(a().shape({id:a().string.isRequired,title:a().string,startTime:a().number.isRequired,endTime:a().number,resourceTitle:a().string,resourceId:a().string})).isRequired,content:a().shape({title:a().string,displayHeaders:a().bool,footerText:a().string,mediaContain:a().bool}).isRequired,getTitle:a().func.isRequired};const ha=Qi;var fa,da,ma,pa,ga,va,ba,ya,Ea,Sa,Ta,wa;function ka(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Aa(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);rn.charCodeAt(0)&&(n=n.trim()),n=[n],01?t-1:0),n=1;ns()()?o=i:La(f["@id"],null)}H(o)};(0,e.useEffect)((function(){s().extend(c()),G();var e=setInterval(G,5e3);return function(){null!==e&&clearInterval(e)}}),[]),(0,e.useEffect)((function(){!function(){var e,t;if(S&&f&&y&&E){if(!_){var r=null!==(e=null==f||null===(t=f.feed)||void 0===t||null===(t=t.configuration)||void 0===t?void 0:t.resources)&&void 0!==e?e:[];1===r.length&&(O(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_GET_QUICK_BOOK_OPTIONS",data:{resource:r[0]}})}).then((function(e){return e.json()})).then((function(e){w(e.options.map((function(t){return{resource:e.resource,from:e.from,to:t.to,durationMinutes:t.durationMinutes}})))})).finally((function(){O(!1)})))}}else O(!1)}()}),[d]);var $=a.filter((function(e){return e.startTime<=R.unix()&&e.endTime>=R.unix()})),Y=a.filter((function(e){return!$.includes(e)})),V=null!==P||$.length>0,q=!V&&_?null:(null==k?void 0:k.length)>0,W=V?"var(--color-red-900)":"var(--color-green-900)",X=V?"var(--color-red-50)":"var(--color-green-50)";return t().createElement(ba,{className:"template-calendar calendar-single-booking ".concat(o.join(" "),"\n ").concat(b?"media-contain":""),style:u},t().createElement(ya,{style:{backgroundColor:W}},t().createElement(Ea,null,v&&t().createElement(Ta,{className:"subtitle"},v),t().createElement(Sa,{className:"title"},p)),t().createElement(ka,null,t().createElement(wa,null,V?t().createElement(Zn,{style:{color:"var(--color-red-600)"}}):t().createElement(Wn,{style:{color:"var(--color-green-600)"}})),t().createElement(Aa,null,V?t().createElement(it,{id:"room_in_use",defaultMessage:"Optaget"}):t().createElement(it,{id:"room_available",defaultMessage:"Ledigt"}))),t().createElement(_a,{style:{backgroundColor:X}},t().createElement(Oa,null,R.locale(Pn()).format("dddd D. MMMM")),t().createElement(Ca,null,R.locale(Pn()).format("HH:mm")))),t().createElement(Pa,{className:"content"},V&&t().createElement(t().Fragment,null,P&&t().createElement(Ha,{className:"content-item"},t().createElement("p",null,t().createElement(it,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm"))),$.map((function(e){return t().createElement(Ha,{key:e.id,className:"content-item"},t().createElement(Na,null,Hn(e.startTime)," - ",Hn(e.endTime)),t().createElement("h1",null,h(e.title)))}))),!V&&t().createElement(t().Fragment,null,t().createElement(Ha,{className:"content-item"},!z&&!P&&!j&&t().createElement(t().Fragment,null,q&&t().createElement(t().Fragment,null,t().createElement("h1",null,t().createElement(it,{id:"instant_booking_available",defaultMessage:"Lokalet er ledigt"})),t().createElement("p",null,t().createElement(it,{id:"instant_booked_available_text",defaultMessage:"Straksbook lokalet. Vælg varighed."})),t().createElement(Ra,null,k.map((function(e){return t().createElement(Ia,{key:e.durationMinutes,onClick:function(){return function(e){S&&f&&y&&E&&(L(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_QUICK_BOOK",data:{interval:e}})}).then((function(e){return e.json()})).then((function(e){H(e),La(f["@id"],e)})).catch((function(){U(!0),setTimeout((function(){return U(!1)}),1e4)})).finally((function(){L(!1)})))}(e)}},t().createElement(Ma,null),t().createElement("span",null,e.durationMinutes," min"))})))),!q&&t().createElement(t().Fragment,null,t().createElement("p",null,t().createElement(it,{id:"instant_booked_not_available",defaultMessage:"Straksbooking ikke tilgængeligt"})),t().createElement("div",{style:{fontSize:".5em"}},function(e){if(e<=0)return"";var t=Math.floor(e/86400),r=Math.floor((e-60*t*60*24)/3600),n=Math.floor((e-60*r*60)/60),a=e%60,i=" til næste begivenhed";return t>0?"".concat(t," dag").concat(t>1?"e":""," ").concat(i):r>0?"".concat(r," time").concat(r>1?"r":""," ").concat(i):n>0?"".concat(n," minut").concat(n>1?"ter":""," ").concat(i):a>0?"Mindre end et minut ".concat(i):""}(B)))),z&&!P&&!j&&t().createElement("p",null,t().createElement(it,{id:"instant_booking_processing",defaultMessage:"Booker lokale..."})),j&&t().createElement("p",null,t().createElement(it,{id:"instant_booking_error",defaultMessage:"Straksbooking fejlede. Prøv igen lidt senere."})),201===(null==P?void 0:P.status)&&t().createElement("p",null,t().createElement(it,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm")))),Y.length>0&&t().createElement(t().Fragment,null,t().createElement("h3",null,t().createElement(it,{id:"coming_events",defaultMessage:"Kommende begivenheder"})),function(e,r){var n=s()(),a=[];return e.length>0&&e.filter((function(e){return e.endTime>n.unix()&&e.endTime<=n.endOf("day").unix()})).forEach((function(e){a.length<3&&a.push(t().createElement(Ha,{key:e.id,className:"content-item"},t().createElement(Na,null,Hn(e.startTime)," - ",Hn(e.endTime)),r(e.title)))})),a.concat()}(Y,h))))}Da.propTypes={slide:i().shape({"@id":i().string.isRequired,feed:i().shape({configuration:i().shape({resources:i().arrayOf(i().string)})})}).isRequired,run:i().string.isRequired,templateClasses:i().arrayOf(i().string),templateRootStyle:i().shape({}),calendarEvents:i().arrayOf(i().shape({id:i().string.isRequired,title:i().string,startTime:i().number.isRequired,endTime:i().number,resourceTitle:i().string,resourceId:i().string})).isRequired,content:i().shape({title:i().string,subTitle:i().string,resourceAvailableText:i().string,resourceUnavailableText:i().string,mediaContain:i().bool}).isRequired,getTitle:i().func.isRequired};const Fa=Da;var ja,Ua,Ga,$a,Ya,Va,qa,Wa,Xa,Ka,Za;function Ja(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Qa(r){var n,a=r.content,i=r.calendarEvents,o=r.templateClasses,l=void 0===o?[]:o,u=r.templateRootStyle,h=void 0===u?{}:u,f=r.getTitle,d=a.title,m=void 0===d?"":d,p=a.footerText,g=void 0===p?null:p,v=a.mediaContain;return(0,e.useEffect)((function(){s().extend(c())}),[]),t().createElement(ei,{className:"template-calendar calendar-multiple-days ".concat(l.join(" ")," ").concat(v?"media-contain":""),style:h},t().createElement(t().Fragment,null,t().createElement(ti,{className:"title"},m),t().createElement(ri,{className:"content"},(null==i?void 0:i.length)>0&&(n=function(e){var t=s()(),r={};return e.filter((function(e){return e.endTime>t.unix()})).forEach((function(e){var t=s()(1e3*e.startTime),n=t.locale(Pn()).format("dddd D. MMMM"),a=t.format("YYYY-MM-DD");Object.prototype.hasOwnProperty.call(r,a)||(r[a]={events:[],title:n}),r[a].events.push(e)})),r}(i),Object.keys(n).sort().map((function(r,a){return t().createElement(e.Fragment,{key:r},a<5&&t().createElement(ni,{className:"content-col"},t().createElement(ai,{className:"col-title"},n[r].title),n[r].events.map((function(e){var r;return t().createElement(ii,{key:e.id,className:"col-item"},t().createElement(oi,{className:"col-item-time"},t().createElement("div",null,Hn(e.startTime)," -"),t().createElement("div",null,Hn(e.endTime))),t().createElement(si,{className:"col-item-event"},t().createElement(li,null,f(e.title)),t().createElement(ci,null,null!==(r=e.resourceTitle)&&void 0!==r?r:e.resourceId)))}))))})))),g&&t().createElement(ui,{className:"footer"},g)))}var ei=Tn.div(ja||(ja=Ja(['\n font-family: var(--font-family-base);\n font-size: var(--font-size-base);\n height: 100%;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n /*\n --bg-color is local to this template file and is populated from configuration.\n --background-color serves as fallback to the global variable, that will serve a light og dark background color depending on the user preferences.\n */\n background-color: var(--bg-color, var(--background-color));\n background-image: var(--bg-image, none);\n color: var(--text-color);\n display: grid;\n grid-template-areas:\n "title"\n "content"\n "footer";\n grid-template-rows: 1fr 14fr 1fr;\n']))),ti=Tn.h1(Ua||(Ua=Ja(["\n grid-area: title;\n color: var(--color-primary);\n padding: 0 var(--padding-size-base);\n font-weight: var(--font-weight-light);\n font-size: var(--h2-font-size);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.5)\n calc(var(--padding-size-base) * 2) 0 calc(var(--padding-size-base) * 2);\n font-size: calc(var(--h1-font-size) * 2);\n }\n"]))),ri=Tn.div(Ga||(Ga=Ja(['\n grid-area: content;\n display: grid;\n grid-gap: 1px;\n grid-template-columns: repeat(5, 20%);\n overflow: hidden;\n position: relative;\n\n &:after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 20px;\n background: rgb(0, 0, 0);\n background: linear-gradient(\n 0deg,\n hsla(0, 0%, 18%, 1) 0%,\n hsla(0, 0%, 18%, 0) 100%\n );\n @media (orientation: portrait) {\n height: 30px;\n }\n }\n\n @media (orientation: portrait) {\n grid-template-rows: repeat(1fr, auto);\n grid-template-columns: revert;\n font-size: calc(var(--font-size-base) * 2);\n }\n']))),ni=Tn.section($a||($a=Ja(["\n background-color: var(--color-grey-200);\n"]))),ai=Tn.p(Ya||(Ya=Ja(["\n background-color: var(--color-grey-100);\n padding: calc(var(--padding-size-base) * 0.5) var(--padding-size-base);\n margin: 0;\n font-weight: var(--font-weight-bold);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.1)\n calc(var(--padding-size-base) * 2);\n }\n"]))),ii=Tn.article(Va||(Va=Ja(["\n padding: calc(var(--padding-size-base) * 0.65) var(--padding-size-base);\n display: flex;\n background-color: var(--color-grey-300);\n\n &:nth-child(odd) {\n background-color: var(--color-grey-400);\n }\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 0.65)\n calc(var(--padding-size-base) * 2);\n }\n"]))),oi=Tn.div(qa||(qa=Ja(["\n line-height: 1.5;\n min-width: fit-content;\n\n @media (orientation: portrait) {\n div {\n display: inline-block;\n\n &:nth-last-of-type(1) {\n margin-left: 5px;\n }\n }\n }\n"]))),si=Tn.div(Wa||(Wa=Ja(["\n padding: 0 calc(var(--padding-size-base) * 0.5) 0 var(--padding-size-base);\n line-height: 1.5;\n max-width: 100%;\n"]))),li=Tn.div(Xa||(Xa=Ja(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ci=Tn.div(Ka||(Ka=Ja(["\n opacity: 0.75;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ui=Tn.div(Za||(Za=Ja(["\n grid-area: footer;\n padding-left: var(--padding-size-base);\n display: flex;\n align-items: center;\n justify-content: center;\n @media (orientation: portrait) {\n font-size: calc(var(--font-size-base) * 2);\n }\n"])));Qa.propTypes={templateClasses:i().arrayOf(i().string),templateRootStyle:i().shape({}),calendarEvents:i().arrayOf(i().shape({id:i().string.isRequired,title:i().string,startTime:i().number.isRequired,endTime:i().number,resourceTitle:i().string,resourceId:i().string})).isRequired,content:i().shape({title:i().string,displayHeaders:i().bool,footerText:i().string,mediaContain:i().bool}).isRequired,getTitle:i().func.isRequired};const hi=Qa;var fi,di,mi,pi,gi,vi,bi,yi,Ei,Si,Ti,ki;function wi(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Ai(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r{getTitle(event.title)}
- {getTitle(event.title)}
+ n.charCodeAt(0)&&(n=n.trim()),n=[n],01?t-1:0),n=1;ns()()?o=i:La(f["@id"],null)}H(o)};(0,e.useEffect)((function(){s().extend(c()),G();var e=setInterval(G,5e3);return function(){null!==e&&clearInterval(e)}}),[]),(0,e.useEffect)((function(){!function(){var e,t;if(S&&f&&y&&E){if(!_){var r=null!==(e=null==f||null===(t=f.feed)||void 0===t||null===(t=t.configuration)||void 0===t?void 0:t.resources)&&void 0!==e?e:[];1===r.length&&(O(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_GET_QUICK_BOOK_OPTIONS",data:{resource:r[0]}})}).then((function(e){return e.json()})).then((function(e){w(e.options.map((function(t){return{resource:e.resource,from:e.from,to:t.to,durationMinutes:t.durationMinutes}})))})).finally((function(){O(!1)})))}}else O(!1)}()}),[d]);var $=a.filter((function(e){return e.startTime<=R.unix()&&e.endTime>=R.unix()})),Y=a.filter((function(e){return!$.includes(e)})),V=null!==P||$.length>0,q=!V&&_?null:(null==k?void 0:k.length)>0,W=V?"var(--color-red-900)":"var(--color-green-900)",X=V?"var(--color-red-50)":"var(--color-green-50)";return t().createElement(ba,{className:"template-calendar calendar-single-booking ".concat(o.join(" "),"\n ").concat(b?"media-contain":""),style:u},t().createElement(ya,{style:{backgroundColor:W}},t().createElement(Ea,null,v&&t().createElement(Ta,{className:"subtitle"},v),t().createElement(Sa,{className:"title"},p)),t().createElement(ka,null,t().createElement(wa,null,V?t().createElement(Zn,{style:{color:"var(--color-red-600)"}}):t().createElement(Wn,{style:{color:"var(--color-green-600)"}})),t().createElement(Aa,null,V?t().createElement(it,{id:"room_in_use",defaultMessage:"Optaget"}):t().createElement(it,{id:"room_available",defaultMessage:"Ledigt"}))),t().createElement(_a,{style:{backgroundColor:X}},t().createElement(Oa,null,R.locale(Pn()).format("dddd D. MMMM")),t().createElement(Ca,null,R.locale(Pn()).format("HH:mm")))),t().createElement(Pa,{className:"content"},V&&t().createElement(t().Fragment,null,P&&t().createElement(Ha,{className:"content-item"},t().createElement("p",null,t().createElement(it,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm"))),$.map((function(e){return t().createElement(Ha,{key:e.id,className:"content-item"},t().createElement(Na,null,Hn(e.startTime)," - ",Hn(e.endTime)),t().createElement("h1",null,h(e.title)))}))),!V&&t().createElement(t().Fragment,null,t().createElement(Ha,{className:"content-item"},!z&&!P&&!j&&t().createElement(t().Fragment,null,q&&t().createElement(t().Fragment,null,t().createElement("h1",null,t().createElement(it,{id:"instant_booking_available",defaultMessage:"Lokalet er ledigt"})),t().createElement("p",null,t().createElement(it,{id:"instant_booked_available_text",defaultMessage:"Straksbook lokalet. Vælg varighed."})),t().createElement(Ra,null,k.map((function(e){return t().createElement(Ia,{key:e.durationMinutes,onClick:function(){return function(e){S&&f&&y&&E&&(L(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_QUICK_BOOK",data:{interval:e}})}).then((function(e){return e.json()})).then((function(e){H(e),La(f["@id"],e)})).catch((function(){U(!0),setTimeout((function(){return U(!1)}),1e4)})).finally((function(){L(!1)})))}(e)}},t().createElement(Ma,null),t().createElement("span",null,e.durationMinutes," min"))})))),!q&&t().createElement(t().Fragment,null,t().createElement("p",null,t().createElement(it,{id:"instant_booked_not_available",defaultMessage:"Straksbooking ikke tilgængeligt"})),t().createElement("div",{style:{fontSize:".5em"}},function(e){if(e<=0)return"";var t=Math.floor(e/86400),r=Math.floor((e-60*t*60*24)/3600),n=Math.floor((e-60*r*60)/60),a=e%60,i=" til næste begivenhed";return t>0?"".concat(t," dag").concat(t>1?"e":""," ").concat(i):r>0?"".concat(r," time").concat(r>1?"r":""," ").concat(i):n>0?"".concat(n," minut").concat(n>1?"ter":""," ").concat(i):a>0?"Mindre end et minut ".concat(i):""}(B)))),z&&!P&&!j&&t().createElement("p",null,t().createElement(it,{id:"instant_booking_processing",defaultMessage:"Booker lokale..."})),j&&t().createElement("p",null,t().createElement(it,{id:"instant_booking_error",defaultMessage:"Straksbooking fejlede. Prøv igen lidt senere."})),201===(null==P?void 0:P.status)&&t().createElement("p",null,t().createElement(it,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm")))),Y.length>0&&t().createElement(t().Fragment,null,t().createElement("h3",null,t().createElement(it,{id:"coming_events",defaultMessage:"Kommende begivenheder"})),function(e,r){var n=s()(),a=[];return e.length>0&&e.filter((function(e){return e.endTime>n.unix()&&e.endTime<=n.endOf("day").unix()})).forEach((function(e){a.length<3&&a.push(t().createElement(Ha,{key:e.id,className:"content-item"},t().createElement(Na,null,Hn(e.startTime)," - ",Hn(e.endTime)),r(e.title)))})),a.concat()}(Y,h))))}Da.propTypes={slide:i().shape({"@id":i().string.isRequired,feed:i().shape({configuration:i().shape({resources:i().arrayOf(i().string)})})}).isRequired,run:i().string.isRequired,templateClasses:i().arrayOf(i().string),templateRootStyle:i().shape({}),calendarEvents:i().arrayOf(i().shape({id:i().string.isRequired,title:i().string,startTime:i().number.isRequired,endTime:i().number,resourceTitle:i().string,resourceId:i().string})).isRequired,content:i().shape({title:i().string,subTitle:i().string,resourceAvailableText:i().string,resourceUnavailableText:i().string,mediaContain:i().bool}).isRequired,getTitle:i().func.isRequired};const Fa=Da;var ja,Ua,Ga,$a,Ya,Va,qa,Wa,Xa,Ka,Za;function Ja(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Qa(r){var n,a=r.content,i=r.calendarEvents,o=r.templateClasses,l=void 0===o?[]:o,u=r.templateRootStyle,h=void 0===u?{}:u,f=r.getTitle,d=a.title,m=void 0===d?"":d,p=a.footerText,g=void 0===p?null:p,v=a.mediaContain;return(0,e.useEffect)((function(){s().extend(c())}),[]),t().createElement(ei,{className:"template-calendar calendar-multiple-days ".concat(l.join(" ")," ").concat(v?"media-contain":""),style:h},t().createElement(t().Fragment,null,t().createElement(ti,{className:"title"},m),t().createElement(ri,{className:"content"},(null==i?void 0:i.length)>0&&(n=function(e){var t=s()(),r={};return e.filter((function(e){return e.endTime>t.unix()})).forEach((function(e){var t=s()(1e3*e.startTime),n=t.locale(Pn()).format("dddd D. MMMM"),a=t.format("YYYY-MM-DD");Object.prototype.hasOwnProperty.call(r,a)||(r[a]={events:[],title:n}),r[a].events.push(e)})),r}(i),Object.keys(n).sort().map((function(r,a){return t().createElement(e.Fragment,{key:r},a<5&&t().createElement(ni,{className:"content-col"},t().createElement(ai,{className:"col-title"},n[r].title),n[r].events.map((function(e){var r;return t().createElement(ii,{key:e.id,className:"col-item"},t().createElement(oi,{className:"col-item-time"},t().createElement("div",null,Hn(e.startTime)," -"),t().createElement("div",null,Hn(e.endTime))),t().createElement(si,{className:"col-item-event"},t().createElement(li,null,f(e.title)),t().createElement(ci,null,null!==(r=e.resourceTitle)&&void 0!==r?r:e.resourceId)))}))))})))),g&&t().createElement(ui,{className:"footer"},g)))}var ei=Tn.div(ja||(ja=Ja(['\n font-family: var(--font-family-base);\n font-size: var(--font-size-base);\n height: 100%;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n /*\n --bg-color is local to this template file and is populated from configuration.\n --background-color serves as fallback to the global variable, that will serve a light og dark background color depending on the user preferences.\n */\n background-color: var(--bg-color, var(--background-color));\n background-image: var(--bg-image, none);\n color: var(--text-color);\n display: grid;\n grid-template-areas:\n "title"\n "content"\n "footer";\n grid-template-rows: 1fr 14fr 1fr;\n']))),ti=Tn.h1(Ua||(Ua=Ja(["\n grid-area: title;\n color: var(--color-primary);\n padding: 0 var(--padding-size-base);\n font-weight: var(--font-weight-light);\n font-size: var(--h2-font-size);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.5)\n calc(var(--padding-size-base) * 2) 0 calc(var(--padding-size-base) * 2);\n font-size: calc(var(--h1-font-size) * 2);\n }\n"]))),ri=Tn.div(Ga||(Ga=Ja(['\n grid-area: content;\n display: grid;\n grid-gap: 1px;\n grid-template-columns: repeat(5, 20%);\n overflow: hidden;\n position: relative;\n\n &:after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 20px;\n background: rgb(0, 0, 0);\n background: linear-gradient(\n 0deg,\n hsla(0, 0%, 18%, 1) 0%,\n hsla(0, 0%, 18%, 0) 100%\n );\n @media (orientation: portrait) {\n height: 30px;\n }\n }\n\n @media (orientation: portrait) {\n grid-template-rows: repeat(1fr, auto);\n grid-template-columns: revert;\n font-size: calc(var(--font-size-base) * 2);\n }\n']))),ni=Tn.section($a||($a=Ja(["\n background-color: var(--color-grey-200);\n"]))),ai=Tn.p(Ya||(Ya=Ja(["\n background-color: var(--color-grey-100);\n padding: calc(var(--padding-size-base) * 0.5) var(--padding-size-base);\n margin: 0;\n font-weight: var(--font-weight-bold);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.1)\n calc(var(--padding-size-base) * 2);\n }\n"]))),ii=Tn.article(Va||(Va=Ja(["\n padding: calc(var(--padding-size-base) * 0.65) var(--padding-size-base);\n display: flex;\n background-color: var(--color-grey-300);\n\n &:nth-child(odd) {\n background-color: var(--color-grey-400);\n }\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 0.65)\n calc(var(--padding-size-base) * 2);\n }\n"]))),oi=Tn.div(qa||(qa=Ja(["\n line-height: 1.5;\n min-width: fit-content;\n\n @media (orientation: portrait) {\n div {\n display: inline-block;\n\n &:nth-last-of-type(1) {\n margin-left: 5px;\n }\n }\n }\n"]))),si=Tn.div(Wa||(Wa=Ja(["\n padding: 0 calc(var(--padding-size-base) * 0.5) 0 var(--padding-size-base);\n line-height: 1.5;\n max-width: 100%;\n"]))),li=Tn.div(Xa||(Xa=Ja(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ci=Tn.div(Ka||(Ka=Ja(["\n opacity: 0.75;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ui=Tn.div(Za||(Za=Ja(["\n grid-area: footer;\n padding-left: var(--padding-size-base);\n display: flex;\n align-items: center;\n justify-content: center;\n @media (orientation: portrait) {\n font-size: calc(var(--font-size-base) * 2);\n }\n"])));Qa.propTypes={templateClasses:i().arrayOf(i().string),templateRootStyle:i().shape({}),calendarEvents:i().arrayOf(i().shape({id:i().string.isRequired,title:i().string,startTime:i().number.isRequired,endTime:i().number,resourceTitle:i().string,resourceId:i().string})).isRequired,content:i().shape({title:i().string,displayHeaders:i().bool,footerText:i().string,mediaContain:i().bool}).isRequired,getTitle:i().func.isRequired};const hi=Qa;var fi,di,mi,pi,gi,vi,bi,yi,Ei,Si,Ti,ki;function wi(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Ai(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);rn.charCodeAt(0)&&(n=n.trim()),n=[n],01?t-1:0),n=1;ns()()?o=a:xi(f["@id"],null)}H(o)};(0,e.useEffect)((function(){s().extend(c()),U();var e=setInterval(U,5e3);return function(){null!==e&&clearInterval(e)}}),[]),(0,e.useEffect)((function(){!function(){var e,t;if(S&&f&&y&&E){if(!_){var r=null!==(e=null==f||null===(t=f.feed)||void 0===t||null===(t=t.configuration)||void 0===t?void 0:t.resources)&&void 0!==e?e:[];1===r.length&&(O(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_GET_QUICK_BOOK_OPTIONS",data:{resource:r[0]}})}).then((function(e){return e.json()})).then((function(e){k(e.options.map((function(t){return{resource:e.resource,from:e.from,to:t.to,durationMinutes:t.durationMinutes}})))})).finally((function(){O(!1)})))}}else O(!1)}()}),[d]);var G=i.filter((function(e){return e.startTime<=R.unix()&&e.endTime>=R.unix()})),$=i.filter((function(e){return!G.includes(e)&&e.endTime>s()().unix()&&e.endTime<=s()().endOf("day").unix()})),Y=null!==P||G.length>0,V=!Y&&_?null:(null==w?void 0:w.length)>0,q=Y?"var(--color-red-900)":"var(--color-green-900)",W=Y?"var(--color-red-50)":"var(--color-green-50)";return t().createElement(bi,{className:"template-calendar calendar-single-booking ".concat(o.join(" "),"\n ").concat(b?"media-contain":""),style:u},t().createElement(yi,{style:{backgroundColor:q}},t().createElement(Ei,null,v&&t().createElement(Ti,{className:"subtitle"},v),t().createElement(Si,{className:"title"},p)),t().createElement(wi,null,t().createElement(ki,null,Y?t().createElement(Zn,{style:{color:"var(--color-red-600)"}}):t().createElement(Wn,{style:{color:"var(--color-green-600)"}})),t().createElement(Ai,null,Y?t().createElement(at,{id:"room_in_use",defaultMessage:"Optaget"}):t().createElement(at,{id:"room_available",defaultMessage:"Ledigt"}))),t().createElement(_i,{style:{backgroundColor:W}},t().createElement(Oi,null,R.locale(Pn()).format("dddd D. MMMM")),t().createElement(Ci,null,R.locale(Pn()).format("HH:mm")))),t().createElement(Pi,{className:"content"},Y&&t().createElement(t().Fragment,null,P&&t().createElement(Hi,{className:"content-item"},t().createElement("p",null,t().createElement(at,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm"))),!P&&G.map((function(e){return t().createElement(Hi,{key:e.id,className:"content-item"},t().createElement(Ni,null,Hn(e.startTime)," - ",Hn(e.endTime)),t().createElement("h1",null,h(e.title)))}))),!Y&&t().createElement(t().Fragment,null,t().createElement(Hi,{className:"content-item"},!z&&!P&&!F&&t().createElement(t().Fragment,null,V&&t().createElement(t().Fragment,null,t().createElement("h1",null,t().createElement(at,{id:"instant_booking_available",defaultMessage:"Lokalet er ledigt"})),t().createElement("p",null,t().createElement(at,{id:"instant_booked_available_text",defaultMessage:"Straksbook lokalet. Vælg varighed."})),t().createElement(Ri,null,w.map((function(e){return t().createElement(Ii,{key:e.durationMinutes,onClick:function(){return function(e){S&&f&&y&&E&&(x(!0),fetch("".concat(S).concat(f["@id"],"/action"),{method:"POST",headers:{authorization:"Bearer ".concat(y),"Authorization-Tenant-Key":E,"Content-Type":"application/ld+json"},body:JSON.stringify({implementationClass:"App\\InteractiveSlide\\InstantBook",action:"ACTION_QUICK_BOOK",data:{interval:e}})}).then((function(e){return e.json()})).then((function(e){H(e),xi(f["@id"],e)})).catch((function(){j(!0),setTimeout((function(){return j(!1)}),1e4)})).finally((function(){x(!1)})))}(e)}},t().createElement(Mi,null),t().createElement("span",null,e.durationMinutes," min"))}))))),z&&!P&&!F&&t().createElement("p",null,t().createElement(at,{id:"instant_booking_processing",defaultMessage:"Booker lokale..."})),F&&t().createElement("p",null,t().createElement(at,{id:"instant_booking_error",defaultMessage:"Straksbooking fejlede. Prøv igen lidt senere."})),201===(null==P?void 0:P.status)&&t().createElement("p",null,t().createElement(at,{id:"instant_booked_until",defaultMessage:"Lokalet er straksbooket indtil"})," ",s()(P.interval.to).locale(Pn()).format("HH:mm")))),$.length>0&&t().createElement(t().Fragment,null,t().createElement("h3",null,t().createElement(at,{id:"coming_events",defaultMessage:"Kommende begivenheder"})),function(e,r){var n=s()(),i=[];return e.length>0&&e.filter((function(e){return e.endTime>n.unix()&&e.endTime<=n.endOf("day").unix()})).forEach((function(e){i.length<3&&i.push(t().createElement(Hi,{key:e.id,className:"content-item"},t().createElement(Ni,null,Hn(e.startTime)," - ",Hn(e.endTime)),r(e.title)))})),i.concat()}($,h))))}Di.propTypes={slide:a().shape({"@id":a().string.isRequired,feed:a().shape({configuration:a().shape({resources:a().arrayOf(a().string)})})}).isRequired,run:a().string.isRequired,templateClasses:a().arrayOf(a().string),templateRootStyle:a().shape({}),calendarEvents:a().arrayOf(a().shape({id:a().string.isRequired,title:a().string,startTime:a().number.isRequired,endTime:a().number,resourceTitle:a().string,resourceId:a().string})).isRequired,content:a().shape({title:a().string,subTitle:a().string,resourceAvailableText:a().string,resourceUnavailableText:a().string,mediaContain:a().bool}).isRequired,getTitle:a().func.isRequired};const Fi=Di;var ji,Ui,Gi,$i,Yi,Vi,qi,Wi,Xi,Ki,Zi;function Ji(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Qi(r){var n,i=r.content,a=r.calendarEvents,o=r.templateClasses,l=void 0===o?[]:o,u=r.templateRootStyle,h=void 0===u?{}:u,f=r.getTitle,d=i.title,m=void 0===d?"":d,p=i.footerText,g=void 0===p?null:p,v=i.mediaContain;return(0,e.useEffect)((function(){s().extend(c())}),[]),t().createElement(ea,{className:"template-calendar calendar-multiple-days ".concat(l.join(" ")," ").concat(v?"media-contain":""),style:h},t().createElement(t().Fragment,null,t().createElement(ta,{className:"title"},m),t().createElement(ra,{className:"content"},(null==a?void 0:a.length)>0&&(n=function(e){var t=s()(),r={};return e.filter((function(e){return e.endTime>t.unix()})).forEach((function(e){var t=s()(1e3*e.startTime),n=t.locale(Pn()).format("dddd D. MMMM"),i=t.format("YYYY-MM-DD");Object.prototype.hasOwnProperty.call(r,i)||(r[i]={events:[],title:n}),r[i].events.push(e)})),r}(a),Object.keys(n).sort().map((function(r,i){return t().createElement(e.Fragment,{key:r},i<5&&t().createElement(na,{className:"content-col"},t().createElement(ia,{className:"col-title"},n[r].title),n[r].events.map((function(e){var r;return t().createElement(aa,{key:e.id,className:"col-item"},t().createElement(oa,{className:"col-item-time"},t().createElement("div",null,Hn(e.startTime)," -"),t().createElement("div",null,Hn(e.endTime))),t().createElement(sa,{className:"col-item-event"},t().createElement(la,null,f(e.title)),t().createElement(ca,null,null!==(r=e.resourceTitle)&&void 0!==r?r:e.resourceId)))}))))})))),g&&t().createElement(ua,{className:"footer"},g)))}var ea=Tn.div(ji||(ji=Ji(['\n font-family: var(--font-family-base);\n font-size: var(--font-size-base);\n height: 100%;\n overflow: hidden;\n background-repeat: no-repeat;\n background-size: cover;\n /*\n --bg-color is local to this template file and is populated from configuration.\n --background-color serves as fallback to the global variable, that will serve a light og dark background color depending on the user preferences.\n */\n background-color: var(--bg-color, var(--background-color));\n background-image: var(--bg-image, none);\n color: var(--text-color);\n display: grid;\n grid-template-areas:\n "title"\n "content"\n "footer";\n grid-template-rows: 1fr 14fr 1fr;\n']))),ta=Tn.h1(Ui||(Ui=Ji(["\n grid-area: title;\n color: var(--color-primary);\n padding: 0 var(--padding-size-base);\n font-weight: var(--font-weight-light);\n font-size: var(--h2-font-size);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.5)\n calc(var(--padding-size-base) * 2) 0 calc(var(--padding-size-base) * 2);\n font-size: calc(var(--h1-font-size) * 2);\n }\n"]))),ra=Tn.div(Gi||(Gi=Ji(['\n grid-area: content;\n display: grid;\n grid-gap: 1px;\n grid-template-columns: repeat(5, 20%);\n overflow: hidden;\n position: relative;\n\n &:after {\n content: "";\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 20px;\n background: rgb(0, 0, 0);\n background: linear-gradient(\n 0deg,\n hsla(0, 0%, 18%, 1) 0%,\n hsla(0, 0%, 18%, 0) 100%\n );\n @media (orientation: portrait) {\n height: 30px;\n }\n }\n\n @media (orientation: portrait) {\n grid-template-rows: repeat(1fr, auto);\n grid-template-columns: revert;\n font-size: calc(var(--font-size-base) * 2);\n }\n']))),na=Tn.section($i||($i=Ji(["\n background-color: var(--color-grey-200);\n"]))),ia=Tn.p(Yi||(Yi=Ji(["\n background-color: var(--color-grey-100);\n padding: calc(var(--padding-size-base) * 0.5) var(--padding-size-base);\n margin: 0;\n font-weight: var(--font-weight-bold);\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 1.1)\n calc(var(--padding-size-base) * 2);\n }\n"]))),aa=Tn.article(Vi||(Vi=Ji(["\n padding: calc(var(--padding-size-base) * 0.65) var(--padding-size-base);\n display: flex;\n background-color: var(--color-grey-300);\n\n &:nth-child(odd) {\n background-color: var(--color-grey-400);\n }\n\n @media (orientation: portrait) {\n padding: calc(var(--padding-size-base) * 0.65)\n calc(var(--padding-size-base) * 2);\n }\n"]))),oa=Tn.div(qi||(qi=Ji(["\n line-height: 1.5;\n min-width: fit-content;\n\n @media (orientation: portrait) {\n div {\n display: inline-block;\n\n &:nth-last-of-type(1) {\n margin-left: 5px;\n }\n }\n }\n"]))),sa=Tn.div(Wi||(Wi=Ji(["\n padding: 0 calc(var(--padding-size-base) * 0.5) 0 var(--padding-size-base);\n line-height: 1.5;\n max-width: 100%;\n"]))),la=Tn.div(Xi||(Xi=Ji(["\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ca=Tn.div(Ki||(Ki=Ji(["\n opacity: 0.75;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 250px;\n\n @media (orientation: portrait) {\n max-width: 740px;\n }\n"]))),ua=Tn.div(Zi||(Zi=Ji(["\n grid-area: footer;\n padding-left: var(--padding-size-base);\n display: flex;\n align-items: center;\n justify-content: center;\n @media (orientation: portrait) {\n font-size: calc(var(--font-size-base) * 2);\n }\n"])));Qi.propTypes={templateClasses:a().arrayOf(a().string),templateRootStyle:a().shape({}),calendarEvents:a().arrayOf(a().shape({id:a().string.isRequired,title:a().string,startTime:a().number.isRequired,endTime:a().number,resourceTitle:a().string,resourceId:a().string})).isRequired,content:a().shape({title:a().string,displayHeaders:a().bool,footerText:a().string,mediaContain:a().bool}).isRequired,getTitle:a().func.isRequired};const ha=Qi;var fa,da,ma,pa,ga,va,ba,ya,Ea,Sa,Ta,wa;function ka(e,t){return t||(t=e.slice(0)),Object.freeze(Object.defineProperties(e,{raw:{value:Object.freeze(t)}}))}function Aa(e,t){(null==t||t>e.length)&&(t=e.length);for(var r=0,n=Array(t);r
-
+