Ekapp/skolehjem/resources/js/calendar/calendar.js

// class Calendar {
//     constructor() {
//
//     }
//
//     nextMonth() {
//
//     }
//
//     previousMonth() {
//
//     }
//
//     addEvent() {
//
//     }
//
//     removeEvent() {
//
//     }
// }

const moment = require("moment");

// const calendar = document.getElementById("calendar");
// const title = document.getElementById("month");



// calendar.innerHTML = "";

function generateCalendar(weekOffset = 0) {
    const week = (moment().week() + weekOffset);
    let weekDays = Array.apply(null, Array(7)).map((value, index) => {
        return moment(index, "e").locale("da").startOf("week").weekday(index).format("ddd");
    });
    // weekDays.push(weekDays.shift());

    // console.log(week);
    // console.log(weekDays);

    const calendar = document.getElementById("calendar");

    let header = document.createElement("div");
    header.classList.add("calendar-table__header", "calendar-table__row");

    weekDays.forEach(function (weekDay) {
        let headerDay = document.createElement("div");
        headerDay.classList.add("calendar-table__col");

        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);

        // onDateSelect(date);

        let dayHolder = document.createElement("div");
        dayHolder.classList.add("calendar-table__col");

        let day = document.createElement("div");
        day.classList.add("calendar-table__item");
        day.innerText = date.date();

        dayHolder.appendChild(day);

        dayHolder.onclick = function() {
            onDateSelect(date);
        }

        calendarRow.appendChild(dayHolder);
    });

    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");

    events.innerHTML = "";


    for (let hour = 8; hour <= 20; hour++) {

        let option = document.createElement("option");
        option.text = prependZero(hour);


        // let item = document.createElement("li");
        // item.classList.add("events__item");
        //
        // let itemData = document.createElement("div");
        //
        // let head = document.createElement("span");
        // head.classList.add("events__name");
        // head.innerText = "Vaskemaskine Tid";
        //
        // let dat = document.createElement("span");
        // dat.classList.add("events__date");
        // dat.innerText = "Klokken " + prependZero(hour);
        //
        // itemData.appendChild(head);
        // itemData.appendChild(dat);
        // item.appendChild(itemData);
        //
        // let button = document.createElement("span");
        // button.classList.add("events__tag");
        // button.innerText = "Book";
        //
        // item.appendChild(button);
        //
        // events.appendChild(item);
    }
}

function prependZero(value) {
    if(value < 10)
        return "0" + value;
    return value;
}

module.exports = {
    generateCalendar
};