NH_Gooi/nhgooi.nl
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

Home page and news page are finished

Browse Source
This commit is contained in:
Jorit Tijsen
2024-03-13 12:37:09 +01:00
parent 55aa88c0f6
commit 2895ba283b
58 changed files with 3713 additions and 31764 deletions
Download Patch File Download Diff File Expand all files Collapse all files

435
resources/views/home.blade.php
View File

@@ -1,269 +1,208 @@
@extends('layouts.master')
@section('title')
NH Gooi - Nieuws
NH Gooi - Nieuws
@endsection
@section('content')
{{-- Nieuws komt met 15 berichten per pagina. Deel op in (1 + 3) in de kop,
1 x 2-breed en de rest 3-breed. --}}
<div class="page_layout page_margin_top clearfix">
<div class="row">
<div class="column column_1_1">
<div class="blog_grid">
{{-- Desktop --}}
<div class="grid_view">
<div class="row">
<div class="col-8">
@if($item = current($news))
<div class="post large">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}' alt='img'>
</a>
<div class="slider_content_box">
<ul class="post_details simple">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}" href="{{route('nieuws.regio', ['region' => $item->region->slug])}}" class="over_image">{{$item->region->title}}</a>
</li>
@endif
</ul>
<h2><a href="{{url($item->url)}}" title="{{$item->title}}">{!!$item->title!!}</a></h2>
</div>
</div>
@endif
</div>
<div class="col-4">
<div class="row">
@for($i = 0; ($i < 4) && ($item = next($news)); ++$i)
<div class="post small col-6">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}' alt='img'>
</a>
<div class="slider_content_box">
<ul class="post_details simple">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}" href="{{route('nieuws.regio', ['region' => $item->region->slug])}}" class="over_image">{{$item->region->title}}</a>
</li>
@endif
</ul>
<h5><a href="{{url($item->url)}}" title="{{$item->title}}">{!!$item->title!!}</a></h5>
</div>
</div>
@endfor
</div>
</div>
</div>
</div>
{{-- Mobile --}}
<div class="slider_view">
<div class="caroufredsel_wrapper caroufredsel_wrapper_slider">
<ul class="slider id-small_slider">
@foreach($news as $item)
@if($loop->index > 3) @break @endif
<li class="slide">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}' alt='img'>
</a>
<div class="slider_content_box">
<ul class="post_details simple">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}" href="{{url('nieuws/regio/' . $item->region->slug)}}" class="over_image">{{$item->region->title}}</a>
</li>
@endif
</ul>
<h2 style="display:none;"><a href="{{url($item->url)}}" title="{{$item->title}}">{{Formatter::excerpt($item->title, 50)}}</a></h2>
<h5><a href="{{url($item->url)}}" title="sfd">{!!$item->title!!}</a></h5>
{{-- Nieuws komt met 15 berichten per pagina. Deel op in (1 + 3) in de kop,
1 x 2-breed en de rest 3-breed. --}}
<div class="page_layout page_margin_top clearfix">
<div class="row">
<div class="column column_1_1">
<div class="blog_grid">
{{-- Desktop --}}
<div class="grid_view">
<div class="row">
<div class="col-6">
@if($item = current($news))
<div class="post large">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
alt='img'>
</a>
<div class="slider_content_box">
<ul class="post_details simple">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}"
href="{{route('nieuws.regio', ['region' => $item->region->slug])}}"
class="over_image">{{$item->region->title}}</a>
</li>
@endif
</ul>
<h2><a href="{{url($item->url)}}"
title="{{$item->title}}">{!!$item->title!!}</a></h2>
<?php
$time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
$time .= ' | bijgewerkt: '
. ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
. ' ' . $item->edited->format('H:i') . ' uur';
}
?>
<span class="post_date" title="{{$time}}">
<i class="fa-regular fa-clock"></i> {{$time}}
</span>
</div>
</div>
@endif
</div>
<div class="col-6">
<div class="row">
@for($i = 0; ($i < 4) && ($item = next($news)); ++$i)
<div class="post small col-6">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
alt='img'>
</a>
<div class="slider_content_box">
<ul class="post_details simple">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}"
href="{{route('nieuws.regio', ['region' => $item->region->slug])}}"
class="over_image">{{$item->region->title}}</a>
</li>
@endif
</ul>
<h5><a href="{{url($item->url)}}"
title="{{$item->title}}">{!!$item->title!!}</a></h5>
<?php
$time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
$time .= ' | bijgewerkt: '
. ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
. ' ' . $item->edited->format('H:i') . ' uur';
}
?>
<span class="post_date" title="{{$time}}">
<i class="fa-regular fa-clock"></i> {{$time}}
</span>
</div>
</div>
@endfor
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
@endforeach
</ul>
</div>
<div id="small_slider" class='slider_posts_list_container small'>
</div>
</div>
</div>
</div>
</div>
{{-- body --}}
<div class="row body_container">
<div class="col-md-9 col-12">
<div class="row">
<div class="col-md-6 col-12">
<h4 class="box_header"><span>Meer nieuws</span></h4>
<div class="box">
@include('partial/newslist_small', ['id' => 'items-more-news', 'news' => array_slice($news, 5, 5)])
</div>
</div>
{{-- Meer nieuws --}}
<div class="row page_margin_top">
<div class="column column_2_3">
<h4 class="box_header">Meer nieuws</h4>
@foreach(array_slice($news, 4, 2) as $item)
@if($loop->index % 2 == 0)
<div class="row">
@endif
<div class="column column_1_2">
<ul class="blog">
<li class="post">
<a href="{{url($item->url)}}" title="{{$item->title}}">
@if($item->video)
<span class="icon video"></span>
@elseif($item->images && count($item->images) > 1)
<span class="icon gallery"></span>
@endif
<img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}' alt='img'>
</a>
<h2><a href="{{url($item->url)}}" title="{{$item->title}}">{!!$item->title!!}</a></h2>
<ul class="post_details">
@if($item->region)
<li class="category">
<a title="Regio: {{$item->region->title}}" href="{{url('nieuws/regio/' . $item->region->slug)}}">{{$item->region->title}}</a>
</li>
@endif
@if($item->theme)
<li class="category">
<a title="Thema: {{$item->theme->title}}" href="{{url('nieuws/thema/' . $item->theme->slug)}}">{{$item->theme->title}}</a>
</li>
@endif
36 @if($item->edited && ($item->edited != $item->published))
<li class="date edited">
Bijgewerkt
@if($item->edited->format('d m') != $item->published->format('d m'))
op {{Formatter::relativeDate($item->edited)}}
@endif
om {{$item->edited->format('H:i')}} uur
</li>
@else
<li class="date">
{{Formatter::relativeDate($item->published)}} om {{$item->published->format('H:i')}} uur
</li>
@endif
</ul>
<p>{{Formatter::excerpt($item->content, 150)}}</p>
<a class="read_more" href="{{url($item->url)}}" title="Lees verder"><span class="arrow"></span><span>Lees verder...</span></a>
</li>
</ul>
</div>
@if($loop->index % 2 == 1)
</div>
@endif
@endforeach
<div class="col-md-6 col-12">
<h4 class="box_header"><span>Meest gelezen</span></h4>
<div class="box">
@include('partial/newslist_small', ['id' => 'items-most-read', 'news' => $populair])
</div>
</div>
</div>
<div class="row mb-4">
<div class="col-12">
<a class="btn auto_width" id="meer-nieuws" href="#"
data-loadmorenews='{"container":["#items-more-news", "#items-most-read"]}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
</div>
</div>
<div style="width: 100%; font-family: Nunito,serif;font-size: 12px;font-weight: 500;line-height: 3.17;text-align: center;color: #666;">
- Advertentie -
</div>
<div style="width: 100%;height: 90px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
<div id="items">
@include('partial/newslist_small', ['news' => array_slice($news, 6, count($news))])
</div>
@if ($podcast)
<?php $url = route('gemist.fragment') . $podcast->url; ?>
<h4 class="box_header"><span>Uitgelicht</span></h4>
<div class="box featured">
<div class="row">
<div class="col-6">
<a href="{{$url}}" title="{{$podcast->title}}">
<img src="{{$podcast->image && $podcast->image->url ? $imgBase . $podcast->image->url : '/images/noimage.png'}}"/>
</a>
</div>
<div class="col-6">
<h2><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->title!!}</a></h2>
<div class="sub_title">
@if ($podcast->program)
<a class="program_name" href="{{ route('programma') . $podcast->program->url }}"
title="{{$podcast->program->name}}">{{$podcast->program->name}}</a>
@endif
<span class="post_date" title="{{Formatter::relativeDate($podcast->created)}}">
<i class="fa-regular fa-clock"></i> {{Formatter::relativeDate($podcast->created)}}
</span>
</div>
<p>
{!!$podcast->content!!}
</p>
</div>
</div>
</div>
@endif
</div>
<div>
<button class="more page_margin_top" type="button" id='meer-nieuws'>
<span class="fa-2x fas fa-spinner fa-spin" id="loading"></span>
LAAD MEER NIEUWSBERICHTEN
</button>
</div>
</div>
<div class="col-md-3 col-12 sidebar">
@include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
<div class="column column_1_3">
@include('widgets.banners')
@include('widgets/contact', [])
{{--
<h4 class="box_header"><span class="fa fa-fire"></span> &nbsp; Meest gelezen</h4>
@include('widgets.populairnieuws')
--}}
<div style="width: 100%; font-family: Nunito,serif;font-size: 12px;font-weight: 500;line-height: 3.17;text-align: center;color: #666;">
- Advertentie -
</div>
<div style="width: 100%;height: 275px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
@include('widgets.nustraks')
<h4 class="page_margin_top box_header"><span class="fa fa-history"></span> &nbsp; Iets gemist?</h4>
<p><a class="more" href="{{route('gemist.fragment')}}">Fragment gemist</a>
<a class="more" style="margin-top: 2px;" href="{{route('gemist.programma')}}">Programma terugluisteren</a></p>
@if(!$title)
<h4 class="page_margin_top box_header"><span class="fa fa-tag"></span> &nbsp; Recente berichten</h4>
<?php
$regions = [];
$themes = [];
foreach($news as $item) {
if($item->region) $regions[$item->region->slug] = $item->region->title;
if($item->theme) $themes[$item->theme->slug] = $item->theme->title;
}
?>
<ul class="taxonomies clearfix page_margin_top">
@foreach($regions as $slug => $title)
<li><a href="{{route('nieuws.regio', $slug)}}" title="Meer nieuws uit regio {{$title}}"><span class="fa fa-map-marker"></span> Uit {{$title}}</a></li>
@endforeach
@foreach($themes as $slug => $title)
<li class="active"><a href="{{route('nieuws.thema', $slug)}}" title="Meer nieuws met thema {{$title}}"><span class="fa fa-tag"></span> Over {{$title}}</a></li>
@endforeach
</ul>
@endif
</div>
</div>
</div>
<div class="podcast_items">
<h4 class="box_header"><span>Fragment gemist</span></h4>
<div class="box">
@include('partial/podcastitems', ['showTime' => false, 'showImage' => false, 'podcasts' => $podcasts])
</div>
</div>
</div>
</div>
</div>
@endsection
@section('oud')
@if($title) <h2> <a href="{{route('nieuws')}}" title="Terug naar het nieuwsoverzicht" class="btn btn-primary"><i class="icon-arrow-small-left"></i></a> {{$title}} </h2> @endif
@if($title)
<h2><a href="{{route('nieuws')}}" title="Terug naar het nieuwsoverzicht" class="btn btn-primary"><i
class="icon-arrow-small-left"></i></a> {{$title}} </h2>
@endif
<section class="page-content col-lg-8 col-md-12">
<div id="items">
@include('partial/newslistitems', ['news' => $news])
</div>
<div id="loading" style="display: none">
<div class="progress progress-striped active">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" style="width: 100%">
<b>Meer nieuwsberichten ophalen...</b>
<section class="page-content col-lg-8 col-md-12">
<div id="items">
@include('partial/newslistitems', ['news' => $news])
</div>
</div>
</div>
</section>
<div id="loading" style="display: none">
<div class="progress progress-striped active">
<div class="progress-bar" role="progressbar" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"
style="width: 100%">
<b>Meer nieuwsberichten ophalen...</b>
</div>
</div>
</div>
</section>
@endsection
@push('scripts')
<script>
var nextPage = 2;
var isLoading = 0;
var $isLoading = $('#loading').hide();
$('#meer-nieuws').click(function(e) {
e.preventDefault();
if(!isLoading) {
// Set flag and update UI
isLoading = 1;
$isLoading.show();
var $button = $(this).attr("disabled", "disabled");
// Fire request for the next page
$.ajax({ url: document.location.pathname + '?pagina=' + nextPage })
.always(function() {
// Whether success or failure, update the UI again
isLoading = 0;
$isLoading.hide();
$button.removeAttr("disabled");
})
.done(function(data) {
if(!data) {
// When no data was returned, disable the button permanently
page = -1;
$button.attr("disabled", "disabled").text("Geen nieuws meer.");
return;
}
$('#items').append(data);
++nextPage;
});
}
});
</script>
@endpush