Fixed basic calendar functionality

skolehjem/resources/js/calendar/calendar.js

@@ -44,6 +44,12 @@ function generateCalendar(weekOffset = 0) {
     let header = document.createElement("div");
     header.classList.add("calendar-table__header", "calendar-table__row");
 
+    let calendarBody = document.createElement("div");
+    calendarBody.classList.add("calendar-table__body");
+
+    let calendarRow = document.createElement("div");
+    calendarRow.classList.add("calendar-table__row")
+
     weekDays.forEach(function (weekDay) {
         let headerDay = document.createElement("div");
         headerDay.classList.add("calendar-table__col");
@@ -51,16 +57,9 @@ function generateCalendar(weekOffset = 0) {
         headerDay.innerText = weekDay;
 
         header.appendChild(headerDay);
-    });
 
-    let calendarBody = document.createElement("div");
-    calendarBody.classList.add("calendar-table__body");
 
-    let calendarRow = document.createElement("div");
-    calendarRow.classList.add("calendar-table__row")
-
-    weekDays.forEach(function (value, index) {
-        let date = moment().locale("da").day(value).week(week);
+        let date = moment().locale("da").day(weekDay).week(week);
 
         // onDateSelect(date);
 
@@ -82,35 +81,65 @@ function generateCalendar(weekOffset = 0) {
 
     calendarBody.appendChild(calendarRow);
 
-
     calendar.innerHTML = "";
 
     calendar.appendChild(header);
     calendar.appendChild(calendarBody);
-
-    // const endWeek = moment().endOf("month").week();
-
-    // let cal = [];
-    // for (let week = startWeek; week < endWeek; week++) {
-    //     cal.push({
-    //         week : week,
-    //         days : Array(7).fill(0).map((n, i) => moment().week(week).startOf("week").clone().add(n + i, "day"))
-    //     });
-    // }
-
-
-
-    // console.log(cal);
 }
 
-// const eventArray = [
-//
-// ]
-
 function onDateSelect(date) {
-    const events = document.getElementById("events");
+    let events;
+    let machinez;
 
-    events.innerHTML = "";
+    let container = document.getElementById("event-container");
+
+
+    if(document.getElementById("washing-machines") != undefined)
+        machinez = document.getElementById("washing-machines");
+    else {
+        let span = document.createElement("span");
+        span.classList.add("events__title");
+        span.innerText = "Maskiner";
+
+        let select = document.createElement("select");
+        select.classList.add("events__title");
+        select.id = "washing-machines";
+
+        container.appendChild(span);
+        container.appendChild(select);
+
+        machinez = document.getElementById("washing-machines");
+    }
+    if(document.getElementById("events") != undefined)
+        events = document.getElementById("events");
+    else {
+        let span = document.createElement("span");
+        span.classList.add("events__title");
+        span.innerText = "Tider";
+
+        let select = document.createElement("select");
+        select.classList.add("events__title");
+        select.id = "events";
+
+        container.appendChild(span);
+        container.appendChild(select);
+
+        events = document.getElementById("events");
+    }
+
+    // events.innerHTML = "";
+
+    const machines = [
+        "Maskine 1",
+        "Maskine 2"
+    ]
+
+    for (let i = 0; i < machines.length; i++) {
+        let option = document.createElement("option");
+        option.text = machines[i];
+
+        machinez.appendChild(option);
+    }
 
 
     for (let hour = 8; hour <= 20; hour++) {
@@ -118,6 +147,7 @@ function onDateSelect(date) {
         let option = document.createElement("option");
         option.text = prependZero(hour);
 
+        events.appendChild(option);
 
         // let item = document.createElement("li");
         // item.classList.add("events__item");