Merge branch 'master' of https://github.com/sebathefox/skolehjem-webapp into master

skolehjem/app/Http/Controllers/WashingReservationController.php

@@ -150,7 +150,7 @@ class WashingReservationController extends Controller
             $machines = WashingMachine::query()->where("location_id", "=", $request->location_id)->orderBy("name", "asc")->get();
 
             if($request->machine_id == 0)
-                $request->machine_id = WashingMachine::query()->orderBy("name", "asc")->first()->id;
+                $request->machine_id = WashingMachine::query()->where("location_id", "=", $request->location_id)->orderBy("name", "asc")->first()->id;
 
             $reservations = WashingReservation::query()->where("machine_id", "=", $request->machine_id)->where("time", "LIKE", $datetext."%")->get();
 
@@ -162,7 +162,41 @@ class WashingReservationController extends Controller
 
             $locations = Location::query()->orderBy("name", "asc")->get();
 
-            $output = json_encode(['date' => $date, 'washingmachines' => $machines, 'unavailable_times' => $times, "locations" => $locations ]);
+            $output = json_encode(['date' => $date, 'washingmachines' => $machines, 'unavailable_times' => $times, "locations" => $locations, "machine_id" => $request->machine_id, "location_id" => $request->location_id ]);
+            return Response($output);
+        }
+    }
+
+    public function getMachines(Request $request){
+        if($request->ajax()){
+            if($request->location_id == 0)
+                $request->location_id = Location::all()->first()->id;
+
+            $machines = WashingMachine::query()->where("location_id", "=", $request->location_id)->orderBy("name", "asc")->get();
+
+            $output = json_encode(["washingmachines" => $machines]);
+            return Response($output);
+        }
+    }
+
+    public function getTimes(Request $request){
+        if($request->ajax()){
+            if($request->location_id == 0)
+                $request->location_id = Location::all()->first()->id;
+
+            if($request->machine_id == 0)
+                $request->machine_id = WashingMachine::query()->where("location_id", "=", $request->location_id)->orderBy("name", "asc")->first()->id;
+
+
+            $reservations = WashingReservation::query()->where("machine_id", "=", $request->machine_id)->where("time", "LIKE", $request->datetext."%")->get();
+
+            $times = [];
+
+            foreach ($reservations as $reservation){
+                array_push($times, $reservation->time);
+            }
+
+            $output = json_encode(["unavailable_times" => $times]);
             return Response($output);
         }
     }

skolehjem/resources/views/admin/events/create.blade.php

@@ -26,15 +26,15 @@
     <h1 id="errormesseages" >Opret Aktivitet:</h1>
     <form method="post" action="{{ route("events.store") }}" enctype="multipart/form-data">
         @csrf
-        <label for="name">Event Navn:</label>
+        <label for="name">Aktivitet Navn:</label>
-        <label hidden id="error" for="errormesseages">Dette Event navn findes allerede</label>
+        <label hidden id="error" for="errormesseages">Dette Aktivitet navn findes allerede</label>
         <input type="text" name="name" id="name" max="60" required>
-        <label for="accountable">Event Ansvarlig:</label>
+        <label for="accountable">Aktivitet Ansvarlig:</label>
         <input type="text" name="accountable" id="accountable" required>
-        <label for="description">Event Beskrivelse:</label>
+        <label for="description">Aktivitet Beskrivelse:</label>
         <div id="editor"></div>
         <textarea name="description" class="d-none" id="hiddenArea"></textarea>
-        <label for="date">Event dato:</label>
+        <label for="date">Aktivitet dato:</label>
         <input type="datetime-local" name="date" id="date" required>
         <label class="toggle">
             <input class="toggle__input" type="checkbox" name="newsoption">

skolehjem/resources/views/admin/events/delete.blade.php

@@ -6,7 +6,7 @@
 @endsection
 
 @section("path")
-    <a href="{{ route('events.destroy') }}" class="text-white"> fjern aktivitet</a>
+    <a href="{{ route('events.destroy') }}" class="text-white">Fjern aktivitet</a>
 @endsection
 
 @section("content")

skolehjem/resources/views/admin/events/edit.blade.php

@@ -2,11 +2,11 @@
 @extends("admin.layout.header")
 
 @section("title")
-    Events - Vis
+    Aktivitet - Rediger
 @endsection
 
 @section("path")
-    <a href="{{route("events.edit", ["event" => $event])}}" class="text-white">Vis Events</a> /
+    <a href="{{route("events.edit", ["event" => $event])}}" class="text-white">Rediger Aktivitet</a> /
 @endsection
 
 @section("content")
@@ -23,19 +23,19 @@
         }
     </style>
     <link href="https://cdn.quilljs.com/1.3.6/quill.snow.css" rel="stylesheet">
-    <h1>Rediger Link:</h1>
+    <h1>Rediger Aktivitet:</h1>
     <form method="post" action="{{route("events.update", ["event" => $event])}}">
         @csrf
         @method("PUT")
-        <label for="name">Event Titel:</label>
+        <label for="name">Aktivitet Navn:</label>
-        <label hidden id="error" for="errormesseages">Dette Event navn findes allerede</label>
+        <label hidden id="error" for="errormesseages">Dette Aktivitet navn findes allerede</label>
         <input value="{{$event->name}}" type="text" name="name" id="name" required>
-        <label for="accountable">Event Ansvarlig:</label>
+        <label for="accountable">Aktivitet Ansvarlig:</label>
         <input value="{{$event->accountable}}" type="text" name="accountable" id="accountable" required>
-        <label for="description">Beskrivelse</label>
+        <label for="description">Aktivitet Beskrivelse:</label>
         <div id="editor">{!! $event->description !!}</div>
         <textarea name="description" class="d-none" id="hiddenArea"></textarea>
-        <label for="date">Beskrivelse</label>
+        <label for="date">Aktivitet Dato:</label>
         <input value="{{$event->date}}" type="datetime-local" name="date" id="date" required>
         <label class="toggle">
             <input class="toggle__input" type="checkbox" name="newsoption">

skolehjem/resources/views/admin/events/index.blade.php

@@ -2,28 +2,28 @@
 @extends("admin.layout.header")
 
 @section("title")
-    Events - Vis
+    Aktiviteter - Vis
 @endsection
 
 @section("path")
-    <a href="" class="text-white">Vis Events</a> /
+    <a href="" class="text-white">Vis Aktiviteter</a> /
 @endsection
 
 @section("content")
     <div class="row align-items-center">
-        <a class="btn btn-inline btn-sde-blue mb-0" href="{{ route('events.create') }}"><img src="{{ asset('/images/icons/plus.svg') }}" alt="Create">Opret Event</a>
+        <a class="btn btn-inline btn-sde-blue mb-0" href="{{ route('events.create') }}"><img src="{{ asset('/images/icons/plus.svg') }}" alt="Create">Opret Aktivitet</a>
 
         <form method="post" action="{{ route("events.store") }}">
             @csrf
-            <input type="text" class="form-controller" id="search" name="search" placeholder="Søg på Evt Navn, Evt Dato"></input>
+            <input type="text" class="form-controller" id="search" name="search" placeholder="Søg på Navn, Dato"></input>
         </form>
     </div>
 
     <table class="tbl mt-2">
         <tr>
-            <th>Event Navn</th>
+            <th>Aktivitet Navn</th>
-            <th>Event Ansvarlig</th>
+            <th>Aktivitet Ansvarlig</th>
-            <th>Event Dato</th>
+            <th>Aktivitet Dato</th>
             <th style="width: 1em;"><img class="w-100" src="{{ asset('/images/icons/eye.svg') }}" alt="Show"></th>
             <th style="width: 1em;"><img class="w-100" src="{{ asset('/images/icons/pencil.svg') }}" alt="Update"></th>
             <th style="width: 1em;"><img class="w-100" src="{{ asset('/images/icons/trashcan.svg') }}" alt="Delete"></th>

skolehjem/resources/views/admin/events/show.blade.php

@@ -1,31 +0,0 @@
-@extends("admin.layout.base")
-@extends("admin.layout.header")
-
-@section("title")
-    Vaskemaskiner - Vis
-@endsection
-
-@section("path")
-    <a href="" class="text-white">Vis Vaskemaskiner</a> /
-@endsection
-
-@section("content")
-    <table class="tbl">
-        <tr>
-            <th>Fornavn</th>
-            <th>Efternavn</th>
-            <th>Email</th>
-            <th>Tlf nr</th>
-            <th style="width: 1px;"><img class="w-100" src="{{ asset('/images/icons/pencil.svg') }}" alt="Update"></th>
-            <th style="width: 1px;"><img class="w-100" src="{{ asset('/images/icons/trashcan.svg') }}" alt="Delete"></th>
-        </tr>
-        <tr>
-            <td>{Fornavn}</td>
-            <td>{Efternavn}</td>
-            <td>{Email}</td>
-            <td>{TLF}</td>
-            <td><a href=""><img class="w-100" src="{{ asset('/images/icons/pencil-dark.svg') }}" alt="Update"></a></td>
-            <td><a href=""><img class="w-100" src="{{ asset('/images/icons/trashcan-dark.svg') }}" alt="Delete"></a></td>
-        </tr>
-    </table>
-@endsection

skolehjem/resources/views/admin/events/store.blade.php

@@ -1,14 +0,0 @@
-@extends("admin.layout.base")
-@extends("admin.layout.header")
-
-@section("title")
-    Vaskemaskiner - Vis
-@endsection
-
-@section("path")
-    <a href="{{ route('events.create') }}" class="text-white">Opret External Link</a> /
-@endsection
-
-@section("content")
-    Link blev (ikke) oprettet.
-@endsection

skolehjem/resources/views/admin/events/update.blade.php

@@ -1,14 +0,0 @@
-@extends("admin.layout.base")
-@extends("admin.layout.header")
-
-@section("title")
-    Vaskemaskiner - Vis
-@endsection
-
-@section("path")
-    <a href="{{ route('events.edit', ["event" => $event]) }}" class="text-white">External link</a> /
-@endsection
-
-@section("content")
-    Din link blev (ikke) redigeret.
-@endsection

skolehjem/resources/views/admin/index.blade.php

@@ -90,11 +90,11 @@
                 <div class="header" style="padding-top: 0">
                     <table class="tbl mt-0">
                         <tr>
-                            <td><label>Event navn</label></td>
+                            <td><label>Aktivitet navn</label></td>
                             <td>{{ \App\Event::query()->orderByDesc("date")->first()->name }}</td>
                         </tr>
                         <tr>
-                            <td><label>Event ansvarlig</label></td>
+                            <td><label>Aktivitet ansvarlig</label></td>
                             <td>{{__('msg.af')}}: {{ \App\Event::query()->orderByDesc("date")->first()->accountable }}</td>
                         </tr>
                         <tr>

skolehjem/resources/views/admin/locations/show.blade.php

@@ -13,22 +13,27 @@
     <p class="text-white" style="margin-left: auto; padding-right: 24px; font-size: 1vw;">Lokation: {{ $location->name }}</p>
 </header>
 <main style="min-height: calc(100% - 72px); background-color: #ffffff;">
-    <?php $i = 1; ?>
+    <?php
+        date_default_timezone_set('Europe/Copenhagen');
+        $i = 1;
+    ?>
     <div class="row">
     @foreach(\App\WashingMachine::query()->where("location_id", "=", $location->id)->get() as $machine)
         @foreach(\App\WashingReservation::query()->where("machine_id", "=", $machine->id)->where("time", "LIKE", date("Y-m-d"). "%")->orderBy("time", "asc")->get() as $reservation)
-            @if($i % 3 == 1)
+            @if (date('Y-m-d H:i:s', strtotime('-1 hour')) < $reservation->time)
+                @if($i % 3 == 1)
+                    </div>
+                    <div class="row w-100">
+                @endif
+                <div class="reservation col align-items-center" style="margin: 0 32px 1.75rem 32px; width: calc(33% - 64px);">
+                    <h2 style="font-size: 2vw">{{ \App\WashingMachine::query()->find($reservation->machine_id)->name }}</h2>
+                    <div class="col align-items-center">
+                        <span style="font-size: 1vw"><b>Dato:</b> {{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($reservation->time))->format('d/m/Y') }}</span>
+                        <span style="font-size: 2vw"><b>Tid:</b> {{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($reservation->time))->format('\k\l\. H:i') }} - {{ \App\User::query()->where("id", "=", $reservation->user_id)->first()->name_first }} {{ \App\User::query()->where("id", "=", $reservation->user_id)->first()->name_last }}</span>
+                    </div>
                 </div>
-                <div class="row w-100">
+                <?php $i++; ?>
             @endif
-            <div class="reservation col align-items-center" style="margin: 0 32px 1.75rem 32px; width: calc(33% - 64px);">
-                <h2 style="font-size: 2vw">{{ \App\WashingMachine::query()->find($reservation->machine_id)->name }}</h2>
-                <div class="col align-items-center">
-                    <span style="font-size: 1vw"><b>Dato:</b> {{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($reservation->time))->format('d/m/Y') }}</span>
-                    <span style="font-size: 2vw"><b>Tid:</b> {{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($reservation->time))->format('\k\l\. H:i') }} - {{ \App\User::query()->where("id", "=", $reservation->user_id)->first()->name_first }} {{ \App\User::query()->where("id", "=", $reservation->user_id)->first()->name_last }}</span>
-                </div>
-            </div>
-            <?php $i++; ?>
         @endforeach
     @endforeach
     @if($i == 1)
@@ -38,6 +43,13 @@
 </main>
 
 <script src="{{ mix("/js/app.js") }}"></script>
+<script type="text/javascript">
+    $(document).ready(function () {
+        setTimeout(function(){
+            location.reload(true);
+        }, (60000*5));
+    });
+</script>
 @yield("scripts")
 </body>
 </html>

skolehjem/resources/views/app/washing-reservations/create.blade.php

@@ -45,6 +45,12 @@
     <script src="{{ asset("/js/moment-with-locales.min.js") }}"></script>
     <script src="{{ asset("/js/da.min.js") }}"></script>
     <script>
+        var momentDate = null;
+        var dateText = null;
+
+        //Custom forEach
+        NodeList.prototype.forEach = Array.prototype.forEach;
+
         function generateCalendar(weekOffset = 0) {
             const week = (moment().week() + weekOffset);
 
@@ -66,6 +72,7 @@
             calendarRow.classList.add("calendar-table__row")
             calendarRow.id = "calenderRow";
 
+            //Generate day buttons
             weekDays.forEach(function (weekDay) {
                 let headerDay = document.createElement("div");
                 headerDay.classList.add("calendar-table__col");
@@ -86,6 +93,7 @@
 
                 dayHolder.appendChild(day);
 
+                //When clicking on a date run "onDateSelect()"
                 dayHolder.onclick = function() {
                     onDateSelect(date, dayHolder, datetext);
                 }
@@ -102,14 +110,11 @@
         }
 
         function onDateSelect(date, dayHolder, datetext) {
-            let events;
+            //Set selected date and dateText
-            let locationz;
+            momentDate = date;
-            let machinez;
+            dateText = datetext;
-            let buttonz;
 
-            let container = document.getElementById("event-container");
+            //Add selected class on the selected date and remove it on all others
-
-            NodeList.prototype.forEach = Array.prototype.forEach;
             var children = document.getElementById("calenderRow").childNodes;
 
             children.forEach(function(item){
@@ -118,177 +123,291 @@
 
             dayHolder.classList.add("selected");
 
+            /***************/
+            /*Generate form*/
+            /***************/
+
             let machine_id;
             let location_id;
 
-            if(document.getElementById('washing-machines'))
+            //If a washing-machine select exists, set machine_id to its currently selected options value
+            //Else set it to 0
+            if(document.getElementById('washing-machines')) {
                 machine_id = document.getElementById('washing-machines').value;
-            else
+            }
+            else {
                 machine_id = 0;
+            }
 
-            if(document.getElementById('locations'))
+            //If a location select exists, set location_id to its currently selected options value
+            //Else set it to 0
+            if(document.getElementById('locations')) {
                 location_id = document.getElementById('locations').value;
-            else
+            }
+            else {
                 location_id = 0;
+            }
 
             axios({
                 method: 'get',
                 url: '{{ route("washing-reservations.api") }}',
                 params: { 'date': date, 'machine_id': machine_id, 'datetext': datetext, 'location_id': location_id }
-            }).then(function (response) {
+            })
+                .then(function (response) {
                 var data = response.data;
 
+                //Fill locations
+                fillLocations(data["locations"], location_id);
 
-                if(document.getElementById("locations") != undefined)
+                //Fill washing-machines
-                    locationz = document.getElementById("locations");
+                fillMachines(data["washingmachines"], machine_id);
-                else {
-                    let span = document.createElement("span");
-                    span.classList.add("events__title");
-                    span.innerText = "{{__('msg.lokation')}}";
 
-                    let select = document.createElement("select");
+                //Fill events (times) and remove unavailable_times
-                    select.classList.add("events__title");
+                fillTimes(data["unavailable_times"], datetext);
-                    select.id = "locations";
-                    select.name = "location_id";
-
-                    select.onchange = function() {
-                        onDateSelect(date, dayHolder, datetext);
-                    }
-
-                    container.appendChild(span);
-                    container.appendChild(select);
-
-                    locationz = document.getElementById("locations");
-                }
-                if(document.getElementById("washing-machines") != undefined)
-                    machinez = document.getElementById("washing-machines");
-                else {
-                    let span = document.createElement("span");
-                    span.classList.add("events__title");
-                    span.innerText = "{{__('msg.maskiner')}}";
-
-                    let select = document.createElement("select");
-                    select.classList.add("events__title");
-                    select.id = "washing-machines";
-                    select.name = "machine_id";
-
-                    select.onchange = function() {
-                        onDateSelect(date, dayHolder, datetext);
-                    }
-
-                    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 = "{{__('msg.tilgængeligetider')}}";
-
-                    let select = document.createElement("select");
-                    select.classList.add("events__title");
-                    select.id = "events";
-                    select.name = "time";
-
-                    container.appendChild(span);
-                    container.appendChild(select);
-
-                    events = document.getElementById("events");
-                }
-                if(document.getElementById("create-reservation") != undefined)
-                    buttonz = document.getElementById("create-reservation");
-                else {
-                    let button = document.createElement("button");
-
-                    button.id = "create-reservation";
-                    button.innerText = "{{__('msg.reserver')}}";
-                    button.classList.add("btn", "btn-sde-blue")
-                    button.type = "submit";
-
-                    container.appendChild(button);
-
-                    buttonz = document.getElementById("events");
-                }
-
-                let locations = data["locations"];
-
-                locationz.innerHTML = "";
-                locationz.onchange = function () {
-                    onDateSelect(date, dayHolder, datetext);
-                }
-
-                for (let i = 0; i < locations.length; i++) {
-                    let option = document.createElement("option");
-                    option.text = locations[i]["name"];
-                    option.value = locations[i]["id"];
-
-                    if(location_id == locations[i]["id"])
-                        option.selected = "selected";
-
-                    locationz.appendChild(option);
-                }
-
-                let machines = data["washingmachines"];
-
-                machinez.innerHTML = "";
-                machinez.onchange = function () {
-                    onDateSelect(date, dayHolder, datetext);
-                }
-
-                for (let i = 0; i < machines.length; i++) {
-                    let option = document.createElement("option");
-                    option.text = machines[i]["name"];
-                    option.value = machines[i]["id"];
-
-                    if(machine_id == machines[i]["id"])
-                        option.selected = "selected";
-
-                    machinez.appendChild(option);
-                }
-
-                events.innerHTML = "";
-                for (let hour = 8; hour <= 20; hour++) {
-                    let value = datetext + " " + prependZero(hour) + ":00:00";
-
-                    let option = document.createElement("option");
-
-                    option.text = prependZero(hour) + ":00";
-                    option.value = value;
-                    option.id = value;
-                    events.appendChild(option);
-                }
-
-                let unavailable_times = data["unavailable_times"];
-
-                unavailable_times.forEach(function (item, index) {
-                    document.getElementById(item).remove();
-                });
-
-                if(events.childElementCount == 0){
-                    let option = document.createElement("option");
-                    option.disabled = "disabled";
-                    option.text = "Der er ingen tilgængelige tider";
-                    option.selected = "selected";
-                    events.appendChild(option);
-
-                    document.getElementById("create-reservation").disabled = "disabled";
-                } else {
-                    document.getElementById("create-reservation").disabled = "";
-                }
             });
         }
 
+        //Fill locations
+        function fillLocations(locations, selected_location_id){
+            var element;
+
+            //If a location select exists, set element to the select element
+            //Else create it
+            if(document.getElementById("locations") !== null) {
+                element = document.getElementById("locations");
+
+                //Clear locations
+                element.innerHTML = "";
+            }
+            else {
+                let span = document.createElement("span");
+                span.classList.add("events__title");
+                span.innerText = "{{__('msg.lokation')}}";
+
+                let select = document.createElement("select");
+                select.classList.add("events__title");
+                select.id = "locations";
+                select.name = "location_id";
+
+                select.onchange = function() {
+                    updateForm();
+                }
+
+                document.getElementById("event-container").appendChild(span);
+                document.getElementById("event-container").appendChild(select);
+
+                element = document.getElementById("locations");
+            }
+
+            element.onchange = function () {
+                updateForm();
+            }
+
+            //Add location options
+            for (let i = 0; i < locations.length; i++) {
+                let option = document.createElement("option");
+                option.text = locations[i]["name"];
+                option.value = locations[i]["id"];
+
+                //If current location is the location we have selected, mark it selected
+                if(selected_location_id == locations[i]["id"])
+                    option.selected = "selected";
+
+                element.appendChild(option);
+            }
+        }
+
+        //Fill washing-machines
+        function fillMachines(machines, selected_machine_id) {
+            var element;
+
+            //If a washing-machine select exists, set element to the select element
+            //Else create it
+            if(document.getElementById("washing-machines") !== null) {
+                element = document.getElementById("washing-machines");
+
+                //Clear machines
+                element.innerHTML = "";
+            }
+            else {
+                let span = document.createElement("span");
+                span.classList.add("events__title");
+                span.innerText = "{{__('msg.maskiner')}}";
+
+                let select = document.createElement("select");
+                select.classList.add("events__title");
+                select.id = "washing-machines";
+                select.name = "machine_id";
+
+                select.onchange = function() {
+                    updateForm();
+                }
+
+                document.getElementById("event-container").appendChild(span);
+                document.getElementById("event-container").appendChild(select);
+
+                element = document.getElementById("washing-machines");
+            }
+
+
+            element.onchange = function () {
+                updateForm();
+            }
+
+            //Add machine options
+            for (let i = 0; i < machines.length; i++) {
+                let option = document.createElement("option");
+                option.text = machines[i]["name"];
+                option.value = machines[i]["id"];
+
+                //If current machine is the machine we have selected, mark it selected
+                if(selected_machine_id == machines[i]["id"])
+                    option.selected = "selected";
+
+                element.appendChild(option);
+            }
+        }
+
+        //Fill events (times) and remove unavailable_times
+        function fillTimes(unavailable_times, datetext) {
+            var element;
+
+            //If a events (times) select exists, set element to the select element
+            //Else create it
+            if(document.getElementById("events") !== null) {
+                element = document.getElementById("events");
+
+                //Clear times
+                element.innerHTML = "";
+            }
+            else {
+                let span = document.createElement("span");
+                span.classList.add("events__title");
+                span.innerText = "{{__('msg.tilgængeligetider')}}";
+
+                let select = document.createElement("select");
+                select.classList.add("events__title");
+                select.id = "events";
+                select.name = "time";
+
+                document.getElementById("event-container").appendChild(span);
+                document.getElementById("event-container").appendChild(select);
+
+                element = document.getElementById("events");
+            }
+
+
+            //Add times 8:00-20:00
+            for (let hour = 8; hour <= 20; hour++) {
+                let value = datetext + " " + prependZero(hour) + ":00:00";
+
+                let option = document.createElement("option");
+
+                option.text = prependZero(hour) + ":00";
+                option.value = value;
+                option.id = value;
+                element.appendChild(option);
+            }
+
+            //Remove unavailable_times
+            unavailable_times.forEach(function (item, index) {
+                document.getElementById(item).remove();
+            });
+
+            //If a submit button doesn't exist, create it
+            if(document.getElementById("create-reservation") === null) {
+                let button = document.createElement("button");
+
+                button.id = "create-reservation";
+                button.innerText = "{{__('msg.reserver')}}";
+                button.classList.add("btn", "btn-sde-blue")
+                button.type = "submit";
+
+                document.getElementById("event-container").appendChild(button);
+            }
+
+            //If there is no available times, disable the make reservation button and create new option
+            if(element.childElementCount === 0){
+                let option = document.createElement("option");
+                option.disabled = "disabled";
+                option.text = "Der er ingen tilgængelige tider";
+                option.selected = "selected";
+                element.appendChild(option);
+
+                document.getElementById("create-reservation").disabled = "disabled";
+            }
+            else {
+                document.getElementById("create-reservation").disabled = "";
+            }
+        }
+
+        //Update selects
+        function updateForm() {
+            //console.log("Updating form...");
+            var location_id;
+            var machine_id;
+
+            //If a location select exists, set location_id to its currently selected options value
+            //Else set it to 0
+            if(document.getElementById('locations') !== null)
+                location_id = document.getElementById('locations').value;
+            else
+                location_id = 0;
+
+            //console.log("location_id: " + location_id);
+
+            //If a washing-machine select exists, set machine_id to its currently selected options value
+            //Else set it to 0
+            if(document.getElementById('washing-machines') !== null)
+                machine_id = document.getElementById('washing-machines').value;
+            else
+                machine_id = 0;
+
+            axios({
+                method: 'get',
+                url: '{{ route("washing-reservations.getMachines") }}',
+                params: { 'location_id': location_id }
+            })
+                .then(function (response) {
+                    var data = response.data;
+
+                    //Fill washing-machines
+                    fillMachines(data["washingmachines"], machine_id);
+
+                    //If a washing-machine select exists, set machine_id to its currently selected options value
+                    //Else set it to 0
+                    if(document.getElementById('washing-machines') !== null)
+                        machine_id = document.getElementById('washing-machines').value;
+                    else
+                        machine_id = 0;
+
+                    //console.log("machine_id: " + machine_id);
+
+                    axios({
+                        method: 'get',
+                        url: '{{ route("washing-reservations.getTimes") }}',
+                        params: { 'machine_id': machine_id, 'datetext': dateText }
+                    })
+                        .then(function (response) {
+                            var data = response.data;
+
+                            //Fill events (times) and remove unavailable_times
+                            fillTimes(data["unavailable_times"], dateText);
+                        });
+                });
+        }
+
+        //Adds a "0" in front of values below 10
         function prependZero(value) {
             if(value < 10)
                 return "0" + value;
             return value;
         }
 
+        //The offset from the current week
         let weekOffset = 0;
 
+        //Generate calender and set onclick function on the week changing arrows
         if(document.getElementById("calendar")) {
             generateCalendar();
 

skolehjem/routes/web.php

@@ -30,6 +30,8 @@ Route::get("/events/signups", "EventController@signups")->name("events.signups")
 Route::get("/events/accountsignups", "EventController@accountsignups")->name("events.accountsignups");
 Route::get("phones", "PhoneController@index")->name("phones.index");
 Route::get("/washing-reservationsapi", "WashingReservationController@api")->name("washing-reservations.api");
+Route::get("/washing-reservationsgetMachines", "WashingReservationController@getMachines")->name("washing-reservations.getMachines");
+Route::get("/washing-reservationsgetTimes", "WashingReservationController@getTimes")->name("washing-reservations.getTimes");
 Route::get("/app/washing-reservations", "WashingReservationController@appindex")->name("washing-reservations.appindex");
 Route::get("/settings", "SettingsController@index")->name("settings.index");
 Route::post("/events/signup", "UserEventController@createajax")->name("userevents.createajax");