diff --git a/css/general.css b/css/general.css index 71494b5..1096adc 100644 --- a/css/general.css +++ b/css/general.css @@ -177,7 +177,7 @@ nav ul li { text-align: center; align-items: center; top: 30px; - right: -60%; + right: calc(100% / 2); padding: 2px 7px; width: max-content; opacity: 1; @@ -233,13 +233,13 @@ nav ul li { @keyframes blinking { 0% { - opacity: 1; + filter: brightness(1); } 50% { - opacity: 0.8; + filter: brightness(0.8); } 100% { - opacity: 1; + filter: brightness(1); } } @@ -1319,8 +1319,7 @@ section { } /* Schedule */ - -#schedule-heading { +#schedule { padding-top: 70px; } @@ -1337,7 +1336,7 @@ section { padding: 20px 20px; margin-top: 20px; width: 95%; - min-width: 390px; + min-width: 370px; max-width: 650px; background-color: rgb(29, 27, 36); border-radius: 10px; @@ -1361,13 +1360,13 @@ section { .modal { border: 1px solid rgb(142, 102, 177); background-color: #23262a; - width: 500px; + min-width: 350px; + max-width: 500px; position: fixed; margin: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); - max-width: 100%; display: none; text-align: left; border-radius: 5px; @@ -2582,8 +2581,6 @@ footer { } #socials { - width: fit-content; - height: auto; display: flex; flex-wrap: wrap; margin-top: 10px; diff --git a/css/second.css b/css/second.css index 1fc6d15..052b335 100644 --- a/css/second.css +++ b/css/second.css @@ -178,7 +178,7 @@ nav ul li { text-align: center; align-items: center; top: 30px; - right: -45px; + right: calc(100% / 2); padding: 2px 7px; width: max-content; opacity: 1; @@ -212,13 +212,13 @@ nav ul li { @keyframes blinking { 0% { - opacity: 1; + filter: brightness(1); } 50% { - opacity: 0.8; + filter: brightness(0.8); } 100% { - opacity: 1; + filter: brightness(1); } } @@ -922,8 +922,6 @@ footer { } #socials { - width: fit-content; - height: auto; display: flex; flex-wrap: wrap; margin-top: 10px; diff --git a/index.html b/index.html index dca9706..3e86a7e 100644 --- a/index.html +++ b/index.html @@ -80,7 +80,7 @@ - loading...in + loading...in --- @@ -95,7 +95,7 @@ Workshops Prizes Team - Rules + Rules @@ -162,7 +162,7 @@ - + Some info on us... What is Gilroy Hacks? @@ -276,8 +276,17 @@
diff --git a/js/general.js b/js/general.js index 5021ade..db7ac72 100644 --- a/js/general.js +++ b/js/general.js @@ -3,264 +3,313 @@ // document is loaded and DOM is ready document.addEventListener('DOMContentLoaded', function(){ - // Email replace - function setAttributes(elem, attrs) { - for(var key in attrs) { - elem.setAttribute(key, attrs[key]); - } - } + // Email replace + function setAttributes(elem, attrs) { + for(var key in attrs) { + elem.setAttribute(key, attrs[key]); + } + } - const tech_emails = document.querySelectorAll('.email-replace-tech'); - tech_emails.forEach(entry => { - setAttributes(entry, {"href": "mailto:tech" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); - entry.innerHTML = "tech" + "@" + "gilroyhacks.com"; - }); + const tech_emails = document.querySelectorAll('.email-replace-tech'); + tech_emails.forEach(entry => { + setAttributes(entry, {"href": "mailto:tech" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); + entry.innerHTML = "tech" + "@" + "gilroyhacks.com"; + }); - var aadhavan = document.getElementById("email-replace-aadhavan"); - setAttributes(aadhavan, {"href": "mailto:aadhavan.magesh" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - aadhavan.innerHTML = "aadhavan.magesh" + "@" + "gmail.com"; + var aadhavan = document.getElementById("email-replace-aadhavan"); + setAttributes(aadhavan, {"href": "mailto:aadhavan.magesh" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + aadhavan.innerHTML = "aadhavan.magesh" + "@" + "gmail.com"; - var isaac = document.getElementById("email-replace-isaac"); - setAttributes(isaac, {"href": "mailto:ihwang" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); - isaac.innerHTML = "ihwang" + "@" + "gilroyhacks.com"; + var isaac = document.getElementById("email-replace-isaac"); + setAttributes(isaac, {"href": "mailto:ihwang" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); + isaac.innerHTML = "ihwang" + "@" + "gilroyhacks.com"; - var steven = document.getElementById("email-replace-steven"); - setAttributes(steven, {"href": "mailto:stevendinh987" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - steven.innerHTML = "stevendinh987" + "@" + "gmail.com"; + var steven = document.getElementById("email-replace-steven"); + setAttributes(steven, {"href": "mailto:stevendinh987" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + steven.innerHTML = "stevendinh987" + "@" + "gmail.com"; - var vijay = document.getElementById("email-replace-vijay"); - setAttributes(vijay, {"href": "mailto:vijay" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); - vijay.innerHTML = "vijay" + "@" + "gilroyhacks.com"; + var vijay = document.getElementById("email-replace-vijay"); + setAttributes(vijay, {"href": "mailto:vijay" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); + vijay.innerHTML = "vijay" + "@" + "gilroyhacks.com"; - var jonathan = document.getElementById("email-replace-jonathan"); - setAttributes(jonathan, {"href": "mailto:jonathantessmann" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - jonathan.innerHTML = "jonathantessmann" + "@" + "gmail.com"; + var jonathan = document.getElementById("email-replace-jonathan"); + setAttributes(jonathan, {"href": "mailto:jonathantessmann" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + jonathan.innerHTML = "jonathantessmann" + "@" + "gmail.com"; - var james = document.getElementById("email-replace-james"); - setAttributes(james, {"href": "mailto:james" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); - james.innerHTML = "james" + "@" + "gilroyhacks.com"; + var james = document.getElementById("email-replace-james"); + setAttributes(james, {"href": "mailto:james" + "@" + "gilroyhacks.com?subject=Gilroy Hacks", "target": "_blank"}); + james.innerHTML = "james" + "@" + "gilroyhacks.com"; - var ezra = document.getElementById("email-replace-ezra"); - setAttributes(ezra, {"href": "mailto:ezrabridger27" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - ezra.innerHTML = "ezrabridger27" + "@" + "gmail.com"; + var ezra = document.getElementById("email-replace-ezra"); + setAttributes(ezra, {"href": "mailto:ezrabridger27" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + ezra.innerHTML = "ezrabridger27" + "@" + "gmail.com"; - var mark = document.getElementById("email-replace-mark"); - setAttributes(mark, {"href": "mailto:markshen00" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - mark.innerHTML = "markshen00" + "@" + "gmail.com"; + var mark = document.getElementById("email-replace-mark"); + setAttributes(mark, {"href": "mailto:markshen00" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + mark.innerHTML = "markshen00" + "@" + "gmail.com"; - var bryce = document.getElementById("email-replace-bryce"); - setAttributes(bryce, {"href": "mailto:brycemankovsky" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); - bryce.innerHTML = "brycemankovsky" + "@" + "gmail.com"; + var bryce = document.getElementById("email-replace-bryce"); + setAttributes(bryce, {"href": "mailto:brycemankovsky" + "@" + "gmail.com?subject=Gilroy Hacks", "target": "_blank"}); + bryce.innerHTML = "brycemankovsky" + "@" + "gmail.com"; - // Scroll Element - // Creating an observer when the user views that element - const observer = new IntersectionObserver(entries => { - // Loop over the entries - entries.forEach(entry => { - // If the element is visible - if (entry.isIntersecting) { - // Add the animation class - entry.target.classList.add('slide-animation'); - } - }); - }); + // Scroll Element + // Creating an observer when the user views that element + const observer = new IntersectionObserver(entries => { + // Loop over the entries + entries.forEach(entry => { + // If the element is visible + if (entry.isIntersecting) { + // Add the animation class + entry.target.classList.add('slide-animation'); + } + }); + }); - const observer_prize_2 = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('slide-animation-prize-2'); - } - }); - }); + const observer_prize_2 = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('slide-animation-prize-2'); + } + }); + }); - const observer_prize_1 = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('slide-animation-prize-1'); - } - }); - }); - - const observer_prize_3 = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('slide-animation-prize-3'); - } - }); - }); + const observer_prize_1 = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('slide-animation-prize-1'); + } + }); + }); + + const observer_prize_3 = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('slide-animation-prize-3'); + } + }); + }); - const observer_team_img = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('slide-animation-card-img'); - } - }); - }); + const observer_team_img = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('slide-animation-card-img'); + } + }); + }); - const observer_team_desc = new IntersectionObserver(entries => { - entries.forEach(entry => { - if (entry.isIntersecting) { - entry.target.classList.add('slide-animation-card-desc'); - } - }); - }); + const observer_team_desc = new IntersectionObserver(entries => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('slide-animation-card-desc'); + } + }); + }); - const workshop_entry = document.querySelectorAll('.workshop-entry'); - workshop_entry.forEach(entry => { - observer.observe(entry); - }); + const workshop_entry = document.querySelectorAll('.workshop-entry'); + workshop_entry.forEach(entry => { + observer.observe(entry); + }); - const rules_obj = document.querySelectorAll('.rules-box'); - rules_obj.forEach(entry => { - observer.observe(entry); - }); + const rules_obj = document.querySelectorAll('.rules-box'); + rules_obj.forEach(entry => { + observer.observe(entry); + }); - const entries = document.querySelectorAll('.team-picture'); - entries.forEach(entry => { - observer_team_img.observe(entry); - }); + const entries = document.querySelectorAll('.team-picture'); + entries.forEach(entry => { + observer_team_img.observe(entry); + }); - const entries_desc = document.querySelectorAll('.team-description'); - entries_desc.forEach(entry => { - observer_team_desc.observe(entry); - }); - - const prize_entries = document.querySelectorAll('.prize-column'); - prize_entries.forEach(entry => { - observer.observe(entry); - }); + const entries_desc = document.querySelectorAll('.team-description'); + entries_desc.forEach(entry => { + observer_team_desc.observe(entry); + }); + + const prize_entries = document.querySelectorAll('.prize-column'); + prize_entries.forEach(entry => { + observer.observe(entry); + }); - const prize_entries_edge = document.querySelectorAll('.podium-edge'); - prize_entries_edge.forEach(entry => { - observer.observe(entry); - }); + const prize_entries_edge = document.querySelectorAll('.podium-edge'); + prize_entries_edge.forEach(entry => { + observer.observe(entry); + }); - // Add class animations to these elements - let elements_id = [ - '#event-title', - '#headline-recap', - '#splash-entrance', - '#what-GilroyHacks', - '#why-GilroyHacks', - '#who-GilroyHacks', - '#slide-wrapper-main', - '#prev', - '#next', - '#signup-title', - '#steps-card', - '#sponsor-title', - '#sponsor-container', - '#schedule-title', - '#schedule-pa', - '#workshops-description', - '#second-podium', - '#first-podium', - '#third-podium', - '#chart', - '#prize-box', - '#administration', - '#logistics', - '#outreach', - '#tech', - '#marketing' - ]; - elements_id.forEach(entry => { - var thing = document.querySelector(entry) - observer.observe(document.querySelector(entry)); - }); + // Add class animations to these elements + let elements_id = [ + '#event-title', + '#headline-recap', + '#div-hr', + '#splash-entrance', + '#what-GilroyHacks', + '#why-GilroyHacks', + '#who-GilroyHacks', + '#slide-wrapper-main', + '#prev', + '#next', + '#signup-title', + '#steps-card', + '#sponsor-title', + '#sponsor-container', + '#schedule-title', + '#schedule-pa', + '#workshops-description', + '#second-podium', + '#first-podium', + '#third-podium', + '#chart', + '#prize-box', + '#administration', + '#logistics', + '#outreach', + '#tech', + '#marketing' + ]; + elements_id.forEach(entry => { + var thing = document.querySelector(entry) + observer.observe(document.querySelector(entry)); + }); - observer_prize_2.observe(document.querySelector('#second-place')); - observer_prize_1.observe(document.querySelector('#first-place')); - observer_prize_3.observe(document.querySelector('#third-place')); + observer_prize_2.observe(document.querySelector('#second-place')); + observer_prize_1.observe(document.querySelector('#first-place')); + observer_prize_3.observe(document.querySelector('#third-place')); - // Scroll Nav - // Toggle the .pa-fixed-header class when the user - // scroll 100px + // Scroll Nav + // Toggle the .pa-fixed-header class when the user + // scroll 100px - window.onscroll = () => {scrollNavbar()}; + window.onscroll = () => {scrollNavbar()}; - var scrollNavbar = () => { - // Target elements - const navBar = document.getElementById("navBar"); - const links = document.querySelectorAll("#navBar a"); + var scrollNavbar = () => { + // Target elements + const navBar = document.getElementById("navBar"); + const links = document.querySelectorAll("#navBar a"); if (document.documentElement.scrollTop > 20) { - navBar.classList.add("pa-fixed-header"); + navBar.classList.add("pa-fixed-header"); - // Change the color of links on scroll - for (let i = 0; i < links.length; i++) { - const element = links[i]; - element.classList.add('text-black'); - } - - } else { - navBar.classList.remove("pa-fixed-header"); - - // Change the color of links back to default - for (let i = 0; i < links.length; i++) { - const element = links[i]; - element.classList.remove('text-black'); - } - } - } - - // Timer - // SRC: W3Schools https://www.w3schools.com/howto/howto_js_countdown.asp - // Set the date we're counting down to - const events = { - "Opening Ceremony": "Apr 15, 2023 10:00:00", - "Lunch": "Apr 15, 2023 12:00:00", - "Web Dev Workshop": "Apr 15, 2023 13:00:00", - "[REDACTED] Workshop": "Apr 15, 2023 15:00:00", - "Kahoot": "Apr 15, 2023 17:00:00", - "Hacking Ends": "Apr 16, 2023 14:00:00", - "Project Presentations": "Apr 16, 2023 14:30:00", - "Awards Ceremony" : "Apr 16, 2023 16:30:00" - } - var countDownDate = 0; - // Get today's date and time - var now = new Date().getTime(); - - // Test for the current event - for (const event in events) { - var testDate = new Date(events[event]).getTime(); - if (testDate > countDownDate && now < testDate) { - countDownDate = testDate; - document.getElementById("event-name").innerHTML = event; - document.styleSheets[0].addRule('#timer:after','content: "'+ events[event] +'";'); - break; + // Change the color of links on scroll + for (let i = 0; i < links.length; i++) { + const element = links[i]; + element.classList.add('text-black'); } } - - // Update the count down every 1 second - var x = setInterval(function() { - - // Find the distance between now and the count down date - var distance = countDownDate - now; - - // Time calculations for days, hours, minutes and seconds - var days = Math.floor(distance / (1000 * 60 * 60 * 24)); - var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); - var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); - // var seconds = Math.floor((distance % (1000 * 60)) / 1000); - - // If the count down is finished, write some text - if (distance < 0) { - clearInterval(x); - document.getElementById("timer").innerHTML = "---"; - document.getElementById("event-name").innerHTML = "Event Ended"; + else { + navBar.classList.remove("pa-fixed-header"); + + // Change the color of links back to default + for (let i = 0; i < links.length; i++) { + const element = links[i]; + element.classList.remove('text-black'); } - // Display the result in the element with id="timer" - else if (days != 0) { - document.getElementById("timer").innerHTML = days + "d " + hours + "h"; + } + } + + // Timer + // SRC: W3Schools https://www.w3schools.com/howto/howto_js_countdown.asp + // Set the date we're counting down to + const events = { + "Opening Ceremony": + { + "start": "Apr 15, 2023 10:30:00", + "end": "Apr 15, 2023 11:00:00", + "tooltip": "Apr 15, 10:30am" + }, + "Lunch": + { + "start": "Apr 15, 2023 12:00:00", + "end": "Apr 15, 2023 13:00:00", + "tooltip": "Apr 15, 12:00am" + }, + "Web Dev Workshop": + { + "start": "Apr 15, 2023 13:00:00", + "end": "Apr 15, 2023 14:00:00", + "tooltip": "Apr 15, 1:00pm" + }, + "[REDACTED] Workshop": + { + "start": "Apr 15, 2023 15:00:00", + "end": "Apr 15, 2023 16:00:00", + "tooltip": "Apr 15, 3:00pm" + }, + "Kahoot": + { + "start": "Apr 15, 2023 17:00:00", + "end": "Apr 15, 2023 18:00:00", + "tooltip": "Apr 15, 5:00pm" + }, + "Hacking Ends": + { + "start": "Apr 16, 2023 14:00:00", + "end": "Apr 16, 2023 14:00:00", + "tooltip": "Apr 16, 2:00pm" + }, + "Project Presentations": + { + "start": "Apr 16, 2023 14:30:00", + "end": "Apr 16, 2023 16:00:00", + "tooltip": "Apr 16, 2:30pm" + }, + "Awards Ceremony" : + { + "start": "Apr 16, 2023 16:30:00", + "end": "Apr 16, 2023 17:00:00", + "tooltip": "Apr 16, 4:30pm" } - else if (hours != 0) { - document.getElementById("timer").innerHTML = hours + "h " + minutes + "m"; - } - else { - document.getElementById("timer").innerHTML = minutes + "m"; - } - }, 1000); + } + var countDownDate = 0; + // Get today's date and time + var now = new Date().getTime(); + var testDateStart, testDateEnd; + + // Test for the current event + for (const event in events) { + testDateStart = new Date(events[event]["start"]).getTime(); + testDateEnd = new Date(events[event]["end"]).getTime(); + if (testDateEnd > countDownDate && now < testDateEnd) { + countDownDate = testDateStart; + document.getElementById("event-name").innerHTML = event; + document.styleSheets[0].addRule('#timer:after','content: "'+ events[event]["tooltip"] +'";'); + break; + } + } + + // Update the count down every 1 second + var x = setInterval(function() { + + // Find the distance between now and the count down date + var distance = countDownDate - now; + + // Time calculations for days, hours, minutes and seconds + var days = Math.floor(distance / (1000 * 60 * 60 * 24)); + var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); + var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); + var seconds = Math.floor((distance % (1000 * 60)) / 1000); + + // If the count down is finished, write some text + if (testDateStart < now && now < testDateEnd) { + document.getElementById("timer").innerHTML = "NOW"; + } + // Display the result in the element with id="timer" + else if (days != 0) { + document.getElementById("timer").innerHTML = days + "d " + hours + "h"; + } + else if (hours != 0) { + document.getElementById("timer").innerHTML = hours + "h " + minutes + "m"; + } + else if (minutes != 0) { + document.getElementById("timer").innerHTML = minutes + "m"; + } + else if (seconds != 0) { + document.getElementById("timer").innerHTML = seconds + "s"; + } + else { + clearInterval(x); + document.getElementById("timer").innerHTML = "---"; + document.getElementById("event-name").innerHTML = "Event Ended"; + } + }, 1000); }); // page is fully loaded, including all frames, objects and images diff --git a/js/second.js b/js/second.js index 8a06fbd..938478b 100644 --- a/js/second.js +++ b/js/second.js @@ -48,32 +48,74 @@ const tech_emails = document.querySelectorAll('.email-replace-tech'); // SRC: W3Schools https://www.w3schools.com/howto/howto_js_countdown.asp // Set the date we're counting down to const events = { - "Opening Ceremony": "Apr 15, 2023 10:00:00", - "Lunch": "Apr 15, 2023 12:00:00", - "Web Dev Workshop": "Apr 15, 2023 13:00:00", - "[REDACTED] Workshop": "Apr 15, 2023 15:00:00", - "Kahoot": "Apr 15, 2023 17:00:00", - "Hacking Ends": "Apr 16, 2023 14:00:00", - "Project Presentations": "Apr 16, 2023 14:30:00", - "Awards Ceremony" : "Apr 16, 2023 16:30:00" -} -var countDownDate = 0; -// Get today's date and time -var now = new Date().getTime(); + "Opening Ceremony": + { + "start": "Apr 15, 2023 10:30:00", + "end": "Apr 15, 2023 11:00:00", + "tooltip": "Apr 15, 10:30am" + }, + "Lunch": + { + "start": "Apr 15, 2023 12:00:00", + "end": "Apr 15, 2023 13:00:00", + "tooltip": "Apr 15, 12:00am" + }, + "Web Dev Workshop": + { + "start": "Apr 15, 2023 13:00:00", + "end": "Apr 15, 2023 14:00:00", + "tooltip": "Apr 15, 1:00pm" + }, + "[REDACTED] Workshop": + { + "start": "Apr 15, 2023 15:00:00", + "end": "Apr 15, 2023 16:00:00", + "tooltip": "Apr 15, 3:00pm" + }, + "Kahoot": + { + "start": "Apr 15, 2023 17:00:00", + "end": "Apr 15, 2023 18:00:00", + "tooltip": "Apr 15, 5:00pm" + }, + "Hacking Ends": + { + "start": "Apr 16, 2023 14:00:00", + "end": "Apr 16, 2023 14:00:00", + "tooltip": "Apr 16, 2:00pm" + }, + "Project Presentations": + { + "start": "Apr 16, 2023 14:30:00", + "end": "Apr 16, 2023 16:00:00", + "tooltip": "Apr 16, 2:30pm" + }, + "Awards Ceremony" : + { + "start": "Apr 16, 2023 16:30:00", + "end": "Apr 16, 2023 17:00:00", + "tooltip": "Apr 16, 4:30pm" + } + } + var countDownDate = 0; + // Get today's date and time + var now = new Date().getTime(); + var testDateStart, testDateEnd; -// Test for the current event -for (const event in events) { -var testDate = new Date(events[event]).getTime(); -if (testDate > countDownDate && now < testDate) { - countDownDate = testDate; - document.getElementById("event-name").innerHTML = event; - document.styleSheets[0].addRule('#timer:after','content: "'+ events[event] +'";'); - break; -} -} + // Test for the current event + for (const event in events) { + testDateStart = new Date(events[event]["start"]).getTime(); + testDateEnd = new Date(events[event]["end"]).getTime(); + if (testDateEnd > countDownDate && now < testDateEnd) { + countDownDate = testDateStart; + document.getElementById("event-name").innerHTML = event; + document.styleSheets[0].addRule('#timer:after','content: "'+ events[event]["tooltip"] +'";'); + break; + } + } -// Update the count down every 1 second -var x = setInterval(function() { + // Update the count down every 1 second + var x = setInterval(function() { // Find the distance between now and the count down date var distance = countDownDate - now; @@ -82,13 +124,11 @@ var x = setInterval(function() { var days = Math.floor(distance / (1000 * 60 * 60 * 24)); var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60)); var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60)); - // var seconds = Math.floor((distance % (1000 * 60)) / 1000); + var seconds = Math.floor((distance % (1000 * 60)) / 1000); // If the count down is finished, write some text - if (distance < 0) { - clearInterval(x); - document.getElementById("timer").innerHTML = "---"; - document.getElementById("event-name").innerHTML = "Event Ended"; + if (testDateStart < now && now < testDateEnd) { + document.getElementById("timer").innerHTML = "NOW"; } // Display the result in the element with id="timer" else if (days != 0) { @@ -97,7 +137,15 @@ var x = setInterval(function() { else if (hours != 0) { document.getElementById("timer").innerHTML = hours + "h " + minutes + "m"; } - else { + else if (minutes != 0) { document.getElementById("timer").innerHTML = minutes + "m"; } + else if (seconds != 0) { + document.getElementById("timer").innerHTML = seconds + "s"; + } + else { + clearInterval(x); + document.getElementById("timer").innerHTML = "---"; + document.getElementById("event-name").innerHTML = "Event Ended"; + } }, 1000); \ No newline at end of file diff --git a/licenses.html b/licenses.html index 2270bac..f2b9962 100644 --- a/licenses.html +++ b/licenses.html @@ -64,7 +64,7 @@ - loading...in + loading...in --- @@ -79,7 +79,7 @@ Workshops Prizes Team - Rules + Rules @@ -326,9 +326,9 @@ Discord Signup Form Library Event Entry - Rules & Liability - Licenses - Contact Form + Rules & Liability + Licenses + Contact Form
diff --git a/rules.html b/rules.html index 9ea2060..2e012a3 100644 --- a/rules.html +++ b/rules.html @@ -64,7 +64,7 @@ - loading...in + loading...in --- @@ -79,7 +79,7 @@ Workshops Prizes Team - Rules + Rules @@ -240,9 +240,9 @@ Discord Signup Form Library Event Entry - Rules & Liability - Licenses - Contact Form + Rules & Liability + Licenses + Contact Form