From fd841033034856b331fa5118d229f103e5ba538f Mon Sep 17 00:00:00 2001 From: Phil Ricketts <812139+replete@users.noreply.github.com> Date: Fri, 20 Sep 2024 17:10:05 +0100 Subject: [PATCH] Optimize event handlers for performance and filesize --- dist/biscuitman-legacy.js | 11 +++++------ dist/biscuitman-legacy.min.js | 2 +- dist/biscuitman-legacy.withcss.js | 11 +++++------ dist/biscuitman-legacy.withcss.min.js | 2 +- dist/biscuitman.js | 9 +++++---- dist/biscuitman.min.js | 2 +- dist/biscuitman.withcss.js | 9 +++++---- dist/biscuitman.withcss.min.js | 2 +- dist/esm/biscuitman.min.mjs | 2 +- dist/esm/biscuitman.mjs | 26 ++++++++++++------------- dist/esm/biscuitman.withcss.min.mjs | 2 +- dist/esm/biscuitman.withcss.mjs | 26 ++++++++++++------------- src/biscuitman.js | 11 ++++++----- src/biscuitman.mjs | 28 +++++++++++++-------------- 14 files changed, 72 insertions(+), 71 deletions(-) diff --git a/dist/biscuitman-legacy.js b/dist/biscuitman-legacy.js index 4804dbd..7b97541 100644 --- a/dist/biscuitman-legacy.js +++ b/dist/biscuitman-legacy.js @@ -704,8 +704,12 @@ saveConsents(false); } }; + ui.onchange = function (e) { + if (!e.target.dataset.s) return; + e.target.parentElement.classList.toggle('checked', e.target.checked); + }; dialog = ui.querySelector('dialog'); - if (o.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (o.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = function () { return dispatch('close'); }; @@ -717,11 +721,6 @@ return e.key === 'Escape' ? e.preventDefault() : null; }; } - ui.querySelectorAll('[data-s]').forEach(function (checkbox) { - return checkbox.addEventListener('change', function (e) { - checkbox.parentElement.classList.toggle('checked', e.target.checked); - }); - }); d.body.appendChild(ui); w.addEventListener('resize', updateBannerHeight); } diff --git a/dist/biscuitman-legacy.min.js b/dist/biscuitman-legacy.min.js index c1f5cc4..b4c1c3f 100644 --- a/dist/biscuitman-legacy.min.js +++ b/dist/biscuitman-legacy.min.js @@ -1 +1 @@ -/*! biscuitman-legacy.js 0.5.0 */!function(){"use strict";if(Object.entries=Object.entries?Object.entries:function(t){var e=Object.prototype.toString.call(t);if(null==t)throw TypeError("Cannot convert undefined or null to object");if(!~["[object String]","[object Object]","[object Array]","[object Function]"].indexOf(e))return[];if(Object.keys)return Object.keys(t).map(function(e){return[e,t[e]]});var n=[];for(var r in t)t.hasOwnProperty(r)&&n.push([r,t[r]]);return"[object Array]"===e?n:n.sort(function(t,e){return t[1]-e[1]})},Array.prototype.forEach||(Array.prototype.forEach=function(t,e){var n,r;for(n=0,r=this.length;nthis.length)&&(e=this.length),this.substring(e-t.length,e)===t}),String.prototype.startsWith||(String.prototype.startsWith=function(t,e){return e=e||0,this.substring(e,e+t.length)===t}),function(){if("undefined"!=typeof window)try{var t=new window.CustomEvent("test",{cancelable:!0});if(t.preventDefault(),!0!==t.defaultPrevented)throw Error("Could not prevent default")}catch(t){var e=function(t,e){var n,r,o={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(o[i]=e[i]);return o.bubbles=!!o.bubbles,o.cancelable=!!o.cancelable,(n=document.createEvent("CustomEvent")).initCustomEvent(t,o.bubbles,o.cancelable,o.detail),r=n.preventDefault,n.preventDefault=function(){r.call(this);try{Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}})}catch(t){this.defaultPrevented=!0}},n};e.prototype=window.Event.prototype,window.CustomEvent=e}}(),Array.from=Array.from||function(t,e,n){var r=[],o=[],i=0;for(window.Set&&t instanceof Set&&(t.forEach(function(t){o.push(t)}),t=o);i\ndetails, summary {\n display: block;\n}\ndetails:not([open]) > *:not(summary) {\n display: none;\n}\nsummary::before {\n content: "►";\n padding-right: 0.3rem;\n font-size: 0.6rem;\n cursor: default;\n}\n[open] > summary::before {\n content: "▼";\n}\n'),e=(t=document.createElement("details").constructor.prototype).setAttribute,n=t.removeAttribute,r=Object.getOwnPropertyDescriptor(t,"open"),Object.defineProperties(t,{open:{get:function(){return"DETAILS"==this.tagName?this.hasAttribute("open"):r&&r.get?r.get.call(this):void 0},set:function(t){return"DETAILS"==this.tagName?t?this.setAttribute("open",""):this.removeAttribute("open"):r&&r.set?r.set.call(this,t):void 0}},setAttribute:{value:function(t,n){var r=this,o=function(){return e.call(r,t,n)};if("open"==t&&"DETAILS"==this.tagName){var i=this.hasAttribute("open"),a=o();if(!i){var c=this.querySelector("summary");c&&c.setAttribute("aria-expanded",!0),p(this)}return a}return o()}},removeAttribute:{value:function(t){var e=this,r=function(){return n.call(e,t)};if("open"==t&&"DETAILS"==this.tagName){var o=this.hasAttribute("open"),i=r();if(o){var a=this.querySelector("summary");a&&a.setAttribute("aria-expanded",!1),p(this)}return i}return r()}}}),d(function(t){t.hasAttribute("open")?t.removeAttribute("open"):t.setAttribute("open","")}),u(document),window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){l.call(t.addedNodes,u)})}).observe(document.documentElement,{subtree:!0,childList:!0}):document.addEventListener("DOMNodeInserted",function(t){u(t.target)})),a.open&&!a.toggle&&(window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){var e=t.target,n=t.attributeName;"DETAILS"==e.tagName&&"open"==n&&p(e)})}).observe(document.documentElement,{attributes:!0,subtree:!0}):d(function(t){var e=t.getAttribute("open");setTimeout(function(){e!=t.getAttribute("open")&&p(t)},1)}))}(),Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(this==null)throw TypeError('"this" is null or not defined');var n,r=Object(this),o=r.length>>>0;if(0===o)return!1;for(var i=0|e,a=Math.max(i>=0?i:o-Math.abs(i),0);at.length)&&(e=t.length);for(var n=0,r=Array(e);n\n".concat(u.title,"\n

").concat(u.message,"

\n\n\n\n
\n").concat(u.settingsTitle,"\n\n
\n

").concat(u.message,"

\n

").concat(u.info.split("\n").map(function(t,e,n){return"".concat(t,"\n").concat(n.length>1&&u.enableMore&&0==e?"".concat(u.more,""):"")}).join(""),"\n

\n").concat(u.sections.map(function(t){var e=v()[t],n="essential"===t,r=n?"disabled":"",o=n?"checked":"";void 0!==e&&(o=e?"checked":"");var c=u["".concat(t,"Cookies")];return"\n
\n
\n\n".concat(u["".concat(t,"Title")],"\n\n

').concat(u["".concat(t,"Message")],"

\n\n").concat(c?a.entries(c).map(function(t){var e=i(t,2),n=e[0],r=e[1];return"
".concat(n,"
").concat(r,"
")}).join(""):"
".concat(u.noCookies,"
"),"\n
\n
")}).join(""),"\n
\n\n
\n").replaceAll("{link}",'').concat(u.linkText,"")),f.onclick=function(t){var e=t.target.dataset.id;if(e)switch(y("button",{id:e}),e){case"more":t.target.remove();break;case"accept":j(!0);break;case"close":s.close();break;case"settings":m();break;case"save":j();break;case"reject":j(!1)}},s=f.querySelector("dialog"),(!u.dialogPolyfill||s.close)&&s.showModal||function(e){function n(){t.documentElement.classList.add("bm-dialog-polyfill"),r.dialogPolyfill.registerDialog(e)}if(r.dialogPolyfill)n();else{var o=t.createElement("script");o.onload=n,o.src=u.dialogPolyfill,t.head.appendChild(o)}}(s),s.onclose=function(){return y("close")},u.force&&(s.oncancel=function(t){return t.preventDefault()},s.onkeydown=function(t){return"Escape"===t.key?t.preventDefault():null}),f.querySelectorAll("[data-s]").forEach(function(t){return t.addEventListener("change",function(e){t.parentElement.classList.toggle("checked",e.target.checked)})}),t.body.appendChild(f),r.addEventListener("resize",d),S(),r[u.global].consentTime?(p(!1),O()):(p(!0),u.force&&m()),r.bmInvalidate=function(){y("invalidate",{data:v()}),h({}),j(!1),g({}),localStorage.removeItem(u.key),p(!0),u.force&&s.showModal()},r.bmUpdate=function(){y("update",{data:v()}),m()}}(document,window,Object,document.documentElement)}(); \ No newline at end of file +/*! biscuitman-legacy.js 0.5.0 */!function(){"use strict";if(Object.entries=Object.entries?Object.entries:function(t){var e=Object.prototype.toString.call(t);if(null==t)throw TypeError("Cannot convert undefined or null to object");if(!~["[object String]","[object Object]","[object Array]","[object Function]"].indexOf(e))return[];if(Object.keys)return Object.keys(t).map(function(e){return[e,t[e]]});var n=[];for(var r in t)t.hasOwnProperty(r)&&n.push([r,t[r]]);return"[object Array]"===e?n:n.sort(function(t,e){return t[1]-e[1]})},Array.prototype.forEach||(Array.prototype.forEach=function(t,e){var n,r;for(n=0,r=this.length;nthis.length)&&(e=this.length),this.substring(e-t.length,e)===t}),String.prototype.startsWith||(String.prototype.startsWith=function(t,e){return e=e||0,this.substring(e,e+t.length)===t}),function(){if("undefined"!=typeof window)try{var t=new window.CustomEvent("test",{cancelable:!0});if(t.preventDefault(),!0!==t.defaultPrevented)throw Error("Could not prevent default")}catch(t){var e=function(t,e){var n,r,o={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(o[i]=e[i]);return o.bubbles=!!o.bubbles,o.cancelable=!!o.cancelable,(n=document.createEvent("CustomEvent")).initCustomEvent(t,o.bubbles,o.cancelable,o.detail),r=n.preventDefault,n.preventDefault=function(){r.call(this);try{Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}})}catch(t){this.defaultPrevented=!0}},n};e.prototype=window.Event.prototype,window.CustomEvent=e}}(),Array.from=Array.from||function(t,e,n){var r=[],o=[],i=0;for(window.Set&&t instanceof Set&&(t.forEach(function(t){o.push(t)}),t=o);i\ndetails, summary {\n display: block;\n}\ndetails:not([open]) > *:not(summary) {\n display: none;\n}\nsummary::before {\n content: "►";\n padding-right: 0.3rem;\n font-size: 0.6rem;\n cursor: default;\n}\n[open] > summary::before {\n content: "▼";\n}\n'),e=(t=document.createElement("details").constructor.prototype).setAttribute,n=t.removeAttribute,r=Object.getOwnPropertyDescriptor(t,"open"),Object.defineProperties(t,{open:{get:function(){return"DETAILS"==this.tagName?this.hasAttribute("open"):r&&r.get?r.get.call(this):void 0},set:function(t){return"DETAILS"==this.tagName?t?this.setAttribute("open",""):this.removeAttribute("open"):r&&r.set?r.set.call(this,t):void 0}},setAttribute:{value:function(t,n){var r=this,o=function(){return e.call(r,t,n)};if("open"==t&&"DETAILS"==this.tagName){var i=this.hasAttribute("open"),a=o();if(!i){var c=this.querySelector("summary");c&&c.setAttribute("aria-expanded",!0),p(this)}return a}return o()}},removeAttribute:{value:function(t){var e=this,r=function(){return n.call(e,t)};if("open"==t&&"DETAILS"==this.tagName){var o=this.hasAttribute("open"),i=r();if(o){var a=this.querySelector("summary");a&&a.setAttribute("aria-expanded",!1),p(this)}return i}return r()}}}),d(function(t){t.hasAttribute("open")?t.removeAttribute("open"):t.setAttribute("open","")}),u(document),window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){l.call(t.addedNodes,u)})}).observe(document.documentElement,{subtree:!0,childList:!0}):document.addEventListener("DOMNodeInserted",function(t){u(t.target)})),a.open&&!a.toggle&&(window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){var e=t.target,n=t.attributeName;"DETAILS"==e.tagName&&"open"==n&&p(e)})}).observe(document.documentElement,{attributes:!0,subtree:!0}):d(function(t){var e=t.getAttribute("open");setTimeout(function(){e!=t.getAttribute("open")&&p(t)},1)}))}(),Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(this==null)throw TypeError('"this" is null or not defined');var n,r=Object(this),o=r.length>>>0;if(0===o)return!1;for(var i=0|e,a=Math.max(i>=0?i:o-Math.abs(i),0);at.length)&&(e=t.length);for(var n=0,r=Array(e);n\n".concat(u.title,"\n

").concat(u.message,"

\n\n\n\n
\n").concat(u.settingsTitle,"\n\n
\n

").concat(u.message,"

\n

").concat(u.info.split("\n").map(function(t,e,n){return"".concat(t,"\n").concat(n.length>1&&u.enableMore&&0==e?"".concat(u.more,""):"")}).join(""),"\n

\n").concat(u.sections.map(function(t){var e=v()[t],n="essential"===t,r=n?"disabled":"",o=n?"checked":"";void 0!==e&&(o=e?"checked":"");var c=u["".concat(t,"Cookies")];return"\n
\n
\n\n".concat(u["".concat(t,"Title")],"\n\n

').concat(u["".concat(t,"Message")],"

\n\n").concat(c?a.entries(c).map(function(t){var e=i(t,2),n=e[0],r=e[1];return"
".concat(n,"
").concat(r,"
")}).join(""):"
".concat(u.noCookies,"
"),"\n
\n
")}).join(""),"\n
\n\n
\n").replaceAll("{link}",'').concat(u.linkText,"")),f.onclick=function(t){var e=t.target.dataset.id;if(e)switch(y("button",{id:e}),e){case"more":t.target.remove();break;case"accept":j(!0);break;case"close":s.close();break;case"settings":m();break;case"save":j();break;case"reject":j(!1)}},f.onchange=function(t){t.target.dataset.s&&t.target.parentElement.classList.toggle("checked",t.target.checked)},s=f.querySelector("dialog"),u.dialogPolyfill&&!s.close&&function(e){function n(){t.documentElement.classList.add("bm-dialog-polyfill"),r.dialogPolyfill.registerDialog(e)}if(r.dialogPolyfill)n();else{var o=t.createElement("script");o.onload=n,o.src=u.dialogPolyfill,t.head.appendChild(o)}}(s),s.onclose=function(){return y("close")},u.force&&(s.oncancel=function(t){return t.preventDefault()},s.onkeydown=function(t){return"Escape"===t.key?t.preventDefault():null}),t.body.appendChild(f),r.addEventListener("resize",d),S(),r[u.global].consentTime?(p(!1),O()):(p(!0),u.force&&m()),r.bmInvalidate=function(){y("invalidate",{data:v()}),h({}),j(!1),g({}),localStorage.removeItem(u.key),p(!0),u.force&&s.showModal()},r.bmUpdate=function(){y("update",{data:v()}),m()}}(document,window,Object,document.documentElement)}(); \ No newline at end of file diff --git a/dist/biscuitman-legacy.withcss.js b/dist/biscuitman-legacy.withcss.js index 7b96407..09572cc 100644 --- a/dist/biscuitman-legacy.withcss.js +++ b/dist/biscuitman-legacy.withcss.js @@ -704,8 +704,12 @@ saveConsents(false); } }; + ui.onchange = function (e) { + if (!e.target.dataset.s) return; + e.target.parentElement.classList.toggle('checked', e.target.checked); + }; dialog = ui.querySelector('dialog'); - if (o.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (o.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = function () { return dispatch('close'); }; @@ -717,11 +721,6 @@ return e.key === 'Escape' ? e.preventDefault() : null; }; } - ui.querySelectorAll('[data-s]').forEach(function (checkbox) { - return checkbox.addEventListener('change', function (e) { - checkbox.parentElement.classList.toggle('checked', e.target.checked); - }); - }); d.body.appendChild(ui); w.addEventListener('resize', updateBannerHeight); } diff --git a/dist/biscuitman-legacy.withcss.min.js b/dist/biscuitman-legacy.withcss.min.js index 7897113..0176c29 100644 --- a/dist/biscuitman-legacy.withcss.min.js +++ b/dist/biscuitman-legacy.withcss.min.js @@ -1 +1 @@ -/*! biscuitman-legacy.js 0.5.0 */!function(){"use strict";if(Object.entries=Object.entries?Object.entries:function(t){var e=Object.prototype.toString.call(t);if(null==t)throw TypeError("Cannot convert undefined or null to object");if(!~["[object String]","[object Object]","[object Array]","[object Function]"].indexOf(e))return[];if(Object.keys)return Object.keys(t).map(function(e){return[e,t[e]]});var n=[];for(var r in t)t.hasOwnProperty(r)&&n.push([r,t[r]]);return"[object Array]"===e?n:n.sort(function(t,e){return t[1]-e[1]})},Array.prototype.forEach||(Array.prototype.forEach=function(t,e){var n,r;for(n=0,r=this.length;nthis.length)&&(e=this.length),this.substring(e-t.length,e)===t}),String.prototype.startsWith||(String.prototype.startsWith=function(t,e){return e=e||0,this.substring(e,e+t.length)===t}),function(){if("undefined"!=typeof window)try{var t=new window.CustomEvent("test",{cancelable:!0});if(t.preventDefault(),!0!==t.defaultPrevented)throw Error("Could not prevent default")}catch(t){var e=function(t,e){var n,r,o={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(o[i]=e[i]);return o.bubbles=!!o.bubbles,o.cancelable=!!o.cancelable,(n=document.createEvent("CustomEvent")).initCustomEvent(t,o.bubbles,o.cancelable,o.detail),r=n.preventDefault,n.preventDefault=function(){r.call(this);try{Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}})}catch(t){this.defaultPrevented=!0}},n};e.prototype=window.Event.prototype,window.CustomEvent=e}}(),Array.from=Array.from||function(t,e,n){var r=[],o=[],i=0;for(window.Set&&t instanceof Set&&(t.forEach(function(t){o.push(t)}),t=o);i\ndetails, summary {\n display: block;\n}\ndetails:not([open]) > *:not(summary) {\n display: none;\n}\nsummary::before {\n content: "►";\n padding-right: 0.3rem;\n font-size: 0.6rem;\n cursor: default;\n}\n[open] > summary::before {\n content: "▼";\n}\n'),e=(t=document.createElement("details").constructor.prototype).setAttribute,n=t.removeAttribute,r=Object.getOwnPropertyDescriptor(t,"open"),Object.defineProperties(t,{open:{get:function(){return"DETAILS"==this.tagName?this.hasAttribute("open"):r&&r.get?r.get.call(this):void 0},set:function(t){return"DETAILS"==this.tagName?t?this.setAttribute("open",""):this.removeAttribute("open"):r&&r.set?r.set.call(this,t):void 0}},setAttribute:{value:function(t,n){var r=this,o=function(){return e.call(r,t,n)};if("open"==t&&"DETAILS"==this.tagName){var i=this.hasAttribute("open"),a=o();if(!i){var c=this.querySelector("summary");c&&c.setAttribute("aria-expanded",!0),p(this)}return a}return o()}},removeAttribute:{value:function(t){var e=this,r=function(){return n.call(e,t)};if("open"==t&&"DETAILS"==this.tagName){var o=this.hasAttribute("open"),i=r();if(o){var a=this.querySelector("summary");a&&a.setAttribute("aria-expanded",!1),p(this)}return i}return r()}}}),d(function(t){t.hasAttribute("open")?t.removeAttribute("open"):t.setAttribute("open","")}),u(document),window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){l.call(t.addedNodes,u)})}).observe(document.documentElement,{subtree:!0,childList:!0}):document.addEventListener("DOMNodeInserted",function(t){u(t.target)})),a.open&&!a.toggle&&(window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){var e=t.target,n=t.attributeName;"DETAILS"==e.tagName&&"open"==n&&p(e)})}).observe(document.documentElement,{attributes:!0,subtree:!0}):d(function(t){var e=t.getAttribute("open");setTimeout(function(){e!=t.getAttribute("open")&&p(t)},1)}))}(),Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(this==null)throw TypeError('"this" is null or not defined');var n,r=Object(this),o=r.length>>>0;if(0===o)return!1;for(var i=0|e,a=Math.max(i>=0?i:o-Math.abs(i),0);at.length)&&(e=t.length);for(var n=0,r=Array(e);n\n".concat(u.title,"\n

").concat(u.message,"

\n\n\n\n
\n").concat(u.settingsTitle,"\n\n
\n

").concat(u.message,"

\n

").concat(u.info.split("\n").map(function(t,e,n){return"".concat(t,"\n").concat(n.length>1&&u.enableMore&&0==e?"".concat(u.more,""):"")}).join(""),"\n

\n").concat(u.sections.map(function(t){var e=v()[t],n="essential"===t,r=n?"disabled":"",o=n?"checked":"";void 0!==e&&(o=e?"checked":"");var c=u["".concat(t,"Cookies")];return"\n
\n
\n\n".concat(u["".concat(t,"Title")],"\n\n

').concat(u["".concat(t,"Message")],"

\n\n").concat(c?a.entries(c).map(function(t){var e=i(t,2),n=e[0],r=e[1];return"
".concat(n,"
").concat(r,"
")}).join(""):"
".concat(u.noCookies,"
"),"\n
\n
")}).join(""),"\n
\n\n
\n").replaceAll("{link}",'').concat(u.linkText,"")),f.onclick=function(t){var e=t.target.dataset.id;if(e)switch(y("button",{id:e}),e){case"more":t.target.remove();break;case"accept":j(!0);break;case"close":s.close();break;case"settings":m();break;case"save":j();break;case"reject":j(!1)}},s=f.querySelector("dialog"),(!u.dialogPolyfill||s.close)&&s.showModal||function(e){function n(){t.documentElement.classList.add("bm-dialog-polyfill"),r.dialogPolyfill.registerDialog(e)}if(r.dialogPolyfill)n();else{var o=t.createElement("script");o.onload=n,o.src=u.dialogPolyfill,t.head.appendChild(o)}}(s),s.onclose=function(){return y("close")},u.force&&(s.oncancel=function(t){return t.preventDefault()},s.onkeydown=function(t){return"Escape"===t.key?t.preventDefault():null}),f.querySelectorAll("[data-s]").forEach(function(t){return t.addEventListener("change",function(e){t.parentElement.classList.toggle("checked",e.target.checked)})}),t.body.appendChild(f),r.addEventListener("resize",d),S(),r[u.global].consentTime?(p(!1),O()):(p(!0),u.force&&m()),r.bmInvalidate=function(){y("invalidate",{data:v()}),h({}),j(!1),g({}),localStorage.removeItem(u.key),p(!0),u.force&&s.showModal()},r.bmUpdate=function(){y("update",{data:v()}),m()}}(document,window,Object,document.documentElement)}();;(function(d){var c=d.createElement('style');c.textContent='/*! biscuitman-legacy.js 0.5.0 *//*! biscuitman-legacy.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;-moz-box-sizing:border-box;box-sizing:border-box;z-index:3;background:#fff;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px rgba(0,0,0,.16)}.bm-show .biscuitman{display:block}.biscuitman *{-moz-box-sizing:border-box;box-sizing:border-box;color:#444;margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){-webkit-transform:translateY(100%);transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;-webkit-transform:translateY(50%);transform:translateY(50%)}}.biscuitman article p{color:#444;margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{color:#105d89;cursor:pointer;background:#fff;border:2px solid #105d89;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:#105d89;color:#fff!important}.biscuitman button[data-id=close]{color:rgba(0,0,0,.5);opacity:.6;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{-webkit-flex-direction:row-reverse;flex-direction:row-reverse;gap:10px;width:100%;display:-webkit-flex;display:flex}.biscuitman nav button{-webkit-flex-grow:1;flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{-webkit-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;flex-grow:1;display:-webkit-flex;display:flex}}.biscuitman dialog{background:#fff;border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px rgba(0,0,0,.3)}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{-webkit-flex-direction:column;flex-direction:column;height:100%;padding:20px;display:-webkit-flex;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(#fff 20%,rgba(255,255,255,0));width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";pointer-events:none;background:linear-gradient(rgba(255,255,255,0),#fff 80%);width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(0,0,0,.2) #fff;-webkit-flex-shrink:1;flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:#105d89;cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(0,0,0,.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px rgba(0,0,0,.1)}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;-webkit-transform:rotate(45deg)scale(.3);transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;-webkit-flex-direction:column;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:-webkit-flex;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(0,0,0,.4);border-color:transparent rgba(0,0,0,.4) rgba(0,0,0,.4) transparent;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;-webkit-transform:rotate(-45deg)scale(.3);transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:#444;font-size:14px}.biscuitman summary>*{display:-webkit-inline-flex;display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(0,0,0,.08);margin:10px;padding:10px;display:-webkit-flex;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:#444;font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;background-color:rgba(0,0,0,.3);border-radius:1.2em;width:2.3em;height:1.2em;margin-top:-2px;display:block;position:absolute;top:50%;right:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";-webkit-transform-origin:50%;transform-origin:50%;background:#fff;border-radius:100%;width:1.2em;height:1.2em;display:block;position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%)scale(.8);transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:#105d89}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}';d.head.appendChild(c)})(document); \ No newline at end of file +/*! biscuitman-legacy.js 0.5.0 */!function(){"use strict";if(Object.entries=Object.entries?Object.entries:function(t){var e=Object.prototype.toString.call(t);if(null==t)throw TypeError("Cannot convert undefined or null to object");if(!~["[object String]","[object Object]","[object Array]","[object Function]"].indexOf(e))return[];if(Object.keys)return Object.keys(t).map(function(e){return[e,t[e]]});var n=[];for(var r in t)t.hasOwnProperty(r)&&n.push([r,t[r]]);return"[object Array]"===e?n:n.sort(function(t,e){return t[1]-e[1]})},Array.prototype.forEach||(Array.prototype.forEach=function(t,e){var n,r;for(n=0,r=this.length;nthis.length)&&(e=this.length),this.substring(e-t.length,e)===t}),String.prototype.startsWith||(String.prototype.startsWith=function(t,e){return e=e||0,this.substring(e,e+t.length)===t}),function(){if("undefined"!=typeof window)try{var t=new window.CustomEvent("test",{cancelable:!0});if(t.preventDefault(),!0!==t.defaultPrevented)throw Error("Could not prevent default")}catch(t){var e=function(t,e){var n,r,o={};if(null!=e)for(var i in e)Object.prototype.hasOwnProperty.call(e,i)&&(o[i]=e[i]);return o.bubbles=!!o.bubbles,o.cancelable=!!o.cancelable,(n=document.createEvent("CustomEvent")).initCustomEvent(t,o.bubbles,o.cancelable,o.detail),r=n.preventDefault,n.preventDefault=function(){r.call(this);try{Object.defineProperty(this,"defaultPrevented",{get:function(){return!0}})}catch(t){this.defaultPrevented=!0}},n};e.prototype=window.Event.prototype,window.CustomEvent=e}}(),Array.from=Array.from||function(t,e,n){var r=[],o=[],i=0;for(window.Set&&t instanceof Set&&(t.forEach(function(t){o.push(t)}),t=o);i\ndetails, summary {\n display: block;\n}\ndetails:not([open]) > *:not(summary) {\n display: none;\n}\nsummary::before {\n content: "►";\n padding-right: 0.3rem;\n font-size: 0.6rem;\n cursor: default;\n}\n[open] > summary::before {\n content: "▼";\n}\n'),e=(t=document.createElement("details").constructor.prototype).setAttribute,n=t.removeAttribute,r=Object.getOwnPropertyDescriptor(t,"open"),Object.defineProperties(t,{open:{get:function(){return"DETAILS"==this.tagName?this.hasAttribute("open"):r&&r.get?r.get.call(this):void 0},set:function(t){return"DETAILS"==this.tagName?t?this.setAttribute("open",""):this.removeAttribute("open"):r&&r.set?r.set.call(this,t):void 0}},setAttribute:{value:function(t,n){var r=this,o=function(){return e.call(r,t,n)};if("open"==t&&"DETAILS"==this.tagName){var i=this.hasAttribute("open"),a=o();if(!i){var c=this.querySelector("summary");c&&c.setAttribute("aria-expanded",!0),p(this)}return a}return o()}},removeAttribute:{value:function(t){var e=this,r=function(){return n.call(e,t)};if("open"==t&&"DETAILS"==this.tagName){var o=this.hasAttribute("open"),i=r();if(o){var a=this.querySelector("summary");a&&a.setAttribute("aria-expanded",!1),p(this)}return i}return r()}}}),d(function(t){t.hasAttribute("open")?t.removeAttribute("open"):t.setAttribute("open","")}),u(document),window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){l.call(t.addedNodes,u)})}).observe(document.documentElement,{subtree:!0,childList:!0}):document.addEventListener("DOMNodeInserted",function(t){u(t.target)})),a.open&&!a.toggle&&(window.MutationObserver?new MutationObserver(function(t){l.call(t,function(t){var e=t.target,n=t.attributeName;"DETAILS"==e.tagName&&"open"==n&&p(e)})}).observe(document.documentElement,{attributes:!0,subtree:!0}):d(function(t){var e=t.getAttribute("open");setTimeout(function(){e!=t.getAttribute("open")&&p(t)},1)}))}(),Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(t,e){if(this==null)throw TypeError('"this" is null or not defined');var n,r=Object(this),o=r.length>>>0;if(0===o)return!1;for(var i=0|e,a=Math.max(i>=0?i:o-Math.abs(i),0);at.length)&&(e=t.length);for(var n=0,r=Array(e);n\n".concat(u.title,"\n

").concat(u.message,"

\n\n\n\n
\n").concat(u.settingsTitle,"\n\n
\n

").concat(u.message,"

\n

").concat(u.info.split("\n").map(function(t,e,n){return"".concat(t,"\n").concat(n.length>1&&u.enableMore&&0==e?"".concat(u.more,""):"")}).join(""),"\n

\n").concat(u.sections.map(function(t){var e=v()[t],n="essential"===t,r=n?"disabled":"",o=n?"checked":"";void 0!==e&&(o=e?"checked":"");var c=u["".concat(t,"Cookies")];return"\n
\n
\n\n".concat(u["".concat(t,"Title")],"\n\n

').concat(u["".concat(t,"Message")],"

\n\n").concat(c?a.entries(c).map(function(t){var e=i(t,2),n=e[0],r=e[1];return"
".concat(n,"
").concat(r,"
")}).join(""):"
".concat(u.noCookies,"
"),"\n
\n
")}).join(""),"\n
\n\n
\n").replaceAll("{link}",'').concat(u.linkText,"")),f.onclick=function(t){var e=t.target.dataset.id;if(e)switch(y("button",{id:e}),e){case"more":t.target.remove();break;case"accept":j(!0);break;case"close":s.close();break;case"settings":m();break;case"save":j();break;case"reject":j(!1)}},f.onchange=function(t){t.target.dataset.s&&t.target.parentElement.classList.toggle("checked",t.target.checked)},s=f.querySelector("dialog"),u.dialogPolyfill&&!s.close&&function(e){function n(){t.documentElement.classList.add("bm-dialog-polyfill"),r.dialogPolyfill.registerDialog(e)}if(r.dialogPolyfill)n();else{var o=t.createElement("script");o.onload=n,o.src=u.dialogPolyfill,t.head.appendChild(o)}}(s),s.onclose=function(){return y("close")},u.force&&(s.oncancel=function(t){return t.preventDefault()},s.onkeydown=function(t){return"Escape"===t.key?t.preventDefault():null}),t.body.appendChild(f),r.addEventListener("resize",d),S(),r[u.global].consentTime?(p(!1),O()):(p(!0),u.force&&m()),r.bmInvalidate=function(){y("invalidate",{data:v()}),h({}),j(!1),g({}),localStorage.removeItem(u.key),p(!0),u.force&&s.showModal()},r.bmUpdate=function(){y("update",{data:v()}),m()}}(document,window,Object,document.documentElement)}();;(function(d){var c=d.createElement('style');c.textContent='/*! biscuitman-legacy.js 0.5.0 *//*! biscuitman-legacy.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;-moz-box-sizing:border-box;box-sizing:border-box;z-index:3;background:#fff;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px rgba(0,0,0,.16)}.bm-show .biscuitman{display:block}.biscuitman *{-moz-box-sizing:border-box;box-sizing:border-box;color:#444;margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){-webkit-transform:translateY(100%);transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;-webkit-transform:translateY(50%);transform:translateY(50%)}}.biscuitman article p{color:#444;margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{color:#105d89;cursor:pointer;background:#fff;border:2px solid #105d89;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:#105d89;color:#fff!important}.biscuitman button[data-id=close]{color:rgba(0,0,0,.5);opacity:.6;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{-webkit-flex-direction:row-reverse;flex-direction:row-reverse;gap:10px;width:100%;display:-webkit-flex;display:flex}.biscuitman nav button{-webkit-flex-grow:1;flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{-webkit-flex-direction:column;flex-direction:column;-webkit-flex-grow:1;flex-grow:1;display:-webkit-flex;display:flex}}.biscuitman dialog{background:#fff;border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px rgba(0,0,0,.3)}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{-webkit-flex-direction:column;flex-direction:column;height:100%;padding:20px;display:-webkit-flex;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";pointer-events:none;z-index:1;background:linear-gradient(#fff 20%,rgba(255,255,255,0));width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";pointer-events:none;background:linear-gradient(rgba(255,255,255,0),#fff 80%);width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(0,0,0,.2) #fff;-webkit-flex-shrink:1;flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:#105d89;cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(0,0,0,.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px rgba(0,0,0,.1)}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;-webkit-transform:rotate(45deg)scale(.3);transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;-webkit-flex-direction:column;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:-webkit-flex;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(0,0,0,.4);border-color:transparent rgba(0,0,0,.4) rgba(0,0,0,.4) transparent;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;-webkit-transform:rotate(-45deg)scale(.3);transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:#444;font-size:14px}.biscuitman summary>*{display:-webkit-inline-flex;display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(0,0,0,.08);margin:10px;padding:10px;display:-webkit-flex;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:#444;font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;background-color:rgba(0,0,0,.3);border-radius:1.2em;width:2.3em;height:1.2em;margin-top:-2px;display:block;position:absolute;top:50%;right:20px;-webkit-transform:translateY(-50%);transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";-webkit-transform-origin:50%;transform-origin:50%;background:#fff;border-radius:100%;width:1.2em;height:1.2em;display:block;position:absolute;top:50%;left:0;-webkit-transform:translateY(-50%)scale(.8);transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:#105d89}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}';d.head.appendChild(c)})(document); \ No newline at end of file diff --git a/dist/biscuitman.js b/dist/biscuitman.js index 1038d04..795cf42 100644 --- a/dist/biscuitman.js +++ b/dist/biscuitman.js @@ -107,16 +107,17 @@ saveConsents(false); } }; + ui.onchange = (e)=>{ + if (!e.target.dataset.s) return; + e.target.parentElement.classList.toggle('checked', e.target.checked); + }; dialog = ui.querySelector('dialog'); - if (o.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (o.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = ()=>dispatch('close'); if (o.force) { dialog.oncancel = (e)=>e.preventDefault(); dialog.onkeydown = (e)=>e.key === 'Escape' ? e.preventDefault() : null; } - ui.querySelectorAll('[data-s]').forEach((checkbox)=>checkbox.addEventListener('change', (e)=>{ - checkbox.parentElement.classList.toggle('checked', e.target.checked); - })); d.body.appendChild(ui); w.addEventListener('resize', updateBannerHeight); } diff --git a/dist/biscuitman.min.js b/dist/biscuitman.min.js index 4d80c7f..1900d8f 100644 --- a/dist/biscuitman.min.js +++ b/dist/biscuitman.min.js @@ -1 +1 @@ -/*! biscuitman.js 0.5.0 */((e,t,o,a)=>{let i;let n={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js",...t.biscuitman},l=e.createElement("div"),s=()=>{a.style.setProperty("--bm-height",`${l.offsetHeight}px`)},c=e=>{a.classList.toggle("bm-show",e),s()},r=()=>{let{consentTime:e,...t}=p();for(let[i,l]of(e||(t=o.fromEntries(n.sections.slice(1).map(e=>[e,!1]))),o.entries(t)))a.classList.toggle(`bm-${i}`,l),a.classList.toggle(`bm-no-${i}`,!l)};function d(){m("open"),i.showModal()}function m(t,o){let a=`bm:${t}`,i={...void 0!==o&&o,time:+new Date};e.dispatchEvent(new CustomEvent(a,{detail:i})),console.debug(a,i)}let p=()=>t[n.global]||{};function u(e){t[n.global]=e,r()}function b(e,t){for(let o in e)e[o]&&!1===t[o]&&m("revoke",{section:o})}function f(){try{return JSON.parse(localStorage.getItem(n.key))}catch(e){return console.error(e),localStorage.removeItem(n.key),{}}}function g(){let t=o.fromEntries(o.entries(localStorage)),a=o.fromEntries(e.cookie.split("; ").map(e=>e.split("="))),{consentTime:i,...l}=f()||n.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[i,s]of o.entries(l)){if(s)continue;let l=o.keys(n[`${i}Cookies`]||{});for(let i of(l.filter(e=>e.endsWith("*")).map(e=>{o.keys({...a,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(a[i]){let t=`${i}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;e.cookie=t,e.cookie=`${t}domain=${location.hostname};`,e.cookie=`${t}domain=.${location.hostname};`,m("delete",{cookie:i})}t[i]&&(localStorage.removeItem(i),m("delete",{localStorage:i}))}}}function $(e){let t=void 0===e,o={consentTime:+new Date};n.sections.forEach(a=>{if("essential"===a)return;let i=l.querySelector(`[data-s=${a}]`),n=t?i.checked:e;o[a]=n,t||(i.checked=e)}),b(p(),o),u(o),localStorage.setItem(n.key,JSON.stringify(o)),m("save",{data:o}),g(),h(),i.open&&i.close(),c(!1)}function h(){e.querySelectorAll("script[data-consent]").forEach(t=>{if(!p()[t.dataset.consent])return;let o=e.createElement("script");for(let{name:e,value:a}of t.attributes)e.startsWith("data-")||"type"===e||o.setAttribute(e,a);o.setAttribute("type",t.dataset.type||"text/javascript"),t.src||(o.textContent=t.textContent),t.parentNode.replaceChild(o,t),m("inject",{el:t,...t.id&&{id:t.id}}),t.src&&""!==t.textContent.trim()&&o.addEventListener("load",()=>{let a=e.createElement("script");a.textContent=t.textContent,t.id&&(a.id=t.id+"-after"),o.insertAdjacentElement("afterend",a),m("inject",{el:a,parent:t,...a.id&&{id:a.id}})})})}u(f()||{});let v=Intl.DateTimeFormat().resolvedOptions().timeZone,k=/^(GMT|UTC)$/.test(v)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(v);n.acceptNonEU&&!k&&($(!0),c(!1)),l.className="biscuitman",l.innerHTML=`
${n.title}

${n.message}

${n.settingsTitle}

${n.message}

${n.info.split("\n").map((e,t,o)=>`${e}${o.length>1&&n.enableMore&&0==t?`${n.more}`:""}`).join("")}

${n.sections.map(e=>{let t=p()[e],a="essential"===e,i=a?"disabled":"",l=a?"checked":"";void 0!==t&&(l=t?"checked":"");let s=n[`${e}Cookies`];return`
${n[`${e}Title`]}

${n[`${e}Message`]}

${s?o.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${n.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${n.linkText}`),l.onclick=e=>{let t=e.target.dataset.id;if(t)switch(m("button",{id:t}),t){case"more":e.target.remove();break;case"accept":$(!0);break;case"close":i.close();break;case"settings":d();break;case"save":$();break;case"reject":$(!1)}},i=l.querySelector("dialog"),(!n.dialogPolyfill||i.close)&&i.showModal||function(o){function a(){e.documentElement.classList.add("bm-dialog-polyfill"),t.dialogPolyfill.registerDialog(o)}if(t.dialogPolyfill)a();else{let t=e.createElement("script");t.onload=a,t.src=n.dialogPolyfill,e.head.appendChild(t)}}(i),i.onclose=()=>m("close"),n.force&&(i.oncancel=e=>e.preventDefault(),i.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),l.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),e.body.appendChild(l),t.addEventListener("resize",s),g(),t[n.global].consentTime?(c(!1),h()):(c(!0),n.force&&d()),t.bmInvalidate=()=>{m("invalidate",{data:p()}),b({}),$(!1),u({}),localStorage.removeItem(n.key),c(!0),n.force&&i.showModal()},t.bmUpdate=()=>{m("update",{data:p()}),d()}})(document,window,Object,document.documentElement); \ No newline at end of file +/*! biscuitman.js 0.5.0 */((e,t,o,a)=>{let i;let n={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js",...t.biscuitman},s=e.createElement("div"),l=()=>{a.style.setProperty("--bm-height",`${s.offsetHeight}px`)},c=e=>{a.classList.toggle("bm-show",e),l()},r=()=>{let{consentTime:e,...t}=p();for(let[i,s]of(e||(t=o.fromEntries(n.sections.slice(1).map(e=>[e,!1]))),o.entries(t)))a.classList.toggle(`bm-${i}`,s),a.classList.toggle(`bm-no-${i}`,!s)};function d(){m("open"),i.showModal()}function m(t,o){let a=`bm:${t}`,i={...void 0!==o&&o,time:+new Date};e.dispatchEvent(new CustomEvent(a,{detail:i})),console.debug(a,i)}let p=()=>t[n.global]||{};function u(e){t[n.global]=e,r()}function b(e,t){for(let o in e)e[o]&&!1===t[o]&&m("revoke",{section:o})}function g(){try{return JSON.parse(localStorage.getItem(n.key))}catch(e){return console.error(e),localStorage.removeItem(n.key),{}}}function f(){let t=o.fromEntries(o.entries(localStorage)),a=o.fromEntries(e.cookie.split("; ").map(e=>e.split("="))),{consentTime:i,...s}=g()||n.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[i,l]of o.entries(s)){if(l)continue;let s=o.keys(n[`${i}Cookies`]||{});for(let i of(s.filter(e=>e.endsWith("*")).map(e=>{o.keys({...a,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&s.push(t)})}),s)){if(a[i]){let t=`${i}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;e.cookie=t,e.cookie=`${t}domain=${location.hostname};`,e.cookie=`${t}domain=.${location.hostname};`,m("delete",{cookie:i})}t[i]&&(localStorage.removeItem(i),m("delete",{localStorage:i}))}}}function $(e){let t=void 0===e,o={consentTime:+new Date};n.sections.forEach(a=>{if("essential"===a)return;let i=s.querySelector(`[data-s=${a}]`),n=t?i.checked:e;o[a]=n,t||(i.checked=e)}),b(p(),o),u(o),localStorage.setItem(n.key,JSON.stringify(o)),m("save",{data:o}),f(),k(),i.open&&i.close(),c(!1)}function k(){e.querySelectorAll("script[data-consent]").forEach(t=>{if(!p()[t.dataset.consent])return;let o=e.createElement("script");for(let{name:e,value:a}of t.attributes)e.startsWith("data-")||"type"===e||o.setAttribute(e,a);o.setAttribute("type",t.dataset.type||"text/javascript"),t.src||(o.textContent=t.textContent),t.parentNode.replaceChild(o,t),m("inject",{el:t,...t.id&&{id:t.id}}),t.src&&""!==t.textContent.trim()&&o.addEventListener("load",()=>{let a=e.createElement("script");a.textContent=t.textContent,t.id&&(a.id=t.id+"-after"),o.insertAdjacentElement("afterend",a),m("inject",{el:a,parent:t,...a.id&&{id:a.id}})})})}u(g()||{});let v=Intl.DateTimeFormat().resolvedOptions().timeZone,h=/^(GMT|UTC)$/.test(v)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(v);n.acceptNonEU&&!h&&($(!0),c(!1)),s.className="biscuitman",s.innerHTML=`
${n.title}

${n.message}

${n.settingsTitle}

${n.message}

${n.info.split("\n").map((e,t,o)=>`${e}${o.length>1&&n.enableMore&&0==t?`${n.more}`:""}`).join("")}

${n.sections.map(e=>{let t=p()[e],a="essential"===e,i=a?"disabled":"",s=a?"checked":"";void 0!==t&&(s=t?"checked":"");let l=n[`${e}Cookies`];return`
${n[`${e}Title`]}

${n[`${e}Message`]}

${l?o.entries(l).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${n.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${n.linkText}`),s.onclick=e=>{let t=e.target.dataset.id;if(t)switch(m("button",{id:t}),t){case"more":e.target.remove();break;case"accept":$(!0);break;case"close":i.close();break;case"settings":d();break;case"save":$();break;case"reject":$(!1)}},s.onchange=e=>{e.target.dataset.s&&e.target.parentElement.classList.toggle("checked",e.target.checked)},i=s.querySelector("dialog"),n.dialogPolyfill&&!i.close&&function(o){function a(){e.documentElement.classList.add("bm-dialog-polyfill"),t.dialogPolyfill.registerDialog(o)}if(t.dialogPolyfill)a();else{let t=e.createElement("script");t.onload=a,t.src=n.dialogPolyfill,e.head.appendChild(t)}}(i),i.onclose=()=>m("close"),n.force&&(i.oncancel=e=>e.preventDefault(),i.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),e.body.appendChild(s),t.addEventListener("resize",l),f(),t[n.global].consentTime?(c(!1),k()):(c(!0),n.force&&d()),t.bmInvalidate=()=>{m("invalidate",{data:p()}),b({}),$(!1),u({}),localStorage.removeItem(n.key),c(!0),n.force&&i.showModal()},t.bmUpdate=()=>{m("update",{data:p()}),d()}})(document,window,Object,document.documentElement); \ No newline at end of file diff --git a/dist/biscuitman.withcss.js b/dist/biscuitman.withcss.js index a3e0388..90c3d65 100644 --- a/dist/biscuitman.withcss.js +++ b/dist/biscuitman.withcss.js @@ -107,16 +107,17 @@ saveConsents(false); } }; + ui.onchange = (e)=>{ + if (!e.target.dataset.s) return; + e.target.parentElement.classList.toggle('checked', e.target.checked); + }; dialog = ui.querySelector('dialog'); - if (o.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (o.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = ()=>dispatch('close'); if (o.force) { dialog.oncancel = (e)=>e.preventDefault(); dialog.onkeydown = (e)=>e.key === 'Escape' ? e.preventDefault() : null; } - ui.querySelectorAll('[data-s]').forEach((checkbox)=>checkbox.addEventListener('change', (e)=>{ - checkbox.parentElement.classList.toggle('checked', e.target.checked); - })); d.body.appendChild(ui); w.addEventListener('resize', updateBannerHeight); } diff --git a/dist/biscuitman.withcss.min.js b/dist/biscuitman.withcss.min.js index 08065b5..1715535 100644 --- a/dist/biscuitman.withcss.min.js +++ b/dist/biscuitman.withcss.min.js @@ -1 +1 @@ -/*! biscuitman.js 0.5.0 */((e,t,o,a)=>{let i;let n={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js",...t.biscuitman},l=e.createElement("div"),s=()=>{a.style.setProperty("--bm-height",`${l.offsetHeight}px`)},c=e=>{a.classList.toggle("bm-show",e),s()},r=()=>{let{consentTime:e,...t}=p();for(let[i,l]of(e||(t=o.fromEntries(n.sections.slice(1).map(e=>[e,!1]))),o.entries(t)))a.classList.toggle(`bm-${i}`,l),a.classList.toggle(`bm-no-${i}`,!l)};function d(){m("open"),i.showModal()}function m(t,o){let a=`bm:${t}`,i={...void 0!==o&&o,time:+new Date};e.dispatchEvent(new CustomEvent(a,{detail:i})),console.debug(a,i)}let p=()=>t[n.global]||{};function u(e){t[n.global]=e,r()}function b(e,t){for(let o in e)e[o]&&!1===t[o]&&m("revoke",{section:o})}function f(){try{return JSON.parse(localStorage.getItem(n.key))}catch(e){return console.error(e),localStorage.removeItem(n.key),{}}}function g(){let t=o.fromEntries(o.entries(localStorage)),a=o.fromEntries(e.cookie.split("; ").map(e=>e.split("="))),{consentTime:i,...l}=f()||n.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[i,s]of o.entries(l)){if(s)continue;let l=o.keys(n[`${i}Cookies`]||{});for(let i of(l.filter(e=>e.endsWith("*")).map(e=>{o.keys({...a,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(a[i]){let t=`${i}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;e.cookie=t,e.cookie=`${t}domain=${location.hostname};`,e.cookie=`${t}domain=.${location.hostname};`,m("delete",{cookie:i})}t[i]&&(localStorage.removeItem(i),m("delete",{localStorage:i}))}}}function $(e){let t=void 0===e,o={consentTime:+new Date};n.sections.forEach(a=>{if("essential"===a)return;let i=l.querySelector(`[data-s=${a}]`),n=t?i.checked:e;o[a]=n,t||(i.checked=e)}),b(p(),o),u(o),localStorage.setItem(n.key,JSON.stringify(o)),m("save",{data:o}),g(),h(),i.open&&i.close(),c(!1)}function h(){e.querySelectorAll("script[data-consent]").forEach(t=>{if(!p()[t.dataset.consent])return;let o=e.createElement("script");for(let{name:e,value:a}of t.attributes)e.startsWith("data-")||"type"===e||o.setAttribute(e,a);o.setAttribute("type",t.dataset.type||"text/javascript"),t.src||(o.textContent=t.textContent),t.parentNode.replaceChild(o,t),m("inject",{el:t,...t.id&&{id:t.id}}),t.src&&""!==t.textContent.trim()&&o.addEventListener("load",()=>{let a=e.createElement("script");a.textContent=t.textContent,t.id&&(a.id=t.id+"-after"),o.insertAdjacentElement("afterend",a),m("inject",{el:a,parent:t,...a.id&&{id:a.id}})})})}u(f()||{});let v=Intl.DateTimeFormat().resolvedOptions().timeZone,k=/^(GMT|UTC)$/.test(v)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(v);n.acceptNonEU&&!k&&($(!0),c(!1)),l.className="biscuitman",l.innerHTML=`
${n.title}

${n.message}

${n.settingsTitle}

${n.message}

${n.info.split("\n").map((e,t,o)=>`${e}${o.length>1&&n.enableMore&&0==t?`${n.more}`:""}`).join("")}

${n.sections.map(e=>{let t=p()[e],a="essential"===e,i=a?"disabled":"",l=a?"checked":"";void 0!==t&&(l=t?"checked":"");let s=n[`${e}Cookies`];return`
${n[`${e}Title`]}

${n[`${e}Message`]}

${s?o.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${n.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${n.linkText}`),l.onclick=e=>{let t=e.target.dataset.id;if(t)switch(m("button",{id:t}),t){case"more":e.target.remove();break;case"accept":$(!0);break;case"close":i.close();break;case"settings":d();break;case"save":$();break;case"reject":$(!1)}},i=l.querySelector("dialog"),(!n.dialogPolyfill||i.close)&&i.showModal||function(o){function a(){e.documentElement.classList.add("bm-dialog-polyfill"),t.dialogPolyfill.registerDialog(o)}if(t.dialogPolyfill)a();else{let t=e.createElement("script");t.onload=a,t.src=n.dialogPolyfill,e.head.appendChild(t)}}(i),i.onclose=()=>m("close"),n.force&&(i.oncancel=e=>e.preventDefault(),i.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),l.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),e.body.appendChild(l),t.addEventListener("resize",s),g(),t[n.global].consentTime?(c(!1),h()):(c(!0),n.force&&d()),t.bmInvalidate=()=>{m("invalidate",{data:p()}),b({}),$(!1),u({}),localStorage.removeItem(n.key),c(!0),n.force&&i.showModal()},t.bmUpdate=()=>{m("update",{data:p()}),d()}})(document,window,Object,document.documentElement);;((d)=>{let c=d.createElement('style');c.textContent=`/*! biscuitman.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;background:var(--bg);box-sizing:border-box;z-index:3;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px #00000029}.bm-show .biscuitman{display:block}.biscuitman *{box-sizing:border-box;color:var(--tx);margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;transform:translateY(50%)}}.biscuitman article p{color:var(--tx);margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{background:var(--bg);border:2px solid var(--c);color:var(--c);cursor:pointer;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:var(--c);color:var(--bg)!important}.biscuitman button[data-id=close]{color:rgba(var(--ui),.5);opacity:.6;-webkit-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{flex-direction:row-reverse;gap:10px;width:100%;display:flex}.biscuitman nav button{flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{flex-direction:column;flex-grow:1;display:flex}}.biscuitman dialog{background:var(--bg);border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px #0000004d}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{flex-direction:column;height:100%;padding:20px;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";background:linear-gradient(180deg,var(--bg)20%,#fff0);pointer-events:none;z-index:1;width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";background:linear-gradient(0deg,var(--bg)20%,#fff0);pointer-events:none;width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(var(--ui),.2)var(--bg);flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:var(--c);cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(var(--ui),.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px #0000001a}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(var(--ui),.4);border-top-color:#0000;border-left-color:#0000;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:var(--tx);font-size:14px}.biscuitman summary>*{display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(var(--ui),.08);margin:10px;padding:10px;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:var(--tx);font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;height:var(--height);width:var(--width);background-color:rgba(var(--ui),.3);border-radius:var(--height);margin-top:-2px;display:block;position:absolute;top:50%;right:20px;transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";background:var(--bg);height:calc(var(--height) - calc(var(--gap)*2));width:calc(var(--height) - calc(var(--gap)*2));height:var(--height);width:var(--height);left:var(--gap);transform-origin:50%;border-radius:100%;display:block;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:var(--c)}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;transform:translateY(-50%)}`;d.head.appendChild(c)})(document); \ No newline at end of file +/*! biscuitman.js 0.5.0 */((e,t,o,a)=>{let i;let n={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js",...t.biscuitman},s=e.createElement("div"),l=()=>{a.style.setProperty("--bm-height",`${s.offsetHeight}px`)},c=e=>{a.classList.toggle("bm-show",e),l()},r=()=>{let{consentTime:e,...t}=p();for(let[i,s]of(e||(t=o.fromEntries(n.sections.slice(1).map(e=>[e,!1]))),o.entries(t)))a.classList.toggle(`bm-${i}`,s),a.classList.toggle(`bm-no-${i}`,!s)};function d(){m("open"),i.showModal()}function m(t,o){let a=`bm:${t}`,i={...void 0!==o&&o,time:+new Date};e.dispatchEvent(new CustomEvent(a,{detail:i})),console.debug(a,i)}let p=()=>t[n.global]||{};function u(e){t[n.global]=e,r()}function b(e,t){for(let o in e)e[o]&&!1===t[o]&&m("revoke",{section:o})}function g(){try{return JSON.parse(localStorage.getItem(n.key))}catch(e){return console.error(e),localStorage.removeItem(n.key),{}}}function f(){let t=o.fromEntries(o.entries(localStorage)),a=o.fromEntries(e.cookie.split("; ").map(e=>e.split("="))),{consentTime:i,...s}=g()||n.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[i,l]of o.entries(s)){if(l)continue;let s=o.keys(n[`${i}Cookies`]||{});for(let i of(s.filter(e=>e.endsWith("*")).map(e=>{o.keys({...a,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&s.push(t)})}),s)){if(a[i]){let t=`${i}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;e.cookie=t,e.cookie=`${t}domain=${location.hostname};`,e.cookie=`${t}domain=.${location.hostname};`,m("delete",{cookie:i})}t[i]&&(localStorage.removeItem(i),m("delete",{localStorage:i}))}}}function $(e){let t=void 0===e,o={consentTime:+new Date};n.sections.forEach(a=>{if("essential"===a)return;let i=s.querySelector(`[data-s=${a}]`),n=t?i.checked:e;o[a]=n,t||(i.checked=e)}),b(p(),o),u(o),localStorage.setItem(n.key,JSON.stringify(o)),m("save",{data:o}),f(),k(),i.open&&i.close(),c(!1)}function k(){e.querySelectorAll("script[data-consent]").forEach(t=>{if(!p()[t.dataset.consent])return;let o=e.createElement("script");for(let{name:e,value:a}of t.attributes)e.startsWith("data-")||"type"===e||o.setAttribute(e,a);o.setAttribute("type",t.dataset.type||"text/javascript"),t.src||(o.textContent=t.textContent),t.parentNode.replaceChild(o,t),m("inject",{el:t,...t.id&&{id:t.id}}),t.src&&""!==t.textContent.trim()&&o.addEventListener("load",()=>{let a=e.createElement("script");a.textContent=t.textContent,t.id&&(a.id=t.id+"-after"),o.insertAdjacentElement("afterend",a),m("inject",{el:a,parent:t,...a.id&&{id:a.id}})})})}u(g()||{});let v=Intl.DateTimeFormat().resolvedOptions().timeZone,h=/^(GMT|UTC)$/.test(v)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(v);n.acceptNonEU&&!h&&($(!0),c(!1)),s.className="biscuitman",s.innerHTML=`
${n.title}

${n.message}

${n.settingsTitle}

${n.message}

${n.info.split("\n").map((e,t,o)=>`${e}${o.length>1&&n.enableMore&&0==t?`${n.more}`:""}`).join("")}

${n.sections.map(e=>{let t=p()[e],a="essential"===e,i=a?"disabled":"",s=a?"checked":"";void 0!==t&&(s=t?"checked":"");let l=n[`${e}Cookies`];return`
${n[`${e}Title`]}

${n[`${e}Message`]}

${l?o.entries(l).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${n.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${n.linkText}`),s.onclick=e=>{let t=e.target.dataset.id;if(t)switch(m("button",{id:t}),t){case"more":e.target.remove();break;case"accept":$(!0);break;case"close":i.close();break;case"settings":d();break;case"save":$();break;case"reject":$(!1)}},s.onchange=e=>{e.target.dataset.s&&e.target.parentElement.classList.toggle("checked",e.target.checked)},i=s.querySelector("dialog"),n.dialogPolyfill&&!i.close&&function(o){function a(){e.documentElement.classList.add("bm-dialog-polyfill"),t.dialogPolyfill.registerDialog(o)}if(t.dialogPolyfill)a();else{let t=e.createElement("script");t.onload=a,t.src=n.dialogPolyfill,e.head.appendChild(t)}}(i),i.onclose=()=>m("close"),n.force&&(i.oncancel=e=>e.preventDefault(),i.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),e.body.appendChild(s),t.addEventListener("resize",l),f(),t[n.global].consentTime?(c(!1),k()):(c(!0),n.force&&d()),t.bmInvalidate=()=>{m("invalidate",{data:p()}),b({}),$(!1),u({}),localStorage.removeItem(n.key),c(!0),n.force&&i.showModal()},t.bmUpdate=()=>{m("update",{data:p()}),d()}})(document,window,Object,document.documentElement);;((d)=>{let c=d.createElement('style');c.textContent=`/*! biscuitman.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;background:var(--bg);box-sizing:border-box;z-index:3;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px #00000029}.bm-show .biscuitman{display:block}.biscuitman *{box-sizing:border-box;color:var(--tx);margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;transform:translateY(50%)}}.biscuitman article p{color:var(--tx);margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{background:var(--bg);border:2px solid var(--c);color:var(--c);cursor:pointer;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:var(--c);color:var(--bg)!important}.biscuitman button[data-id=close]{color:rgba(var(--ui),.5);opacity:.6;-webkit-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{flex-direction:row-reverse;gap:10px;width:100%;display:flex}.biscuitman nav button{flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{flex-direction:column;flex-grow:1;display:flex}}.biscuitman dialog{background:var(--bg);border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px #0000004d}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{flex-direction:column;height:100%;padding:20px;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";background:linear-gradient(180deg,var(--bg)20%,#fff0);pointer-events:none;z-index:1;width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";background:linear-gradient(0deg,var(--bg)20%,#fff0);pointer-events:none;width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(var(--ui),.2)var(--bg);flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:var(--c);cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(var(--ui),.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px #0000001a}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(var(--ui),.4);border-top-color:#0000;border-left-color:#0000;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:var(--tx);font-size:14px}.biscuitman summary>*{display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(var(--ui),.08);margin:10px;padding:10px;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:var(--tx);font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;height:var(--height);width:var(--width);background-color:rgba(var(--ui),.3);border-radius:var(--height);margin-top:-2px;display:block;position:absolute;top:50%;right:20px;transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";background:var(--bg);height:calc(var(--height) - calc(var(--gap)*2));width:calc(var(--height) - calc(var(--gap)*2));height:var(--height);width:var(--height);left:var(--gap);transform-origin:50%;border-radius:100%;display:block;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:var(--c)}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;transform:translateY(-50%)}`;d.head.appendChild(c)})(document); \ No newline at end of file diff --git a/dist/esm/biscuitman.min.mjs b/dist/esm/biscuitman.min.mjs index 50dad1b..6b15dab 100644 --- a/dist/esm/biscuitman.min.mjs +++ b/dist/esm/biscuitman.min.mjs @@ -1 +1 @@ -/*! biscuitman.js 0.5.0 */let e,t,o;let{document:a,window:n,Object:i}=globalThis,l=a.documentElement,s={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js"},c=document.createElement("div"),r={},d=()=>{l.style.setProperty("--bm-height",`${c.offsetHeight}px`)},m=e=>{l.classList.toggle("bm-show",e),d()},p=()=>{let{consentTime:t,...o}=b();for(let[a,n]of(t||(o=i.fromEntries(e.sections.slice(1).map(e=>[e,!1]))),i.entries(o)))l.classList.toggle(`bm-${a}`,n),l.classList.toggle(`bm-no-${a}`,!n)};function u(){f("open"),t.showModal()}function f(e,t){let o=`bm:${e}`,n={...void 0!==t&&t,time:+new Date};a.dispatchEvent(new CustomEvent(o,{detail:n})),console.debug(o,n),r[o]&&r[o].forEach(e=>e(n))}let b=()=>n[e.global]||{};function g(t){n[e.global]=t,p()}let $=e=>!!b()[e];function h(e,t){for(let o in e)e[o]&&!1===t[o]&&f("revoke",{section:o})}function v(){try{return JSON.parse(localStorage.getItem(e.key))}catch(t){return console.error(t),localStorage.removeItem(e.key),{}}}function k(){let t=i.fromEntries(i.entries(localStorage)),o=i.fromEntries(a.cookie.split("; ").map(e=>e.split("="))),{consentTime:n,...l}=v()||e.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[n,s]of i.entries(l)){if(s)continue;let l=i.keys(e[`${n}Cookies`]||{});for(let e of(l.filter(e=>e.endsWith("*")).map(e=>{i.keys({...o,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(o[e]){let t=`${e}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;a.cookie=t,a.cookie=`${t}domain=${location.hostname};`,a.cookie=`${t}domain=.${location.hostname};`,f("delete",{cookie:e})}t[e]&&(localStorage.removeItem(e),f("delete",{localStorage:e}))}}}function y(o){let a=void 0===o,n={consentTime:+new Date};e.sections.forEach(e=>{if("essential"===e)return;let t=c.querySelector(`[data-s=${e}]`),i=a?t.checked:o;n[e]=i,a||(t.checked=o)}),h(b(),n),g(n),localStorage.setItem(e.key,JSON.stringify(n)),f("save",{data:n}),k(),E(),t.open&&t.close(),m(!1)}function E(){a.querySelectorAll("script[data-consent]").forEach(e=>{if(!b()[e.dataset.consent])return;let t=a.createElement("script");for(let{name:o,value:a}of e.attributes)o.startsWith("data-")||"type"===o||t.setAttribute(o,a);t.setAttribute("type",e.dataset.type||"text/javascript"),e.src||(t.textContent=e.textContent),e.parentNode.replaceChild(t,e),f("inject",{el:e,...e.id&&{id:e.id}}),e.src&&""!==e.textContent.trim()&&t.addEventListener("load",()=>{let o=a.createElement("script");o.textContent=e.textContent,e.id&&(o.id=e.id+"-after"),t.insertAdjacentElement("afterend",o),f("inject",{el:o,parent:e,...o.id&&{id:o.id}})})})}export default{create:function(){let l=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(o)return o;e={...s,...l};let p=n.bmInvalidate=()=>{f("invalidate",{data:b()}),h({}),y(!1),g({}),localStorage.removeItem(e.key),m(!0),e.force&&t.showModal()},T=n.bmUpdate=()=>{f("update",{data:b()}),u()};return g(v()||{}),function(){let t=Intl.DateTimeFormat().resolvedOptions().timeZone,o=/^(GMT|UTC)$/.test(t)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(t);e.acceptNonEU&&!o&&(y(!0),m(!1))}(),c.className="biscuitman",c.innerHTML=`
${e.title}

${e.message}

${e.settingsTitle}

${e.message}

${e.info.split("\n").map((t,o,a)=>`${t}${a.length>1&&e.enableMore&&0==o?`${e.more}`:""}`).join("")}

${e.sections.map(t=>{let o=b()[t],a="essential"===t,n=a?"disabled":"",l=a?"checked":"";void 0!==o&&(l=o?"checked":"");let s=e[`${t}Cookies`];return`
${e[`${t}Title`]}

${e[`${t}Message`]}

${s?i.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${e.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${e.linkText}`),c.onclick=e=>{let o=e.target.dataset.id;if(o)switch(f("button",{id:o}),o){case"more":e.target.remove();break;case"accept":y(!0);break;case"close":t.close();break;case"settings":u();break;case"save":y();break;case"reject":y(!1)}},t=c.querySelector("dialog"),(!e.dialogPolyfill||t.close)&&t.showModal||function(t){function o(){a.documentElement.classList.add("bm-dialog-polyfill"),n.dialogPolyfill.registerDialog(t)}if(n.dialogPolyfill)o();else{let t=a.createElement("script");t.onload=o,t.src=e.dialogPolyfill,a.head.appendChild(t)}}(t),t.onclose=()=>f("close"),e.force&&(t.oncancel=e=>e.preventDefault(),t.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),c.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),a.body.appendChild(c),n.addEventListener("resize",d),k(),n[e.global].consentTime?(m(!1),E()):(m(!0),e.force&&u()),o={consent:$,invalidate:p,update:T,on:(e,t)=>{let a=`bm:${e}`;return r[a]||(r[a]=[]),r[a].push(t),o},off:(e,t)=>{let o=`bm:${e}`;r[o]&&(r[o]=r[o].filter(e=>e!==t))}}}}; \ No newline at end of file +/*! biscuitman.js 0.5.0 */let e,t,o;let{document:a,window:n,Object:i}=globalThis,l=a.documentElement,s={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js"},c=document.createElement("div"),r={},d=()=>{l.style.setProperty("--bm-height",`${c.offsetHeight}px`)},m=e=>{l.classList.toggle("bm-show",e),d()},p=()=>{let{consentTime:t,...o}=b();for(let[a,n]of(t||(o=i.fromEntries(e.sections.slice(1).map(e=>[e,!1]))),i.entries(o)))l.classList.toggle(`bm-${a}`,n),l.classList.toggle(`bm-no-${a}`,!n)};function u(){f("open"),t.showModal()}function f(e,t){let o=`bm:${e}`,n={...void 0!==t&&t,time:+new Date};a.dispatchEvent(new CustomEvent(o,{detail:n})),console.debug(o,n),r[o]&&r[o].forEach(e=>e(n))}let b=()=>n[e.global]||{};function g(t){n[e.global]=t,p()}let $=e=>!!b()[e];function h(e,t){for(let o in e)e[o]&&!1===t[o]&&f("revoke",{section:o})}function v(){try{return JSON.parse(localStorage.getItem(e.key))}catch(t){return console.error(t),localStorage.removeItem(e.key),{}}}function k(){let t=i.fromEntries(i.entries(localStorage)),o=i.fromEntries(a.cookie.split("; ").map(e=>e.split("="))),{consentTime:n,...l}=v()||e.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[n,s]of i.entries(l)){if(s)continue;let l=i.keys(e[`${n}Cookies`]||{});for(let e of(l.filter(e=>e.endsWith("*")).map(e=>{i.keys({...o,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(o[e]){let t=`${e}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;a.cookie=t,a.cookie=`${t}domain=${location.hostname};`,a.cookie=`${t}domain=.${location.hostname};`,f("delete",{cookie:e})}t[e]&&(localStorage.removeItem(e),f("delete",{localStorage:e}))}}}function y(o){let a=void 0===o,n={consentTime:+new Date};e.sections.forEach(e=>{if("essential"===e)return;let t=c.querySelector(`[data-s=${e}]`),i=a?t.checked:o;n[e]=i,a||(t.checked=o)}),h(b(),n),g(n),localStorage.setItem(e.key,JSON.stringify(n)),f("save",{data:n}),k(),E(),t.open&&t.close(),m(!1)}function E(){a.querySelectorAll("script[data-consent]").forEach(e=>{if(!b()[e.dataset.consent])return;let t=a.createElement("script");for(let{name:o,value:a}of e.attributes)o.startsWith("data-")||"type"===o||t.setAttribute(o,a);t.setAttribute("type",e.dataset.type||"text/javascript"),e.src||(t.textContent=e.textContent),e.parentNode.replaceChild(t,e),f("inject",{el:e,...e.id&&{id:e.id}}),e.src&&""!==e.textContent.trim()&&t.addEventListener("load",()=>{let o=a.createElement("script");o.textContent=e.textContent,e.id&&(o.id=e.id+"-after"),t.insertAdjacentElement("afterend",o),f("inject",{el:o,parent:e,...o.id&&{id:o.id}})})})}export default{create:function(){let l=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(o)return o;e={...s,...l};let p=n.bmInvalidate=()=>{f("invalidate",{data:b()}),h({}),y(!1),g({}),localStorage.removeItem(e.key),m(!0),e.force&&t.showModal()},T=n.bmUpdate=()=>{f("update",{data:b()}),u()};return g(v()||{}),function(){let t=Intl.DateTimeFormat().resolvedOptions().timeZone,o=/^(GMT|UTC)$/.test(t)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(t);e.acceptNonEU&&!o&&(y(!0),m(!1))}(),c.className="biscuitman",c.innerHTML=`
${e.title}

${e.message}

${e.settingsTitle}

${e.message}

${e.info.split("\n").map((t,o,a)=>`${t}${a.length>1&&e.enableMore&&0==o?`${e.more}`:""}`).join("")}

${e.sections.map(t=>{let o=b()[t],a="essential"===t,n=a?"disabled":"",l=a?"checked":"";void 0!==o&&(l=o?"checked":"");let s=e[`${t}Cookies`];return`
${e[`${t}Title`]}

${e[`${t}Message`]}

${s?i.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${e.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${e.linkText}`),c.onclick=e=>{let o=e.target.dataset.id;if(o)switch(f("button",{id:o}),o){case"more":e.target.remove();break;case"accept":y(!0);break;case"close":t.close();break;case"settings":u();break;case"save":y();break;case"reject":y(!1)}},t=c.querySelector("dialog"),e.dialogPolyfill&&!t.close&&function(t){function o(){a.documentElement.classList.add("bm-dialog-polyfill"),n.dialogPolyfill.registerDialog(t)}if(n.dialogPolyfill)o();else{let t=a.createElement("script");t.onload=o,t.src=e.dialogPolyfill,a.head.appendChild(t)}}(t),t.onclose=()=>f("close"),e.force&&(t.oncancel=e=>e.preventDefault(),t.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),c.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),a.body.appendChild(c),n.addEventListener("resize",d),k(),n[e.global].consentTime?(m(!1),E()):(m(!0),e.force&&u()),o={consent:$,invalidate:p,update:T,on:(e,t)=>{let a=`bm:${e}`;return r[a]||(r[a]=[]),r[a].push(t),o},off:(e,t)=>{let o=`bm:${e}`;r[o]&&(r[o]=r[o].filter(e=>e!==t))}}}}; \ No newline at end of file diff --git a/dist/esm/biscuitman.mjs b/dist/esm/biscuitman.mjs index cf40797..8f6b1c0 100644 --- a/dist/esm/biscuitman.mjs +++ b/dist/esm/biscuitman.mjs @@ -34,19 +34,19 @@ function render() { ${options.title}

${options.message}

-
+
${options.settingsTitle} - -
+ +

${options.message}

${options.info.split('\n').map((line, i, arr)=>`${line} - ${arr.length > 1 && options.enableMore && i == 0 ? `${options.more}` : ''}`).join('')} + ${arr.length > 1 && options.enableMore && i == 0 ? `${options.more}` : ''}`).join('')}

${options.sections.map((section)=>{ let hasConsent = getConsents()[section]; @@ -60,8 +60,8 @@ function render() {
${options[`${section}Title`]} - @@ -74,9 +74,9 @@ function render() { }).join('')}
`.replaceAll('{link}', `${options.linkText}`); @@ -107,7 +107,7 @@ function render() { } }; dialog = ui.querySelector('dialog'); - if (options.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (options.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = ()=>dispatch('close'); if (options.force) { dialog.oncancel = (e)=>e.preventDefault(); diff --git a/dist/esm/biscuitman.withcss.min.mjs b/dist/esm/biscuitman.withcss.min.mjs index 28ea313..c9425de 100644 --- a/dist/esm/biscuitman.withcss.min.mjs +++ b/dist/esm/biscuitman.withcss.min.mjs @@ -1 +1 @@ -/*! biscuitman.js 0.5.0 */let e,t,o;let{document:a,window:n,Object:i}=globalThis,l=a.documentElement,s={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js"},c=document.createElement("div"),r={},d=()=>{l.style.setProperty("--bm-height",`${c.offsetHeight}px`)},m=e=>{l.classList.toggle("bm-show",e),d()},p=()=>{let{consentTime:t,...o}=b();for(let[a,n]of(t||(o=i.fromEntries(e.sections.slice(1).map(e=>[e,!1]))),i.entries(o)))l.classList.toggle(`bm-${a}`,n),l.classList.toggle(`bm-no-${a}`,!n)};function u(){f("open"),t.showModal()}function f(e,t){let o=`bm:${e}`,n={...void 0!==t&&t,time:+new Date};a.dispatchEvent(new CustomEvent(o,{detail:n})),console.debug(o,n),r[o]&&r[o].forEach(e=>e(n))}let b=()=>n[e.global]||{};function g(t){n[e.global]=t,p()}let $=e=>!!b()[e];function h(e,t){for(let o in e)e[o]&&!1===t[o]&&f("revoke",{section:o})}function v(){try{return JSON.parse(localStorage.getItem(e.key))}catch(t){return console.error(t),localStorage.removeItem(e.key),{}}}function k(){let t=i.fromEntries(i.entries(localStorage)),o=i.fromEntries(a.cookie.split("; ").map(e=>e.split("="))),{consentTime:n,...l}=v()||e.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[n,s]of i.entries(l)){if(s)continue;let l=i.keys(e[`${n}Cookies`]||{});for(let e of(l.filter(e=>e.endsWith("*")).map(e=>{i.keys({...o,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(o[e]){let t=`${e}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;a.cookie=t,a.cookie=`${t}domain=${location.hostname};`,a.cookie=`${t}domain=.${location.hostname};`,f("delete",{cookie:e})}t[e]&&(localStorage.removeItem(e),f("delete",{localStorage:e}))}}}function y(o){let a=void 0===o,n={consentTime:+new Date};e.sections.forEach(e=>{if("essential"===e)return;let t=c.querySelector(`[data-s=${e}]`),i=a?t.checked:o;n[e]=i,a||(t.checked=o)}),h(b(),n),g(n),localStorage.setItem(e.key,JSON.stringify(n)),f("save",{data:n}),k(),E(),t.open&&t.close(),m(!1)}function E(){a.querySelectorAll("script[data-consent]").forEach(e=>{if(!b()[e.dataset.consent])return;let t=a.createElement("script");for(let{name:o,value:a}of e.attributes)o.startsWith("data-")||"type"===o||t.setAttribute(o,a);t.setAttribute("type",e.dataset.type||"text/javascript"),e.src||(t.textContent=e.textContent),e.parentNode.replaceChild(t,e),f("inject",{el:e,...e.id&&{id:e.id}}),e.src&&""!==e.textContent.trim()&&t.addEventListener("load",()=>{let o=a.createElement("script");o.textContent=e.textContent,e.id&&(o.id=e.id+"-after"),t.insertAdjacentElement("afterend",o),f("inject",{el:o,parent:e,...o.id&&{id:o.id}})})})}export default{create:function(){let l=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(o)return o;e={...s,...l};let p=n.bmInvalidate=()=>{f("invalidate",{data:b()}),h({}),y(!1),g({}),localStorage.removeItem(e.key),m(!0),e.force&&t.showModal()},T=n.bmUpdate=()=>{f("update",{data:b()}),u()};return g(v()||{}),function(){let t=Intl.DateTimeFormat().resolvedOptions().timeZone,o=/^(GMT|UTC)$/.test(t)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(t);e.acceptNonEU&&!o&&(y(!0),m(!1))}(),c.className="biscuitman",c.innerHTML=`
${e.title}

${e.message}

${e.settingsTitle}

${e.message}

${e.info.split("\n").map((t,o,a)=>`${t}${a.length>1&&e.enableMore&&0==o?`${e.more}`:""}`).join("")}

${e.sections.map(t=>{let o=b()[t],a="essential"===t,n=a?"disabled":"",l=a?"checked":"";void 0!==o&&(l=o?"checked":"");let s=e[`${t}Cookies`];return`
${e[`${t}Title`]}

${e[`${t}Message`]}

${s?i.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${e.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${e.linkText}`),c.onclick=e=>{let o=e.target.dataset.id;if(o)switch(f("button",{id:o}),o){case"more":e.target.remove();break;case"accept":y(!0);break;case"close":t.close();break;case"settings":u();break;case"save":y();break;case"reject":y(!1)}},t=c.querySelector("dialog"),(!e.dialogPolyfill||t.close)&&t.showModal||function(t){function o(){a.documentElement.classList.add("bm-dialog-polyfill"),n.dialogPolyfill.registerDialog(t)}if(n.dialogPolyfill)o();else{let t=a.createElement("script");t.onload=o,t.src=e.dialogPolyfill,a.head.appendChild(t)}}(t),t.onclose=()=>f("close"),e.force&&(t.oncancel=e=>e.preventDefault(),t.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),c.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),a.body.appendChild(c),n.addEventListener("resize",d),k(),n[e.global].consentTime?(m(!1),E()):(m(!0),e.force&&u()),o={consent:$,invalidate:p,update:T,on:(e,t)=>{let a=`bm:${e}`;return r[a]||(r[a]=[]),r[a].push(t),o},off:(e,t)=>{let o=`bm:${e}`;r[o]&&(r[o]=r[o].filter(e=>e!==t))}}}};;if(typeof BMCSS==='undefined'){let c=document.createElement('style');c.id='BMCSS';c.textContent=`/*! biscuitman.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;background:var(--bg);box-sizing:border-box;z-index:3;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px #00000029}.bm-show .biscuitman{display:block}.biscuitman *{box-sizing:border-box;color:var(--tx);margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;transform:translateY(50%)}}.biscuitman article p{color:var(--tx);margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{background:var(--bg);border:2px solid var(--c);color:var(--c);cursor:pointer;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:var(--c);color:var(--bg)!important}.biscuitman button[data-id=close]{color:rgba(var(--ui),.5);opacity:.6;-webkit-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{flex-direction:row-reverse;gap:10px;width:100%;display:flex}.biscuitman nav button{flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{flex-direction:column;flex-grow:1;display:flex}}.biscuitman dialog{background:var(--bg);border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px #0000004d}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{flex-direction:column;height:100%;padding:20px;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";background:linear-gradient(180deg,var(--bg)20%,#fff0);pointer-events:none;z-index:1;width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";background:linear-gradient(0deg,var(--bg)20%,#fff0);pointer-events:none;width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(var(--ui),.2)var(--bg);flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:var(--c);cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(var(--ui),.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px #0000001a}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(var(--ui),.4);border-top-color:#0000;border-left-color:#0000;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:var(--tx);font-size:14px}.biscuitman summary>*{display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(var(--ui),.08);margin:10px;padding:10px;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:var(--tx);font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;height:var(--height);width:var(--width);background-color:rgba(var(--ui),.3);border-radius:var(--height);margin-top:-2px;display:block;position:absolute;top:50%;right:20px;transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";background:var(--bg);height:calc(var(--height) - calc(var(--gap)*2));width:calc(var(--height) - calc(var(--gap)*2));height:var(--height);width:var(--height);left:var(--gap);transform-origin:50%;border-radius:100%;display:block;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:var(--c)}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;transform:translateY(-50%)}`;document.head.appendChild(c)} \ No newline at end of file +/*! biscuitman.js 0.5.0 */let e,t,o;let{document:a,window:n,Object:i}=globalThis,l=a.documentElement,s={key:"myconsent",global:"Consent",force:!1,enableMore:!0,sections:["essential"],title:"Your privacy matters",message:"We use cookies",settings:"Settings",reject:"Reject All",accept:"Accept All",save:"Save My Settings",settingsTitle:"My Consent Settings",info:"",more:"Show more",noCookies:"No cookies to display",acceptNonEU:!1,dialogPolyfill:"/dist/dialog-polyfill.withcss.min.js"},c=document.createElement("div"),r={},d=()=>{l.style.setProperty("--bm-height",`${c.offsetHeight}px`)},m=e=>{l.classList.toggle("bm-show",e),d()},p=()=>{let{consentTime:t,...o}=b();for(let[a,n]of(t||(o=i.fromEntries(e.sections.slice(1).map(e=>[e,!1]))),i.entries(o)))l.classList.toggle(`bm-${a}`,n),l.classList.toggle(`bm-no-${a}`,!n)};function u(){f("open"),t.showModal()}function f(e,t){let o=`bm:${e}`,n={...void 0!==t&&t,time:+new Date};a.dispatchEvent(new CustomEvent(o,{detail:n})),console.debug(o,n),r[o]&&r[o].forEach(e=>e(n))}let b=()=>n[e.global]||{};function g(t){n[e.global]=t,p()}let $=e=>!!b()[e];function h(e,t){for(let o in e)e[o]&&!1===t[o]&&f("revoke",{section:o})}function v(){try{return JSON.parse(localStorage.getItem(e.key))}catch(t){return console.error(t),localStorage.removeItem(e.key),{}}}function k(){let t=i.fromEntries(i.entries(localStorage)),o=i.fromEntries(a.cookie.split("; ").map(e=>e.split("="))),{consentTime:n,...l}=v()||e.sections.slice(1).reduce((e,t)=>(e[t]=!1,{consentTime:void 0,...e}),{});for(let[n,s]of i.entries(l)){if(s)continue;let l=i.keys(e[`${n}Cookies`]||{});for(let e of(l.filter(e=>e.endsWith("*")).map(e=>{i.keys({...o,...t}).map(t=>{t.startsWith(e.slice(0,-1))&&l.push(t)})}),l)){if(o[e]){let t=`${e}=;expires=Thu, 01 Jan 1970 00:00:01 UTC;path=/;`;a.cookie=t,a.cookie=`${t}domain=${location.hostname};`,a.cookie=`${t}domain=.${location.hostname};`,f("delete",{cookie:e})}t[e]&&(localStorage.removeItem(e),f("delete",{localStorage:e}))}}}function y(o){let a=void 0===o,n={consentTime:+new Date};e.sections.forEach(e=>{if("essential"===e)return;let t=c.querySelector(`[data-s=${e}]`),i=a?t.checked:o;n[e]=i,a||(t.checked=o)}),h(b(),n),g(n),localStorage.setItem(e.key,JSON.stringify(n)),f("save",{data:n}),k(),E(),t.open&&t.close(),m(!1)}function E(){a.querySelectorAll("script[data-consent]").forEach(e=>{if(!b()[e.dataset.consent])return;let t=a.createElement("script");for(let{name:o,value:a}of e.attributes)o.startsWith("data-")||"type"===o||t.setAttribute(o,a);t.setAttribute("type",e.dataset.type||"text/javascript"),e.src||(t.textContent=e.textContent),e.parentNode.replaceChild(t,e),f("inject",{el:e,...e.id&&{id:e.id}}),e.src&&""!==e.textContent.trim()&&t.addEventListener("load",()=>{let o=a.createElement("script");o.textContent=e.textContent,e.id&&(o.id=e.id+"-after"),t.insertAdjacentElement("afterend",o),f("inject",{el:o,parent:e,...o.id&&{id:o.id}})})})}export default{create:function(){let l=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};if(o)return o;e={...s,...l};let p=n.bmInvalidate=()=>{f("invalidate",{data:b()}),h({}),y(!1),g({}),localStorage.removeItem(e.key),m(!0),e.force&&t.showModal()},T=n.bmUpdate=()=>{f("update",{data:b()}),u()};return g(v()||{}),function(){let t=Intl.DateTimeFormat().resolvedOptions().timeZone,o=/^(GMT|UTC)$/.test(t)||/(Europe|BST|CEST|CET|EET|IST|WEST|WET|GMT-1|GMT-2|UTC+1|UTC+2|UTC+3)/.test(t);e.acceptNonEU&&!o&&(y(!0),m(!1))}(),c.className="biscuitman",c.innerHTML=`
${e.title}

${e.message}

${e.settingsTitle}

${e.message}

${e.info.split("\n").map((t,o,a)=>`${t}${a.length>1&&e.enableMore&&0==o?`${e.more}`:""}`).join("")}

${e.sections.map(t=>{let o=b()[t],a="essential"===t,n=a?"disabled":"",l=a?"checked":"";void 0!==o&&(l=o?"checked":"");let s=e[`${t}Cookies`];return`
${e[`${t}Title`]}

${e[`${t}Message`]}

${s?i.entries(s).map(e=>{let[t,o]=e;return`
${t}
${o}
`}).join(""):`
${e.noCookies}
`}
`}).join("")}
`.replaceAll("{link}",`${e.linkText}`),c.onclick=e=>{let o=e.target.dataset.id;if(o)switch(f("button",{id:o}),o){case"more":e.target.remove();break;case"accept":y(!0);break;case"close":t.close();break;case"settings":u();break;case"save":y();break;case"reject":y(!1)}},t=c.querySelector("dialog"),e.dialogPolyfill&&!t.close&&function(t){function o(){a.documentElement.classList.add("bm-dialog-polyfill"),n.dialogPolyfill.registerDialog(t)}if(n.dialogPolyfill)o();else{let t=a.createElement("script");t.onload=o,t.src=e.dialogPolyfill,a.head.appendChild(t)}}(t),t.onclose=()=>f("close"),e.force&&(t.oncancel=e=>e.preventDefault(),t.onkeydown=e=>"Escape"===e.key?e.preventDefault():null),c.querySelectorAll("[data-s]").forEach(e=>e.addEventListener("change",t=>{e.parentElement.classList.toggle("checked",t.target.checked)})),a.body.appendChild(c),n.addEventListener("resize",d),k(),n[e.global].consentTime?(m(!1),E()):(m(!0),e.force&&u()),o={consent:$,invalidate:p,update:T,on:(e,t)=>{let a=`bm:${e}`;return r[a]||(r[a]=[]),r[a].push(t),o},off:(e,t)=>{let o=`bm:${e}`;r[o]&&(r[o]=r[o].filter(e=>e!==t))}}}};;if(typeof BMCSS==='undefined'){let c=document.createElement('style');c.id='BMCSS';c.textContent=`/*! biscuitman.js 0.5.0 */.biscuitman{--ui:0,0,0;--tx:#444;--bg:#fff;--c:#105d89;background:var(--bg);box-sizing:border-box;z-index:3;width:100%;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;display:none;position:fixed;bottom:0;box-shadow:0 -2px 10px #00000029}.bm-show .biscuitman{display:block}.biscuitman *{box-sizing:border-box;color:var(--tx);margin:0;padding:0;font-family:inherit;font-size:16px;line-height:1.4em}.biscuitman:has([open]){transform:translateY(100%)}.biscuitman article{padding:0;position:relative}@media (min-width:770px){.biscuitman article{padding-right:calc(max(300px,30vw) + 20px)}.biscuitman article nav{width:30vw;min-width:300px;position:absolute;bottom:50%;right:0;transform:translateY(50%)}}.biscuitman article p{color:var(--tx);margin:10px 0;font-size:13px}@media (min-width:575px){.biscuitman article p{font-size:14px}}.biscuitman button{background:var(--bg);border:2px solid var(--c);color:var(--c);cursor:pointer;border-radius:3px;margin-top:10px;padding:.8em;font-size:13px;line-height:1em}.biscuitman button[data-id=accept]{background:var(--c);color:var(--bg)!important}.biscuitman button[data-id=close]{color:rgba(var(--ui),.5);opacity:.6;-webkit-user-select:none;user-select:none;z-index:2;background:0 0;border:none;outline:none;padding:10px;font-size:24px;line-height:1em;position:absolute;top:0;right:10px}.biscuitman button[disabled]{display:none}.biscuitman button:hover{opacity:.8}@media (min-width:576px){.biscuitman nav{flex-direction:row-reverse;gap:10px;width:100%;display:flex}.biscuitman nav button{flex-grow:1;margin-bottom:0}}@media (max-width:575px){.biscuitman nav{flex-direction:column;flex-grow:1;display:flex}}.biscuitman dialog{background:var(--bg);border:0;width:100%;max-width:100%;height:100%;max-height:100%}@media (min-width:576px){.biscuitman dialog{border-radius:10px;width:90vw;max-width:860px;max-height:80vh;margin:auto;box-shadow:0 0 8px #0000004d}}@media (min-width:576px) and (min-height:1134px){.biscuitman dialog{max-height:950px}}.biscuitman dialog nav{justify-self:flex-end;position:relative}.biscuitman .bm-dialog{flex-direction:column;height:100%;padding:20px;display:flex}.biscuitman .bm-dialog b{padding-bottom:8px;position:relative}.biscuitman .bm-dialog>b:after{content:"";background:linear-gradient(180deg,var(--bg)20%,#fff0);pointer-events:none;z-index:1;width:100%;height:25px;margin-bottom:-24px;position:absolute;bottom:0;left:0}.biscuitman .bm-dialog nav:after{content:"";background:linear-gradient(0deg,var(--bg)20%,#fff0);pointer-events:none;width:100%;height:25px;position:absolute;top:-24px;left:0}.biscuitman .bm-sections{scrollbar-color:rgba(var(--ui),.2)var(--bg);flex-shrink:1;height:100%;padding:15px 0;position:relative;overflow-y:scroll}@media (min-width:576px){.biscuitman .bm-sections{margin-right:-18px;padding-right:4px}}.biscuitman .bm-sections>p{padding-right:30px;font-size:13px;line-height:18px}@media (min-width:576px){.biscuitman .bm-sections>p{font-size:14px}}.biscuitman .bm-sections>p span{font-size:inherit;padding-bottom:5px;display:inline-block}.biscuitman .bm-sections>p [data-id=more]~span{display:none}.biscuitman a{font-size:inherit;color:var(--c);cursor:pointer;text-decoration:none;display:inline-block}.biscuitman a:hover{text-decoration:underline}.biscuitman section{margin-bottom:10px;position:relative}.biscuitman section:first-of-type{margin-top:10px}.biscuitman details{border:1px solid rgba(var(--ui),.2);border-radius:5px;padding:10px;list-style:none;box-shadow:0 2px 4px #0000001a}.biscuitman details[open] summary b:after{margin:-3px 0 0 -2px;transform:rotate(45deg)scale(.3)}.biscuitman summary{cursor:pointer;flex-direction:column;width:100%;padding:5px 80px 10px 10px;list-style:none;display:flex;position:relative}.biscuitman summary b{margin-bottom:3px}.biscuitman summary b:after{content:"";border:5px solid rgba(var(--ui),.4);border-top-color:#0000;border-left-color:#0000;border-radius:2px;width:1em;height:1em;margin:-2px 0 0 -4px;display:block;transform:rotate(-45deg)scale(.3)}.biscuitman summary p{color:var(--tx);font-size:14px}.biscuitman summary>*{display:inline-flex}.biscuitman summary::marker{display:none}.biscuitman summary::-webkit-details-marker{display:none}.biscuitman dl{background:rgba(var(--ui),.08);margin:10px;padding:10px;display:flex}.biscuitman dl dt,.biscuitman dl dd{color:var(--tx);font-size:12px}.biscuitman dl dt{min-width:120px;padding-right:30px;font-weight:700}.biscuitman label{--height:1.2em;--width:2.3em;--gap:2px;height:var(--height);width:var(--width);background-color:rgba(var(--ui),.3);border-radius:var(--height);margin-top:-2px;display:block;position:absolute;top:50%;right:20px;transform:translateY(-50%);font-size:20px!important}.biscuitman label:before{content:"";background:var(--bg);height:calc(var(--height) - calc(var(--gap)*2));width:calc(var(--height) - calc(var(--gap)*2));height:var(--height);width:var(--height);left:var(--gap);transform-origin:50%;border-radius:100%;display:block;position:absolute;top:50%;left:0;transform:translateY(-50%)scale(.8)}.biscuitman label.checked{background-color:var(--c)}.biscuitman label.checked:before{left:auto;right:0}.biscuitman label:has(:focus-visible){outline:auto highlight}.biscuitman label.disabled.checked{opacity:.5}.biscuitman label input{opacity:0}.bm-dialog-polyfill .biscuitman dialog{position:fixed;top:50%;transform:translateY(-50%)}`;document.head.appendChild(c)} \ No newline at end of file diff --git a/dist/esm/biscuitman.withcss.mjs b/dist/esm/biscuitman.withcss.mjs index 61ba011..fc559a4 100644 --- a/dist/esm/biscuitman.withcss.mjs +++ b/dist/esm/biscuitman.withcss.mjs @@ -34,19 +34,19 @@ function render() { ${options.title}

${options.message}

-
+
${options.settingsTitle} - -
+ +

${options.message}

${options.info.split('\n').map((line, i, arr)=>`${line} - ${arr.length > 1 && options.enableMore && i == 0 ? `${options.more}` : ''}`).join('')} + ${arr.length > 1 && options.enableMore && i == 0 ? `${options.more}` : ''}`).join('')}

${options.sections.map((section)=>{ let hasConsent = getConsents()[section]; @@ -60,8 +60,8 @@ function render() {
${options[`${section}Title`]} - @@ -74,9 +74,9 @@ function render() { }).join('')}
`.replaceAll('{link}', `${options.linkText}`); @@ -107,7 +107,7 @@ function render() { } }; dialog = ui.querySelector('dialog'); - if (options.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog); + if (options.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog); dialog.onclose = ()=>dispatch('close'); if (options.force) { dialog.oncancel = (e)=>e.preventDefault(); diff --git a/src/biscuitman.js b/src/biscuitman.js index 27a4fb6..161b476 100644 --- a/src/biscuitman.js +++ b/src/biscuitman.js @@ -116,22 +116,23 @@ case 'reject': saveConsents(false) } } + ui.onchange = e => { + if (!e.target.dataset.s) return + e.target.parentElement.classList.toggle('checked', e.target.checked) + } dialog = ui.querySelector('dialog') - if (o.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog) + if (o.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog) dialog.onclose = () => dispatch('close') if (o.force) { dialog.oncancel = e => e.preventDefault() dialog.onkeydown = e => e.key === 'Escape' ? e.preventDefault() : null } - ui.querySelectorAll('[data-s]').forEach(checkbox => checkbox.addEventListener('change', e => { - checkbox.parentElement.classList.toggle('checked', e.target.checked) - })) d.body.appendChild(ui) w.addEventListener('resize', updateBannerHeight) } const updateBannerHeight = () => { h.style.setProperty('--bm-height', `${ui.offsetHeight}px`) } - const displayUI = (show) => { + const displayUI = show => { h.classList.toggle('bm-show', show) updateBannerHeight() } diff --git a/src/biscuitman.mjs b/src/biscuitman.mjs index 6f1974d..db9ca49 100644 --- a/src/biscuitman.mjs +++ b/src/biscuitman.mjs @@ -58,21 +58,21 @@ function render() { ${options.title}

${options.message}

-
+
${options.settingsTitle} - -
+ +

${options.message}

${options.info.split('\n').map((line, i, arr) => `${line} ${arr.length > 1 && options.enableMore && i == 0 ? - `${options.more}` : '' + `${options.more}` : '' }`).join('')}

${options.sections.map(section => { @@ -87,8 +87,8 @@ function render() {
${options[`${section}Title`]} - @@ -99,9 +99,9 @@ function render() { `}).join('')}
`.replaceAll('{link}',`${options.linkText}`) @@ -119,7 +119,7 @@ function render() { } } dialog = ui.querySelector('dialog') - if (options.dialogPolyfill && !dialog.close || !dialog.showModal) loadDialogPolyfill(dialog) + if (options.dialogPolyfill && !dialog.close) loadDialogPolyfill(dialog) dialog.onclose = () => dispatch('close') if (options.force) { dialog.oncancel = e => e.preventDefault() @@ -133,7 +133,7 @@ function render() { } const updateBannerHeight = () => { h.style.setProperty('--bm-height', `${ui.offsetHeight}px`) } -const displayUI = (show) => { +const displayUI = show => { h.classList.toggle('bm-show', show) updateBannerHeight() }