Line 110: | Line 110: | ||
var menuLinks = document.getElementsByClassName("main-choice"); | var menuLinks = document.getElementsByClassName("main-choice"); | ||
for (let link of menuLinks) { | for (let link of menuLinks) { | ||
− | link.addEventListener('mouseover', function() { | + | link.addEventListener('mouseover', initializeSecondBubble); |
− | for (let | + | } |
− | if (lk.classList.contains("active")) { | + | for (let link of menuLinks) { |
− | + | link.addEventListener('click', function() { | |
− | + | for (let linkRecursive of menuLinks) linkRecursive.removeEventListener('mouseover', initializeSecondBubble); | |
− | + | link.initializeSecondBubble; | |
− | + | setTimeout(function() { | |
− | + | for (let linkRecursive of menuLinks) linkRecursive.addEventListener('mouseover', initializeSecondBubble); | |
+ | }, 3000) | ||
+ | }) | ||
+ | } | ||
+ | |||
+ | function initializeSecondBubble() { | ||
+ | for (let lk of menuLinks) { | ||
+ | if (lk.classList.contains("active")) { | ||
+ | lk.classList.remove("active"); | ||
+ | const myNode = document.getElementById("appendable"); | ||
+ | while (myNode.firstChild) { | ||
+ | myNode.removeChild(myNode.lastChild); | ||
} | } | ||
} | } | ||
− | + | } | |
− | + | if (document.querySelector('#popup-main').classList.contains('active')) openSecBubble(this) | |
} | } | ||
+ | |||
$('#appendable li a').on("click", function() { | $('#appendable li a').on("click", function() { |
Revision as of 15:16, 22 October 2020
//---------------Checking if the page is content page---------------
var textSection = null; var navbar = document.getElementById("navbar"); window.addEventListener('load', function() { textSection = document.querySelector('.elevate-navbar'); }) window.addEventListener('scroll', function() { updateScrollbar(); checkNavbarPos(); });
function checkNavbarPos() { if (textSection != null) { var navbarTop = navbar.getBoundingClientRect().top; var mainTagTop = textSection.getBoundingClientRect().top; if (navbarTop >= mainTagTop) { if (document.getElementById("bubbles-to-close").getAttribute("open") != true) navbar.setAttribute("onText", "true"); } else { navbar.setAttribute("onText", "false"); } } var footerTop = document.getElementById("footerWrapper").getBoundingClientRect().top; var scrollbarBottom = document.getElementById("scrollbar-container").getBoundingClientRect().bottom; if (scrollbarBottom >= footerTop) { if (document.getElementById("scrollbar-container").getAttribute("hiddenScroll") == "false") { document.getElementById("scrollbar-container").setAttribute("hiddenScroll", "true"); } } else { if (document.getElementById("scrollbar-container").getAttribute("hiddenScroll") == "true") { document.getElementById("scrollbar-container").setAttribute("hiddenScroll", "false"); } } }
//---------------Scrollbar height--------------- function updateScrollbar() { var winScroll = document.body.scrollTop || document.documentElement.scrollTop; var height = document.documentElement.scrollHeight - window.innerHeight;; var scrolled = (winScroll / height) * 100; document.getElementById("scrollbar").style.height = scrolled + "%"; }
//---------------Closing the menu and returning to default values--------------- function closeMenu() { var toggleable = document.querySelectorAll('.toggleable'); for (let item of toggleable) { item.classList.remove("active"); } document.getElementById("fixedOverlay").setAttribute("bg", "none"); document.getElementById("appendable").classList.remove(currentChoice); document.querySelector(".hamb-wrapper").classList.remove("invisible"); currentChoice = null; const myNode = document.getElementById("appendable"); while (myNode.firstChild) { myNode.removeChild(myNode.lastChild); } document.getElementById("bubbles-to-close").setAttribute("open", "false"); checkNavbarPos();
}
function openSecBubble(link) { link.classList.add("active"); document.getElementById("appendable").classList.remove(currentChoice); currentChoice = link.id; document.getElementById("popup-next").classList.add("active"); var items = menuItems[currentChoice]; document.getElementById("appendable").classList.add(currentChoice) let counter = 0; for (const [key, value] of Object.entries(menuItems[currentChoice])) { var node = document.createElement("li"); var nodeLink = document.createElement("a"); nodeLink.href = value.link; nodeLink.innerHTML = value.name; if (currentChoice = "project") { counter++; if (counter <= 5) node.classList.add('right-align'); } node.appendChild(nodeLink); document.getElementById("appendable").appendChild(node); } resizeBubble(); }
var openMenuEls = document.getElementsByClassName("menu-wrapper"); for (let el of openMenuEls) { //---------------Clicking on menu sandwich/close button--------------- el.addEventListener('click', function() { //---------------If menu is open and close button is clicked, close menu--------------- if (this.classList.contains("active")) { closeMenu(); } else { document.getElementById("popup-main").classList.add("active"); this.classList.add("active"); document.querySelector(".hamb-wrapper").classList.add("invisible"); fxdOv = document.getElementById("fixedOverlay"); fxdOv.setAttribute("bg", "dark"); document.getElementById("navbar").setAttribute("onText", "false"); document.getElementById("bubbles-to-close").setAttribute("open", "true"); if (fxdOv.classList.length != 0) { link = fxdOv.classList[0] openSecBubble(document.getElementById(link)) } } }) } var currentChoice; var menuLinks = document.getElementsByClassName("main-choice"); for (let link of menuLinks) { link.addEventListener('mouseover', initializeSecondBubble); } for (let link of menuLinks) { link.addEventListener('click', function() { for (let linkRecursive of menuLinks) linkRecursive.removeEventListener('mouseover', initializeSecondBubble); link.initializeSecondBubble; setTimeout(function() { for (let linkRecursive of menuLinks) linkRecursive.addEventListener('mouseover', initializeSecondBubble); }, 3000) }) }
function initializeSecondBubble() { for (let lk of menuLinks) { if (lk.classList.contains("active")) { lk.classList.remove("active"); const myNode = document.getElementById("appendable"); while (myNode.firstChild) { myNode.removeChild(myNode.lastChild); } } }
if (document.querySelector('#popup-main').classList.contains('active')) openSecBubble(this) }
$('#appendable li a').on("click", function() { closeMenu(); })
$(window).resize(function() { resizeBubble(); });
function resizeBubble() { $(function() { var elementWidth = $("#appendable").width(); var elementHeight = $("#appendable").height(); var resizingConstant = (function() { if (currentChoice == "hp") { return 1.4 } else if (currentChoice == "team") { return 1.7 } else if (currentChoice == "parts") { return 1.45 } else { return 1.15 } })(); if (elementHeight > elementWidth) { $("#bubbles #popup-next").css("height", elementHeight * resizingConstant); $("#bubbles #popup-next").css("width", elementHeight * resizingConstant); } else { $("#bubbles #popup-next").css("height", elementWidth * resizingConstant); $("#bubbles #popup-next").css("width", elementWidth * resizingConstant); } }) } document.getElementById("bubbles-to-close").addEventListener('click', function() { var isOpen = document.getElementById("popup-main"); if (isOpen.classList.contains("active")) { closeMenu(); } }) var menuItems = { project: { desc: { name: "Description", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Description" }, imp: { name: "Implementation", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Implementation", }, des: { name: "Design", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Design", }, exp: { name: "Experiments", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Experiments", }, res: { name: "Results", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Results", }, eng: { name: "Engineering", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Engineering", }, pof: { name: "Proof of Concept", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Proof_Of_Concept", }, mod: { name: "Model", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Model", }, sof: { name: "Software", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Software", }, con: { name: "Contribution", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Contribution", } }, parts: { par: { name: "Parts", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Parts", }, col: { name: "Parts Collection", link: "https://2020.igem.org/Team:Vilnius-Lithuania/PartsCollection", } }, hp: { int: { name: "Integrated
Human Practices", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Human_Practices", }, col: { name: "Education &
Public Engagement", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Education", } }, team: { members: { name: "Members", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Team", }, coll: { name: "Collaborations", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Collaborations", }, att: { name: "Attributions", link: "https://2020.igem.org/Team:Vilnius-Lithuania/Attributions", } } }