Working on calendar.js some more..

.idea/php.xml

@@ -9,16 +9,12 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/psr/log" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/psr/simple-cache" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/psy/psysh" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/filp/whoops" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/opis/closure" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/voku/portable-ascii" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/asm89/stack-cors" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/brick/math" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/nikic/php-parser" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/defuse/php-encryption" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/facade/flare-client-php" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/facade/ignition" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/facade/ignition-contracts" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/league/commonmark" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/league/event" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/league/flysystem" />
@@ -27,7 +23,6 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/nyholm/psr7" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/ramsey/collection" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/ramsey/uuid" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/scrivo/highlight.php" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/vlucas/phpdotenv" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/dnoegel/php-xdg-base-dir" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/egulias/email-validator" />
@@ -36,18 +31,7 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/laravel/framework" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/laravel/passport" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/laravel/tinker" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/mockery/mockery" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/monolog/monolog" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/myclabs/deep-copy" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phar-io/manifest" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phar-io/version" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpspec/prophecy" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/php-code-coverage" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/php-file-iterator" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/php-text-template" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/php-timer" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/php-token-stream" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpunit/phpunit" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/console" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/css-selector" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/deprecation-contracts" />
@@ -75,12 +59,9 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/translation" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/translation-contracts" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/symfony/var-dumper" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/theseer/tokenizer" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/doctrine/inflector" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/doctrine/instantiator" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/doctrine/lexer" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/firebase/php-jwt" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/hamcrest/hamcrest-php" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/lcobucci/jwt" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/php-http/message-factory" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/fideloper/proxy" />
@@ -89,30 +70,12 @@
       <path value="$PROJECT_DIR$/skolehjem/vendor/phpoption/phpoption" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/phpseclib/phpseclib" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/ralouphie/getallheaders" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/code-unit-reverse-lookup" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/comparator" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/diff" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/environment" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/exporter" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/global-state" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/object-enumerator" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/object-reflector" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/recursion-context" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/resource-operations" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/type" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/sebastian/version" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/webmozart/assert" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/fzaninotto/faker" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/guzzlehttp/guzzle" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/guzzlehttp/promises" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/guzzlehttp/psr7" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/nunomaduro/collision" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/swiftmailer/swiftmailer" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/tijsverkoyen/css-to-inline-styles" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/dragonmantank/cron-expression" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpdocumentor/reflection-common" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpdocumentor/reflection-docblock" />
-      <path value="$PROJECT_DIR$/skolehjem/vendor/phpdocumentor/type-resolver" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/composer" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/spatie/laravel-permission" />
       <path value="$PROJECT_DIR$/skolehjem/vendor/laravel/ui" />

.idea/skolehjem-webapp.iml

@@ -12,22 +12,15 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/defuse/php-encryption" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/dnoegel/php-xdg-base-dir" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/doctrine/inflector" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/doctrine/instantiator" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/doctrine/lexer" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/dragonmantank/cron-expression" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/egulias/email-validator" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/facade/flare-client-php" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/facade/ignition" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/facade/ignition-contracts" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/fideloper/proxy" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/filp/whoops" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/firebase/php-jwt" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/fruitcake/laravel-cors" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/fzaninotto/faker" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/guzzlehttp/guzzle" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/guzzlehttp/promises" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/guzzlehttp/psr7" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/hamcrest/hamcrest-php" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/jaybizzle/crawler-detect" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/jenssegers/agent" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/laminas/laminas-diactoros" />
@@ -42,30 +35,15 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/league/flysystem" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/league/oauth2-server" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/mobiledetect/mobiledetectlib" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/mockery/mockery" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/monolog/monolog" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/myclabs/deep-copy" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/nesbot/carbon" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/nikic/php-parser" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/nunomaduro/collision" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/nyholm/psr7" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/opis/closure" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/paragonie/random_compat" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phar-io/manifest" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phar-io/version" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/php-http/message-factory" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpdocumentor/reflection-common" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpdocumentor/reflection-docblock" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpdocumentor/type-resolver" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpoption/phpoption" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpseclib/phpseclib" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpspec/prophecy" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/php-code-coverage" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/php-file-iterator" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/php-text-template" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/php-timer" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/php-token-stream" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/phpunit/phpunit" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/psr/container" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/psr/event-dispatcher" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/psr/http-factory" />
@@ -76,19 +54,6 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/ralouphie/getallheaders" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/ramsey/collection" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/ramsey/uuid" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/scrivo/highlight.php" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/code-unit-reverse-lookup" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/comparator" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/diff" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/environment" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/exporter" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/global-state" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/object-enumerator" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/object-reflector" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/recursion-context" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/resource-operations" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/type" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/sebastian/version" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/spatie/laravel-permission" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/swiftmailer/swiftmailer" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/console" />
@@ -118,11 +83,9 @@
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/translation" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/translation-contracts" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/symfony/var-dumper" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/theseer/tokenizer" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/tijsverkoyen/css-to-inline-styles" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/vlucas/phpdotenv" />
       <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/voku/portable-ascii" />
-      <excludeFolder url="file://$MODULE_DIR$/skolehjem/vendor/webmozart/assert" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />

skolehjem/resources/js/app.js

@@ -7,7 +7,7 @@
 require('./bootstrap');
 
 //Dependencies
-require("moment");
+const moment = require("moment");
 
 require('./date');
 
@@ -23,7 +23,7 @@ import { toggleMenu } from './navmenu/menu';
 
 // window.Vue = require('vue');
 
-//import { generateCalendar } from "./calendar/calendar";
+import { generateCalendar } from "./calendar/calendar";
 
 // createCalendar();
 //
@@ -53,8 +53,23 @@ import { toggleMenu } from './navmenu/menu';
 //     el: '#app',
 // });
 
-//generateCalendar();
+let weekOffset = 0;
 
-document.getElementById("toggle").onclick = function () {
+if(document.getElementById("calendar")) {
+    generateCalendar();
+
+    document.getElementById("week-previous").onclick = function () {
+        weekOffset--;
+        generateCalendar(weekOffset);
+    }
+
+    document.getElementById("week-next").onclick = function () {
+        weekOffset++;
+        generateCalendar(weekOffset);
+    }
+}
+
+if(document.getElementById("toggle"))
+    document.getElementById("toggle").onclick = function () {
         toggleMenu('menu');
-};
+    };

skolehjem/resources/js/calendar/calendar.js

@@ -22,229 +22,134 @@
 
 const moment = require("moment");
 
-const calendar = document.getElementById("calendar");
+// const calendar = document.getElementById("calendar");
-const title = document.getElementById("month");
+// const title = document.getElementById("month");
+
 
-const days = [
-    "Mandag",
-    "Tirsdag",
-    "Onsdag",
-    "Torsdag",
-    "Fredag",
-    "Lørdag",
-    "Søndag"
-];
-//
-// const months = [
-//     "January",
-//     "February",
-//     "March",
-//     "April",
-//     "May",
-//     "June",
-//     "July",
-//     "August",
-//     "September",
-//     "October",
-//     "November",
-//     "December",
-// ]
 
-// const month = document.getElementById("month");
-//
-// const year = 2020;
-//
-// let currentMonth = 0;
-//
-// let firstDay = (new Date(year, month)).getDay();
-//
-// function createCalendar() {
-//
 // calendar.innerHTML = "";
-//
-//     // HEADER
-//     let header = document.createElement("div");
-//     header.classList.add("calendar-table__header", "calendar-table__row");
-//
-//     days.forEach((value) =>{
-//         let head = document.createElement("div");
-//         head.classList.add("calendar-table__col");
-//
-//         head.innerText = value;
-//
-//         header.appendChild(head);
-//     });
-//
-//     calendar.appendChild(header);
-//
-//
-//     // BODY
-//
-//     let date = new Date(Date.now());
-//
-//     months.forEach((value, index) => {
-//         if(index === date.getMonth()) {
-//
-//         }
-//     });
-//
-//
-// // <div class="calendar-table__col">
-// //         <div class="calendar-table__item">
-// //         <span>2</span>
-// //         </div>
-// //         </div>
-//
-//     // let intDay = 1;
-//     // for(let columns = 0; columns < 5; columns++)
-//     // {
-//     //     let row = document.createElement("div");
-//     //     row.classList.add("calendar-table__row");
-//     //
-//     //     for (let i = 0; i < 7; i++)
-//     //     {
-//     //         let day = document.createElement("div");
-//     //         day.classList.add("calendar-table__col", "calendar-table__item");
-//     //         day.innerText = intDay;
-//     //         // let
-//     //
-//     //         row.appendChild(day);
-//     //
-//     //         intDay++;
-//     //     }
-//     //     calendar.appendChild(row);
-//     // }
-//     drawMonth(6);
-// }
-//
-// function drawMonth(monthId) {
-//
-//
-//     let dateObject = new Date()
-//
-//     let date = 1;
-//     for(let columns = 0; columns < 6; columns++)
-//     {
-//         let row = document.createElement("div");
-//         row.classList.add("calendar-table__row");
-//
-//         for (let i = 0; i < 7; i++)
-//         {
-//             if(columns === 0 && i < firstDay) {
-//                 let day = document.createElement("div");
-//                 day.classList.add("calendar-table__col", "calendar-table__item");
-//                 // day.innerText = date;
-//
-//                 row.appendChild(day);
-//             }
-//             else if(date > countDays(year, 6)) {
-//                 break;
-//             }
-//
-//             else {
-//                 let day = document.createElement("div");
-//                 day.classList.add("calendar-table__col", "calendar-table__item");
-//                 day.innerText = date;
-//
-//                 row.appendChild(day);
-//                 date++;
-//             }
-//
-//             // let day = document.createElement("div");
-//             // day.classList.add("calendar-table__col", "calendar-table__item");
-//             // day.innerText = date;
-//             // // let
-//             //
-//             // row.appendChild(day);
-//             //
-//             // date++;
-//         }
-//         calendar.appendChild(row);
-//     }
-// }
-//
-// function nextMonth() {
-//     currentMonth++;
-//
-//     if(currentMonth > 11)
-//         currentMonth = 0;
-//
-//     months.forEach((value, index) => {
-//         if(index === currentMonth)
-//             month.innerText = value;
-//     });
-//
-//     drawMonth(currentMonth);
-// }
-//
-// function previousMonth() {
-//     currentMonth--;
-//
-//     if(currentMonth < 0)
-//         currentMonth = 11;
-//
-//     months.forEach((value, index) => {
-//         if(index === currentMonth)
-//             month.innerText = value;
-//     });
-//
-//     drawMonth(currentMonth);
-// }
-//
-//
-// function countDays(year, month) {
-//     return 32 - new Date(year, month, 32).getDate();
-// }
-//
-// // Monday
-// // Tuesday
-// // Wednesday
-// // Thursday
-// // Friday
-// // Saturday
-// // Sunday
-// //
-// // mon tue wed thu fri sat sun
-//
-//
-// module.exports = {
-//     createCalendar,
-//     countDays,
-//     nextMonth,
-//     previousMonth,
-//     calendar,
-//     days,
-//     months,
-//     currentMonth,
-//     month,
-// };
 
-
+function generateCalendar(weekOffset = 0) {
-
+    const week = (moment().week() + weekOffset);
-calendar.innerHTML = "";
+    let weekDays = Array.apply(null, Array(7)).map((value, index) => {
-//
+        return moment(index, "e").locale("da").startOf("week").weekday(index).format("ddd");
-// cal.forEach(value => {
-//     let elem = document.createElement("div");
-//     elem.innerText = value;
-//     console.log(value);
-//     calendar.appendChild(elem);
-// });
-//
-// title.innerText = moment().format("DD/MM/YYYY");
-
-function generateCalendar() {
-    const startWeek = moment().startOf("month").week();
-    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"))
     });
+    // 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 = {

skolehjem/resources/views/app/bookings/index.blade.php

@@ -10,11 +10,11 @@
         <div class="col w-100 mt-auto">
             <div class="calendar-container">
                 <div class="calendar-container__header">
-                    <button id="month-previous" class="calendar-container__btn calendar-container__btn--left" title="Previous">
+                    <button id="week-previous" class="calendar-container__btn calendar-container__btn--left" title="Previous">
                         <i class="icon ion-ios-arrow-back"></i>
                     </button>
                     <h2 id="month" class="calendar-container__title">{Måned} {År}</h2>
-                    <button id="month-next" class="calendar-container__btn calendar-container__btn--right" title="Next">
+                    <button id="week-next" class="calendar-container__btn calendar-container__btn--right" title="Next">
                         <i class="icon ion-ios-arrow-forward"></i>
                     </button>
                 </div>
@@ -223,22 +223,22 @@
             </div>
             <div class="events-container">
                 <span class="events__title">Tider</span>
-                <ul class="events__list">
+                <select id="events" class="events__list">
-                    <li class="events__item">
+{{--                    <li class="events__item">--}}
-                        <div class="events__item--left">
+{{--                        <div class="events__item--left">--}}
-                            <span class="events__name">Vaskemaskine Tid</span>
+{{--                            <span class="events__name">Vaskemaskine Tid</span>--}}
-                            <span class="events__date">{Dato}</span>
+{{--                            <span class="events__date">{Dato}</span>--}}
-                        </div>
+{{--                        </div>--}}
-                        <span class="events__tag">Book</span>
+{{--                        <span class="events__tag">Book</span>--}}
-                    </li>
+{{--                    </li>--}}
-                    <li class="events__item">
+{{--                    <li class="events__item">--}}
-                        <div class="events__item--left">
+{{--                        <div class="events__item--left">--}}
-                            <span class="events__name">Vaskemaskine Tid</span>
+{{--                            <span class="events__name">Vaskemaskine Tid</span>--}}
-                            <span class="events__date">{Dato}</span>
+{{--                            <span class="events__date">{Dato}</span>--}}
-                        </div>
+{{--                        </div>--}}
-                        <span class="events__tag">Book</span>
+{{--                        <span class="events__tag">Book</span>--}}
-                    </li>
+{{--                    </li>--}}
-                </ul>
+                </select>
             </div>
         </div>
     </main>