@extends("app.layout.base") @section("content") <style> iframe, .ql-video { width: 100%; } div.card { margin-top: .5rem; margin-bottom: 7px; width: auto; @if(request()->cookie("mode") == "dark") background-color: rgba(0,0,0, 0.3); @else background-color: white; @endif } div.header { background-color: #00788a; color: white; padding: 8px; font-size: 10px; text-align: center; height: 200px; width: auto; } div.container { padding: 3px 13px 13px 13px; text-align: justify; line-height: 1.5; } ol { padding-right: 8px; } .title{ margin-left: 50px; padding: 10px 10px; font-size: 22px; line-height: 30px; } .img{ width: 1em; height: calc(1em + 20px); margin-top: 5px; margin-bottom: 5px; margin-left: 5px; font-size: 20px; padding: 0 10px; border-color: #00788a; border-radius: 100%; background-color: #00788a; line-height: 30px; float: left; display: flex; justify-content: center; } .img > a { width: 100%; height: 100%; display: flex; justify-content: center; } .information{ text-align: center; background-color: rgba(0, 0, 0, 0.2); width: 100%; height: 25px; } .card > .img > a > img, .card > .img > img { width: 100%; } html,main{ @if(request()->cookie("mode") == "dark") @else background-color: rgb(200,200,200); @endif } </style> <main style="justify-content: unset; padding: 0"> @foreach($news as $new) <!--Code to list events--> @if($new->type == 'News')<!--Code that prints news--> <div class="card"> <div class="img"><img src="{{URL::asset('/images/icons/news.svg')}}" alt="News:"></div> <div class="title">{{ $new->subname }}</div> @if($new->resource_id !== null) <div class="header" style="background-size: cover; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $new->resource_id)->first()->filename) }}');"></div> @endif <div class="container" style="margin-top: 8px;"> {!! $new->content !!} </div> </div> @elseif($new->type == 'Menu')<!--Code that prints menuplan --> <div class="card"> <div class="img"><a href="{{ route('menu-plans.index') }}"><img src="{{URL::asset('/images/icons/Menuplan.svg')}}" alt="Menuplan:"></a></div> <div class="title">{{ $new->subname }}</div> @if($new->resource_id !== null) <div class="header" style="background-size: cover; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $new->resource_id)->first()->filename) }}');"></div> @endif <div class="container" style="margin-top: 8px;"> @if ($new->type_id == 1 || $new->type_id == 2) {{-- If it's a news or menu then display the whole message --}} {!! $new->content !!} @else {{-- If it's a menu, guide or event. Then display up to 300 characters of text --}} {!! \App\Helpers::closetags(substr($new->content, 0, 300) ) !!} @endif </div> </div> @elseif($new->type == 'Activity')<!--Code that prints events--> <div class="card"> <div class="img"><a href="{{ route('events.index') }}"><img src="{{URL::asset('/images/icons/Aktiviteter.svg')}}" alt="Aktiviteter:"></a></div> <div class="title">{{ $new->subname }}</div> @if($new->resource_id !== null) <div class="header" style="background-size: cover; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $new->resource_id)->first()->filename) }}');"></div> @endif <div class="information">{{ \Illuminate\Support\Facades\Date::createFromTimeStamp(strtotime(\App\Event::query()->where('id', '=', $new->arrangement_id)->first()->date))->format('d/m/Y \k\l\. H:i') }} | {{\App\Event::query()->where('id', '=', $new->arrangement_id)->first()->accountable}} </div> <div class="container"> {!! \App\Helpers::closetags(substr($new->content, 0, 300) ) !!} <div class="row" style="justify-content: space-between; margin-top: 16px; border-top: 1px solid rgba(0, 0, 0, .2);"> @if (count(\App\UserEvent::query()->where('event_id', '=', $new->arrangement_id)->where('user_id', '=', Auth::user()->id)->get()) > 0) <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="javascript:void(0);" onclick="ajaxCall({{ $new->arrangement_id }}, this)" >{{__('msg.afmeld')}}</a> @else {{-- ^ If you're already participating in the event, then show a ´cancel´ button - v Else show a ´participate´ button --}} <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="javascript:void(0);" onclick="ajaxCall({{ $new->arrangement_id }}, this)" >{{__('msg.tilmeld')}}</a> @endif <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="{{route("events.show", ["event" => $new->arrangement_id ])}}">{{__('msg.læsmere')}}</a> <a style="margin: 0; padding: 0; font-weight: 700;" class="sde-blue text-center" href="{{route("events.accountsignups", ["event" => $new->arrangement_id ])}}">{{__('msg.sedeltagere')}}</a> </div> </div> </div> @else<!--Code that prints guides--> <div class="card"> <div class="img"><a href="{{ route('guides.index') }}"><img src="{{URL::asset('/images/icons/Vejledninger.svg')}}" alt="Vejledninger:"></a></div> <div class="title">{{ $new->subname }}</div> @if($new->resource_id !== null) <div class="header" style="background-size: cover; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $new->resource_id)->first()->filename) }}');"></div> @endif <div class="container" style="margin-top: 8px;"> {!! \App\Helpers::closetags(substr($new->content, 0, 300) ) !!} @if ($new->type == 'Guide') {{-- Else if's displaying guides, then show `Læs mere` --}} <div class="row" style="justify-content: center; border-top: 1px solid rgba(0, 0, 0, .2);"> <a style="font-weight: 700;" href="{{route("guides.show", ["guide" => $new->arrangement_id])}}" class="sde-blue">{{__('msg.læsmere')}}</a> </div> @endif {{-- Else if it's a menu or news, then don't show a button at bottom --}} </div> </div> @endif @endforeach @if(count(\App\News::query()->orderBy("created_at", "desc")->get()) == 0) <p class="text-center">{{__('msg.ingennyheder')}}</p> @endif <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); }); } } </script> @endsection