Game-Jaming/Frontend/Javascript/Kalender.js

108 lines
2.5 KiB
JavaScript
Raw Normal View History

2021-03-15 13:03:29 +00:00
const date = new Date();
const renderCalendar = () => {
date.setDate(1);
const monthDays = document.querySelector(".days");
const lastDay = new Date(
date.getFullYear(),
date.getMonth() + 1,
0
).getDate();
const prevLastDay = new Date(
date.getFullYear(),
date.getMonth(),
0
).getDate();
const firstDayIndex = date.getDay();
const lastDayIndex = new Date(
date.getFullYear(),
date.getMonth() + 1,
0
).getDay();
const nextDays = 7 - lastDayIndex - 1 + 1;
const months = [
"Januar",
"Februar",
"Marts",
"April",
"Maj",
"Juni",
"Juli",
"August",
"September",
"Oktober",
"November",
"December",
];
document.querySelector(".date h1").innerHTML = months[date.getMonth()];
document.querySelector(".date p").innerHTML = new Date().toLocaleDateString('da-DK', {
weekday: 'long',
year: 'numeric',
month: 'long',
day: 'numeric'
});
let days = "";
for (let x = firstDayIndex; x > 1; x--) {
days += `<div class="prev-date">${prevLastDay - x + 2}</div>`;
}
for (let i = 1; i <= lastDay; i++) {
if (
i === new Date().getDate() &&
date.getMonth() === new Date().getMonth()
) {
days += `<div class="today" onClick="clickdate()">${i}</div>`;
} else {
days += `<div onClick="clickdate()">${i}</div>`;
}
}
for (let j = 1; j <= nextDays; j++) {
days += `<div class="next-date" onClick="clickdate()">${j}</div>`;
monthDays.innerHTML = days;
}
};
document.querySelector(".prev").addEventListener("click", () => {
date.setMonth(date.getMonth() - 1);
renderCalendar();
});
document.querySelector(".next").addEventListener("click", () => {
date.setMonth(date.getMonth() + 1);
renderCalendar();
});
renderCalendar();
function clickdate() {
var dato = new Date();
let month = dato.getMonth() + 1;
let day = dato.getDate();
let currentDate = dato.getFullYear() + "/" + (("" + month).length < 2 ? "0" : "") + month + "/" + (("" + day).length < 2 ? "0" : "") + day;
var myModal = new bootstrap.Modal(document.getElementById("popup"));
$("#popupDate").text(currentDate);
myModal.show();
}
var myModal = document.getElementById('popup')
myModal.addEventListener('shown.bs.modal', function() {
myInput.focus()
})