{"version":3,"file":"videogridblock.7f08b7dd.js","mappings":"AACIA,OAAOC,YAAcD,OAAOC,aAAe,CAAC,EAC5CD,OAAOC,YAAYC,eAAiBF,OAAOC,YAAYC,gBAAkB,CAAC,EAE1EF,OAAOC,YAAYC,eAAeC,KAAO,WAIrC,IAAIC,EAAaC,SAASC,iBAAiB,cACvCC,EAAiBF,SAASG,cAAc,qBAExCC,EAAkB,EAGlBC,EAAqB,SAAUD,GAC/BL,EAAWO,SAAQ,SAAUC,EAAUC,GAC/BA,EAAQJ,EACRG,EAASE,UAAUC,IAAI,QAEvBH,EAASE,UAAUE,OAAO,OAElC,GAGJ,EAEAN,EAAmBD,GAEnBF,EAAeU,iBAAiB,SAAS,WAhBzB,KAiBRR,GAGAC,EADAD,EAAkB,GAElBF,EAAeW,YAAc,cAI7BR,EADAD,GAAmB,GAxBX,KA0BJA,IACAF,EAAeW,YAAc,aAGzC,IAGId,EAAWe,QAAU,IACrBZ,EAAea,MAAMC,QAAU,SAK/BjB,EAAaC,SAASC,iBAAiB,eAEhCK,SAAQ,SAAUC,GACzB,IAAIU,EAAcV,EAASJ,cAAc,iBAGzCc,EAAYL,iBAAiB,SAAS,SAAUM,GAGX,GAA7BD,EAAYF,MAAMI,UAClBF,EAAYF,MAAMI,QAAU,EAC5BF,EAAYF,MAAMK,OAAS,EAC3Bb,EAASQ,MAAMM,WAAa,cAC5Bd,EAASQ,MAAMK,OAAS,GAI5BF,EAAMI,kBAGaf,EAASJ,cAAc,mBAC7BY,MAAMI,QAAU,CACjC,GACJ,IAOQxB,OAAO4B,WAAa,KAILvB,SAASC,iBAAiB,2BAGhCK,SAAQ,SAAUkB,GACvBA,EAAQC,UAAYD,EAAQC,UAAUC,QAAQ,oBAAqB,gBACvE,IAOgD,GAApD/B,OAAOC,YAAYC,eAAe8B,iBAClChC,OAAOC,YAAYC,eAAe8B,gBAAiB,EAG3D,EAGAhC,OAAOC,YAAYC,eAAe+B,WAAY","sources":["webpack://advanced-web/./UI/js/core/modules/videogridblock.js"],"sourcesContent":["(function () {\r\n    window.oneadvanced = window.oneadvanced || {};\r\n    window.oneadvanced.videogridblock = window.oneadvanced.videogridblock || {};\r\n\r\n    window.oneadvanced.videogridblock.init = function () {\r\n        //console.log(\"Initialising videogridblock ...\");\r\n\r\n        // this is the 4-8-12 Show More/Less button functionality\r\n        var videoBoxes = document.querySelectorAll('.video-box');\r\n        var showMoreButton = document.querySelector('.show-more-button');\r\n\r\n        var numVideosToShow = 4; // Initial number of videos to show\r\n        var maxVideos = 12; // Maximum number of videos\r\n\r\n        var toggleVideoClasses = function (numVideosToShow) {\r\n            videoBoxes.forEach(function (videoBox, index) {\r\n                if (index < numVideosToShow) {\r\n                    videoBox.classList.add('show');\r\n                } else {\r\n                    videoBox.classList.remove('show');\r\n                }\r\n            });\r\n\r\n            //console.log(\"number of Videos To Show is \" + numVideosToShow);\r\n        };\r\n\r\n        toggleVideoClasses(numVideosToShow);\r\n\r\n        showMoreButton.addEventListener('click', function () {\r\n            if (numVideosToShow === maxVideos) {\r\n                // if all videos are currently shown, toggle back to showing 4 videos\r\n                numVideosToShow = 4;\r\n                toggleVideoClasses(numVideosToShow);\r\n                showMoreButton.textContent = 'Show more';\r\n            } else {\r\n                // Show the next batch of 4 videos\r\n                numVideosToShow += 4;\r\n                toggleVideoClasses(numVideosToShow);\r\n                if (numVideosToShow === maxVideos) {\r\n                    showMoreButton.textContent = 'Show less';\r\n                }\r\n            }\r\n        });\r\n\r\n        // if there are 4 videos or less, hide \"show more\" button\r\n        if (videoBoxes.length <= 4) {\r\n            showMoreButton.style.display = 'none';\r\n        }\r\n        \r\n\r\n        // this is the click-detect to hide the Hover Text for Mobile\r\n        var videoBoxes = document.querySelectorAll('.video-box');\r\n\r\n        videoBoxes.forEach(function (videoBox) {\r\n            var wistiaVideo = videoBox.querySelector('.wistia_embed');\r\n\r\n            // add click event listener to each Wistia video\r\n            wistiaVideo.addEventListener('click', function (event) {\r\n\r\n                // toggle the visibility of the Wistia video embed\r\n                if (wistiaVideo.style.opacity == 0) {\r\n                    wistiaVideo.style.opacity = 1;\r\n                    wistiaVideo.style.zIndex = 1;\r\n                    videoBox.style.background = \"transparent\";\r\n                    videoBox.style.zIndex = 0;\r\n                }\r\n\r\n                // prevent the click event from propagating to the parent elements\r\n                event.stopPropagation();\r\n\r\n                // hide the hover text box of the clicked video\r\n                var hoverTextBox = videoBox.querySelector('.hover-text-box');\r\n                hoverTextBox.style.opacity = 0;\r\n            });\r\n        });\r\n        \r\n\r\n        //Make video popover on desktop but play in player container on mobile\r\n        // on page load\r\n        function loadForMobile() {\r\n            // only for mobile\r\n            if (window.innerWidth < 768) {\r\n                //console.log(\"Applying Mobile view styles\");\r\n\r\n                // elements with popover=true class which should be the span used for desktop\r\n                var elements = document.querySelectorAll('[class*=\"popover=true\"]');\r\n\r\n                // make the popover=true to popover=false to make it play in container\r\n                elements.forEach(function (element) {\r\n                    element.className = element.className.replace(/\\bpopover=true\\b/g, 'popover=false');\r\n                });\r\n            }\r\n        }\r\n\r\n        loadForMobile();\r\n\r\n\r\n        if (window.oneadvanced.videogridblock.hasinitialised != true) {\r\n            window.oneadvanced.videogridblock.hasinitialised = true;\r\n            //console.log(\"videogridblock.hasinitialised is made True.\");\r\n        }\r\n    };\r\n\r\n\r\n    window.oneadvanced.videogridblock.hasLoaded = true;\r\n})();\r\n"],"names":["window","oneadvanced","videogridblock","init","videoBoxes","document","querySelectorAll","showMoreButton","querySelector","numVideosToShow","toggleVideoClasses","forEach","videoBox","index","classList","add","remove","addEventListener","textContent","length","style","display","wistiaVideo","event","opacity","zIndex","background","stopPropagation","innerWidth","element","className","replace","hasinitialised","hasLoaded"],"sourceRoot":""}