Countdown for the Romereis that ended catastrophically
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

137 lines
3.7 KiB

interface TimeRemaining {
weeks: number;
days: number;
hours: number;
minutes: number;
seconds: number;
}
class CountdownBuilder {
timeRemaining: TimeRemaining;
constructor(public timeremaining: TimeRemaining) {
this.timeRemaining = timeremaining
}
build(): string {
let html = "";
if (this.timeRemaining.weeks <= 9 && this.timeRemaining.weeks > 0) {
html += "0";
}
if (this.timeRemaining.weeks > 0) {
html += this.timeRemaining.weeks.toString();
html += "<span>w</span> ";
}
if (this.timeRemaining.days <= 9) {
html += "0";
}
html += this.timeRemaining.days.toString();
html += "<span>d</span> ";
if (this.timeRemaining.hours <= 9) {
html += "0";
}
html += this.timeRemaining.hours.toString();
html += "<span>u</span> ";
if (this.timeRemaining.minutes <= 9) {
html += "0";
}
html += this.timeRemaining.minutes.toString();
html += "<span>m</span> ";
if (this.timeRemaining.seconds <= 9) {
html += "0";
}
html += this.timeRemaining.seconds.toString();
html += "<span>s</span> ";
return html
}
}
function setStyleOptions(totaldays: number) {
const backgroundElement = document.getElementById("background");
if (totaldays < 35) {
backgroundElement.style.backgroundImage = "url('bg.jpg')";
let spans = document.querySelectorAll("span");
for (let i = 0; i < spans.length; i++) {
spans[i].style.color = "#dddddd";
}
backgroundElement.style.filter = "blur(0px) brightness(100%)";
}
if (totaldays < 35 && totaldays > 7 ) {
const percentage = (totaldays-7)/(35-7);
const blur = percentage * 10; //base is 10px
const brightness = 100 - Math.floor(percentage * 100);
backgroundElement.style.filter = "blur(" + blur + "px) brightness(" + brightness + "%)";
}
}
function calculateTimeRemaining(distance: number) {
// Time calculations for days, hours, minutes and seconds
let weeks = Math.floor((distance / (1000 * 60 * 60 * 24))/7);
let days = Math.floor((distance / (1000 * 60 * 60 * 24))%7);
let hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
let minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
let seconds = Math.floor((distance % (1000 * 60)) / 1000);
return {
weeks: weeks,
days: days,
hours: hours,
minutes: minutes,
seconds: seconds
};
}
function setNewTime() {
// Get today's date and time
let now = new Date().getTime();
// Find the distance between now and the count down date
let distance = countDownDate - now;
let timeRemaining = calculateTimeRemaining(distance);
if (distance < 0) {
clearInterval(x);
return;
}
document.getElementById("countdown").innerHTML = new CountdownBuilder(timeRemaining).build();
const totaldays = timeRemaining.weeks*7 + timeRemaining.days;
setStyleOptions(totaldays);
}
// Set the date we're counting down to
let countDownDate = new Date("Mar 7, 2020 07:20:00").getTime();
//intervals are numbers apparently
let x: number;
window.onload = function () {
if(!isMobile()) {
setNewTime();
// Update the count down every 1 second
x = setInterval(setNewTime, 1000);
} else {
document.getElementById("countdown").innerHTML = "Zie app";
}
};
function isMobile(): boolean {
let match = window.matchMedia;
if(match) {
let mq = match("(pointer:coarse)");
return mq.matches;
}
return false;
}