Game-Jaming/Frontend/Javascript/Kalender.js

142 lines
3.2 KiB
JavaScript
Executable File

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 class="today" ><span id="testEvent2"onClick="clickdate()"></span>${i}</div>`;
}
}
for (let j = 1; j <= nextDays; j++) {
days += `<div class="next-date" onClick="clickdate()">${j}</div>`;
monthDays.innerHTML = days;
}
// 2021, 3, 28, 11, 30
$('#test').click(function() {
let newDate = new Date();
newDate.setDate(28);
console.log(newDate);
});
};
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()
})
//Admin add event
$("#indsend").click(function () {
let startDate = $("#startDate").val();
let endDate = $("#endDate").val();
let startTime = $("#startTime").val();
let endTime = $("#endTime").val();
console.log(`startDate ${startDate} \n
endDate ${endDate} \n
startTime ${startTime} \n
endTime ${endTime}`);
})
function addEvent() {
}
//Admin
/*
$(document).ready(function () {
$('#description').keyup(function () {
$(this).attr('size', $(this).val().length)
});
});
*/