COVID-19 Badges

COVID-19 Badges can be put on your products, giving your customers extra reassurance and information in the time of the crisis. Exponea prepared two types of icons/badges on the product page for you:

Global badges
If you have adopted a new policy (a new way of delivering items or disinfecting them or new return policy), display these badges on your product image to give comfort to consumers, reduce their anxiety and remove doubt.

Product-specific badges
Some of your products might fit the changing habits in consumer preferences well and you might want to use this as an opportunity to display certain badges on these products. For example, some clothes might be more comfortable and you can display a "comfy home wear" badge on them. Or some items fit the quarantine life better than usual, such as board games, or an elliptical bike.

These designs are compliments of Exponea, but the web layers are all parametric, so you can change these icons and titles of the badges based on your industry and own practices you adopted.

📘

You can use these either global or product-specific badges in two ways: You can show them on the product page, and/or you can show them on list pages, such as brand or category pages.

Importing the badges

In order to import the package, copy the following JSON code into a text file and import it following the guide in the Initiatives article.

{"files":[],"initiative":{"archived":false,"cloned_from_id":"5e793509a74957a76721fac9","color":"rgb(255, 106, 77)","description":"Add badges on your product images to show either your company practices or how that specific product can help life under quarantine","name":"CV19 badges","pinned":false,"prevent_archivation":false},"items":[{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"COVID-19 Aggregated background worker (don't touch, don't start)","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"any"}]},"variants":[{"enabled":true,"group":"","html":"","id":0,"name":"Variant A","parametrized_parts":{"html":"","script":"var self = this;\n\n/*\n\tExpecting params (\"params\" obj):\n\t\tbadges: [\n\t\t\t{\n\t\t\t\tcatalog_name\n\t\t\t\tcatalog_attribute\n\t\t\t\tproduct_id\n\t\t\t\tbadge_unique_class\n\t\t\t}\n\t\t]\n*/\n\nvar values = [],\n\tclassNames = [];\n\t\n{% for badge in params.badges %}\n\n\tvalues.push('{{ catalogs[badge.catalog_name].item_by_id(badge.product_id)[badge.catalog_attribute] }}');\n\tclassNames.push('{{ badge.badge_unique_class }}');\n\n{% endfor %}\n\n\nfor (var i=0; i<values.length; i++) {\n\tvar value = values[i],\n\t\tbadge = document.querySelector('.exponea-covid-19-badge.'+classNames[i]);\n\t\t\n\tif (!value || value==='' || value.toLowerCase()==='false' || value=='0' || value=='-1') {\n\t\t// do not display\n\t\t// remove form document to release place for other badges\n\t\tbadge.parentNode.removeChild(badge);\n\t}\n\t// any other value\n\telse { \n\t\t// display badge\n\t\tbadge.classList.remove('badge-state-loading');\n\t}\n}\n\nreturn {\n    remove: function() {}\n};","sdk_object_name":"exponea","style":""},"params":{"backgroundColor":"#00b7db","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","buttonText":"Default button text","closeButtonColor":"#ffffff","headerText":"Default header text","headerTextColor":"#1c1733"},"percentage":100,"script":"var self = this;\n\n/*\n\tExpecting params (\"params\" obj):\n\t\tbadges: [\n\t\t\t{\n\t\t\t\tcatalog_name\n\t\t\t\tcatalog_attribute\n\t\t\t\tproduct_id\n\t\t\t\tbadge_unique_class\n\t\t\t}\n\t\t]\n*/\n\nvar values = [],\n\tclassNames = [];\n\t\n{% for badge in params.badges %}\n\n\tvalues.push('{{ catalogs[badge.catalog_name].item_by_id(badge.product_id)[badge.catalog_attribute] }}');\n\tclassNames.push('{{ badge.badge_unique_class }}');\n\n{% endfor %}\n\n\nfor (var i=0; i<values.length; i++) {\n\tvar value = values[i],\n\t\tbadge = document.querySelector('.exponea-covid-19-badge.'+classNames[i]);\n\t\t\n\tif (!value || value==='' || value.toLowerCase()==='false' || value=='0' || value=='-1') {\n\t\t// do not display\n\t\t// remove form document to release place for other badges\n\t\tbadge.parentNode.removeChild(badge);\n\t}\n\t// any other value\n\telse { \n\t\t// display badge\n\t\tbadge.classList.remove('badge-state-loading');\n\t}\n}\n\nreturn {\n    remove: function() {}\n};","source_mode":true,"style":"","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e8168810b6360ead8956bc5","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"COVID-19 Badge \"List Page\" Container","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge-container exponea-badge-container-list-page exponea-state-loading-badges\">\n\t<div class=\"exponea-covid-19-badge-wrapper\"></div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge-container exponea-badge-container-list-page exponea-state-loading-badges\">\n\t<div class=\"exponea-covid-19-badge-wrapper\"></div>\n</div>","script":"var self = this,\n\tEXPONEA_BADGE_CONTAINER_CLASS_NAME = '.exponea-covid-19-badge-container',\n\tWEBLAYER_CONDITIONAL_VIEW = '5e8168810b6360ead8956bc5'; // \"COVID-19 Aggregated background worker (don't touch, don't start)\"\n\n{% set productIdJavascriptExpression %}(function(){ var node = self; while (node && node.className.indexOf('product-img')==-1) node = node.parentNode; return node && node.querySelector('.product-like').getAttribute('data-product-id'); })();{% endset %}\nvar getProductIdScript = \"{{ productIdJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tproductId;\n\t\n{% set languageJavascriptExpression %}document.documentElement.lang{% endset %}\nvar langExpression = \"{{ languageJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tlang,\n\temptyBadge,\n\tobserver,\n\tonce = false,\n\t_callbacks = [],\n\t_badges = [];\n\t\t    \nif (document.readyState==='loading') {\n\tdocument.addEventListener('DOMContentLoaded', main, false);\n}\nelse {\n\tmain();\n}\n\n\t\n\t\t    \nfunction main() {\n\tvar selector = self.inPreview ? 'body' : '.product-listing-container .product-stickers';\n\t\t\n\tif (langExpression) {\n\t\ttry {\n\t\t\teval('lang = '+langExpression)\n\t\t}\n\t\tcatch(e) {\n\t\t\tconsole.log('languageJavascriptExpression', langExpression, e);\n\t\t}\n\t}\n\t\n\temptyBadge = document.createElement('div');\n\temptyBadge.className = 'exponea-covid-19-badge';\n\temptyBadge.innerHTML = '<img src=\"data:image/png;base64,'+\n\t\t\t\t\t\t\t'iVBORw0KGgoAAAANSUhEUgAAAAEAAAA'+\n\t\t\t\t\t\t\t'BCAQAAAC1HAwCAAAAC0lEQVR42mNkYA'+\n\t\t\t\t\t\t\t'AAAAYAAjCB0C8AAAAASUVORK5CYII=\" />';\n\n\tvar containers = document.querySelectorAll(selector);\n\t// INIT ----------------------------------------------\n\tinit(containers);\n\t\n\t// watch for new containers (e.g lazy loading)\n\tobserver = new MutationObserver(function(mutationsList, observer) {\n\t\tvar elements = [];\n\t\tfor (var i=0; i<mutationsList.length; i++) {\n\t\t\tvar mutationRecord = mutationsList[i];\n\t\t\tif (mutationRecord.type=='childList' && mutationRecord.addedNodes && mutationRecord.addedNodes.length) {\n\t\t\t\tfor (var k=0; k<mutationRecord.addedNodes.length; k++) {\n\t\t\t\t\taddAllSubNodesToArray(elements, mutationRecord.addedNodes[k]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tvar allContainers = document.querySelectorAll('.product-listing-container .product-stickers')\n\t\t\tnewContainers = [];\n\t\tfor (var i=0; i<allContainers.length; i++) {\n\t\t\tif (elements.indexOf(allContainers[i])!==-1)\n\t\t\t\tnewContainers.push( allContainers[i] );\n\t\t}\n\t\t// INIT ----------------------------------------------\n\t\tinit(newContainers);\n\t});\n\t\n\tobserver.observe(document.documentElement, { attributes: false, childList: true, subtree: true, characterData: false });\n}\n\nfunction init(containers) {\n\tfor (var i=0; i<containers.length; i++) {\n\t\t(function(container){\n\t\t\t\n\t\t\t// if container css position is 'static' set 'relative'\n\t\t\tvar position = window.getComputedStyle(container, null).getPropertyValue(\"position\");\n\t\t\tif (position==='static') {\n\t\t\t\tcontainer.style.position = 'relative';\n\t\t\t}\n\t\t\t\n\t\t\t// insert HTML\n\t    \tcontainer.insertAdjacentHTML('beforeend', self.html);\n\t    \t\n\t    \tvar badgeContainer = container.querySelector(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t    \t\n\t    \tbadgeContainer.setAttribute('animation', 'fade-in');\t\n\t    \t\n\t    \tif (lang) {\n\t    \t\tbadgeContainer.setAttribute('lang', lang);\t\n\t    \t}\n\t    \n\t    \tif (getProductIdScript && getProductIdScript.trim()!=='') {\n\t    \t\ttry {\n\t    \t\t\tfunction inContext() {\n\t    \t\t\t\tvar self = this;\n\t\t    \t\t\teval('productId = ' + getProductIdScript);\n\t    \t\t\t}\n\t    \t\t\tinContext.call(badgeContainer);\n\t\t\t    \tbadgeContainer.setAttribute('product-id', productId);\n\t    \t\t}\n\t    \t\tcatch(e) {\n\t    \t\t\tconsole.log('You have an error in expression:', getProductIdScript, e);\n\t    \t\t}\n\t\t    }\n\t\t    \n\t\t    // callback to support lazy loading - container will let know its badges\n\t\t    badgeContainer.registerBadge = function( badge, initCallback ) {\n\t\t    \tif (_badges.indexOf(badge)===-1) {\n\t\t    \t\t_badges.push( badge );\n\t\t    \t\t_callbacks.push( initCallback );\n\t\t    \t}\n\t\t    }\n\t\t    \n\t\t    // init badges\n\t\t\tfor (var k=0; k<_callbacks.length; k++) {\n\t\t\t\t_callbacks[k]( badgeContainer.firstElementChild );\n\t\t\t}\n\t\t\t\n\t\t    // show badge container if all badges are loaded\n\t\t    function showBadgeContainer() {\n\t\t    \tbadgeContainer.classList.remove('exponea-state-loading-badges');\n\t\t    \tbadgeContainer.classList.add('animation-fade-in');\n\t\t    }\n\n\t\t    // fallback if something goes wrong (after one 1.5 seconds)\n\t\t    setTimeout(function(){\n\t\t    \t// move loading badges (.badge-state-loading) at the end of the container to show loaded\n\t\t    \t// (if count of the displayed badges is limited)\n\t\t    \tvar loadingBadges = badgeContainer.querySelectorAll('.badge-state-loading');\n\t\t    \tfor (var k=0; k<loadingBadges.length; k++) {\n\t\t    \t\t// move element to to the end (as a last child\n\t\t    \t\tloadingBadges[k].parentNode.appendChild(loadingBadges[k]);\n\t\t    \t\tvar order = (parseInt(loadingBadges[k].getAttribute('order'),10) || 0)+100;\n\t\t    \t\tloadingBadges[k].setAttribute('order', order);\n\t\t    \t\tloadingBadges[k].style.order = order;\n\t\t    \t}\n\t\t    \t// show whole badge container\n\t\t    \tshowBadgeContainer();\n\t\t    }, self.inPreview ? 0 : 1500);\n\t\t    \n\t    \t// insert CSS (only for first one - CSS is common/shared)\n\t\t    if (!once) {\n\t\t    \tonce = true;\n\t\t\t    container.insertAdjacentHTML(\n\t\t\t        'afterbegin',\n\t\t\t        '<style class=\"exponea-covid-19-style\">' + self.style + '</style>'\n\t\t\t    );\n\t\t\t    \n\t\t\t    if (self.inPreview)  {\n\t\t\t    \tvar wrapper = container.querySelector('.exponea-covid-19-badge-wrapper');\n\t\t\t    \tfor (var j=0; j<16; j++) {\n\t\t\t    \t\tvar badge = emptyBadge.cloneNode(true);\n\t\t\t    \t\tbadge.setAttribute('index', j+1);\n\t\t\t    \t\twrapper.appendChild(badge);\n\t\t\t    \t}\n\t\t\t    \tdocument.documentElement && document.documentElement.classList.add('in-preview-mode');\n\t\t\t    }\n\t\t    }\n\t\t    \n\t\t})(containers[i]);\n\t}\n}\n\n// aggregated (for all similar weblayers) asking wheter a badges are displayed for each product\nif (!window._exponea_load_badge) {\n\tvar badgeQueue = [],\n\t\ttimer;\n\twindow._exponea_load_badge = function(catalogName, catalogAttribute, productId, uniqueClass) {\n\t\tbadgeQueue.push({\n\t\t\t\"catalog_name\": catalogName,\n\t\t\t\"catalog_attribute\": catalogAttribute,\n\t\t\t\"product_id\": productId,\n\t\t\t\"badge_unique_class\": uniqueClass\t\n\t\t});\n\t\tclearTimeout(timer);\n\t\t// wait for other badges to aggregate function calls\n\t\ttimer = setTimeout(loadBadges, 20);\n\n\t\tfunction loadBadges() {\n\t\t\tif (badgeQueue.length>0) {\n\t\t\t\tself.sdk.showBanner(WEBLAYER_CONDITIONAL_VIEW, { \n\t\t\t\t\t\"badges\": badgeQueue\n\t\t\t\t}, !!'do not hide other weblayers', function(){\n\t\t\t\t\t// show badge container(s)\n\t\t\t\t\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t\t\t\t\tfor (var i=0; i<containers.length; i++) {\n\t\t\t\t\t\tvar container = containers[i];\n\t\t\t\t\t\tcontainer.classList.remove('exponea-state-loading-badges');\n\t\t\t    \t\tcontainer.classList.add('animation-' + container.getAttribute('animation'));\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t\tbadgeQueue = [];\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction addAllSubNodesToArray( list, node ) {\n\tif (node.nodeType==1) {\n\t\tlist.push(node);\n\t\tnode = node.firstElementChild;\n\t\twhile (node) {\n\t\t\taddAllSubNodesToArray( list, node );\n\t\t\tnode = node.nextElementSibling;\n\t\t}\t\t\n\t}\n}\n\nfunction removeContainer() {\n\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME+', .exponea-covid-19-style');\n\tfor (var i=0; i<containers.length; i++) {\n\t\tvar container = containers[i];\n\t\tcontainer.parentNode.removeChild(container); \n\t}\n    if (self.inPreview) {\n    \tdocument.documentElement && document.documentElement.classList.remove('in-preview-mode');\n    }\n    observer.disconnect();\n}\n\nreturn {\n    remove: removeContainer\n};","sdk_object_name":"exponea","style":"/*\n\n\t{% set targetElementSelectorCSS %}.product-listing-container .product-stickers{% endset %}\n\t{% set productIdJavascriptExpression %}(function(){ var node = self; while (node && node.className.indexOf('product-img')==-1) node = node.parentNode; return node && node.querySelector('.product-like').getAttribute('data-product-id'); })();{% endset %}\n\t\n\t{% set position %}relative{% endset %}\n\t{% set leftPosition %}{% endset %}\n\t{% set rightPosition %}{% endset %}\n\t{% set topPosition %}10px{% endset %}\n\t{% set bottomPosition %}{% endset %}\n\t\n\t{% set align %}center{% endset %}\n\t\n\t{% set direction %}vertical{% endset %}\n\t{% set reverseOrder %}false{% endset %}\n\t{% if direction!='horizontal' %}\n\t\t{% set direction = 'vertical' %}\n\t{% endif %}\n\t{% set maxCount %}4{% endset %}\n\t\n\t{% set size %}42px{% endset %}\n\t{% set spacing %}12px{% endset %}\n\t\n\t{% set animationType %}fade-in{% endset %}\n\t{% set animationDuration %}0.65s{% endset %}\n\t{% set animationDelay %}0.08s{% endset %}\n*/\n\n.exponea-covid-19-badge-container {\n\tbox-sizing: border-box;\n\t\n\t{% if leftPosition!='' or rightPosition!='' or topPosition!='' or bottomPosition!='' %}\n\tposition: relative;\n\t{% endif %}\n\t\n\t{% if leftPosition!='' %}\n\tleft: 0;\n\tmargin-left: ;\n\t{% endif %}\n\t\n\t{% if rightPosition!='' %}\n\tright: 0;\n\tmargin-right: ;\n\t{% endif %}\n\t\n\t{% if topPosition!='' %}\n\ttop: 0;\n\tmargin-top: 10px;\n\t{% endif %}\n\t\n\t{% if bottomPosition!='' %}\n\tbottom: 0;\n\tmargin-bottom: ;\n\t{% endif %}\n\t\n\tdisplay: flex;\n\t{% if align=='start' %}\n\t\tjustify-content: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\tjustify-content: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\tjustify-content: flex-end;\n\t{% endif %}\n\t\n\tmin-width: 42px;\n\tmin-height: 42px;\n}\n\nhtml:not(.in-preview-mode) .exponea-covid-19-badge-container.exponea-state-loading-badges {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge-wrapper {\n\tdisplay: flex;\n\t\n\t{% if direction!='vertical' %}\n\t\tflex-direction: {{ 'row' if reverseOrder=='false' else 'row-reverse' }};\n\t\tmargin: 0 calc(-0.5 * 12px);\n\t\theight: 42px;\n\t{% else %}\n\t\tflex-direction: {{ 'column' if reverseOrder=='false' else 'column-reverse' }};\n\t\tmargin: calc(-0.5 * 12px) 0;\n\t\twidth: 42px;\n\t{% endif %}\n\t\n\t{% if align=='start' %}\n\t\talign-items: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\talign-items: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\talign-items: flex-end;\n\t{% endif %}\n}\n\n.exponea-covid-19-badge-container.exponea-state-loading-badges .exponea-covid-19-badge {\n\topacity: 0;\n}\n\n.exponea-covid-19-badge.badge-state-loading img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge:not(._) {\n\topacity: 0;\n\t{% if direction!='vertical' %}\n\t\tmargin: 0 calc(12px / 2);\n\t{% else %}\n\t\tmargin: calc(12px / 2) 0;\n\t{% endif %}\n\t{% if maxCount!='all' %}\n\t\tdisplay: none;\n\t{% endif %}\n\t\n\twidth: 42px;\n\t\n\tanimation-duration: 0.65s;\n\tanimation-fill-mode: forwards;\n}\n\n\n{% if maxCount!='all' %}\n\t{% for i in range(maxCount*1+1) %}\n\t\t.exponea-covid-19-badge:nth-child({{ i }}) {\n\t\t\tdisplay: flex;\n\t\t\tanimation-delay: calc( {{ i - 1 }} * 0.08s );\n\t\t}\n\t{% endfor %}\n{% endif %}\n\n.exponea-covid-19-badge img {\n\twidth: 100%;\n\theight: auto;\n}\n\n.exponea-covid-19-badge-container.animation-none .exponea-covid-19-badge {\n\topacity: 1;\n}\n\n.exponea-covid-19-badge-container.animation-fade-in .exponea-covid-19-badge {\n\tanimation-name: fadeIn;\n}\n\n.exponea-covid-19-badge-container.animation-zoom-in .exponea-covid-19-badge {\n\tanimation-name: zoomIn;\n}\n\n.exponea-covid-19-badge-container.animation-bounce-in .exponea-covid-19-badge {\n\tanimation-name: bounceIn;\n}\n\n.exponea-covid-19-badge-container.animation-rotate-in .exponea-covid-19-badge {\n\tanimation-name: rotateIn;\n}\n\n.exponea-covid-19-badge-container.animation-rubber-band .exponea-covid-19-badge {\n\tanimation-name: rubberBand;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-x .exponea-covid-19-badge {\n\tanimation-name: flipInX;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-y .exponea-covid-19-badge {\n\tanimation-name: flipInY;\n}\n\n\n/* --- in preview mode ------------------- */\n\nhtml.in-preview-mode .exponea-covid-19-badge-container {\n\tborder: 2px solid rgba(255, 0, 0, 0.2);\n\tbackground-color: rgba(255, 0, 0, 0.1);\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge {\n\tbackground-color: rgba(255, 0, 0, 0.2);\n\tborder: 2px solid rgba(255, 0, 0, 0.5);\n\tposition: relative;\n\tbox-sizing: border-box;\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge::before {\n\tcontent: attr(index);\n\tposition: absolute;\n\tfont-family: arial;\n\tfont-size: 32px;\n\tcolor: red;\n\topacity: 0.75;\n\tleft: 50%;\n\ttop: 50%;\n\ttransform: translate(-50%, -50%);\n}\n\t\n\t\n\t\[email protected] fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\[email protected] zoomIn {\n  from {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  50% {\n    opacity: 1;\n  }\n  \n  to {\n  \topacity: 1;\n  }\n}\n\[email protected] bounceIn {\n  from,\n  20%,\n  40%,\n  60%,\n  80%,\n  to {\n    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n  }\n\n  0% {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  20% {\n    transform: scale3d(1.1, 1.1, 1.1);\n  }\n\n  40% {\n    transform: scale3d(0.9, 0.9, 0.9);\n  }\n\n  60% {\n    opacity: 1;\n    transform: scale3d(1.03, 1.03, 1.03);\n  }\n\n  80% {\n    transform: scale3d(0.97, 0.97, 0.97);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale3d(1, 1, 1);\n  }\n}\n\[email protected] rotateIn {\n  from {\n    transform-origin: center;\n    transform: rotate3d(0, 0, 1, -200deg);\n    opacity: 0;\n  }\n\n  to {\n    transform-origin: center;\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n}\n\[email protected] rubberBand {\n  from {\n    transform: scale3d(1, 1, 1);\n  }\n\n  30% {\n    transform: scale3d(1.25, 0.75, 1);\n  }\n\n  40% {\n    transform: scale3d(0.75, 1.25, 1);\n  }\n\n  50% {\n    transform: scale3d(1.15, 0.85, 1);\n  }\n\n  65% {\n    transform: scale3d(0.95, 1.05, 1);\n  }\n\n  75% {\n    transform: scale3d(1.05, 0.95, 1);\n  }\n\n  to {\n    transform: scale3d(1, 1, 1);\n    opacity: 1;\n  }\n}\n\[email protected] flipInX {\n  from {\n    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}\n\[email protected] flipInY {\n  from {\n    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}"},"params":{"align":"center","animationDelay":"0.08s","animationDuration":"0.65s","animationType":"fade-in","backgroundColor":"#00b7db","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","buttonText":"Default button text","closeButtonColor":"#ffffff","direction":"vertical","gap":"8px","headerText":"Default header text","headerTextColor":"#1c1733","languageJavascriptExpression":"document.documentElement.lang","leftPosition":"","maxCount":"4","position":"relative","productIdJavascriptExpression":"(function(){ var node = self; while (node && node.className.indexOf('product-img')==-1) node = node.parentNode; return node && node.querySelector('.product-like').getAttribute('data-product-id'); })();","reverseOrder":"false","rightPosition":"","size":"42px","spacing":"12px","targetElementSelector":".product-detail .pd-img","targetElementSelectorCSS":".product-listing-container .product-stickers","topPosition":"10px"},"percentage":100,"script":"var self = this,\n\tEXPONEA_BADGE_CONTAINER_CLASS_NAME = '.exponea-covid-19-badge-container',\n\tWEBLAYER_CONDITIONAL_VIEW = '5e8168810b6360ead8956bc5'; // \"COVID-19 Aggregated background worker (don't touch, don't start)\"\n\n{% set productIdJavascriptExpression %}[[ productIdJavascriptExpression ]]{% endset %}\nvar getProductIdScript = \"{{ productIdJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tproductId;\n\t\n{% set languageJavascriptExpression %}[[ languageJavascriptExpression | document.documentElement.lang ]]{% endset %}\nvar langExpression = \"{{ languageJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tlang,\n\temptyBadge,\n\tobserver,\n\tonce = false,\n\t_callbacks = [],\n\t_badges = [];\n\t\t    \nif (document.readyState==='loading') {\n\tdocument.addEventListener('DOMContentLoaded', main, false);\n}\nelse {\n\tmain();\n}\n\n\t\n\t\t    \nfunction main() {\n\tvar selector = self.inPreview ? 'body' : '[[ targetElementSelectorCSS ]]';\n\t\t\n\tif (langExpression) {\n\t\ttry {\n\t\t\teval('lang = '+langExpression)\n\t\t}\n\t\tcatch(e) {\n\t\t\tconsole.log('languageJavascriptExpression', langExpression, e);\n\t\t}\n\t}\n\t\n\temptyBadge = document.createElement('div');\n\temptyBadge.className = 'exponea-covid-19-badge';\n\temptyBadge.innerHTML = '<img src=\"data:image/png;base64,'+\n\t\t\t\t\t\t\t'iVBORw0KGgoAAAANSUhEUgAAAAEAAAA'+\n\t\t\t\t\t\t\t'BCAQAAAC1HAwCAAAAC0lEQVR42mNkYA'+\n\t\t\t\t\t\t\t'AAAAYAAjCB0C8AAAAASUVORK5CYII=\" />';\n\n\tvar containers = document.querySelectorAll(selector);\n\t// INIT ----------------------------------------------\n\tinit(containers);\n\t\n\t// watch for new containers (e.g lazy loading)\n\tobserver = new MutationObserver(function(mutationsList, observer) {\n\t\tvar elements = [];\n\t\tfor (var i=0; i<mutationsList.length; i++) {\n\t\t\tvar mutationRecord = mutationsList[i];\n\t\t\tif (mutationRecord.type=='childList' && mutationRecord.addedNodes && mutationRecord.addedNodes.length) {\n\t\t\t\tfor (var k=0; k<mutationRecord.addedNodes.length; k++) {\n\t\t\t\t\taddAllSubNodesToArray(elements, mutationRecord.addedNodes[k]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tvar allContainers = document.querySelectorAll('[[ targetElementSelectorCSS ]]')\n\t\t\tnewContainers = [];\n\t\tfor (var i=0; i<allContainers.length; i++) {\n\t\t\tif (elements.indexOf(allContainers[i])!==-1)\n\t\t\t\tnewContainers.push( allContainers[i] );\n\t\t}\n\t\t// INIT ----------------------------------------------\n\t\tinit(newContainers);\n\t});\n\t\n\tobserver.observe(document.documentElement, { attributes: false, childList: true, subtree: true, characterData: false });\n}\n\nfunction init(containers) {\n\tfor (var i=0; i<containers.length; i++) {\n\t\t(function(container){\n\t\t\t\n\t\t\t// if container css position is 'static' set 'relative'\n\t\t\tvar position = window.getComputedStyle(container, null).getPropertyValue(\"position\");\n\t\t\tif (position==='static') {\n\t\t\t\tcontainer.style.position = 'relative';\n\t\t\t}\n\t\t\t\n\t\t\t// insert HTML\n\t    \tcontainer.insertAdjacentHTML('beforeend', self.html);\n\t    \t\n\t    \tvar badgeContainer = container.querySelector(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t    \t\n\t    \tbadgeContainer.setAttribute('animation', '[[ animationType ]]');\t\n\t    \t\n\t    \tif (lang) {\n\t    \t\tbadgeContainer.setAttribute('lang', lang);\t\n\t    \t}\n\t    \n\t    \tif (getProductIdScript && getProductIdScript.trim()!=='') {\n\t    \t\ttry {\n\t    \t\t\tfunction inContext() {\n\t    \t\t\t\tvar self = this;\n\t\t    \t\t\teval('productId = ' + getProductIdScript);\n\t    \t\t\t}\n\t    \t\t\tinContext.call(badgeContainer);\n\t\t\t    \tbadgeContainer.setAttribute('product-id', productId);\n\t    \t\t}\n\t    \t\tcatch(e) {\n\t    \t\t\tconsole.log('You have an error in expression:', getProductIdScript, e);\n\t    \t\t}\n\t\t    }\n\t\t    \n\t\t    // callback to support lazy loading - container will let know its badges\n\t\t    badgeContainer.registerBadge = function( badge, initCallback ) {\n\t\t    \tif (_badges.indexOf(badge)===-1) {\n\t\t    \t\t_badges.push( badge );\n\t\t    \t\t_callbacks.push( initCallback );\n\t\t    \t}\n\t\t    }\n\t\t    \n\t\t    // init badges\n\t\t\tfor (var k=0; k<_callbacks.length; k++) {\n\t\t\t\t_callbacks[k]( badgeContainer.firstElementChild );\n\t\t\t}\n\t\t\t\n\t\t    // show badge container if all badges are loaded\n\t\t    function showBadgeContainer() {\n\t\t    \tbadgeContainer.classList.remove('exponea-state-loading-badges');\n\t\t    \tbadgeContainer.classList.add('animation-[[ animationType ]]');\n\t\t    }\n\n\t\t    // fallback if something goes wrong (after one 1.5 seconds)\n\t\t    setTimeout(function(){\n\t\t    \t// move loading badges (.badge-state-loading) at the end of the container to show loaded\n\t\t    \t// (if count of the displayed badges is limited)\n\t\t    \tvar loadingBadges = badgeContainer.querySelectorAll('.badge-state-loading');\n\t\t    \tfor (var k=0; k<loadingBadges.length; k++) {\n\t\t    \t\t// move element to to the end (as a last child\n\t\t    \t\tloadingBadges[k].parentNode.appendChild(loadingBadges[k]);\n\t\t    \t\tvar order = (parseInt(loadingBadges[k].getAttribute('order'),10) || 0)+100;\n\t\t    \t\tloadingBadges[k].setAttribute('order', order);\n\t\t    \t\tloadingBadges[k].style.order = order;\n\t\t    \t}\n\t\t    \t// show whole badge container\n\t\t    \tshowBadgeContainer();\n\t\t    }, self.inPreview ? 0 : 1500);\n\t\t    \n\t    \t// insert CSS (only for first one - CSS is common/shared)\n\t\t    if (!once) {\n\t\t    \tonce = true;\n\t\t\t    container.insertAdjacentHTML(\n\t\t\t        'afterbegin',\n\t\t\t        '<style class=\"exponea-covid-19-style\">' + self.style + '</style>'\n\t\t\t    );\n\t\t\t    \n\t\t\t    if (self.inPreview)  {\n\t\t\t    \tvar wrapper = container.querySelector('.exponea-covid-19-badge-wrapper');\n\t\t\t    \tfor (var j=0; j<16; j++) {\n\t\t\t    \t\tvar badge = emptyBadge.cloneNode(true);\n\t\t\t    \t\tbadge.setAttribute('index', j+1);\n\t\t\t    \t\twrapper.appendChild(badge);\n\t\t\t    \t}\n\t\t\t    \tdocument.documentElement && document.documentElement.classList.add('in-preview-mode');\n\t\t\t    }\n\t\t    }\n\t\t    \n\t\t})(containers[i]);\n\t}\n}\n\n// aggregated (for all similar weblayers) asking wheter a badges are displayed for each product\nif (!window._exponea_load_badge) {\n\tvar badgeQueue = [],\n\t\ttimer;\n\twindow._exponea_load_badge = function(catalogName, catalogAttribute, productId, uniqueClass) {\n\t\tbadgeQueue.push({\n\t\t\t\"catalog_name\": catalogName,\n\t\t\t\"catalog_attribute\": catalogAttribute,\n\t\t\t\"product_id\": productId,\n\t\t\t\"badge_unique_class\": uniqueClass\t\n\t\t});\n\t\tclearTimeout(timer);\n\t\t// wait for other badges to aggregate function calls\n\t\ttimer = setTimeout(loadBadges, 20);\n\n\t\tfunction loadBadges() {\n\t\t\tif (badgeQueue.length>0) {\n\t\t\t\tself.sdk.showBanner(WEBLAYER_CONDITIONAL_VIEW, { \n\t\t\t\t\t\"badges\": badgeQueue\n\t\t\t\t}, !!'do not hide other weblayers', function(){\n\t\t\t\t\t// show badge container(s)\n\t\t\t\t\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t\t\t\t\tfor (var i=0; i<containers.length; i++) {\n\t\t\t\t\t\tvar container = containers[i];\n\t\t\t\t\t\tcontainer.classList.remove('exponea-state-loading-badges');\n\t\t\t    \t\tcontainer.classList.add('animation-' + container.getAttribute('animation'));\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t\tbadgeQueue = [];\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction addAllSubNodesToArray( list, node ) {\n\tif (node.nodeType==1) {\n\t\tlist.push(node);\n\t\tnode = node.firstElementChild;\n\t\twhile (node) {\n\t\t\taddAllSubNodesToArray( list, node );\n\t\t\tnode = node.nextElementSibling;\n\t\t}\t\t\n\t}\n}\n\nfunction removeContainer() {\n\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME+', .exponea-covid-19-style');\n\tfor (var i=0; i<containers.length; i++) {\n\t\tvar container = containers[i];\n\t\tcontainer.parentNode.removeChild(container); \n\t}\n    if (self.inPreview) {\n    \tdocument.documentElement && document.documentElement.classList.remove('in-preview-mode');\n    }\n    observer.disconnect();\n}\n\nreturn {\n    remove: removeContainer\n};","source_mode":true,"style":"/*\n\n\t{% set targetElementSelectorCSS %}[[ targetElementSelectorCSS ]]{% endset %}\n\t{% set productIdJavascriptExpression %}[[ productIdJavascriptExpression ]]{% endset %}\n\t\n\t{% set position %}[[ position : enum(absolute, relative) | absolute ]]{% endset %}\n\t{% set leftPosition %}[[ leftPosition ]]{% endset %}\n\t{% set rightPosition %}[[ rightPosition ]]{% endset %}\n\t{% set topPosition %}[[ topPosition ]]{% endset %}\n\t{% set bottomPosition %}[[ bottomPosition ]]{% endset %}\n\t\n\t{% set align %}[[ align : enum(start, center, end) | center ]]{% endset %}\n\t\n\t{% set direction %}[[ direction : enum(vertical, horizontal) | vertical ]]{% endset %}\n\t{% set reverseOrder %}[[ reverseOrder : boolean ]]{% endset %}\n\t{% if direction!='horizontal' %}\n\t\t{% set direction = 'vertical' %}\n\t{% endif %}\n\t{% set maxCount %}[[ maxCount : enum(all, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16) | 5 ]]{% endset %}\n\t\n\t{% set size %}[[ size | 80px ]]{% endset %}\n\t{% set spacing %}[[ spacing | 10px ]]{% endset %}\n\t\n\t{% set animationType %}[[ animationType : enum(none, fade-in, zoom-in, bounce-in, rotate-in, rubber-band, flip-in-x, flip-in-y) | none ]]{% endset %}\n\t{% set animationDuration %}[[ animationDuration | 0.65s ]]{% endset %}\n\t{% set animationDelay %}[[ animationDelay | 0.08s ]]{% endset %}\n*/\n\n.exponea-covid-19-badge-container {\n\tbox-sizing: border-box;\n\t\n\t{% if leftPosition!='' or rightPosition!='' or topPosition!='' or bottomPosition!='' %}\n\tposition: [[ position ]];\n\t{% endif %}\n\t\n\t{% if leftPosition!='' %}\n\tleft: 0;\n\tmargin-left: [[ leftPosition ]];\n\t{% endif %}\n\t\n\t{% if rightPosition!='' %}\n\tright: 0;\n\tmargin-right: [[ rightPosition ]];\n\t{% endif %}\n\t\n\t{% if topPosition!='' %}\n\ttop: 0;\n\tmargin-top: [[ topPosition ]];\n\t{% endif %}\n\t\n\t{% if bottomPosition!='' %}\n\tbottom: 0;\n\tmargin-bottom: [[ bottomPosition ]];\n\t{% endif %}\n\t\n\tdisplay: flex;\n\t{% if align=='start' %}\n\t\tjustify-content: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\tjustify-content: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\tjustify-content: flex-end;\n\t{% endif %}\n\t\n\tmin-width: [[ size ]];\n\tmin-height: [[ size ]];\n}\n\nhtml:not(.in-preview-mode) .exponea-covid-19-badge-container.exponea-state-loading-badges {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge-wrapper {\n\tdisplay: flex;\n\t\n\t{% if direction!='vertical' %}\n\t\tflex-direction: {{ 'row' if reverseOrder=='false' else 'row-reverse' }};\n\t\tmargin: 0 calc(-0.5 * [[ spacing ]]);\n\t\theight: [[ size ]];\n\t{% else %}\n\t\tflex-direction: {{ 'column' if reverseOrder=='false' else 'column-reverse' }};\n\t\tmargin: calc(-0.5 * [[ spacing ]]) 0;\n\t\twidth: [[ size ]];\n\t{% endif %}\n\t\n\t{% if align=='start' %}\n\t\talign-items: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\talign-items: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\talign-items: flex-end;\n\t{% endif %}\n}\n\n.exponea-covid-19-badge-container.exponea-state-loading-badges .exponea-covid-19-badge {\n\topacity: 0;\n}\n\n.exponea-covid-19-badge.badge-state-loading img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge:not(._) {\n\topacity: 0;\n\t{% if direction!='vertical' %}\n\t\tmargin: 0 calc([[ spacing ]] / 2);\n\t{% else %}\n\t\tmargin: calc([[ spacing ]] / 2) 0;\n\t{% endif %}\n\t{% if maxCount!='all' %}\n\t\tdisplay: none;\n\t{% endif %}\n\t\n\twidth: [[ size ]];\n\t\n\tanimation-duration: [[ animationDuration ]];\n\tanimation-fill-mode: forwards;\n}\n\n\n{% if maxCount!='all' %}\n\t{% for i in range(maxCount*1+1) %}\n\t\t.exponea-covid-19-badge:nth-child({{ i }}) {\n\t\t\tdisplay: flex;\n\t\t\tanimation-delay: calc( {{ i - 1 }} * [[ animationDelay ]] );\n\t\t}\n\t{% endfor %}\n{% endif %}\n\n.exponea-covid-19-badge img {\n\twidth: 100%;\n\theight: auto;\n}\n\n.exponea-covid-19-badge-container.animation-none .exponea-covid-19-badge {\n\topacity: 1;\n}\n\n.exponea-covid-19-badge-container.animation-fade-in .exponea-covid-19-badge {\n\tanimation-name: fadeIn;\n}\n\n.exponea-covid-19-badge-container.animation-zoom-in .exponea-covid-19-badge {\n\tanimation-name: zoomIn;\n}\n\n.exponea-covid-19-badge-container.animation-bounce-in .exponea-covid-19-badge {\n\tanimation-name: bounceIn;\n}\n\n.exponea-covid-19-badge-container.animation-rotate-in .exponea-covid-19-badge {\n\tanimation-name: rotateIn;\n}\n\n.exponea-covid-19-badge-container.animation-rubber-band .exponea-covid-19-badge {\n\tanimation-name: rubberBand;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-x .exponea-covid-19-badge {\n\tanimation-name: flipInX;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-y .exponea-covid-19-badge {\n\tanimation-name: flipInY;\n}\n\n\n/* --- in preview mode ------------------- */\n\nhtml.in-preview-mode .exponea-covid-19-badge-container {\n\tborder: 2px solid rgba(255, 0, 0, 0.2);\n\tbackground-color: rgba(255, 0, 0, 0.1);\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge {\n\tbackground-color: rgba(255, 0, 0, 0.2);\n\tborder: 2px solid rgba(255, 0, 0, 0.5);\n\tposition: relative;\n\tbox-sizing: border-box;\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge::before {\n\tcontent: attr(index);\n\tposition: absolute;\n\tfont-family: arial;\n\tfont-size: 32px;\n\tcolor: red;\n\topacity: 0.75;\n\tleft: 50%;\n\ttop: 50%;\n\ttransform: translate(-50%, -50%);\n}\n\t\n\t\n\t\[email protected] fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\[email protected] zoomIn {\n  from {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  50% {\n    opacity: 1;\n  }\n  \n  to {\n  \topacity: 1;\n  }\n}\n\[email protected] bounceIn {\n  from,\n  20%,\n  40%,\n  60%,\n  80%,\n  to {\n    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n  }\n\n  0% {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  20% {\n    transform: scale3d(1.1, 1.1, 1.1);\n  }\n\n  40% {\n    transform: scale3d(0.9, 0.9, 0.9);\n  }\n\n  60% {\n    opacity: 1;\n    transform: scale3d(1.03, 1.03, 1.03);\n  }\n\n  80% {\n    transform: scale3d(0.97, 0.97, 0.97);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale3d(1, 1, 1);\n  }\n}\n\[email protected] rotateIn {\n  from {\n    transform-origin: center;\n    transform: rotate3d(0, 0, 1, -200deg);\n    opacity: 0;\n  }\n\n  to {\n    transform-origin: center;\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n}\n\[email protected] rubberBand {\n  from {\n    transform: scale3d(1, 1, 1);\n  }\n\n  30% {\n    transform: scale3d(1.25, 0.75, 1);\n  }\n\n  40% {\n    transform: scale3d(0.75, 1.25, 1);\n  }\n\n  50% {\n    transform: scale3d(1.15, 0.85, 1);\n  }\n\n  65% {\n    transform: scale3d(0.95, 1.05, 1);\n  }\n\n  75% {\n    transform: scale3d(1.05, 0.95, 1);\n  }\n\n  to {\n    transform: scale3d(1, 1, 1);\n    opacity: 1;\n  }\n}\n\[email protected] flipInX {\n  from {\n    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}\n\[email protected] flipInY {\n  from {\n    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7daa8217046af3719e84c3","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"COVID-19 Badge \"Product Page\" Container","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge-container exponea-badge-container-detail-page exponea-state-loading-badges\">\n\t<div class=\"exponea-covid-19-badge-wrapper\"></div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge-container exponea-badge-container-detail-page exponea-state-loading-badges\">\n\t<div class=\"exponea-covid-19-badge-wrapper\"></div>\n</div>","script":"var self = this,\n\tEXPONEA_BADGE_CONTAINER_CLASS_NAME = '.exponea-covid-19-badge-container',\n\tWEBLAYER_CONDITIONAL_VIEW = '5e8168810b6360ead8956bc5'; // \"COVID-19 Aggregated background worker (don't touch, don't start)\"\n\n{% set productIdJavascriptExpression %}dataLayer.find(function(item){ return item.ecommerce }).ecommerce.detail.products[0].id{% endset %}\nvar getProductIdScript = \"{{ productIdJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tproductId;\n\t\n{% set languageJavascriptExpression %}document.documentElement.lang{% endset %}\nvar langExpression = \"{{ languageJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tlang,\n\temptyBadge,\n\tobserver,\n\tonce = false,\n\t_callbacks = [],\n\t_badges = [];\n\t\t    \nif (document.readyState==='loading') {\n\tdocument.addEventListener('DOMContentLoaded', main, false);\n}\nelse {\n\tmain();\n}\n\n\t\n\t\t    \nfunction main() {\n\tvar selector = self.inPreview ? 'body' : '.product-detail .product-gallery > .row';\n\t\t\n\tif (langExpression) {\n\t\ttry {\n\t\t\teval('lang = '+langExpression)\n\t\t}\n\t\tcatch(e) {\n\t\t\tconsole.log('languageJavascriptExpression', langExpression, e);\n\t\t}\n\t}\n\t\n\temptyBadge = document.createElement('div');\n\temptyBadge.className = 'exponea-covid-19-badge';\n\temptyBadge.innerHTML = '<img src=\"data:image/png;base64,'+\n\t\t\t\t\t\t\t'iVBORw0KGgoAAAANSUhEUgAAAAEAAAA'+\n\t\t\t\t\t\t\t'BCAQAAAC1HAwCAAAAC0lEQVR42mNkYA'+\n\t\t\t\t\t\t\t'AAAAYAAjCB0C8AAAAASUVORK5CYII=\" />';\n\n\tvar containers = document.querySelectorAll(selector);\n\t// INIT ----------------------------------------------\n\tinit(containers);\n\t\n\t// watch for new containers (e.g lazy loading)\n\tobserver = new MutationObserver(function(mutationsList, observer) {\n\t\tvar elements = [];\n\t\tfor (var i=0; i<mutationsList.length; i++) {\n\t\t\tvar mutationRecord = mutationsList[i];\n\t\t\tif (mutationRecord.type=='childList' && mutationRecord.addedNodes && mutationRecord.addedNodes.length) {\n\t\t\t\tfor (var k=0; k<mutationRecord.addedNodes.length; k++) {\n\t\t\t\t\taddAllSubNodesToArray(elements, mutationRecord.addedNodes[k]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tvar allContainers = document.querySelectorAll('.product-detail .product-gallery > .row')\n\t\t\tnewContainers = [];\n\t\tfor (var i=0; i<allContainers.length; i++) {\n\t\t\tif (elements.indexOf(allContainers[i])!==-1)\n\t\t\t\tnewContainers.push( allContainers[i] );\n\t\t}\n\t\t// INIT ----------------------------------------------\n\t\tinit(newContainers);\n\t});\n\t\n\tobserver.observe(document.documentElement, { attributes: false, childList: true, subtree: true, characterData: false });\n}\n\nfunction init(containers) {\n\tfor (var i=0; i<containers.length; i++) {\n\t\t(function(container){\n\t\t\t\n\t\t\t// if container css position is 'static' set 'relative'\n\t\t\tvar position = window.getComputedStyle(container, null).getPropertyValue(\"position\");\n\t\t\tif (position==='static') {\n\t\t\t\tcontainer.style.position = 'relative';\n\t\t\t}\n\t\t\t\n\t\t\t// insert HTML\n\t    \tcontainer.insertAdjacentHTML('beforeend', self.html);\n\t    \t\n\t    \tvar badgeContainer = container.querySelector(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t    \t\n\t    \tbadgeContainer.setAttribute('animation', 'fade-in');\t\n\t    \t\n\t    \tif (lang) {\n\t    \t\tbadgeContainer.setAttribute('lang', lang);\t\n\t    \t}\n\t    \n\t    \tif (getProductIdScript && getProductIdScript.trim()!=='') {\n\t    \t\ttry {\n\t    \t\t\tfunction inContext() {\n\t    \t\t\t\tvar self = this;\n\t\t    \t\t\teval('productId = ' + getProductIdScript);\n\t    \t\t\t}\n\t    \t\t\tinContext.call(badgeContainer);\n\t\t\t    \tbadgeContainer.setAttribute('product-id', productId);\n\t    \t\t}\n\t    \t\tcatch(e) {\n\t    \t\t\tconsole.log('You have an error in expression:', getProductIdScript, e);\n\t    \t\t}\n\t\t    }\n\t\t    \n\t\t    // callback to support lazy loading - container will let know its badges\n\t\t    badgeContainer.registerBadge = function( badge, initCallback ) {\n\t\t    \tif (_badges.indexOf(badge)===-1) {\n\t\t    \t\t_badges.push( badge );\n\t\t    \t\t_callbacks.push( initCallback );\n\t\t    \t}\n\t\t    }\n\t\t    \n\t\t    // init badges\n\t\t\tfor (var k=0; k<_callbacks.length; k++) {\n\t\t\t\t_callbacks[k]( badgeContainer.firstElementChild );\n\t\t\t}\n\t\t\t\n\t\t    // show badge container if all badges are loaded\n\t\t    function showBadgeContainer() {\n\t\t    \tbadgeContainer.classList.remove('exponea-state-loading-badges');\n\t\t    \tbadgeContainer.classList.add('animation-fade-in');\n\t\t    }\n\n\t\t    // fallback if something goes wrong (after one 1.5 seconds)\n\t\t    setTimeout(function(){\n\t\t    \t// move loading badges (.badge-state-loading) at the end of the container to show loaded\n\t\t    \t// (if count of the displayed badges is limited)\n\t\t    \tvar loadingBadges = badgeContainer.querySelectorAll('.badge-state-loading');\n\t\t    \tfor (var k=0; k<loadingBadges.length; k++) {\n\t\t    \t\t// move element to to the end (as a last child\n\t\t    \t\tloadingBadges[k].parentNode.appendChild(loadingBadges[k]);\n\t\t    \t\tvar order = (parseInt(loadingBadges[k].getAttribute('order'),10) || 0)+100;\n\t\t    \t\tloadingBadges[k].setAttribute('order', order);\n\t\t    \t\tloadingBadges[k].style.order = order;\n\t\t    \t}\n\t\t    \t// show whole badge container\n\t\t    \tshowBadgeContainer();\n\t\t    }, self.inPreview ? 0 : 1500);\n\t\t    \n\t    \t// insert CSS (only for first one - CSS is common/shared)\n\t\t    if (!once) {\n\t\t    \tonce = true;\n\t\t\t    container.insertAdjacentHTML(\n\t\t\t        'afterbegin',\n\t\t\t        '<style class=\"exponea-covid-19-style\">' + self.style + '</style>'\n\t\t\t    );\n\t\t\t    \n\t\t\t    if (self.inPreview)  {\n\t\t\t    \tvar wrapper = container.querySelector('.exponea-covid-19-badge-wrapper');\n\t\t\t    \tfor (var j=0; j<16; j++) {\n\t\t\t    \t\tvar badge = emptyBadge.cloneNode(true);\n\t\t\t    \t\tbadge.setAttribute('index', j+1);\n\t\t\t    \t\twrapper.appendChild(badge);\n\t\t\t    \t}\n\t\t\t    \tdocument.documentElement && document.documentElement.classList.add('in-preview-mode');\n\t\t\t    }\n\t\t    }\n\t\t    \n\t\t})(containers[i]);\n\t}\n}\n\n// aggregated (for all similar weblayers) asking wheter a badges are displayed for each product\nif (!window._exponea_load_badge) {\n\tvar badgeQueue = [],\n\t\ttimer;\n\twindow._exponea_load_badge = function(catalogName, catalogAttribute, productId, uniqueClass) {\n\t\tbadgeQueue.push({\n\t\t\t\"catalog_name\": catalogName,\n\t\t\t\"catalog_attribute\": catalogAttribute,\n\t\t\t\"product_id\": productId,\n\t\t\t\"badge_unique_class\": uniqueClass\t\n\t\t});\n\t\tclearTimeout(timer);\n\t\t// wait for other badges to aggregate function calls\n\t\ttimer = setTimeout(loadBadges, 20);\n\n\t\tfunction loadBadges() {\n\t\t\tif (badgeQueue.length>0) {\n\t\t\t\tself.sdk.showBanner(WEBLAYER_CONDITIONAL_VIEW, { \n\t\t\t\t\t\"badges\": badgeQueue\n\t\t\t\t}, !!'do not hide other weblayers', function(){\n\t\t\t\t\t// show badge container(s)\n\t\t\t\t\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t\t\t\t\tfor (var i=0; i<containers.length; i++) {\n\t\t\t\t\t\tvar container = containers[i];\n\t\t\t\t\t\tcontainer.classList.remove('exponea-state-loading-badges');\n\t\t\t    \t\tcontainer.classList.add('animation-' + container.getAttribute('animation'));\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t\tbadgeQueue = [];\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction addAllSubNodesToArray( list, node ) {\n\tif (node.nodeType==1) {\n\t\tlist.push(node);\n\t\tnode = node.firstElementChild;\n\t\twhile (node) {\n\t\t\taddAllSubNodesToArray( list, node );\n\t\t\tnode = node.nextElementSibling;\n\t\t}\t\t\n\t}\n}\n\nfunction removeContainer() {\n\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME+', .exponea-covid-19-style');\n\tfor (var i=0; i<containers.length; i++) {\n\t\tvar container = containers[i];\n\t\tcontainer.parentNode.removeChild(container); \n\t}\n    if (self.inPreview) {\n    \tdocument.documentElement && document.documentElement.classList.remove('in-preview-mode');\n    }\n    observer.disconnect();\n}\n\nreturn {\n    remove: removeContainer\n};","sdk_object_name":"exponea","style":"/*\n\n\t{% set targetElementSelectorCSS %}.product-detail .product-gallery > .row{% endset %}\n\t{% set productIdJavascriptExpression %}dataLayer.find(function(item){ return item.ecommerce }).ecommerce.detail.products[0].id{% endset %}\n\t\n\t{% set position %}absolute{% endset %}\n\t{% set leftPosition %}{% endset %}\n\t{% set rightPosition %}12px{% endset %}\n\t{% set topPosition %}70px{% endset %}\n\t{% set bottomPosition %}{% endset %}\n\t\n\t{% set align %}end{% endset %}\n\t\n\t{% set direction %}vertical{% endset %}\n\t{% set reverseOrder %}false{% endset %}\n\t{% if direction!='horizontal' %}\n\t\t{% set direction = 'vertical' %}\n\t{% endif %}\n\t{% set maxCount %}4{% endset %}\n\t\n\t{% set size %}64px{% endset %}\n\t{% set spacing %}12px{% endset %}\n\t\n\t{% set animationType %}fade-in{% endset %}\n\t{% set animationDuration %}0.65s{% endset %}\n\t{% set animationDelay %}0.08s{% endset %}\n*/\n\n.exponea-covid-19-badge-container {\n\tbox-sizing: border-box;\n\t\n\t{% if leftPosition!='' or rightPosition!='' or topPosition!='' or bottomPosition!='' %}\n\tposition: absolute;\n\t{% endif %}\n\t\n\t{% if leftPosition!='' %}\n\tleft: 0;\n\tmargin-left: ;\n\t{% endif %}\n\t\n\t{% if rightPosition!='' %}\n\tright: 0;\n\tmargin-right: 12px;\n\t{% endif %}\n\t\n\t{% if topPosition!='' %}\n\ttop: 0;\n\tmargin-top: 70px;\n\t{% endif %}\n\t\n\t{% if bottomPosition!='' %}\n\tbottom: 0;\n\tmargin-bottom: ;\n\t{% endif %}\n\t\n\tdisplay: flex;\n\t{% if align=='start' %}\n\t\tjustify-content: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\tjustify-content: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\tjustify-content: flex-end;\n\t{% endif %}\n\t\n\tmin-width: 64px;\n\tmin-height: 64px;\n}\n\nhtml:not(.in-preview-mode) .exponea-covid-19-badge-container.exponea-state-loading-badges {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge-wrapper {\n\tdisplay: flex;\n\t\n\t{% if direction!='vertical' %}\n\t\tflex-direction: {{ 'row' if reverseOrder=='false' else 'row-reverse' }};\n\t\tmargin: 0 calc(-0.5 * 12px);\n\t\theight: 64px;\n\t{% else %}\n\t\tflex-direction: {{ 'column' if reverseOrder=='false' else 'column-reverse' }};\n\t\tmargin: calc(-0.5 * 12px) 0;\n\t\twidth: 64px;\n\t{% endif %}\n\t\n\t{% if align=='start' %}\n\t\talign-items: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\talign-items: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\talign-items: flex-end;\n\t{% endif %}\n}\n\n.exponea-covid-19-badge-container.exponea-state-loading-badges .exponea-covid-19-badge {\n\topacity: 0;\n}\n\n.exponea-covid-19-badge.badge-state-loading img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge:not(._) {\n\topacity: 0;\n\t{% if direction!='vertical' %}\n\t\tmargin: 0 calc(12px / 2);\n\t{% else %}\n\t\tmargin: calc(12px / 2) 0;\n\t{% endif %}\n\t{% if maxCount!='all' %}\n\t\tdisplay: none;\n\t{% endif %}\n\t\n\twidth: 64px;\n\t\n\tanimation-duration: 0.65s;\n\tanimation-fill-mode: forwards;\n}\n\n\n{% if maxCount!='all' %}\n\t{% for i in range(maxCount*1+1) %}\n\t\t.exponea-covid-19-badge:nth-child({{ i }}) {\n\t\t\tdisplay: flex;\n\t\t\tanimation-delay: calc( {{ i - 1 }} * 0.08s );\n\t\t}\n\t{% endfor %}\n{% endif %}\n\n.exponea-covid-19-badge img {\n\twidth: 100%;\n\theight: auto;\n}\n\n.exponea-covid-19-badge-container.animation-none .exponea-covid-19-badge {\n\topacity: 1;\n}\n\n.exponea-covid-19-badge-container.animation-fade-in .exponea-covid-19-badge {\n\tanimation-name: fadeIn;\n}\n\n.exponea-covid-19-badge-container.animation-zoom-in .exponea-covid-19-badge {\n\tanimation-name: zoomIn;\n}\n\n.exponea-covid-19-badge-container.animation-bounce-in .exponea-covid-19-badge {\n\tanimation-name: bounceIn;\n}\n\n.exponea-covid-19-badge-container.animation-rotate-in .exponea-covid-19-badge {\n\tanimation-name: rotateIn;\n}\n\n.exponea-covid-19-badge-container.animation-rubber-band .exponea-covid-19-badge {\n\tanimation-name: rubberBand;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-x .exponea-covid-19-badge {\n\tanimation-name: flipInX;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-y .exponea-covid-19-badge {\n\tanimation-name: flipInY;\n}\n\n\n/* --- in preview mode ------------------- */\n\nhtml.in-preview-mode .exponea-covid-19-badge-container {\n\tborder: 2px solid rgba(255, 0, 0, 0.2);\n\tbackground-color: rgba(255, 0, 0, 0.1);\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge {\n\tbackground-color: rgba(255, 0, 0, 0.2);\n\tborder: 2px solid rgba(255, 0, 0, 0.5);\n\tposition: relative;\n\tbox-sizing: border-box;\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge::before {\n\tcontent: attr(index);\n\tposition: absolute;\n\tfont-family: arial;\n\tfont-size: 32px;\n\tcolor: red;\n\topacity: 0.75;\n\tleft: 50%;\n\ttop: 50%;\n\ttransform: translate(-50%, -50%);\n}\n\t\n\t\n\t\[email protected] fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\[email protected] zoomIn {\n  from {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  50% {\n    opacity: 1;\n  }\n  \n  to {\n  \topacity: 1;\n  }\n}\n\[email protected] bounceIn {\n  from,\n  20%,\n  40%,\n  60%,\n  80%,\n  to {\n    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n  }\n\n  0% {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  20% {\n    transform: scale3d(1.1, 1.1, 1.1);\n  }\n\n  40% {\n    transform: scale3d(0.9, 0.9, 0.9);\n  }\n\n  60% {\n    opacity: 1;\n    transform: scale3d(1.03, 1.03, 1.03);\n  }\n\n  80% {\n    transform: scale3d(0.97, 0.97, 0.97);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale3d(1, 1, 1);\n  }\n}\n\[email protected] rotateIn {\n  from {\n    transform-origin: center;\n    transform: rotate3d(0, 0, 1, -200deg);\n    opacity: 0;\n  }\n\n  to {\n    transform-origin: center;\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n}\n\[email protected] rubberBand {\n  from {\n    transform: scale3d(1, 1, 1);\n  }\n\n  30% {\n    transform: scale3d(1.25, 0.75, 1);\n  }\n\n  40% {\n    transform: scale3d(0.75, 1.25, 1);\n  }\n\n  50% {\n    transform: scale3d(1.15, 0.85, 1);\n  }\n\n  65% {\n    transform: scale3d(0.95, 1.05, 1);\n  }\n\n  75% {\n    transform: scale3d(1.05, 0.95, 1);\n  }\n\n  to {\n    transform: scale3d(1, 1, 1);\n    opacity: 1;\n  }\n}\n\[email protected] flipInX {\n  from {\n    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}\n\[email protected] flipInY {\n  from {\n    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}"},"params":{"align":"end","animationDelay":"0.08s","animationDuration":"0.65s","animationType":"fade-in","backgroundColor":"#00b7db","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","buttonText":"Default button text","closeButtonColor":"#ffffff","direction":"vertical","gap":"8px","headerText":"Default header text","headerTextColor":"#1c1733","languageJavascriptExpression":"document.documentElement.lang","leftPosition":"","maxCount":"4","productIdJavascriptExpression":"dataLayer.find(function(item){ return item.ecommerce }).ecommerce.detail.products[0].id","reverseOrder":"false","rightPosition":"12px","size":"64px","spacing":"12px","targetElementSelector":".product-detail .pd-img","targetElementSelectorCSS":".product-detail .product-gallery > .row","topPosition":"70px"},"percentage":100,"script":"var self = this,\n\tEXPONEA_BADGE_CONTAINER_CLASS_NAME = '.exponea-covid-19-badge-container',\n\tWEBLAYER_CONDITIONAL_VIEW = '5e8168810b6360ead8956bc5'; // \"COVID-19 Aggregated background worker (don't touch, don't start)\"\n\n{% set productIdJavascriptExpression %}[[ productIdJavascriptExpression ]]{% endset %}\nvar getProductIdScript = \"{{ productIdJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tproductId;\n\t\n{% set languageJavascriptExpression %}[[ languageJavascriptExpression | document.documentElement.lang ]]{% endset %}\nvar langExpression = \"{{ languageJavascriptExpression | replace('\"','\\\\\\\"') }}\",\n\tlang,\n\temptyBadge,\n\tobserver,\n\tonce = false,\n\t_callbacks = [],\n\t_badges = [];\n\t\t    \nif (document.readyState==='loading') {\n\tdocument.addEventListener('DOMContentLoaded', main, false);\n}\nelse {\n\tmain();\n}\n\n\t\n\t\t    \nfunction main() {\n\tvar selector = self.inPreview ? 'body' : '[[ targetElementSelectorCSS ]]';\n\t\t\n\tif (langExpression) {\n\t\ttry {\n\t\t\teval('lang = '+langExpression)\n\t\t}\n\t\tcatch(e) {\n\t\t\tconsole.log('languageJavascriptExpression', langExpression, e);\n\t\t}\n\t}\n\t\n\temptyBadge = document.createElement('div');\n\temptyBadge.className = 'exponea-covid-19-badge';\n\temptyBadge.innerHTML = '<img src=\"data:image/png;base64,'+\n\t\t\t\t\t\t\t'iVBORw0KGgoAAAANSUhEUgAAAAEAAAA'+\n\t\t\t\t\t\t\t'BCAQAAAC1HAwCAAAAC0lEQVR42mNkYA'+\n\t\t\t\t\t\t\t'AAAAYAAjCB0C8AAAAASUVORK5CYII=\" />';\n\n\tvar containers = document.querySelectorAll(selector);\n\t// INIT ----------------------------------------------\n\tinit(containers);\n\t\n\t// watch for new containers (e.g lazy loading)\n\tobserver = new MutationObserver(function(mutationsList, observer) {\n\t\tvar elements = [];\n\t\tfor (var i=0; i<mutationsList.length; i++) {\n\t\t\tvar mutationRecord = mutationsList[i];\n\t\t\tif (mutationRecord.type=='childList' && mutationRecord.addedNodes && mutationRecord.addedNodes.length) {\n\t\t\t\tfor (var k=0; k<mutationRecord.addedNodes.length; k++) {\n\t\t\t\t\taddAllSubNodesToArray(elements, mutationRecord.addedNodes[k]);\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\tvar allContainers = document.querySelectorAll('[[ targetElementSelectorCSS ]]')\n\t\t\tnewContainers = [];\n\t\tfor (var i=0; i<allContainers.length; i++) {\n\t\t\tif (elements.indexOf(allContainers[i])!==-1)\n\t\t\t\tnewContainers.push( allContainers[i] );\n\t\t}\n\t\t// INIT ----------------------------------------------\n\t\tinit(newContainers);\n\t});\n\t\n\tobserver.observe(document.documentElement, { attributes: false, childList: true, subtree: true, characterData: false });\n}\n\nfunction init(containers) {\n\tfor (var i=0; i<containers.length; i++) {\n\t\t(function(container){\n\t\t\t\n\t\t\t// if container css position is 'static' set 'relative'\n\t\t\tvar position = window.getComputedStyle(container, null).getPropertyValue(\"position\");\n\t\t\tif (position==='static') {\n\t\t\t\tcontainer.style.position = 'relative';\n\t\t\t}\n\t\t\t\n\t\t\t// insert HTML\n\t    \tcontainer.insertAdjacentHTML('beforeend', self.html);\n\t    \t\n\t    \tvar badgeContainer = container.querySelector(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t    \t\n\t    \tbadgeContainer.setAttribute('animation', '[[ animationType ]]');\t\n\t    \t\n\t    \tif (lang) {\n\t    \t\tbadgeContainer.setAttribute('lang', lang);\t\n\t    \t}\n\t    \n\t    \tif (getProductIdScript && getProductIdScript.trim()!=='') {\n\t    \t\ttry {\n\t    \t\t\tfunction inContext() {\n\t    \t\t\t\tvar self = this;\n\t\t    \t\t\teval('productId = ' + getProductIdScript);\n\t    \t\t\t}\n\t    \t\t\tinContext.call(badgeContainer);\n\t\t\t    \tbadgeContainer.setAttribute('product-id', productId);\n\t    \t\t}\n\t    \t\tcatch(e) {\n\t    \t\t\tconsole.log('You have an error in expression:', getProductIdScript, e);\n\t    \t\t}\n\t\t    }\n\t\t    \n\t\t    // callback to support lazy loading - container will let know its badges\n\t\t    badgeContainer.registerBadge = function( badge, initCallback ) {\n\t\t    \tif (_badges.indexOf(badge)===-1) {\n\t\t    \t\t_badges.push( badge );\n\t\t    \t\t_callbacks.push( initCallback );\n\t\t    \t}\n\t\t    }\n\t\t    \n\t\t    // init badges\n\t\t\tfor (var k=0; k<_callbacks.length; k++) {\n\t\t\t\t_callbacks[k]( badgeContainer.firstElementChild );\n\t\t\t}\n\t\t\t\n\t\t    // show badge container if all badges are loaded\n\t\t    function showBadgeContainer() {\n\t\t    \tbadgeContainer.classList.remove('exponea-state-loading-badges');\n\t\t    \tbadgeContainer.classList.add('animation-[[ animationType ]]');\n\t\t    }\n\n\t\t    // fallback if something goes wrong (after one 1.5 seconds)\n\t\t    setTimeout(function(){\n\t\t    \t// move loading badges (.badge-state-loading) at the end of the container to show loaded\n\t\t    \t// (if count of the displayed badges is limited)\n\t\t    \tvar loadingBadges = badgeContainer.querySelectorAll('.badge-state-loading');\n\t\t    \tfor (var k=0; k<loadingBadges.length; k++) {\n\t\t    \t\t// move element to to the end (as a last child\n\t\t    \t\tloadingBadges[k].parentNode.appendChild(loadingBadges[k]);\n\t\t    \t\tvar order = (parseInt(loadingBadges[k].getAttribute('order'),10) || 0)+100;\n\t\t    \t\tloadingBadges[k].setAttribute('order', order);\n\t\t    \t\tloadingBadges[k].style.order = order;\n\t\t    \t}\n\t\t    \t// show whole badge container\n\t\t    \tshowBadgeContainer();\n\t\t    }, self.inPreview ? 0 : 1500);\n\t\t    \n\t    \t// insert CSS (only for first one - CSS is common/shared)\n\t\t    if (!once) {\n\t\t    \tonce = true;\n\t\t\t    container.insertAdjacentHTML(\n\t\t\t        'afterbegin',\n\t\t\t        '<style class=\"exponea-covid-19-style\">' + self.style + '</style>'\n\t\t\t    );\n\t\t\t    \n\t\t\t    if (self.inPreview)  {\n\t\t\t    \tvar wrapper = container.querySelector('.exponea-covid-19-badge-wrapper');\n\t\t\t    \tfor (var j=0; j<16; j++) {\n\t\t\t    \t\tvar badge = emptyBadge.cloneNode(true);\n\t\t\t    \t\tbadge.setAttribute('index', j+1);\n\t\t\t    \t\twrapper.appendChild(badge);\n\t\t\t    \t}\n\t\t\t    \tdocument.documentElement && document.documentElement.classList.add('in-preview-mode');\n\t\t\t    }\n\t\t    }\n\t\t    \n\t\t})(containers[i]);\n\t}\n}\n\n// aggregated (for all similar weblayers) asking wheter a badges are displayed for each product\nif (!window._exponea_load_badge) {\n\tvar badgeQueue = [],\n\t\ttimer;\n\twindow._exponea_load_badge = function(catalogName, catalogAttribute, productId, uniqueClass) {\n\t\tbadgeQueue.push({\n\t\t\t\"catalog_name\": catalogName,\n\t\t\t\"catalog_attribute\": catalogAttribute,\n\t\t\t\"product_id\": productId,\n\t\t\t\"badge_unique_class\": uniqueClass\t\n\t\t});\n\t\tclearTimeout(timer);\n\t\t// wait for other badges to aggregate function calls\n\t\ttimer = setTimeout(loadBadges, 20);\n\n\t\tfunction loadBadges() {\n\t\t\tif (badgeQueue.length>0) {\n\t\t\t\tself.sdk.showBanner(WEBLAYER_CONDITIONAL_VIEW, { \n\t\t\t\t\t\"badges\": badgeQueue\n\t\t\t\t}, !!'do not hide other weblayers', function(){\n\t\t\t\t\t// show badge container(s)\n\t\t\t\t\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME);\n\t\t\t\t\tfor (var i=0; i<containers.length; i++) {\n\t\t\t\t\t\tvar container = containers[i];\n\t\t\t\t\t\tcontainer.classList.remove('exponea-state-loading-badges');\n\t\t\t    \t\tcontainer.classList.add('animation-' + container.getAttribute('animation'));\n\t\t\t\t\t}\n\t\t\t\t});\n\t\t\t\tbadgeQueue = [];\n\t\t\t}\n\t\t}\n\t}\n}\n\nfunction addAllSubNodesToArray( list, node ) {\n\tif (node.nodeType==1) {\n\t\tlist.push(node);\n\t\tnode = node.firstElementChild;\n\t\twhile (node) {\n\t\t\taddAllSubNodesToArray( list, node );\n\t\t\tnode = node.nextElementSibling;\n\t\t}\t\t\n\t}\n}\n\nfunction removeContainer() {\n\tvar containers = document.querySelectorAll(EXPONEA_BADGE_CONTAINER_CLASS_NAME+', .exponea-covid-19-style');\n\tfor (var i=0; i<containers.length; i++) {\n\t\tvar container = containers[i];\n\t\tcontainer.parentNode.removeChild(container); \n\t}\n    if (self.inPreview) {\n    \tdocument.documentElement && document.documentElement.classList.remove('in-preview-mode');\n    }\n    observer.disconnect();\n}\n\nreturn {\n    remove: removeContainer\n};","source_mode":true,"style":"/*\n\n\t{% set targetElementSelectorCSS %}[[ targetElementSelectorCSS ]]{% endset %}\n\t{% set productIdJavascriptExpression %}[[ productIdJavascriptExpression ]]{% endset %}\n\t\n\t{% set position %}[[ position : enum(absolute, relative) | absolute ]]{% endset %}\n\t{% set leftPosition %}[[ leftPosition ]]{% endset %}\n\t{% set rightPosition %}[[ rightPosition ]]{% endset %}\n\t{% set topPosition %}[[ topPosition ]]{% endset %}\n\t{% set bottomPosition %}[[ bottomPosition ]]{% endset %}\n\t\n\t{% set align %}[[ align : enum(start, center, end) | center ]]{% endset %}\n\t\n\t{% set direction %}[[ direction : enum(vertical, horizontal) | vertical ]]{% endset %}\n\t{% set reverseOrder %}[[ reverseOrder : boolean ]]{% endset %}\n\t{% if direction!='horizontal' %}\n\t\t{% set direction = 'vertical' %}\n\t{% endif %}\n\t{% set maxCount %}[[ maxCount : enum(all, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16) | 5 ]]{% endset %}\n\t\n\t{% set size %}[[ size | 80px ]]{% endset %}\n\t{% set spacing %}[[ spacing | 10px ]]{% endset %}\n\t\n\t{% set animationType %}[[ animationType : enum(none, fade-in, zoom-in, bounce-in, rotate-in, rubber-band, flip-in-x, flip-in-y) | none ]]{% endset %}\n\t{% set animationDuration %}[[ animationDuration | 0.65s ]]{% endset %}\n\t{% set animationDelay %}[[ animationDelay | 0.08s ]]{% endset %}\n*/\n\n.exponea-covid-19-badge-container {\n\tbox-sizing: border-box;\n\t\n\t{% if leftPosition!='' or rightPosition!='' or topPosition!='' or bottomPosition!='' %}\n\tposition: [[ position ]];\n\t{% endif %}\n\t\n\t{% if leftPosition!='' %}\n\tleft: 0;\n\tmargin-left: [[ leftPosition ]];\n\t{% endif %}\n\t\n\t{% if rightPosition!='' %}\n\tright: 0;\n\tmargin-right: [[ rightPosition ]];\n\t{% endif %}\n\t\n\t{% if topPosition!='' %}\n\ttop: 0;\n\tmargin-top: [[ topPosition ]];\n\t{% endif %}\n\t\n\t{% if bottomPosition!='' %}\n\tbottom: 0;\n\tmargin-bottom: [[ bottomPosition ]];\n\t{% endif %}\n\t\n\tdisplay: flex;\n\t{% if align=='start' %}\n\t\tjustify-content: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\tjustify-content: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\tjustify-content: flex-end;\n\t{% endif %}\n\t\n\tmin-width: [[ size ]];\n\tmin-height: [[ size ]];\n}\n\nhtml:not(.in-preview-mode) .exponea-covid-19-badge-container.exponea-state-loading-badges {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge-wrapper {\n\tdisplay: flex;\n\t\n\t{% if direction!='vertical' %}\n\t\tflex-direction: {{ 'row' if reverseOrder=='false' else 'row-reverse' }};\n\t\tmargin: 0 calc(-0.5 * [[ spacing ]]);\n\t\theight: [[ size ]];\n\t{% else %}\n\t\tflex-direction: {{ 'column' if reverseOrder=='false' else 'column-reverse' }};\n\t\tmargin: calc(-0.5 * [[ spacing ]]) 0;\n\t\twidth: [[ size ]];\n\t{% endif %}\n\t\n\t{% if align=='start' %}\n\t\talign-items: flex-start;\n\t{% endif %}\n\t{% if align=='center' %}\n\t\talign-items: center;\n\t{% endif %}\n\t{% if align=='end' %}\n\t\talign-items: flex-end;\n\t{% endif %}\n}\n\n.exponea-covid-19-badge-container.exponea-state-loading-badges .exponea-covid-19-badge {\n\topacity: 0;\n}\n\n.exponea-covid-19-badge.badge-state-loading img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\n\tvisibility: hidden;\n}\n\n.exponea-covid-19-badge:not(._) {\n\topacity: 0;\n\t{% if direction!='vertical' %}\n\t\tmargin: 0 calc([[ spacing ]] / 2);\n\t{% else %}\n\t\tmargin: calc([[ spacing ]] / 2) 0;\n\t{% endif %}\n\t{% if maxCount!='all' %}\n\t\tdisplay: none;\n\t{% endif %}\n\t\n\twidth: [[ size ]];\n\t\n\tanimation-duration: [[ animationDuration ]];\n\tanimation-fill-mode: forwards;\n}\n\n\n{% if maxCount!='all' %}\n\t{% for i in range(maxCount*1+1) %}\n\t\t.exponea-covid-19-badge:nth-child({{ i }}) {\n\t\t\tdisplay: flex;\n\t\t\tanimation-delay: calc( {{ i - 1 }} * [[ animationDelay ]] );\n\t\t}\n\t{% endfor %}\n{% endif %}\n\n.exponea-covid-19-badge img {\n\twidth: 100%;\n\theight: auto;\n}\n\n.exponea-covid-19-badge-container.animation-none .exponea-covid-19-badge {\n\topacity: 1;\n}\n\n.exponea-covid-19-badge-container.animation-fade-in .exponea-covid-19-badge {\n\tanimation-name: fadeIn;\n}\n\n.exponea-covid-19-badge-container.animation-zoom-in .exponea-covid-19-badge {\n\tanimation-name: zoomIn;\n}\n\n.exponea-covid-19-badge-container.animation-bounce-in .exponea-covid-19-badge {\n\tanimation-name: bounceIn;\n}\n\n.exponea-covid-19-badge-container.animation-rotate-in .exponea-covid-19-badge {\n\tanimation-name: rotateIn;\n}\n\n.exponea-covid-19-badge-container.animation-rubber-band .exponea-covid-19-badge {\n\tanimation-name: rubberBand;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-x .exponea-covid-19-badge {\n\tanimation-name: flipInX;\n}\n\n.exponea-covid-19-badge-container.animation-flip-in-y .exponea-covid-19-badge {\n\tanimation-name: flipInY;\n}\n\n\n/* --- in preview mode ------------------- */\n\nhtml.in-preview-mode .exponea-covid-19-badge-container {\n\tborder: 2px solid rgba(255, 0, 0, 0.2);\n\tbackground-color: rgba(255, 0, 0, 0.1);\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge {\n\tbackground-color: rgba(255, 0, 0, 0.2);\n\tborder: 2px solid rgba(255, 0, 0, 0.5);\n\tposition: relative;\n\tbox-sizing: border-box;\n}\n\nhtml.in-preview-mode .exponea-covid-19-badge::before {\n\tcontent: attr(index);\n\tposition: absolute;\n\tfont-family: arial;\n\tfont-size: 32px;\n\tcolor: red;\n\topacity: 0.75;\n\tleft: 50%;\n\ttop: 50%;\n\ttransform: translate(-50%, -50%);\n}\n\t\n\t\n\t\[email protected] fadeIn {\n  from {\n    opacity: 0;\n  }\n\n  to {\n    opacity: 1;\n  }\n}\n\[email protected] zoomIn {\n  from {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  50% {\n    opacity: 1;\n  }\n  \n  to {\n  \topacity: 1;\n  }\n}\n\[email protected] bounceIn {\n  from,\n  20%,\n  40%,\n  60%,\n  80%,\n  to {\n    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);\n  }\n\n  0% {\n    opacity: 0;\n    transform: scale3d(0.3, 0.3, 0.3);\n  }\n\n  20% {\n    transform: scale3d(1.1, 1.1, 1.1);\n  }\n\n  40% {\n    transform: scale3d(0.9, 0.9, 0.9);\n  }\n\n  60% {\n    opacity: 1;\n    transform: scale3d(1.03, 1.03, 1.03);\n  }\n\n  80% {\n    transform: scale3d(0.97, 0.97, 0.97);\n  }\n\n  to {\n    opacity: 1;\n    transform: scale3d(1, 1, 1);\n  }\n}\n\[email protected] rotateIn {\n  from {\n    transform-origin: center;\n    transform: rotate3d(0, 0, 1, -200deg);\n    opacity: 0;\n  }\n\n  to {\n    transform-origin: center;\n    transform: translate3d(0, 0, 0);\n    opacity: 1;\n  }\n}\n\[email protected] rubberBand {\n  from {\n    transform: scale3d(1, 1, 1);\n  }\n\n  30% {\n    transform: scale3d(1.25, 0.75, 1);\n  }\n\n  40% {\n    transform: scale3d(0.75, 1.25, 1);\n  }\n\n  50% {\n    transform: scale3d(1.15, 0.85, 1);\n  }\n\n  65% {\n    transform: scale3d(0.95, 1.05, 1);\n  }\n\n  75% {\n    transform: scale3d(1.05, 0.95, 1);\n  }\n\n  to {\n    transform: scale3d(1, 1, 1);\n    opacity: 1;\n  }\n}\n\[email protected] flipInX {\n  from {\n    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}\n\[email protected] flipInY {\n  from {\n    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);\n    animation-timing-function: ease-in;\n    opacity: 0;\n  }\n\n  40% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);\n    animation-timing-function: ease-in;\n  }\n\n  60% {\n    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);\n    opacity: 1;\n  }\n\n  80% {\n    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);\n  }\n\n  to {\n    transform: perspective(400px);\n    opacity: 1;\n  }\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7a5edc68ff7ee9e41e4589","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [global] Disinfected","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"Disinfected before shipment\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/451f4bdca460dc8c55c41c40b9e408ae592750306be0bc319ac089f40ed0dc07\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/451f4bdca460dc8c55c41c40b9e408ae592750306be0bc319ac089f40ed0dc07\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '',\n\tcatalogAttribute = '',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}Disinfected before shipment{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/451f4bdca460dc8c55c41c40b9e408ae592750306be0bc319ac089f40ed0dc07\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('15', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 15;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#0099ff","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/451f4bdca460dc8c55c41c40b9e408ae592750306be0bc319ac089f40ed0dc07","badgeTitle":"Disinfected before shipment","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","closeButtonColor":"#ffffff","displayOnDetailPage":"true","displayOnListPage":"true","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","iconShape":"circle","imageSize":"100%","innerSpace":"10%","order":"15","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7aa34e6865bddb670f113a","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [global] No-touch Delivery","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"No-touch delivery\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/a5dd4253f91b304f7c443f0c012bafb0353bd180f27a55a5cb79b741cb750fff\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/a5dd4253f91b304f7c443f0c012bafb0353bd180f27a55a5cb79b741cb750fff\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '',\n\tcatalogAttribute = '',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}No-touch delivery{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/a5dd4253f91b304f7c443f0c012bafb0353bd180f27a55a5cb79b741cb750fff\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('16', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 16;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#8f6cff","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/a5dd4253f91b304f7c443f0c012bafb0353bd180f27a55a5cb79b741cb750fff","badgeTitle":"No-touch delivery","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"","catalogName":"","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"68%","innerSpace":"10%","offsetLeftPercent":"0%","offsetTop":"4%","order":"16","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7abe5bba36880d26ce2460","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [specific] Comfy Homewear","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"Comfy Homewear\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/cece4a02135d0ef69936c8377223cfdbda628fa775dc26d27b7c0ed283403528\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/cece4a02135d0ef69936c8377223cfdbda628fa775dc26d27b7c0ed283403528\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = 'COVID19_badge',\n\tcatalogAttribute = 'comfy_homewear',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}Comfy Homewear{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/cece4a02135d0ef69936c8377223cfdbda628fa775dc26d27b7c0ed283403528\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('5', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 5;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#ff5e40","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/cece4a02135d0ef69936c8377223cfdbda628fa775dc26d27b7c0ed283403528","badgeTitle":"Comfy Homewear","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"comfy_homewear","catalogName":"COVID19_badge","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"66%","innerSpace":"10%","offsetLeftPercent":"0%","offsetTop":"0%","order":"5","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7b4ec53bc29d1e80ae9adb","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [specific] Happy Kids","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"Happy kids in quarantine\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/fecd665232f8b94ed6f347121b11f61384ca64910b4ac716bcd55fa955739ca8\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/fecd665232f8b94ed6f347121b11f61384ca64910b4ac716bcd55fa955739ca8\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = 'COVID19_badge',\n\tcatalogAttribute = 'kids_in_quarantine',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}Happy kids in quarantine{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/fecd665232f8b94ed6f347121b11f61384ca64910b4ac716bcd55fa955739ca8\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('7', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 7;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#d233ff","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/fecd665232f8b94ed6f347121b11f61384ca64910b4ac716bcd55fa955739ca8","badgeTitle":"Happy kids in quarantine","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"kids_in_quarantine","catalogName":"COVID19_badge","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"70%","innerSpace":"10%","offsetLeft":"0%","offsetLeftPercent":"0%","offsetTop":"-2%","order":"7","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7b50e5911fb5764d906444","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [specific] Quarantine Convenience","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"Quarantine convenience\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/2506ae3ec9d8234d562ba7a0c2a24bf4ba347b6b448e35c8c7f0d09e3d49e3b5\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/2506ae3ec9d8234d562ba7a0c2a24bf4ba347b6b448e35c8c7f0d09e3d49e3b5\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = 'COVID19_badge',\n\tcatalogAttribute = 'quarantine_fun',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}Quarantine convenience{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/2506ae3ec9d8234d562ba7a0c2a24bf4ba347b6b448e35c8c7f0d09e3d49e3b5\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('3', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 3;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#00ca80","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/2506ae3ec9d8234d562ba7a0c2a24bf4ba347b6b448e35c8c7f0d09e3d49e3b5","badgeTitle":"Quarantine convenience","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"quarantine_fun","catalogName":"COVID19_badge","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"66%","innerSpace":"10%","offsetLeftPercent":"0%","offsetTop":"0%","order":"3","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7b328a0a0d0bce023003ed","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [specific] Remote Working","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"For remote working\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/09f6ef2add3155025ecefadcbf1390eeaf8c898cfdd1ee8f5e155d5557235225\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/09f6ef2add3155025ecefadcbf1390eeaf8c898cfdd1ee8f5e155d5557235225\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = 'COVID19_badge',\n\tcatalogAttribute = 'remote_working',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}For remote working{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/09f6ef2add3155025ecefadcbf1390eeaf8c898cfdd1ee8f5e155d5557235225\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('6', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 6;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#ff9e00","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/09f6ef2add3155025ecefadcbf1390eeaf8c898cfdd1ee8f5e155d5557235225","badgeTitle":"For remote working","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"remote_working","catalogName":"COVID19_badge","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"70%","innerSpace":"10%","offsetLeft":"-1%","offsetLeftPercent":"0%","offsetTop":"-1%","order":"6","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7b4fd01fe3a53d4565c1e5","type":"banner"},{"data":{"ab_testing_options":{"type":"manual"},"archived":false,"cloned_from_id":null,"consent_category":null,"control_group":{"script":"var self = this;\nself.sdk.track('banner', getEventProperties('show', false));\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        banner_type: self.data.banner_type,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}","sdk_object_name":"exponea"},"conversion_goal":{"type":"purchase"},"customer_filter":null,"date_filter":{"enabled":false,"from_date":null,"to_date":null},"description":null,"device_target":{"type":"any"},"enabled":false,"frequency":"always","general_consent":true,"is_global_object":false,"last_variant_id":0,"name":"CV19 Badge [specific] Virus Protection","prevent_archivation":false,"show_description_in_view":false,"site_url":"","status":"draft","tags":[],"trigger":{"exclude_pages":[],"include_pages":[{"type":"contains","url":"covid-test"}]},"variants":[{"enabled":true,"group":"","html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"[[ badgeTitle ]]\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"[[ badgeImageURL ]]\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","id":0,"name":"Variant A","parametrized_parts":{"html":"<div class=\"exponea-covid-19-badge badge-state-loading badge-state-new\" title=\"Virus protection\">\n\t<div class=\"exponea-covid-19-badge-inner-wrapper\">\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/f9e5b4d8a6de2d86bdbc89f9a64eda3cc4dbb9b42da738ce9c3b090d91ef188a\" class=\"exponea-badge-placeholder\" />\n\t\t<img src=\"https://cdn.exponea.com/exponea-delivery-team/f/f9e5b4d8a6de2d86bdbc89f9a64eda3cc4dbb9b42da738ce9c3b090d91ef188a\" class=\"exponea-badge-icon\" />\n\t</div>\n</div>","script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = 'COVID19_badge',\n\tcatalogAttribute = 'virus_protection',\n\tdisplayOnListPage = true,\n\tdisplayOnDetailPage = true;\n\n{% set badgeTitle %}Virus protection{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"https://cdn.exponea.com/exponea-delivery-team/f/f9e5b4d8a6de2d86bdbc89f9a64eda3cc4dbb9b42da738ce9c3b090d91ef188a\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('4', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","sdk_object_name":"exponea","style":"/*\r\n{% set shape %}circle{% endset %}\r\n{% set dropShadow %}true{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: 4;\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}"},"params":{"backgroundColor":"#ff30af","badgeImageURL":"https://cdn.exponea.com/exponea-delivery-team/f/f9e5b4d8a6de2d86bdbc89f9a64eda3cc4dbb9b42da738ce9c3b090d91ef188a","badgeTitle":"Virus protection","bannerShowDelayInMilliseconds":"0","bodyText":"Default body text","bodyTextColor":"#ffffff","borderRadius":"50%","buttonText":"Default button text","catalogAttribute":"virus_protection","catalogName":"COVID19_badge","closeButtonColor":"#ffffff","dropShadow":"true","headerText":"Default header text","headerTextColor":"#1c1733","imageAspectRatio":"1","imageSize":"66%","innerSpace":"10%","offsetLeftPercent":"0%","offsetTop":"3%","order":"4","shape":"circle","specificClassName":"exponea-badge-virus-free"},"percentage":100,"script":"var self = this,\n\tuniqueClass = 'exponea-badge-'+Date.now()+parseInt(Math.random()*10000),\n\tcontainerWrapperClassName = 'exponea-covid-19-badge-wrapper',\n\tproductId,\n\tcatalogName = '[[ catalogName ]]',\n\tcatalogAttribute = '[[ catalogAttribute ]]',\n\tdisplayOnListPage = [[ displayOnListPage : boolean | true ]],\n\tdisplayOnDetailPage = [[ displayOnDetailPage : boolean | true ]];\n\n{% set badgeTitle %}[[ badgeTitle ]]{% endset %}\nvar badgeTitle = \"{{ badgeTitle | replace('\"','\\\\\\\"') }}\",\n\tisMultiLang = false;\nif (badgeTitle.indexOf('{')===0) {\n\tbadgeTitle = JSON.parse(badgeTitle);\n\tisMultiLang = true;\n}\n\nsetTimeout(function() {\n\n    requestAnimationFrame(function() {\n    \tif (self.inPreview) {\n    \t\tvar tempContainer = document.createElement('div');\n    \t\ttempContainer.classList.add(containerWrapperClassName);\n    \t\ttempContainer.classList.add('temp-badge-container');\n    \t\ttempContainer.classList.add(uniqueClass);\n    \t\tdocument.body.appendChild( tempContainer )\t\t\n    \t}\n    \t\n    \tvar selector = '.'+containerWrapperClassName, // in parent .exponea-covid-19-badge-container \n    \t\tparentSelector = '';\n    \t\t\n    \tif (!displayOnListPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-list-page)';\n    \t}\n    \tif (!displayOnDetailPage) {\n    \t\tparentSelector += ':not(.exponea-badge-container-detail-page)';\n    \t}\n    \tif (parentSelector!='')\n    \t\tselector = parentSelector+' > '+selector;\n    \tvar containers = document.querySelectorAll(selector); \n    \t\n    \t// preload icon and show badge after icon load\n    \tvar image = new Image();\n    \timage.onload = function() {\n\t    \tvar elements = document.querySelectorAll('.exponea-covid-19-badge.'+uniqueClass);\n\t\t\tfor (var i=0; i<elements.length; i++) {\n\t\t\t\tif (self.inPreview || !catalogName || !catalogAttribute) {\n\t\t\t\t\telements[i].classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t}\n    \t}\n    \timage.src = \"[[ badgeImageURL ]]\";\n\n    \tif (containers.length>0) {\n    \t\t\n    \t\t// insert CSS (once)\n    \t\tvar css = self.style.replace(/\\.exponea\\-covid\\-19\\-badge/g, '.exponea-covid-19-badge.'+uniqueClass);\n\t        document.body.insertAdjacentHTML(\n\t            'afterbegin',\n\t            '<style class=\"'+uniqueClass+'\">' + css + '</style>'\n\t        );\n    \t\t\n    \t\t// for each container\n    \t\tfor (var i=0; i<containers.length; i++) {\n    \t\t\tinitBadge( containers[i] );\n    \t\t}\n    \t\t\n    \t\t// register callback\n    \t\tvar uniqueBadgeObj = {};\n    \t\tcontainers[0].parentNode.registerBadge && containers[0].parentNode.registerBadge( uniqueBadgeObj, initBadge );\n\t\t\t\t\n    \t\tfunction initBadge(container) {\n    \t\t\tproductId = container.parentNode.getAttribute('product-id');\n    \t\t\t// insert HTML\n        \t\tcontainer.insertAdjacentHTML('beforeend', self.html);\n        \t\tvar badge = container.querySelector('.exponea-covid-19-badge.badge-state-new');\n        \t\tbadge.classList.add(uniqueClass);\n        \t\tbadge.classList.add(uniqueClass+'-'+productId);\n        \t\tbadge.classList.remove('badge-state-new');\n        \t\t\n        \t\tif (self.inPreview || !catalogName || !catalogAttribute || image.complete) {\n\t\t\t\t\tbadge.classList.remove('badge-state-loading');\n\t\t\t\t}\n\t\t\t\n        \t\t// if multilingual\n    \t\t\tif (isMultiLang) {\n    \t\t\t\tvar lang = container.parentNode.getAttribute('lang');\n    \t\t\t\tvar title = badgeTitle[lang];\n    \t\t\t\tif (!title) {\n    \t\t\t\t\t// take first lang (property)\n    \t\t\t\t\tlang = Object.keys(badgeTitle)[0];\n    \t\t\t\t\ttitle = badgeTitle[lang];\n    \t\t\t\t}\n    \t\t\t\telements[i].title = title;\n    \t\t\t}\n        \t\t\n        \t\tvar order = parseInt('[[ order ]]', 10);\n        \t\tbadge.setAttribute('order', order);\n        \t\t// reorder in all badges\n        \t\tvar node = container.lastChild,\n        \t\t\tfound = false;\n        \t\twhile (node && !found) {\n        \t\t\tif (node!==badge && node.getAttribute('order') && order>=node.getAttribute('order')*1)\t{\n        \t\t\t\tcontainer.insertBefore(badge, node.nextSibling);\n        \t\t\t\tfound = true;\n        \t\t\t}\n        \t\t\tnode = node.previousSibling;\n        \t\t}\n        \t\tif (!found) {\n        \t\t\tcontainer.insertBefore(badge, container.firstChild);\n        \t\t}\n        \t\t\n        \t\tif (catalogName && catalogAttribute && !self.inPreview) {\n\t    \t\t\t// ask catalog if badge should be displayed\n    \t\t\t\twindow._exponea_load_badge(catalogName, catalogAttribute, productId, uniqueClass+'-'+productId);\n\t    \t\t}\n    \t\t}\n    \t\t\n    \t\t// track\n    \t\tself.sdk.track('banner', getEventProperties('show', false));\n    \t}\n        \n    });\n}, 1); // to wait for badge container\n\nfunction getEventProperties(action, interactive) {\n    return {\n        action: action,\n        banner_id: self.data.banner_id,\n        banner_name: self.data.banner_name,\n        product_id: productId,\n        variant_id: self.data.variant_id,\n        variant_name: self.data.variant_name,\n        interaction: interactive !== false,\n        location: window.location.href,\n        path: window.location.pathname\n    };\n}\n\nfunction removeBadge() {\n    var elements = document.querySelectorAll('.'+uniqueClass);\n\tfor (var i=0; i<elements.length; i++) {\n\t\tvar el = elements[i];\n\t\tel.parentNode.removeChild(el); \n\t}\n}\n\nreturn {\n    remove: removeBadge\n};","source_mode":true,"style":"/*\r\n{% set shape %}[[ shape : enum(rectangle, circle) | rectangle ]]{% endset %}\r\n{% set dropShadow %}[[ dropShadow : boolean | FALSE ]]{% endset %}\r\n*/\r\n\r\n.exponea-covid-19-badge {\r\n\tbox-sizing: border-box;\r\n\tdisplay: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    /* background: [ backgroundColor : color | transparent ]; */\r\n    {% if dropShadow=='true' %}\r\n    \tbox-shadow: 0 3px 6px rgba(0,0,0, 0.2);\r\n    {% endif %}\r\n    border-radius: {{ '0' if shape=='rectangle' else '50%' }};\r\n    order: [[ order : enum(1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16) | 1 ]];\r\n    overflow: hidden;\r\n    position: relative;\r\n}\r\n\r\n.badge-state-loading {\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge > div {\r\n\tdisplay: block;\r\n    width: 100%;\r\n\tposition: relative;\r\n}\r\n\r\n.exponea-covid-19-badge img:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\ttransition: none; /* override */\r\n\topacity: 1; /* override */\r\n\tdisplay: block; /* override */\r\n\tborder: 0; /* override */\r\n\tmargin: 0; /* override */\r\n\tfloat: none; /* override */\r\n\ttransform: none; /* override */\r\n\tvisibility: visible; /* override */\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-placeholder:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: static; /* override */\r\n\tdisplay: block;\r\n\twidth: 100%;\r\n\tvisibility: hidden;\r\n}\r\n\r\n.exponea-covid-19-badge img.exponea-badge-icon:not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._):not(._) {\r\n\tposition: absolute;\r\n\tleft: 50%;\r\n\ttop: 50%;\r\n\t/* width: [ imageSize ]; */\r\n\twidth: 100%;\r\n\theight: auto;\r\n\ttransform: translate(-50%, -50%);\r\n}\r\n\r\n\r\n\r\n\r\n/* --- in preview mode ------------------- */\r\n\r\n.temp-badge-container {\r\n\tmargin: 25px 15px;\r\n\twidth: 80px;\r\n\theight: 80px;\r\n}\r\n\r\n.temp-badge-container .exponea-covid-19-badge {\r\n\t/*height: 100%;*/\r\n}","template_id":null,"type":"medium_rectangle"}],"variants_enabled":false},"id":"5e7b4d39e55ef5048499671d","type":"banner"},{"data":{"archived":false,"cloned_from_id":null,"components":[{"evaluate":false,"position":{"height":{"type":"fixed","value":4},"width":12,"x":0,"y":4},"project_id":null,"text":"<p>Exponea prepared two types of icons / badges on the product page for you:</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":13},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/b748d41b9bfb250eec2bf0934e19fde6a49aafdf3b8d3388ca842fc284f37a97\" style=\"width: 40px; height: 40px;\" />&nbsp;</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":6},"width":12,"x":0,"y":18},"project_id":null,"text":"<p><strong>2. Product-specific badges:</strong>&nbsp;Some of your products might fit the changing habits in consumer preferences well and you might want to use this as an opportunity to display certain badges on these products. For example, some clothes might be more comfortable and you can display a &quot;comfy homewear&quot; badge on them. Or some items fit the quarantine life better than usual, such as board games, or an elliptical bike.</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":3,"x":1,"y":13},"project_id":null,"text":"<p>Disinfected before shipment</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":12,"x":0,"y":8},"project_id":null,"text":"<p><strong>1. Global badges:</strong> If you have adopted a new policy (a new way of delivering items or disinfecting them or new return policy), display these badges on your product image to give comfort to consumers, reduce their anxiety and remove doubt.</p>\n","type":"html"},{"position":{"height":{"type":"fixed","value":4},"width":12,"x":0,"y":0},"text":"COVID-19 Badges","type":"text"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":5,"y":13},"project_id":null,"text":"<p><img alt=\"\" src=\"https://storage.googleapis.com/exp-app-storage/6f2aec76-b09c-11e6-a7f7-141877340e97/a5dd4253f91b304f7c443f0c012bafb0353bd180f27a55a5cb79b741cb750fff\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":3,"x":6,"y":13},"project_id":null,"text":"<p>No touch delivery</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":24},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/f9e5b4d8a6de2d86bdbc89f9a64eda3cc4dbb9b42da738ce9c3b090d91ef188a\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":8,"x":1,"y":24},"project_id":null,"text":"<p>Virus protective (gloves, masks, disinfectants, etc)</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":29},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/2506ae3ec9d8234d562ba7a0c2a24bf4ba347b6b448e35c8c7f0d09e3d49e3b5\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":8,"x":1,"y":29},"project_id":null,"text":"<p>Quarantine life (elliptical bike, board games, yoga mats, DIY items, video games, books, etc)</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":34},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/09f6ef2add3155025ecefadcbf1390eeaf8c898cfdd1ee8f5e155d5557235225\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":8,"x":1,"y":34},"project_id":null,"text":"<p>Remote working (headsets, microphones, laptops, paper notebooks, etc)</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":39},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/fecd665232f8b94ed6f347121b11f61384ca64910b4ac716bcd55fa955739ca8\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":8,"x":1,"y":39},"project_id":null,"text":"<p>Happy kids in quarantine (education sets for homeschooled kids, toys, board games, etc)</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":1,"x":0,"y":44},"project_id":null,"text":"<p><img alt=\"\" src=\"https://cdn.exponea.com/exponea-delivery-team/f/cece4a02135d0ef69936c8377223cfdbda628fa775dc26d27b7c0ed283403528\" style=\"width: 40px; height: 40px;\" /></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":8,"x":1,"y":44},"project_id":null,"text":"<p>Comfy homewear (pijamas, fluffy slippers, or any comfortable but stylish clothes)</p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":12,"x":0,"y":49},"project_id":null,"text":"<p>These designs are compliments of Exponea, but the weblayers are all parametric, so you can change these icons and titles of the badges based on your industry and own practices you adopted.</p>\n","type":"html"},{"position":{"height":{"type":"fixed","value":4},"width":12,"x":0,"y":59},"text":"HOW TO LAUNCH","type":"text"},{"evaluate":false,"position":{"height":{"type":"fixed","value":4},"width":12,"x":0,"y":63},"project_id":null,"text":"<p>You can find how to launch these badges in <a href=\"https://docs.google.com/document/d/1yvBk7OnQKw4HV-55vPRjge_OBr130ZjHgkACHJZw59M/edit?usp=sharing\">this walkthrough document</a></p>\n","type":"html"},{"evaluate":false,"position":{"height":{"type":"fixed","value":5},"width":12,"x":0,"y":54},"project_id":null,"text":"<p>You can use these either global or product-specific badges in two ways: You can show them on <strong>product page</strong>, and/or you can show them on <strong>list pages</strong>, such as brand or category pages.</p>\n","type":"html"}],"filters":{"attributes":[],"date_filter":{"absolute":false,"duration":{"count":30,"units":"days"},"enabled":false,"from_date":null,"offset":null,"to_date":null},"date_filter_override":false},"is_global_object":false,"name":"README","prevent_archivation":false,"tags":[],"used_project_ids":["f0ddd9fe-6751-11e9-aed1-0a580a203507"]},"id":"5e7ba89893fc1f2bd8b9cc47","type":"dashboard"}],"version":"v1.164.11"}

🚧

It might not be possible to import the JSON file if your Exponea instance has not gone through the release 1.164 yet.

Launching the badges

We designed the badge setup in a way that multiple badges on multiple places on your website can be launched simultaneously. We’ll describe below all the steps separately, but there are a lot of overlaps that you can take advantage of.

Global Badges on Product Pages

  1. Ensure that as a company you have adopted the policies/changes that the global badges represent. If you have different policies than the default badges Exponea provided (disinfection or no-touch delivery), you can change these icons to your own designs within the specific web layers. Just find the Image URL parameter within the web layer's Design section and add your own image's URL.
  1. Launch each global badge within their individual web layer asset (Start button)
  1. Make sure that you're going to display the badge on the correct DIV container on your website (you might want to look at your own website's HTML code for this). When you want to launch global badges on product pages, this parameter can be set up within the COVID-19 Badge "Product Page" Container.

📘

For Global Badges, you can completely ignore the Product Id JavaScript Expression parameter.

  1. Launch the COVID-19 Badge “Product Page” CONTAINER web layer.

Global Badges on List Pages

The first 2 steps are the same as in Global Badges on Product Pages. If you already launched Global Badges on Product Pages, you don’t need to repeat the first two steps now.

  1. Make sure that you're going to display the badge on the correct DIV container on your website (you might want to look at your own website's HTML code for this). When you want to launch global badges on list pages (category/brand pages), this parameter can be set up within the COVID-19 Badge "List Page" Container.

📘

For Global Badges, you can completely ignore the Product Id JavaScript Expression parameter.

  1. Launch COVID-19 Badge “List Page” CONTAINER web layer for the list page badges.

Product-Specific Badges on Product Pages

  1. Prepare a catalog inside your Exponea project called COVID19_badge which includes functional information about each of your products on your website. You can prepare this externally within a CSV file and then import it into Exponea. The file should look something like this example in the link.
  1. After you complete the step above, you can choose which specific badges you want to launch. Again, you can change the badge icons as you like; and as long as you have the relevant function within the catalog, you can utilize the banner we prepared for you. Just make sure to update the "catalog attribute" within the web layer.
  1. Launch the product-specific badge
  1. Make sure that you're going to display the badge on the correct DIV container on your website (you might want to look at your own website's HTML code for this). When you want to launch product-specific badges on product pages, this parameter can be set up within the COVID-19 Badge "Product Page" Container.
  1. Make sure you're taking the product_id from your product page from the correct location (the default setup should work for most websites with a data layer, but it's not universal. It depends on the website). When you want to launch product-specific badges on product pages, this parameter can be set up within the COVID-19 Badge "Product Page" Container, under Product Id Javascript Expression.
  1. Finally, launch the COVID-19 Badge "Product Page" Container.

Product-Specific Badges on List Pages

The first 3 steps are the same as in Product-Specific Badges on Product Pages. If you already launched Product-Specific Badges on Product Pages, you don’t need to repeat the first three steps now.

  1. Make sure that you're going to display the badge on the correct DIV container on your website (you might want to look at your own website's HTML code for this). When you want to launch product-specific badges on list pages (category/brand pages), this parameter can be set up within the COVID-19 Badge "List Page" Container.
  1. Make sure you're taking the product_id from your product page from the correct location (the default setup should work for most websites with a data layer, but it's not universal. It depends on the website) When you want to launch product-specific badges on list pages, this parameter can be set up within the COVID-19 Badge "List Page" Container, under Product Id Javascript Expression.
  1. Finally, launch the COVID-19 Badge "List Page" Container.

Updated 6 months ago


COVID-19 Badges


Suggested Edits are limited on API Reference Pages

You can only suggest edits to Markdown body content, but not to the API spec.


We rely on cookies

to optimize our communication and to enhance your customer experience. By clicking on the Accept and Close button, you agree to the collection of cookies. You can also adjust your preferences by clicking on Manage Preferences. For more information please see our Privacy policy.

Manage cookies
Accept & close

Cookies preferences

Accept & close
Back