{"version":3,"file":"event.min.js","mappings":"AAAAA,SAASC,iBAAiB,oBAAoB,WAGxBD,SAASE,eAAe,aACvBF,SAASE,eAAe,cAC9BF,SAASE,eAAe,QACrBF,SAASE,eAAe,eA8F5C,IAEAC,OAAOH,UAAUI,OAAM,SAASC,GAU5B,SAASC,IACsC,GAAxCD,EAAE,4BAA4BE,QAC7BF,EAAE,8BAA8BG,MAGxC,CAdAH,EAAE,qBAAqBI,MAAM,EAAG,GAAGC,OACnCJ,IAEAD,EAAE,cAAcM,OAAM,SAASC,GAC3BA,EAAEC,iBACFR,EAAE,4BAA4BI,MAAM,EAAG,GAAGC,OAC1CJ,GACJ,IASA,IAAMQ,EAAWT,EAAE,oCACnB,GAAIS,EAASP,OAAS,EAAG,CACrB,IACIQ,EADcD,EAASE,SACG,GAC9BX,EAAE,oBAAoBY,IAAI,MAAOF,EAAY,KACjD,CAGJ","sources":["webpack://empty-project/./src/js/event.js"],"sourcesContent":["document.addEventListener(\"DOMContentLoaded\", () => {\r\n\r\n    // DOM elements to track.\r\n    const leftArrow = document.getElementById('leftArrow');\r\n    const rightArrow = document.getElementById('rightArrow');\r\n    const menu = document.getElementById('menu');\r\n    const wrapper = document.getElementById('menu-wrapper');\r\n\r\n    function setEDPNavMenu() {\r\n        if (rightArrow !== null) { rightArrow.classList.remove(\"hidden\");}\r\n        if (leftArrow !== null) { leftArrow.classList.add(\"hidden\");}\r\n        if (menu !== null) { menu.style.left = '0px';}\t// Reset menu position to far left.\r\n        //wrapper.classList.add(\"center-flex\");\r\n        \r\n        // Establish unchanging constants and initialize variables.\r\n        let menuWrapperSize = document.getElementById('menu-wrapper').offsetWidth; // Unchanging area of the screen where the menu is always visible.\r\n        let menuSize = document.getElementById('menu').offsetWidth;\t// Includes itemsCount * itemSize but also factors in space between items added by flexbox.\r\n        let menuInvisibleSize = Math.max(menuSize - menuWrapperSize, 0);\t// Fixed portion of scrollable menu that is hidden at all times, or zero if menu fits within container.\r\n        let arrowSize = rightArrow.offsetWidth;\t// Width of each arrow div. In current design, this equates to 12px. Still computes value even if right arrow is hidden, which it is at time this line is executed.\r\n        //console.log(arrowSize);\r\n        let menuEndOffset = Math.max(menuInvisibleSize + arrowSize + 20, 0);\t// Fixed portion of scrollable menu that is not obscured by an overlapping arrow key, or zero if no arrow keys are needed.\r\n        let itemsCount = document.getElementsByClassName('item').length; // Number of menu items.\r\n        let itemSize = document.getElementsByClassName('item')[0].offsetWidth; // offsetWidth includes borders and padding but not margins of a menu item (since all the same, choose first one in array). FYI, clientWidth includes padding but NOT borders and margins.\r\n        let itemsSpaceBetween = (menuSize - (itemsCount * itemSize)) / (itemsCount - 1);\t// Space between menu items is deliberately set to equal menu wrapper padding left/right. In this design it is 20 pixels.\r\n        let distanceInPixels = itemSize + itemsSpaceBetween;\t// Distance to scroll per arrow button click equals width of a menu item plus the space to its right or left. In this design, it is 75 + 20 = 95.\r\n        let durationInMilliseconds = 500;\r\n        let starttime = null;\r\n\r\n        // Iniitially, on page load menu items are left aligned and left arrow is hidden. Let's hide right arrow also if there is no need for it (as when all menu items fit within visible container).\r\n        if (menuInvisibleSize === 0) {\r\n            if (rightArrow !== null) {rightArrow.classList.add(\"hidden\");}\r\n        }\r\n\r\n        // Get current left position of menu in pixels.\r\n        let getMenuPosition = () => {\r\n            return parseFloat(menu.style.left) || 0;\t// First time, left property is not set so initialize to 0.\r\n        };\r\n\r\n        // Get current distance (in pixels) that we have scrolled.\r\n        let getScrolledDistance = () => {\r\n            return -1 * getMenuPosition();\t// Negate value because this is the only way it will work.\r\n        };\r\n\r\n        // After an arrow key is clicked and menu is animating, check to see where we are and determine which arrow key(s) to show, always resulting in at least one arrow key visible. Also, update data at bottom.\r\n        // Notes: o This function is only applicable when all menu items cannot be seen in container at one time and an arrow key is clicked to animate menu. \r\n        //        o If all menu items fit in visible container, UI will be initially rendered without any arrow keys and this function will never be called.\r\n        let checkPosition = () => {\r\n            // Calculate where we are right now.\r\n            let menuPosition = getScrolledDistance();\r\n\r\n            // Determine which arrow key(s) to display based on position.\r\n            if (menuPosition <= arrowSize) {\t\t\t// SHOW RIGHT ARROW if we are scrolling from far left.\r\n                leftArrow.classList.add(\"hidden\");\t\t// FYI, this will NOT create duplicate hidden class if leftArrow already contains it.\t\r\n                rightArrow.classList.remove(\"hidden\");\r\n                wrapper.classList.remove(\"center-flex\");\r\n            } else if (menuPosition < menuEndOffset) {\t// SHOW BOTH ARROWS when in the middle of the menu.\r\n                leftArrow.classList.remove(\"hidden\");\r\n                rightArrow.classList.remove(\"hidden\");\r\n                wrapper.classList.add(\"center-flex\");\r\n            } else if (menuPosition >= menuEndOffset) {\t// SHOW LEFT ARROW if we are scrolling as far right as we can go.\r\n                leftArrow.classList.remove(\"hidden\");\r\n                rightArrow.classList.add(\"hidden\");\r\n                wrapper.classList.remove(\"center-flex\");\r\n            }\r\n        };\r\n\r\n        const animateMenu = (timestamp, startingPoint, distance) => {\r\n            let runtime = timestamp - starttime;\r\n            let progress = runtime / durationInMilliseconds;\r\n            progress = Math.min(progress, 1);\r\n            let newValue = (startingPoint + (distance * progress)).toFixed(2) + 'px';\r\n            menu.style.left = newValue;\r\n\r\n            if (runtime < durationInMilliseconds) {\t// If we still have time remaining...\r\n                requestAnimationFrame(function (timestamp) {\t// Request another animation frame and recursively call THIS function.\r\n                    animateMenu(timestamp, startingPoint, distance);\r\n                })\r\n            }\r\n            checkPosition();\r\n        };\r\n\r\n        let animationFramesSetup = (timestamp, travelDistanceInPixels) => {\r\n            timestamp = timestamp || new Date().getTime();\t// if browser doesn't support requestAnimationFrame, generate our own timestamp using Date.\r\n            starttime = timestamp;\r\n            let startingPoint = getMenuPosition();\t\t// This cannot be defined up top in constants. Need to read current value only during initial setup of arrow button click.\r\n            animateMenu(timestamp, startingPoint, travelDistanceInPixels);\r\n        };\r\n\r\n        rightArrow.addEventListener('click', () => requestAnimationFrame(\r\n            timestamp => animationFramesSetup(timestamp, -1 * distanceInPixels)\r\n        ));\r\n\r\n        leftArrow.addEventListener('click', () => requestAnimationFrame(\r\n            timestamp => animationFramesSetup(timestamp, distanceInPixels)\r\n        ));\r\n    }\r\n\r\n    //setEDPNavMenu();\r\n    //window.onresize = setEDPNavMenu;\r\n\r\n});\r\n\r\njQuery(document).ready(function($) {\r\n    $(\".ticket-grid__row\").slice(0, 8).show();\r\n    checkButton();\r\n    \r\n    $(\"#load_more\").click(function(e){ \r\n        e.preventDefault();\r\n        $(\".ticket-grid__row:hidden\").slice(0, 8).show();\r\n        checkButton();\r\n    });\r\n    \r\n    function checkButton(){\r\n        if($(\".ticket-grid__row:hidden\").length == 0){\r\n            $(\"div.edp_dates__more-button\").hide();\r\n            //console.log('hide');\r\n        }\r\n    }\r\n\r\n    const alertdiv = $(\"#wpfront-notification-bar-spacer\");\r\n    if (alertdiv.length > 0) {\r\n        let alertheight = alertdiv.height();\r\n        let setheight = alertheight + 80;\r\n        $(\"#edp_nav_section\").css(\"top\", setheight + \"px\");\r\n    }\r\n    //$(\"#edp_nav_section\").css(\"height\", $(\"#wpfront-notification-bar-spacer\").height()+ \"80px\");\r\n    \r\n});\r\n"],"names":["document","addEventListener","getElementById","jQuery","ready","$","checkButton","length","hide","slice","show","click","e","preventDefault","alertdiv","setheight","height","css"],"sourceRoot":""}