@extends('layouts.master')

@section('title')
    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-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>

        {{-- 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>

                    <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>

                @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 class="col-md-3 col-12 sidebar">
                @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])

                @include('widgets/contact', [])

                <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>

                <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

    <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>
                </div>
            </div>
        </div>
    </section>
@endsection