DV8/GameExpo23
1
0
Fork 0
mirror of https://github.com/Fluffy-Bean/GameExpo23.git synced 2025-05-19 09:44:52 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Fix Commit history

Browse source
This commit is contained in:
Michał Gdula 2023-06-11 20:44:00 +01:00
parent a29f06dfee
commit d26d8cb021
70 changed files with 674 additions and 477 deletions
Download patch file Download diff file Expand all files Collapse all files

82
DV8-Expo/website/static/js/nav.js
View file

@ -1,82 +0,0 @@
const defaultTitle = "DV8 Game Expo <span>2023</span>";
let navSpacing = (5 * 16); // The amount of pixels to offset the section by
let prevElement = null;
function resizeNav() {
if (window.innerWidth > 600) {
navSpacing = (5 * 16);
} else {
navSpacing = (8 * 16);
}
}
function scrollFunction() {
let nav = document.querySelector("nav");
// let scrollHeight = window.innerHeight - nav.offsetHeight;
let scrollHeight = 0;
if (document.body.scrollTop > scrollHeight ||
document.documentElement.scrollTop > scrollHeight) {
nav.classList.add("scrolled");
} else {
nav.classList.remove("scrolled");
}
}
function checkSection() {
// Get the nav and sections
let navTitle = document.querySelector(".title > p");
let sections = document.querySelectorAll("section");
// If we're at the top of the page, set the title to the default
if ((window.pageYOffset + navSpacing) < sections[0].offsetTop || window.pageYOffset === 0) {
// If we're already on the default title, don't do anything as it'll break the animation
if (prevElement === null) return;
navTitle.innerHTML = defaultTitle;
navTitle.style.animation = "title-change 0.2s ease-in-out";
prevElement = null;
// Remove the animation after it's done, so we can animate again
setTimeout(() => { navTitle.style.animation = ""; }, 200);
return;
}
// While at this point we may not need to check for the sections
// There aren't many sections, so it's not a big deal
sections.forEach((section) => {
// Get the position of the section
let top = section.offsetTop;
let bottom = section.offsetTop + section.offsetHeight;
// If the section is on the screen is:
// 1. The top of the section is above the top of the screen
// 2. The bottom of the section is below the bottom of the screen
if ((window.pageYOffset + navSpacing) >= top && window.pageYOffset < (bottom - navSpacing)) {
// If we're already on the section, don't do anything as it'll break the animation
if (prevElement === section) return;
navTitle.innerHTML = section.id.split("_").join(" ");
navTitle.style.animation = "title-change 0.2s ease-in-out";
prevElement = section;
// Remove the animation after it's done, so we can animate again
setTimeout(() => { navTitle.style.animation = ""; }, 200);
}
});
}
document.querySelectorAll("nav > ul > li > a").forEach((element) => {
element.onclick = () => {
let anchor = location.hash.split("#")[1].toString();
let element = document.getElementById(anchor);
if (element === null) {
window.scrollTo({ top: 0, behavior: "smooth" });
} else {
window.scrollTo({top: (element.offsetTop + navSpacing), behavior: "smooth"});
}
}
});