/**
 * mdCalendar.js
 */

document.addEventListener("DOMContentLoaded", function() {

    /**
     * @var {array} translations Array of all translations.
     */
    let translations = {
        "en" : {
            "dow0"  : "Sunday",
            "dow1"  : "Monday",
            "dow2"  : "Tuesday",
            "dow3"  : "Wednesday",
            "dow4"  : "Thursday",
            "dow5"  : "Friday",
            "dow6"  : "Saturday",
            "mon0"  : "January",
            "mon1"  : "February",
            "mon2"  : "March",
            "mon3"  : "April",
            "mon4"  : "May",
            "mon5"  : "June",
            "mon6"  : "July",
            "mon7"  : "August",
            "mon8"  : "September",
            "mon9"  : "October",
            "mon10" : "November",
            "mon11" : "December",
            "Today" : "Today",
            "Title" : "Title",
            "Start" : "Start",
            "End"   : "End",
            "Location" : "Location"
        },
        "de" : {
            "dow0"  : "Sonntag",
            "dow1"  : "Montag",
            "dow2"  : "Dienstag",
            "dow3"  : "Mittwoch",
            "dow4"  : "Donnerstag",
            "dow5"  : "Freitag",
            "dow6"  : "Samstag",
            "mon0"  : "Januar",
            "mon1"  : "Februar",
            "mon2"  : "März",
            "mon3"  : "April",
            "mon4"  : "Mai",
            "mon5"  : "Juni",
            "mon6"  : "Juli",
            "mon7"  : "August",
            "mon8"  : "September",
            "mon9"  : "Oktober",
            "mon10" : "November",
            "mon11" : "Dezember",
            "Today" : "Jetzt",
            "Title" : "Titel",
            "Start" : "Beginn",
            "End"   : "Ende",
            "Location" : "Ort"
        },
        "hu" : {
            "dow0": "Vas\u00e1rnap",
            "dow1": "H\u00e9tf\u0151",
            "dow2": "Kedd",
            "dow3": "Szerda",
            "dow4": "Cs\u00fct\u00f6rt\u00f6k",
            "dow5": "P\u00e9ntek",
            "dow6": "Szombat",
            "mon0": "Janu\u00e1r",
            "mon1": "Febru\u00e1r",
            "mon2": "M\u00e1rcius",
            "mon3": "\u00c1prilis",
            "mon4": "M\u00e1jus",
            "mon5": "J\u00fanius",
            "mon6": "J\u00falius",
            "mon7": "Augusztus",
            "mon8": "Szeptember",
            "mon9": "Okt\u00f3ber",
            "mon10": "November",
            "mon11": "December",
            "Today": "Ma",
            "Title": "C\u00edm",
            "Start": "Nyit",
            "End": "Bez\u00e1r",
            "Location": "Helysz\u00edn"
        }
    }

    /**
     * @var {boolean} Toggle debugging.
     */
    let debugging = false;

    /**
     * Function queryPage queries a web page and runs the specified function over the output.
     *
     * @param {string}   url   URL to query.
     * @param {function} func  Callback function to run on the request after loading.
     * @param {boolean}  debug Enable / disable debug mode.
     *
     * @return {boolean}
     */
    function queryPage(url, func, debug = false) {

        let request     = new XMLHttpRequest();
        request.open('GET', url);
        request.setRequestHeader("Cache-Control", "no-cache");
        request.responseType = 'htm';
        request.send();
        request.onload = function() {

            func(request, debug);
        };

    }

    /**
     * Removes all children of an element.
     *
     * @param {string} id ID of the element to tear down.
     *
     * @return {void}
     */
    function emptyElement(element) {
        while (element.firstChild) {
            emptyElement(element.firstChild);
        }
        element.parentNode.removeChild(element);
        if (debugging === true) {
            console.log("Removed element:");
            console.log(element);
        }
    }

    function tearDownById(id) {
        let target = document.getElementById(id);
        if (target !== null) emptyElement(target);
    }

    /**
     * Returns a requested translation from an array in the currently used language.
     *
     * @param {mixed[]} list      Translation variable.
     * @param {string}  specifier Specifies which translation to get.
     *
     * @return {string}
     */
    function getTranslation(list, specifier) {

        let preferedLang = document.getElementsByTagName("html")[0].getAttribute("lang");

        if (list[preferedLang] !== undefined && list[preferedLang][specifier] !== null) return list[preferedLang][specifier];
        return list["en"][specifier];

    }

    /**
     * Function to create calendar.
     */
    function createCalendarTable(target, events) {

        let startOfWeek = 1; // The week starts on Monday.
        let endOfWeek   = 0; // The week ends on Sunday.

        let calLocale = document.getElementsByTagName("html")[0].getAttribute("lang");
        if (calLocale === undefined || calLocale === null) calLocale = "en";

        function removeToolTips() {
            let toolTips = document.getElementsByClassName("mdCToolTip");
            for (let i = 0, max = toolTips.length; i < max; i++) {
                emptyElement(toolTips[i]);
            }
        }

        /**
         * Gets all days to display per month.
         * Adapted version of function described in https://stackoverflow.com/a/13146828.
         *
         * @param {int} The month number, 0 based
         * @param {int} The year, not zero based, required to account for leap years
         *
         * @return {Date[]} List with date objects for each day of the month
         */
        function getDaysInMonth(month, year) {

            var date = new Date(year, month, 1);
            var days = [];

            // If the weekday of the first of the month does not equal 1 (Monday),
            // get days until the last monday before the month.
            if (date.getDay() !== startOfWeek) {
                while (date.getDay() !== startOfWeek) {
                    date.setDate(date.getDate() - 1);
                    days.unshift(new Date(date));
                }
            }

            date = new Date(year, month, 1);
            // Get days of the month
            while (date.getMonth() === month) {
                days.push(new Date(date));
                date.setDate(date.getDate() + 1);
            }

            // If the weekday of the first of the month does not equal 1 (Monday),
            // get days until the last monday before the month.
            while (date.getDay() !== startOfWeek) {
                days.push(new Date(date));
                date.setDate(date.getDate() + 1);
            }
            return days;
        }

        events = (function() {

            let colorSchemeLength = 29;
            for (var i = 0, max = events.length; i < max; i++) {
                let hash = 0;
                for (var j = 0, maxj = events[i].name.length; j < maxj; j++) {
                    hash = events[i].name.charCodeAt(j) + hash;
                }
                hash = hash % (colorSchemeLength) - 1;

                events[i].color = hash;
            }
            return events;

        })();

        let d = new Date();

        let year;
        if (target.getAttribute("data-year") !== null) year = parseInt(target.getAttribute("data-year"));
        else year = d.getFullYear();

        let month;
        if (target.getAttribute("data-month") !== null) month = parseInt(target.getAttribute("data-month") - 1);
        else month = d.getMonth();

        // Create outer div
        let mdCalDiv = document.createElement("div");
        mdCalDiv.classList.add("mdCalendar");

        /**
         * Creater header line of the calendar.
         */
        (function() {

            let mdCalTitleLine = document.createElement("header");
            mdCalTitleLine.classList.add("mdCTitleLine");

            let mdCalTitle = document.createElement("h3");
            mdCalTitle.textContent = getTranslation(translations, "mon" + month.toString());
            if (year != d.getFullYear()) mdCalTitle.textContent = mdCalTitle.textContent + " (" + year + ")";
            mdCalTitleLine.appendChild(mdCalTitle);

            let mdCalNav = document.createElement("div");
            mdCalNav.classList.add("mdCNav");
            mdCalTitleLine.appendChild(mdCalNav);

            let mdCalNavPrev  = document.createElement("a");
            mdCalNavPrev.href = target.getAttribute("data-prev");
            mdCalNavPrev.rel  = "prev";
            mdCalNavPrev.classList.add("mdCNavPrev");
            mdCalNav.appendChild(mdCalNavPrev);

            let mdCalNavNext  = document.createElement("a");
            mdCalNavNext.href = target.getAttribute("data-next");
            mdCalNavNext.rel  = "next";
            mdCalNavNext.classList.add("mdCNavNext");
            mdCalNav.appendChild(mdCalNavNext);

            let mdCalNavToday  = document.createElement("a");
            mdCalNavToday.href = target.getAttribute("data-today");
            mdCalNavToday.textContent = getTranslation(translations, "Today");
            mdCalNav.appendChild(mdCalNavToday);

            mdCalTitleLine.appendChild(mdCalNav);
            mdCalDiv.appendChild(mdCalTitleLine);

        })();

        /**
         * Create table.
         */
        let table = document.createElement("table");
        table.classList.add("mdCTable");

        let thead = document.createElement("thead");
        let theadTr = document.createElement("tr");

        for (let i = 1, max = 7; i < max; i++) {
            let th = document.createElement("th");
            th.textContent = getTranslation(translations, "dow" + i.toString());
            theadTr.appendChild(th);
        }
        let th = document.createElement("th");
        th.textContent = getTranslation(translations, "dow0");
        theadTr.appendChild(th);

        thead.appendChild(theadTr);
        table.appendChild(thead);

        let tbody = document.createElement("tbody");

        let days = getDaysInMonth(month, year);
        let tr;

        let daysTDs = [];

        function createSingleEventOverlay(e, parentElement, data) {

            let toolTip = document.createElement("table");
            toolTip.classList.add("mdCToolTip");

            let tableData = [];
            tableData.push(["Title", data["name"]]);
            if (data["start"] !== undefined) tableData.push(["Start", data["start"]]);
            if (data["end"] !== undefined)   tableData.push(["End", data["end"]]);
            if (data["place"] !== undefined) tableData.push(["Location", data["place"]]);

            for (let i = 0, max= tableData.length; i < max; i++) {
                let nameRow = document.createElement("tr");
                let nameTh = document.createElement("th");
                nameTh.textContent = getTranslation(translations, tableData[i][0]);
                nameRow.appendChild(nameTh);
                let nameTd = document.createElement("td");
                nameTd.textContent = tableData[i][1];
                nameRow.appendChild(nameTd);
                toolTip.appendChild(nameRow);
            }

            parentElement.appendChild(toolTip);

        }

        for (let i = 0, max= days.length; i < max; i++) {

            // Begin a new table row every Monday.
            if (days[i].getDay() === startOfWeek) {
                tr = document.createElement("tr");
                tbody.appendChild(tr);
            }

            // Create new TD per day and add appropriate classes.
            let td = document.createElement("td");
            if (days[i].getMonth() !== month) td.classList.add("mdCOtherMonth");
            if (days[i].getYear() == d.getYear() && days[i].getMonth() == d.getMonth() && days[i].getDate() == d.getDate()) td.classList.add("mdCToday");

            tdTitle = document.createElement("time");
            tdTitle.textContent = days[i].getDate();

            td.appendChild(tdTitle);
            tr.appendChild(td);

            // Append dates.
            let dayTime = days[i].getTime();
            let dayTimeMinusDay = days[i].getTime() + 24 * 3600 * 1000;
            let dayTimePlusDay = days[i].getTime() - 0 * 3600 * 1000;
            for (let j = 0, maxj = events.length; j < maxj; j++) {
                if (Date.parse(events[j].start) > dayTimeMinusDay || Date.parse(events[j].end) < dayTimePlusDay) continue;

                let eventSignifier = document.createElement("a");
                eventSignifier.classList.add("color" + events[j].color.toString());
                if (events[j].link) eventSignifier.href = events[j].link;

                let eventSignifierText = document.createElement("span");
                eventSignifierText.textContent = events[j].name;
                eventSignifier.appendChild(eventSignifierText);

                eventSignifier.addEventListener('mouseover', function(e) {
                    createSingleEventOverlay(e, eventSignifier, events[j]);
                });
                eventSignifier.addEventListener('mouseout', function(e) {
                    removeToolTips();
                });

                td.appendChild(eventSignifier);

            }

            // Add posibility for overlay.
            tdTitle.addEventListener('click', function(e) {

                tearDownById("mdCOverlay");

                let overlay = document.createElement("div");
                overlay.id = "mdCOverlay";

                let eventTitleBar = document.createElement("div");
                eventTitleBar.classList.add("mdCOverlayTitleBar");
                overlay.appendChild(eventTitleBar);

                let title = document.createElement("span");
                title.classList.add("mdCOverlayTitle");
                title.textContent = days[i].toLocaleDateString(calLocale);
                eventTitleBar.appendChild(title);

                let closer = document.createElement("span");
                closer.classList.add("mdCOverlayClose");
                closer.addEventListener('click', function(e) {
                    if (debugging === true) console.log("Clicked close button: Tearing down daily agenda.");
                    tearDownById("mdCOverlay");
                });
                eventTitleBar.appendChild(closer);

                let ul = document.createElement("ul");

                // Append events.
                for (let j = 0, maxj = events.length; j < maxj; j++) {

                    let start = new Date(events[j].start);
                    let end   = new Date(events[j].end);

                    if (start.getTime() > dayTime || end.getTime() < dayTimePlusDay) continue;

                    let eventLi = document.createElement("li");

                    let eventSignifier = document.createElement("a");
                    eventSignifier.textContent = events[j].name;
                    if (events[j].link) eventSignifier.href = events[j].link;
                    eventLi.appendChild(eventSignifier);

                    let eventP = document.createElement("p");
                    eventP.textContent = start.toLocaleDateString(calLocale) + " - " + end.toLocaleDateString(calLocale);
                    if (events[j].place !== undefined) eventP.textContent = eventP.textContent + ", " + events[j].place;
                    eventLi.appendChild(eventP);

                    let eventDesc = document.createElement("p");
                    eventDesc.textContent = events[j].description;
                    eventLi.appendChild(eventDesc);

                    ul.appendChild(eventLi);

                }

                overlay.appendChild(ul);
                document.getElementsByTagName("body")[0].appendChild(overlay);

            });

            if (td.childElementCount > 6) td.classList.add("mdCManyElements");
            daysTDs[days[i].getFullYear() + "-" + days[i].getMonth() + "-" + days[i].getDate()] = td;

        }

        table.appendChild(tbody);
        mdCalDiv.appendChild(table);

        target.appendChild(mdCalDiv);

        // Enable closing overlay by pressing escape.
        document.addEventListener('keydown', function(e) {
            if (e.keyCode !== 27) return;
            if (debugging === true) console.log("Pressed escape: Tearing down daily agenda.");
            tearDownById("mdCOverlay");
        });

        return daysTDs;
    }

    (function() {

        let calendars = document.getElementsByClassName("mdCalendar");
        for (let i = 0, max = calendars.length; i < max; i++) {

            queryPage(
                encodeURI(calendars[i].getAttribute("data-src")),
                function (request) {
                    if (debugging === true) console.log("Loaded\n" + request.response);
                    let elements = JSON.parse(request.response);
                    let tCalendar = createCalendarTable(calendars[i], elements);
                });
        }
    }
    )();

});