https://www.gdata.nl/typo3conf/ext/gd_sites/Resources/Public/JavaScript/comparison-boxes-2021.js?1790250842

1/**
2 * JS for the G DATA comparison boxes.
3 *
4 * @author    Christopher Christen <[email protected]>
5 * @copyright (c) 2021, G DATA CyberDefense AG
6 */
7function GDataComparisonBoxes(){this.breakpoint=1024,this.DOMElements={comparisonBoxes:document.querySelector(".comparison-boxes"),comparisonControlItems:document.querySelectorAll(".comparison-boxes__controls__item")},this.init=()=>{this._addOSListener(),this._initMobileSlider(),window.addEventListener("resize",(()=>this._initMobileSlider()))},this._addOSListener=()=>{window.addEventListener("load",(()=>{let e=GdPlatform.getOsFamily().toLowerCase();"mac"!==e&&"android"!==e&&"ios"!==e&&(e="windows"),document.querySelectorAll(".comparison-boxes__item__os--"+e).forEach((e=>{e.parentNode.removeChild(e)})),document.querySelectorAll(".comparison-boxes__controls__item__os--"+e).forEach((e=>{e.parentNode.removeChild(e)})),this.DOMElements.comparisonBoxes.classList.add("loaded"),this._setDataAttributes()}))},this._setDataAttributes=()=>{const e=document.querySelectorAll(".comparison-boxes__controls__item"),t=document.querySelectorAll(".comparison-boxes__item");for(let i=0;i<t.length;i++){let o=parseInt(i)+1;e[i].setAttribute("data-control-item",o),t[i].setAttribute("data-box-item",o)}},this._initMobileSlider=()=>{if(document.documentElement.clientWidth<this.breakpoint){this._mobileSliderSetContainerHeight(),this._initMobileSwipeGestures();const e=this.DOMElements.comparisonControlItems;for(let t=0;t<e.length;t++)e[t].addEventListener("click",(()=>{const i=this._mobileSliderGetActiveId(),o=this._mobileSliderGetActiveItem(),s=e[t].getAttribute("data-control-item"),r=document.querySelector('[data-box-item="'+s+'"]');i<s?this._mobileSliderShowNext(o,r):i>s&&this._mobileSliderShowPrevious(o,r)}))}else this._resetMobileSlider()},this._mobileSliderSetContainerHeight=()=>{const e=this.DOMElements.comparisonBoxes;e.style.height=e.querySelector(".comparison-boxes__item.active").offsetHeight+"px"},this._resetMobileSlider=()=>{const e=this.DOMElements.comparisonBoxes;e.removeAttribute("style");for(let t=0;t<e.children.length;t++)e.children[t].removeAttribute("style")},this._mobileSliderShowNext=(e,t)=>{t.style.transform="translateX(100%)",t.style.opacity=0,setTimeout((()=>{e.style.transform="translateX(-100%)",this._mobileSliderChangeActiveState(e,t)}),200)},this._mobileSliderShowPrevious=(e,t)=>{t.style.transform="translateX(-100%)",t.style.opacity=0,setTimeout((()=>{e.style.transform="translateX(100%)",this._mobileSliderChangeActiveState(e,t)}),200)},this._mobileSliderChangeActiveState=(e,t)=>{t.style.opacity=1,t.style.transform="translateX(0)",e.classList.remove("active"),t.classList.add("active"),this._mobileSliderSetContainerHeight(),this._mobileSliderChangeControlActiveState(e,t)},this._mobileSliderChangeControlActiveState=(e,t)=>{const i=e.getAttribute("data-box-item"),o=t.getAttribute("data-box-item");document.querySelector('[data-control-item="'+i+'"]').classList.remove("active"),document.querySelector('[data-control-item="'+o+'"]').classList.add("active")},this._mobileSliderGetActiveId=()=>{const e=document.querySelector(".comparison-boxes__item.active").getAttribute("data-box-item");return parseInt(e)},this._mobileSliderGetActiveItem=()=>document.querySelector('[data-box-item="'+this._mobileSliderGetActiveId()+'"]'),this._initMobileSwipeGestures=()=>{const e=new Hammer(this.DOMElements.comparisonBoxes);e.get("swipe").set({direction:Hammer.DIRECTION_HORIZONTAL}),e.on("swipeleft",(()=>this._mobileSliderTouchSwipeLeft())),e.on("swiperight",(()=>this._mobileSliderTouchSwipeRight()))},this._mobileSliderTouchSwipeLeft=()=>{const e=this.DOMElements.comparisonBoxes.querySelectorAll(".comparison-boxes__item").length,t=this._mobileSliderGetActiveId();t<e&&this._mobileSliderTouchSwipe("left",t+1)},this._mobileSliderTouchSwipeRight=()=>{const e=this._mobileSliderGetActiveId();e>1&&this._mobileSliderTouchSwipe("right",e-1)},this._mobileSliderTouchSwipe=(e,t)=>{const i=this._mobileSliderGetActiveItem(),o=document.querySelector('[data-box-item="'+t+'"]');"right"===e&&this._mobileSliderShowPrevious(i,o),"left"===e&&this._mobileSliderShowNext(i,o)}}var GdWebsite=GdWebsite||{};GdWebsite.ComparsionBoxes=new GDataComparisonBoxes,GdWebsite.ComparsionBoxes.init();