const scrollAction = (state, main, customElUserBox, loginButton) => { if (state) { main.classList.add('stickyContent'); if(loginButton) { loginButton.classList.add('tm-login--small') } } else { main.classList.remove('stickyContent'); if(loginButton) { loginButton.classList.remove('tm-login--small') } } if (customElUserBox) { customElUserBox.setAttribute('scroll-mode', `${state}`); } } const stickyNavi = () => { const superBanner = document.querySelector('#werbung_superbanner_wrapper'); let headerHeight = 0; if(superBanner) { headerHeight = document.querySelector('header').offsetHeight + document.querySelector('#werbung_superbanner_wrapper').offsetHeight; } else { headerHeight = document.querySelector('header').offsetHeight; } const main = document.querySelector('#main'); const loginButton = document.querySelector('.tm-login'); const customElUserBox = document.querySelector('tm-user-box'); let ticking = false; let stickyState = false; document.addEventListener('scroll', () => { if (!ticking) { window.requestAnimationFrame(() => { const updatedStickyState = document.documentElement.scrollTop > headerHeight; if (updatedStickyState !== stickyState) { scrollAction(updatedStickyState, main, customElUserBox, loginButton); } ticking = false; stickyState = updatedStickyState; }); ticking = true; } }); window.addEventListener('load', () => { scrollAction(document.documentElement.scrollTop > headerHeight, main, customElUserBox, loginButton); }); } const configureSkyBelowTheFold = () => { const skyBtfElement = document.querySelector('.werbung-skyscraperbtf-container'); const pageHeight = document.body.scrollHeight; if(skyBtfElement && pageHeight > 3000) { skyBtfElement.style.top = (pageHeight >= 5000 ? pageHeight / 2 : 2000) + 'px'; skyBtfElement.style.display = 'block'; } } const initLoginBox = () => { const loginButton = document.querySelector("#login"); let loadingLoginBox = false; if(loginButton) { loginButton.addEventListener("click", async (event) => { event.preventDefault(); const popuphalter = document.querySelectorAll('.popuphalter'); if(!popuphalter.length) { const header = document.querySelector('.navihalter'); const header2022 = document.querySelector('.main-navbar'); const div = document.createElement("div"); const loginBox = document.createElement("div"); div.classList.add('row'); div.classList.add('popuphalter'); loginBox.setAttribute('id', 'loginbox'); loginBox.classList.add('small-12'); div.append(loginBox); if(header) { header.after(div); } if(header2022) { header2022.after(div); } } const loginBox = document.querySelector("#loginbox"); if (loginBox.style.display !== 'block' && !loadingLoginBox) { loadingLoginBox = true; const parser = new DOMParser(); const getLoginForm = await fetch(loginUrl); const loginFormMarkup = await getLoginForm.text(); const loginFormDOM = parser.parseFromString(loginFormMarkup, "text/html"); loginBox.innerHTML = loginFormDOM.querySelector('#login-form').outerHTML; loginBox.style.display = 'block'; const userNameInput = document.querySelector("#LoginForm_username"); userNameInput.focus(); loadingLoginBox = false; } }); } } document.addEventListener("DOMContentLoaded", () => { initLoginBox(); stickyNavi(); configureSkyBelowTheFold(); var config={ '.chzn-select': {}, '.chzn-select-deselect': { allow_single_deselect: true }, '.chzn-select-no-single': { disable_search_threshold: 10 }, '.chzn-select-no-results': { no_results_text: 'Oops, nothing found!' }, '.chzn-select-width': { width: '95%' } }; for (var selector in config) { $(selector).chosen(config[selector]); } })