@dbp-topics/greenlight
Version:
[GitHub Repository](https://github.com/digital-blueprint/greenlight-frontend) | [npmjs package](https://www.npmjs.com/package/@dbp-topics/greenlight) | [Unpkg CDN](https://unpkg.com/browse/@dbp-topics/greenlight/) | [Greenlight Bundle](https://gitlab.tugr
389 lines (346 loc) • 22.4 kB
JavaScript
let t,e,i,n=t=>t;function o(){return o=Object.assign?Object.assign.bind():function(t){for(var e=1;e<arguments.length;e++){var i=arguments[e];for(var n in i)Object.prototype.hasOwnProperty.call(i,n)&&(t[n]=i[n])}return t},o.apply(this,arguments)}
/*!
* License: LGPL-2.1-or-later
* Dependencies:
*
* @webcomponents/scoped-custom-element-registry: 0.0.7 (BSD-3-Clause)
* @dbp-toolkit/app-shell: 0.3.3 (LGPL-2.1-or-later)
* @dbp-toolkit/language-select: 0.3.1 (LGPL-2.1-or-later)
* @dbp-toolkit/common: 0.3.4 (LGPL-2.1-or-later)
* @dbp-toolkit/auth: 0.3.1 (LGPL-2.1-or-later)
* event-target-shim: 6.0.2 (MIT)
* @dbp-toolkit/notification: 0.3.1 (LGPL-2.1-or-later)
* @dbp-toolkit/theme-switcher: 0.0.5 (LGPL-2.1-or-later)
* path-to-regexp: 6.2.0 (MIT)
* universal-router: 9.1.0 (MIT)
* generateUrls: 9.1.0 (MIT)
* @dbp-toolkit/matomo: 0.2.6 (LGPL-2.1-or-later)
* @tugraz/web-components: 0.3.6 (LGPL-2.1-or-later)
* @babel/runtime: 7.20.13 (MIT)
* i18next: 22.4.9 (MIT)
* @lit/reactive-element: 1.6.1 (BSD-3-Clause)
* lit-html: 2.6.1 (BSD-3-Clause)
* lit-element: 3.2.2 (BSD-3-Clause)
* @open-wc/dedupe-mixin: 1.3.1 (MIT)
* @open-wc/scoped-elements: 2.1.4 (MIT)
* jose: 4.11.2 (MIT)
* @dbp-toolkit/file-handling: 0.3.5 (LGPL-2.1-or-later)
* webdav: 4.8.0 (MIT)
* tabulator-tables: 5.1.8 (MIT)
* file-saver: 2.0.5 (MIT)
* @dbp-toolkit/qr-code-scanner: 0.3.1 (LGPL-2.1-or-later)
* async-mutex: 0.4.0 (MIT)
* pdfjs-dist: 2.16.105 (Apache-2.0)
* dommatrix: 1.0.3 (MIT)
* web-streams-polyfill: 3.2.1 (MIT)
* mockdate: 3.0.5 (MIT)
* certlogic-js: 1.2.2 (Apache-2.0)
* string-similarity: 4.0.4 (ISC)
* @popperjs/core: 2.11.5 (MIT)
* tippy.js: 6.3.7 (MIT)
* @dbp-toolkit/tooltip: 0.0.3 (LGPL-2.1-or-later)
* qrcode-generator: 1.4.4 (MIT)
*/import{S as a,I as r,M as s,L as l,s as c,y as d,o as h,i as u}from"./notification.23e517da.es.js";import{D as m,x as p}from"./activity.bd47f9d0.es.js";function f(t,e){for(var i=0;i<e.length;i++){var n=e[i];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(t,n.key,n)}}function g(t){return function(t){if(Array.isArray(t))return v(t)}(t)||function(t){if("undefined"!=typeof Symbol&&Symbol.iterator in Object(t))return Array.from(t)}(t)||function(t,e){if(!t)return;if("string"==typeof t)return v(t,e);var i=Object.prototype.toString.call(t).slice(8,-1);"Object"===i&&t.constructor&&(i=t.constructor.name);if("Map"===i||"Set"===i)return Array.from(i);if("Arguments"===i||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(i))return v(t,e)}(t)||function(){throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function v(t,e){(null==e||e>t.length)&&(e=t.length);for(var i=0,n=new Array(e);i<e;i++)n[i]=t[i];return n}var b,y,k,w,x,T=(b=["a[href]","area[href]",'input:not([disabled]):not([type="hidden"]):not([aria-hidden])',"select:not([disabled]):not([aria-hidden])","textarea:not([disabled]):not([aria-hidden])","button:not([disabled]):not([aria-hidden])","iframe","object","embed","[contenteditable]",'[tabindex]:not([tabindex^="-"])'],y=function(){function t(e){var i=e.targetModal,n=e.triggers,o=void 0===n?[]:n,a=e.onShow,r=void 0===a?function(){}:a,s=e.onClose,l=void 0===s?function(){}:s,c=e.openTrigger,d=void 0===c?"data-micromodal-trigger":c,h=e.closeTrigger,u=void 0===h?"data-micromodal-close":h,m=e.openClass,p=void 0===m?"is-open":m,f=e.disableScroll,v=void 0!==f&&f,b=e.disableFocus,y=void 0!==b&&b,k=e.awaitCloseAnimation,w=void 0!==k&&k,x=e.awaitOpenAnimation,T=void 0!==x&&x,E=e.debugMode,$=void 0!==E&&E;!function(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}(this,t),this.modal=this.modal="string"==typeof i?document.getElementById(i):i,this.config={debugMode:$,disableScroll:v,openTrigger:d,closeTrigger:u,openClass:p,onShow:r,onClose:l,awaitCloseAnimation:w,awaitOpenAnimation:T,disableFocus:y},o.length>0&&this.registerTriggers.apply(this,g(o)),this.onClick=this.onClick.bind(this),this.onKeydown=this.onKeydown.bind(this)}var e,i,n;return e=t,i=[{key:"registerTriggers",value:function(){for(var t=this,e=arguments.length,i=new Array(e),n=0;n<e;n++)i[n]=arguments[n];i.filter(Boolean).forEach((function(e){e.addEventListener("click",(function(e){return t.showModal(e)}))}))}},{key:"showModal",value:function(){var t=this,e=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null;if(this.activeElement=document.activeElement,this.modal.setAttribute("aria-hidden","false"),this.modal.classList.add(this.config.openClass),this.scrollBehaviour("disable"),this.addEventListeners(),this.config.awaitOpenAnimation){var i=function e(){t.modal.removeEventListener("animationend",e,!1),t.setFocusToFirstNode()};this.modal.addEventListener("animationend",i,!1)}else this.setFocusToFirstNode();this.config.onShow(this.modal,this.activeElement,e)}},{key:"closeModal",value:function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:null,e=this.modal;if(this.modal.setAttribute("aria-hidden","true"),this.removeEventListeners(),this.scrollBehaviour("enable"),this.activeElement&&this.activeElement.focus&&this.activeElement.focus(),this.config.onClose(this.modal,this.activeElement,t),this.config.awaitCloseAnimation){var i=this.config.openClass;this.modal.addEventListener("animationend",(function t(){e.classList.remove(i),e.removeEventListener("animationend",t,!1)}),!1)}else e.classList.remove(this.config.openClass)}},{key:"closeModalById",value:function(t){t instanceof HTMLElement?this.modal=t:this.model=document.getElementById(t),this.modal&&this.closeModal()}},{key:"scrollBehaviour",value:function(t){if(this.config.disableScroll){var e=document.querySelector("body");switch(t){case"enable":Object.assign(e.style,{overflow:""});break;case"disable":Object.assign(e.style,{overflow:"hidden"})}}}},{key:"addEventListeners",value:function(){this.modal.addEventListener("touchstart",this.onClick),this.modal.addEventListener("click",this.onClick),document.addEventListener("keydown",this.onKeydown)}},{key:"removeEventListeners",value:function(){this.modal.removeEventListener("touchstart",this.onClick),this.modal.removeEventListener("click",this.onClick),document.removeEventListener("keydown",this.onKeydown)}},{key:"onClick",value:function(t){t.target.hasAttribute(this.config.closeTrigger)&&this.closeModal(t)}},{key:"onKeydown",value:function(t){27===t.keyCode&&this.closeModal(t),9===t.keyCode&&this.retainFocus(t)}},{key:"getFocusableNodes",value:function(){var t=this.modal.querySelectorAll(b);return Array.apply(void 0,g(t))}},{key:"setFocusToFirstNode",value:function(){var t=this;if(!this.config.disableFocus){var e=this.getFocusableNodes();if(0!==e.length){var i=e.filter((function(e){return!e.hasAttribute(t.config.closeTrigger)}));i.length>0&&i[0].focus(),0===i.length&&e[0].focus()}}}},{key:"retainFocus",value:function(t){var e=this.getFocusableNodes();if(0!==e.length)if(e=e.filter((function(t){return null!==t.offsetParent})),this.modal.contains(document.activeElement)){var i=e.indexOf(document.activeElement);t.shiftKey&&0===i&&(e[e.length-1].focus(),t.preventDefault()),!t.shiftKey&&e.length>0&&i===e.length-1&&(e[0].focus(),t.preventDefault())}else e[0].focus()}}],i&&f(e.prototype,i),n&&f(e,n),t}(),k=null,w=function(t){if(!document.getElementById(t))return console.warn("MicroModal: ❗Seems like you have missed %c'".concat(t,"'"),"background-color: #f8f9fa;color: #50596c;font-weight: bold;","ID somewhere in your code. Refer example below to resolve it."),console.warn("%cExample:","background-color: #f8f9fa;color: #50596c;font-weight: bold;",'<div class="modal" id="'.concat(t,'"></div>')),!1},x=function(t,e){if(function(t){t.length<=0&&(console.warn("MicroModal: ❗Please specify at least one %c'micromodal-trigger'","background-color: #f8f9fa;color: #50596c;font-weight: bold;","data attribute."),console.warn("%cExample:","background-color: #f8f9fa;color: #50596c;font-weight: bold;",'<a href="#" data-micromodal-trigger="my-modal"></a>'))}(t),!e)return!0;for(var i in e)w(i);return!0},{init:function(t){var e=Object.assign({},{openTrigger:"data-micromodal-trigger"},t),i=g(document.querySelectorAll("[".concat(e.openTrigger,"]"))),n=function(t,e){var i=[];return t.forEach((function(t){var n=t.attributes[e].value;void 0===i[n]&&(i[n]=[]),i[n].push(t)})),i}(i,e.openTrigger);if(!0!==e.debugMode||!1!==x(i,n))for(var o in n){var a=n[o];e.targetModal=o,e.triggers=g(a),k=new y(e)}},show:function(t,e){var i=e||{};i.targetModal=t,!0===i.debugMode&&!1===w(t)||(k&&k.removeEventListeners(),(k=new y(i)).showModal())},close:function(t){t?k.closeModalById(t):k.closeModal()}});window.MicroModal=T;class E extends(a(m)){constructor(){super(),this._i18n=p(),this.lang=this._i18n.language,this.entryPointUrl="",this.loading=!1,this.ticketLoading=!1,this.ticketOpen=!1,this.ticketImage="",this.timer="",this.setTimeoutIsSet=!1,this.showReloadButton=!1,this.forceTicketGrayscale=!1,this.boundUpdateTicketwrapper=this.updateTicketWrapper.bind(this)}static get properties(){return o({},super.properties,{lang:{type:String},entryPointUrl:{type:String,attribute:"entry-point-url"},loading:{type:Boolean,attribute:!1},ticketLoading:{type:Boolean,attribute:!1},showReloadButton:{type:Boolean,attribute:!1},ticketImage:{type:String,attribute:!1},forceTicketGrayscale:{type:Boolean,attribute:!1}})}static get scopedElements(){return{"dbp-icon":r,"dbp-mini-spinner":s,"dbp-loading-button":l}}disconnectedCallback(){clearTimeout(this.timer),window.removeEventListener("focus",this.boundUpdateTicketwrapper),super.disconnectedCallback()}connectedCallback(){super.connectedCallback(),window.addEventListener("focus",this.boundUpdateTicketwrapper)}update(t){t.forEach(((t,e)=>{if("lang"===e)this._i18n.changeLanguage(this.lang)})),super.update(t)}async updateTicketWrapper(){this.setTimeoutIsSet=!1,this.showReloadButton=!1,this.updateTicket()}async updateTicketAndNotify(){if(this.setTimeoutIsSet=!1,this.showReloadButton=!1,!await this.updateTicket()&&this.showReloadButton){const t=this._i18n;c({summary:t.t("reload-error-title"),body:t.t("reload-error-body"),type:"danger",timeout:5}),this.showReloadButton=!0}}async updateTicket(){return!0}setTimer(t){const e=this;this.setTimeoutIsSet||(this.setTimeoutIsSet=!0,clearTimeout(this.timer),this.timer=setTimeout((function(){e.setTimeoutIsSet=!1,e.updateTicket.bind(e)()}),t))}async openTicket(t){this._("#show-ticket-modal")&&(this.ticketOpen=!0,T.show(this._("#show-ticket-modal"),{disableScroll:!0,onClose:t=>{this.ticketLoading=!1,this.ticketOpen=!1}}),this.sendSuccessAnalyticsEvent(t,"Success",""))}closeDialog(){this._("#show-ticket-modal")&&T.close(this._("#show-ticket-modal"))}getTicketUI(i,o,a,r=null){const s=this._i18n;return d(t||(t=n`
<div class="${0}">
<h2>${0}</h2>
<p class="subheadline">
<slot name="description">${0}</slot>
</p>
<div
class="no-tickets ${0}">
${0}
<div>
<a
class="button is-primary create-ticket-button"
href="#"
="${0}"
title="${0}">
${0}
</a>
</div>
</div>
<div class="tickets ${0}">
<div class="${0}">${0}</div>
</div>
<span class="control ${0}">
<span class="loading">
<dbp-mini-spinner text=${0}></dbp-mini-spinner>
</span>
</span>
</div>
<div class="modal micromodal-slide" id="show-ticket-modal" aria-hidden="true">
<div class="modal-overlay" tabindex="-2" data-micromodal-close>
<div
class="modal-container"
id="ticket-modal-box"
role="dialog"
aria-modal="true"
aria-labelledby="ticket-modal-title">
<main class="modal-content" id="ticket-modal-content">
<span
class="control ticket-loading ${0}">
<span class="loading">
<dbp-mini-spinner
text=${0}></dbp-mini-spinner>
</span>
</span>
<div class="content-wrapper">
<div
class="left-container ${0}">
<h3 id="ticket-modal-title">
<slot name="ticket-place">
${0}
<strong>${0}</strong>
</slot>
</h3>
<div
class="reload-failed ${0}">
<p>${0}</p>
<button
id="reload-btn"
class="button"
="${0}"
title="${0}">
<dbp-icon
title="${0}"
name="reload"
class="reload-icon"></dbp-icon>
</button>
</div>
<div class="foto-container">
<img
class="${0}"
src="${0}"
alt="${0}" />
${0}
</div>
</div>
${0}
<button
title="Close"
class="modal-close"
aria-label="Close modal"
="${0}">
<dbp-icon
title="${0}"
name="close"
class="close-icon"></dbp-icon>
</button>
</div>
</main>
</div>
</div>
</div>
`),h({hidden:i}),this.activity.getName(this.lang),this.activity.getDescription(this.lang),h({hidden:this.loading||!this.activeTickets||0!==this.activeTickets.length||this.loadingTickets}),s.t("no-tickets-message"),(t=>{this.dispatchEvent(new CustomEvent("dbp-show-activity",{detail:{name:"acquire-3g-ticket"}})),t.preventDefault()}),s.t("show-active-tickets.acquire-ticket"),s.t("show-active-tickets.acquire-ticket"),h({hidden:this.isLoading()}),h({hidden:this.loading}),o,h({hidden:!this.loading&&!this.loadingTickets}),s.t("loading-message"),h({hidden:!this.ticketLoading}),s.t("loading-message-ticket"),h({hidden:this.ticketLoading}),s.t("show-ticket-title"),this.locationName,h({hidden:!this.showReloadButton}),s.t("reload-failed"),(()=>{this.updateTicketAndNotify()}),s.t("reload"),s.t("reload"),h({filterGrayscale:this.forceTicketGrayscale,filterNone:!this.forceTicketGrayscale}),this.ticketImage||"",s.t("image-alt-text"),null!=r?r:d(e||(e=n``)),a,(()=>{this.closeDialog()}),s.t("file-sink.modal-close"))}}function $(){return u(i||(i=n`
.no-tickets {
display: flex;
flex-direction: column;
row-gap: 2em;
}
.ticket {
display: flex;
justify-content: space-between;
column-gap: 15px;
row-gap: 1.5em;
margin-bottom: 2em;
padding: 1.25rem 1.5rem 1.25rem 1.5rem;
border: var(--dbp-border);
border-radius: var(--dbp-border-radius);
}
.tickets {
margin-top: 2.3em;
}
.header {
display: grid;
align-items: center;
grid-row-gap: 4px;
}
.btn {
display: flex;
justify-content: space-between;
column-gap: 0.5em;
align-items: start;
}
.filterNone {
filter: none;
transition-duration: 0.5s;
}
.filterGrayscale {
filter: grayscale(100%);
transition-duration: 0.5s;
}
#ticket-modal-box {
display: flex;
flex-direction: column;
padding: 0px;
min-width: 700px;
max-width: 880px;
min-height: unset;
height: auto;
}
.proof-container,
.information-container {
border: var(--dbp-border);
border-color: var(--dbp-info-surface-border-color);
background-color: var(--dbp-info-surface);
color: var(--dbp-on-info-surface);
padding: 40px 10px;
display: flex;
flex-direction: column;
justify-content: space-evenly;
align-items: center;
text-align: center;
}
.proof-container {
text-align: center;
}
.proof-container .int-link-external,
.proof-container .int-link-internal,
.information-container .int-link-internal,
.information-container .int-link-external {
border: var(--dbp-border);
border-color: var(--dbp-info-surface-border-color);
background-color: var(--dbp-info-surface);
color: var(--dbp-on-info-surface);
}
.proof-container .int-link-external::after,
.information-container .int-link-external::after {
filter: invert(100%);
-webkit-filter: invert(100%);
}
.foto-container {
width: 80%;
}
.foto-container img {
width: 100%;
display: block;
}
.left-container h3,
.proof-container h4,
.information-container h4 {
margin: 0px 0px 10px 0px;
line-height: 30px;
}
.left-container {
display: flex;
flex-direction: column;
align-items: center;
padding: 40px 10px;
justify-content: space-evenly;
}
.content-wrapper {
padding-right: 44px;
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 10px;
grid-auto-rows: 100%;
}
.modal-close {
position: absolute;
right: 10px;
top: 5px;
}
.ticket h3 {
margin-bottom: 0.2rem;
}
.ticket-loading {
font-size: 1.3rem;
}
.reload-failed {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 1em;
}
.reload-failed p {
color: var(--dbp-danger);
margin-top: 0px;
margin-bottom: 0px;
}
#reload-btn {
margin-left: 10px;
}
.hidden {
display: none;
}
only screen and (orientation: landscape) and (max-width: 768px) {
#ticket-modal-box {
height: 100%;
width: 100%;
max-width: unset;
max-height: unset;
}
#ticket-modal-content,
#ticket-modal-content > div:first-of-type,
.content-wrapper {
height: 100%;
}
.left-container,
.proof-container,
.information-container {
justify-content: space-evenly;
}
}
only screen and (orientation: portrait) and (max-width: 768px) {
.create-ticket-button {
display: flex;
flex-direction: column;
min-height: 24px;
}
.no-tickets {
justify-content: space-between;
align-items: normal;
row-gap: 1.5em;
margin-top: 2.3em;
}
.ticket {
display: block;
margin-bottom: 0;
}
.tickets {
display: block;
}
.header {
margin-bottom: 0.5rem;
}
.btn {
flex-direction: column;
align-items: normal;
row-gap: 1em;
padding-top: 0.5em;
}
.loading {
justify-content: center;
}
#ticket-modal-box {
width: 100%;
height: 100%;
min-width: 100%;
min-height: 100%;
padding: 0px;
}
.left-container {
padding: 11px 20px 20px 20px;
}
.foto-container {
width: 100%;
}
.content-wrapper {
display: flex;
flex-direction: column;
padding: 0px;
grid-gap: inherit;
min-height: 100vh;
}
.proof-container,
.information-container {
padding: 12px 20px 20px 20px;
flex-grow: 1;
}
.reload-failed {
width: 90%;
}
}
`))}export{E as D,$ as g};
//# sourceMappingURL=dbp-greenlight-ticket-lit-element.6a6b9129.es.js.map