@extends('layouts.master')

@section('title')
    Home
@endsection


@section('content')
    <div class="clearfix">
        <div class="blog_grid" data-snapto="{}">
            {{-- Desktop --}}
            <div class="grid_view">
                <div class="row">
                    <div class="col-4 col-md-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
                            @if($item = next($news))
                                <div class="post large d-block d-md-none">
                                    <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-8 col-md-6">
                        <div class="row">
                            @php(prev($news))
                            @for($i = 0; ($i < 5) && ($item = next($news)); ++$i)
                                <div class="post small col-6{{$i == 0 ? ' d-none d-md-block' : ''}}{{$i == 4 ? ' d-block d-md-none' : ''}}">
                                    <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 class="post_title"><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>

        {{-- body --}}
        <div class="grey_background">
            <div class="body_container row">
                <div class="col-12">
                    <div class="d-none d-md-block" 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 class="d-none d-md-block" style="width: 728px; height: 90px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
                </div>
                <div class="col-12 col-md content_container">
                    <div class="row">
                        <div class="col-md-6 col-12">
                            <h4 class="box_header"><span>Meer nieuws</span></h4>
                            <div class="box full-width">
                                @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 full-width">
                                @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"], "url": "/nieuws"}'>
                                <span class="fas fa-spinner fa-spin" id="loading"></span>
                                Klik hier voor meer nieuws
                            </a>
                        </div>
                    </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-12 col-md-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-12 col-md-6">
                                    <h2 class="post_title"><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 class="clipText clipText-7" title="{{strip_tags($podcast->content)}}">
                                        {!!$podcast->content!!}
                                    </p>
                                </div>
                            </div>
                        </div>
                    @endif
                </div>

                <div class="col-12 col-md-auto 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 small"><span>Fragment gemist</span></h4>
                        <div class="box">
                            @include('partial/podcastitems', ['showTime' => false, 'showImage' => false, 'podcasts' => $podcasts])
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection