Ekapp/skolehjem/resources/views/app/news/index.blade.php

242 lines
12 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@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: #36393F;
@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;
@if(request()->cookie("mode") == "dark")
background-color: #202225;
@else
background-color: rgba(240,240,240,0.8);
@endif
border-bottom: 1px solid rgba(0, 0, 0, .1);
width: 100%;
height: 25px;
}
.information2{
text-align: center;
@if(request()->cookie("mode") == "dark")
background-color: #202225;
@else
background-color: rgba(240,240,240,0.8);
@endif
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-position: center; 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-position: center; 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-position: center; background-image: url('{{ asset(\App\Resource::query()->where("id", "=", $new->resource_id)->first()->filename) }}');"></div>
<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; padding-top: 12px; 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>
@else
<div class="container">
{!! \App\Helpers::closetags(substr($new->content, 0, 300) ) !!}
<div class="information2">{{ \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="row" style="justify-content: space-between; padding-top: 12px; 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>
@endif
</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-position: center; 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; padding-top: 12px; 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