@extends("app.layout.base") @section("title") Aktiviteter @endsection @section("content") <style> iframe, .ql-video { width: 100%; } div.card { margin-top: 1rem; margin-bottom: 30px; width: auto; heigt: auto; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); border-radius: 10px; } div.container { padding: 8px; text-align: justify; line-height: 1.5; } .header > img { border-radius: 10px 10px 0px 0px } /*Alert box*/ .alert { opacity: 0.8; padding: 20px; background-color: #00788A; color: white; border-radius: 10px; background: linear-gradient(to right, red, purple); } .closebtn { margin-left: 15px; color: white; font-weight: bold; float: right; font-size: 22px; line-height: 20px; cursor: pointer; transition: 0.3s; } .closebtn:hover { color: black; } alertBoxBackground { margin-top: 1rem; margin-bottom: 30px; width: auto; heigt: auto; } </style> <main> <h1 class="text-center sde-blue mb-2rem">{{ __('msg.ugentligaktiviteter') }}</h1> <!--Alert box, display when a event is delete: start--> @if(count(\App\Notification::query()->where("user_id", "=", auth()->user()->id)->get()) > 0) <div class="alertBoxBackground" id="notifications"> <div class="alert"> <span class="closebtn" onclick="deleteNotifications(document.getElementById('notifications'))">×</span> <strong>{{__('msg.aktivitetaflyst')}}</strong> @foreach(\App\Notification::query()->where("user_id", "=", auth()->user()->id)->get() as $notification) <p>{{ $notification->message }}{{ __("msg.canceled") }}</p> @endforeach </div> </div> @endif <!--Alert box, display when a event is delete: end --> <!--If there is a images to the event do this: Start--> @if(!$multiEvents->isEmpty()) @foreach($multiEvents as $multiEvent) <div class="card"> @if($multiEvent->resource_id !== null) <div class="header"> <img class="w-100" src="{{ asset(\App\Resource::query()->where("id", "=", $multiEvent->resource_id)->first()->filename) }}"> </div> @endif <div class="container" class="mt-1"> <p class="m-none">Oprettet: {{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime($multiEvent->created_at))->format('d/m/Y \k\l\. H:i') }}</p> <h4 class="m-none">Ugentlige aktivitets plan for uge {{ $multiEvent->week }}</h4> <div class="row justify-content-space mt-1"> <a class="sde-blue text-center m-none p-none bold" href="{{route("multiple-events.show", $multiEvent->id)}}">{{__('msg.læsmere')}}</a> </div> </div> </div> @endforeach @else <p class="text-center mb-auto">{{__('msg.dereringenaktiviteter')}}!</p> @endif <a href="{{ route("userevents.index") }}" class="mt-auto btn text-center btn-sde-blue" id="tilmeld">{{__('msg.setilmeldteaktiviteter')}}</a> <div id="snackbar"></div> </main> @endsection @section("scripts") <script type="text/javascript"> function snackbar(data) { var x = document.getElementById("snackbar"); x.innerHTML = data; x.className = "show"; setTimeout(function(){ x.className = x.className.replace("show", ""); }, 3000); } function ajaxCall(event_id, el) { if(el.innerHTML === "{{__("msg.tilmeld")}}") { axios.post("{{ route("userevents.createajax") }}", { event_id: event_id } ).then(function (response) { var data = response.data; snackbar(data); el.innerHTML = "{{__("msg.afmeld")}}"; }).catch(function (error) { console.log(error); }); } else if(el.innerHTML === "{{__("msg.afmeld")}}"){ axios.post("{{ route("userevents.createajaxcancel") }}", { event_id: event_id } ).then(function (response) { var data = response.data; snackbar(data); el.innerHTML = "{{__("msg.tilmeld")}}"; }).catch(function (error) { console.log(error); }); } } function deleteNotifications(el) { el.remove(); } window.onload = function () { setMain(); axios({ method: 'delete', url: '{{route("notifications.delete")}}', data: { user_id: {{ auth()->user()->id }} } }); }; </script> @endsection