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

Added radio page

Browse Source
This commit is contained in:
Jorit Tijsen
2024-03-13 17:44:35 +01:00
parent d445d90069
commit a0baa0230f
40 changed files with 749 additions and 610 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -77,7 +77,7 @@
</li>
@endif
</ul>
<h5><a href="{{url($item->url)}}"
<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');
@@ -144,7 +144,7 @@
</a>
</div>
<div class="col-6">
<h2><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->title!!}</a></h2>
<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 }}"
@@ -164,7 +164,7 @@
</div>
<div class="col-md-3 col-12 sidebar">
@include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
@include('widgets/nhgooiradiotv', ['headerClass' => 'extra-small'])
@include('widgets/contact', [])

13
resources/views/layouts/full.blade.php
View File

@@ -1,16 +1,11 @@
@extends('layouts/master')
@section('page')
<div class="clearfix" style="height: 15px;"></div>
<div class="page_header clearfix page_margin_top">
<div class="page_header_left clearfix page_margin_top">
<h1 class="page_title">@yield('title')</h1>
</div>
<div class="page_header_right">
<div class="page_container @yield('page_class')">
<div class="bread_crumb">
@yield('breadcrumb')
</div>
</div>
<div class="page_layout clearfix">
@yield('content')
<h1 class="page_title">@yield('title')</h1>
@yield('content')
</div>
@endsection

62
resources/views/layouts/sidebar.blade.php
View File

@@ -12,45 +12,47 @@
</div>
<div class="col-4">
@if ((isset($populair) && $populair) || isset($newsItems) && $newsItems)
<div data-tabs>
<div class="tabs">
@section('sidebar')
@if ((isset($populair) && $populair) || isset($newsItems) && $newsItems)
<div data-tabs>
<div class="tabs">
@if (isset($populair) && $populair)
<h4 data-tab-content-id="tab_most_read" class="box_header active"><span>Meest gelezen</span></h4>
@endif
@if (isset($newsItems) && $newsItems)
<h4 data-tab-content-id="tab_more_news" class="box_header"><span>Meer nieuws</span></h4>
@endif
</div>
@if (isset($populair) && $populair)
<h4 data-tab-content-id="tab_most_read" class="box_header active"><span>Meest gelezen</span></h4>
<div id="tab_most_read" class="box tab_content active">
@include('partial/newslist_small', ['id' => 'items-most-read', 'news' => $populair])
<a class="btn auto_width" id="meer-nieuws-most-read" href="#" data-loadmorenews='{"container":["#items-most-read"], "url": "/nieuws/populair?id=items-most-read"}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
</div>
@endif
@if (isset($newsItems) && $newsItems)
<h4 data-tab-content-id="tab_more_news" class="box_header"><span>Meer nieuws</span></h4>
<div id="tab_more_news" class="box tab_content">
@include('partial/newslist_small', ['id' => 'items-more-news', 'news' => $newsItems])
<a class="btn auto_width" id="meer-nieuws-more-news" href="#" data-loadmorenews='{"container":["#items-more-news"], "url": "/nieuws/more?id=items-more-news"}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
</div>
@endif
</div>
@if (isset($populair) && $populair)
<div id="tab_most_read" class="box tab_content active">
@include('partial/newslist_small', ['id' => 'items-most-read', 'news' => $populair])
<a class="btn auto_width" id="meer-nieuws-most-read" href="#" data-loadmorenews='{"container":["#items-most-read"], "url": "/nieuws/populair?id=items-most-read"}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
</div>
@endif
@if (isset($newsItems) && $newsItems)
<div id="tab_more_news" class="box tab_content">
@include('partial/newslist_small', ['id' => 'items-more-news', 'news' => $newsItems])
<a class="btn auto_width" id="meer-nieuws-more-news" href="#" data-loadmorenews='{"container":["#items-more-news"], "url": "/nieuws/more?id=items-more-news"}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
<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>
@endif
</div>
@endif
<div style="width: 100%;height: 275px;margin: 11px auto 50px auto;background-color: #efefef;"></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: 275px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
@include('widgets/nhgooiradiotv', ['headerClass' => 'medium'])
@include('widgets/nhgooiradiotv', ['headerClass' => 'medium'])
@include('widgets/contact', [])
@include('widgets/contact', [])
@show
</div>
</div>

2
resources/views/partial/newslist_small.blade.php
View File

@@ -14,7 +14,7 @@
</a>
</div>
<div class="col-8">
<h2><a href="{{url($item->url)}}"
<h2 class="post_title"><a href="{{url($item->url)}}"
title="{{$item->title}}">{!!$item->title!!}</a></h2>
<?php
$time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');

6
resources/views/partial/podcastitems.blade.php
View File

@@ -3,19 +3,19 @@
<?php $url = route('gemist.fragment') . $podcast->url; ?>
<li class="post">
<div class="post_content">
<h2><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->titleWithoutProgram()!!}</a></h2>
<h2 class="post_title"><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->titleWithoutProgram()!!}</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
<?php /** @var boolean $showTime **/ $time = Formatter::relativeDate($podcast->created) . ($showTime ? ' om ' . $podcast->published->format('H:i') : ''); ?>
<?php $time = Formatter::relativeDate($podcast->created) . (isset($showTime) && $showTime ? ' om ' . $podcast->published->format('H:i') : ''); ?>
<span class="post_date"
title="{{$time}}">
<i class="fa-regular fa-clock"></i> {{$time}}
</span>
</div>
@if($showImage && $podcast->image)
@if(isset($showImage) && $showImage && $podcast->image)
<a href="{{$url}}" title="{{$podcast->title}}" class="fixed-height">
<img src='{{$imgBase . $podcast->image->url}}' alt='{{$podcast->image->title}}'>
</a>

86
resources/views/partial/radioscheduleweek.blade.php
View File

@@ -1,59 +1,29 @@
<div class="schedule">
<div class="timeslots">
<div class="date-header"></div>
@for($h = 0; $h < 24; $h += 1.0)
<div class="time-header">{{$time = gmdate("H:i", $h * 3600)}} uur</div>
@endfor
</div>
@php($date = null)
@php($hour = 0)
@php($now = new \DateTime("now"))
@foreach($schedule as $item)
@php($diff = $item['endtime']->diff($item['starttime']))
@php($duration = $diff->d * 24 + $diff->h + $diff->i / 60)
@php($isCurrent = ($now >= $item['starttime']) && ($now <= $item['endtime']))
@php($class = ($item['program']->priority < 2 ? ' special' : '')
. ($item['program']->nonstop || $item['program']->rerun ? ' non-stop' : '')
. ($isCurrent ? ' current' : ''))
@php($starttime = $item['starttime'])
@while($duration > 0)
@if(($formattedDate = Formatter::fullDate($starttime, 'W d/M')) != $date)
@if($date != null)
</div>
@endif
<div class="date-column">
<div class="date-header">{{$formattedDate}}</div>
@php($date = $formattedDate)
@php($hour = 0)
@endif
@php($durationToday = ($hour + $duration <= 24) ? $duration : (24 - $hour))
<a href="{{route('programma') . $item['program']->url}}" class="program{{$class}}" style="height: {{$durationToday * $pixelsPerHour - 2 * $border - $margin}}px;" title="{{$item['program']->name . ($item['program']->tagline ? "\n" . $item['program']->tagline : "")}}">
<div class="program-title">
@if($isCurrent) <div class="current-marker"><span>On air</span></div> @endif
{{$item['program']->name}}
</div>
<div class="program-content">
<div class="program-times"><span class="fa fa-clock"></span> {{$item['starttime']->format('H:i')}} &ndash; {{$item['endtime']->format('H:i')}}</div>
@if($item['program']->tagline)
<hr/>
<div class="tagline">{{$item['program']->tagline}}</div>
@endif
</div>
</a>
@php($hour += $durationToday)
@php($duration -= $durationToday)
@if($duration > 0)
@php($starttime->add(new \DateInterval('P1D'))->setTime(0, 0, 0))
@endif
@endwhile
@endforeach
</div>
</div>
@php($now = new \DateTime("now"))
@foreach($days as $title => $day)
<div id="tab_radio_items_{{$title}}" class="tab_content{{(!$date && $title == 'today') || ($date && $title == 'custom') ? ' active' : ''}}">
<div class="row">
@if(isset($schedule[$day]) && $schedule[$day])
@foreach($schedule[$day] as $item)
@php($isCurrent = ($now >= $item['starttime']) && ($now <= $item['endtime']))
<div class="col-3">
<a class="box full-width" href="{{route('programma') . $item['program']->url}}"
title="{{$item['program']->name . ($item['program']->tagline ? "\n" . $item['program']->tagline : "")}}">
<div class="program-title">
@if($isCurrent)
<div class="current-marker"><span>On air</span></div>
@endif
{{$item['program']->name}}
</div>
<div class="program-times"><i class="fa-regular fa-clock"></i>
{{$item['starttime']->format('H:i')}} &ndash; {{$item['endtime']->format('H:i')}}
</div>
</a>
</div>
@endforeach
@else
<div class="no-results col-12">Geen resultaten gevonden.</div>
@endif
</div>
</div>
@endforeach

72
resources/views/podcastlist.blade.php
View File

@@ -1,47 +1,47 @@
@extends('layouts/sidebar')
@section('title')
@section('title')
Fragment gemist
@endsection
@section('page_class')post_container @endsection
@section('breadcrumb')
@if(isset($program))
<ul class="bread_crumb">
@if(isset($program))
<li><a title="Fragment gemist" href="{{url('radio/gemist')}}">Fragment gemist</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li>{{$program->name}}</li>
@endif
</ul>
@endsection
@endif
@endsection
@section('content')
@parent
<div id="gemist_tabs" class="no_scroll clearfix">
<ul class="tabs_navigation clearfix">
<li>
<a href="{{route('gemist.programma')}}" title="Programma gemist">
Programma gemist
</a>
<span></span>
</li>
<li class="ui-tabs-active col_1_2"">
<a href="{{route('gemist.fragment')}}" title="Fragment gemist">
Fragment gemist
</a>
<span></span>
</li>
</ul>
<div class="tabs fit_content">
<h4 class="box_header">
<a href="{{route('gemist.programma')}}" title="Programma gemist">
<span>Programma gemist</span>
</a>
</h4>
<h4 class="box_header active">
<a href="{{route('gemist.fragment')}}" title="Fragment gemist">
<span>Fragment gemist</span>
</a>
</h4>
</div>
</div>
@if(isset($program))
@if(isset($program))
<h2>{{$program->name}}</h2>
<p class="align-right">
<a href="{{route('gemist')}}" title="Alle programma's" class="btn btn-info">&larr; Toon alles</a>
<a href="{{route('programma') . $program->url}}" title="{{$program->name}}" class="btn btn-info">Programmainfo</a>
</p>
@else
<p>Hele uitzendingen kunt u binnen twee weken terugluisteren via <a href="{{route('gemist.programma')}}">programma gemist</a>.
<p class="page_body">Hele uitzendingen kunt u binnen twee weken terugluisteren via <a href="{{route('gemist.programma')}}">programma gemist</a>.
@endif
@if($podcasts)
@@ -51,7 +51,7 @@
@include('partial.podcastitems', ['podcasts' => $podcasts])
</div><!--/.row-->
</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%">
@@ -64,28 +64,28 @@
<script>
var page = 1;
var isLoading = 0;
var $items = $('#items');
var $isLoading = $('#loading');
var $items = $('#items');
var $isLoading = $('#loading');
$(function() {
$(window).scroll(function () {
var $this = $(this);
var $this = $(this);
var tweak = 10;
if(!isLoading && (page > 0) && ($this.scrollTop() >= $items.height() - $this.height() - tweak))
{
isLoading = 1;
isLoading = 1;
$isLoading.show();
$.ajax({ url: document.location.pathname + '?pagina=' + (++page) })
.always(function() { isLoading = 0; $isLoading.hide(); })
.done(function(data) {
if(!data) {
if(page > 1) $items.append("<hr /><p>Er zijn geen podcasts (meer).</p>");
page = -1;
.done(function(data) {
if(!data) {
if(page > 1) $items.append("<hr /><p class=\"page_body\">Er zijn geen podcasts (meer).</p>");
page = -1;
return;
}
$newPage = $("<div />").append(data);
$newPage = $("<div />").append(data);
$items.append($newPage);
$newPage.find("audio, video").mediaelementplayer({ stretching: 'responsive' });
$newPage.find("audio, video").mediaelementplayer({ stretching: 'responsive' });
});
}
});
@@ -93,11 +93,11 @@
</script>
@endpush
@else
<p>Er zijn geen fragmenten beschikbaar.</p>
<p class="page_body">Er zijn geen fragmenten beschikbaar.</p>
@endif
@endsection
@push('styles')

54
resources/views/programlist.blade.php
View File

@@ -1,54 +1,54 @@
@extends('layouts/sidebar')
@section('title')
@section('title')
Programma gemist
@endsection
@section('page_class')news_post post_container @endsection
@section('breadcrumb')
@if(isset($program))
<ul class="bread_crumb">
@if(isset($program))
<li><a title="Programma gemist" href="{{route('gemist.programma')}}">Programma gemist</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li>{{$program->name}}</li>
@endif
</ul>
@endsection
@endif
@endsection
@section('content')
@parent
<div id="gemist_tabs" class="no_scroll clearfix">
<ul class="tabs_navigation clearfix">
<li class="ui-tabs-active">
<a href="{{route('gemist.programma')}}" title="Programma gemist">
Programma gemist
</a>
<span></span>
</li>
<li>
<a href="{{route('gemist.fragment')}}" title="Fragment gemist">
Fragment gemist
</a>
<span></span>
</li>
</ul>
<div class="tabs fit_content">
<h4 class="box_header active">
<a href="{{route('gemist.programma')}}" title="Programma gemist">
<span>Programma gemist</span>
</a>
</h4>
<h4 class="box_header">
<a href="{{route('gemist.fragment')}}" title="Fragment gemist">
<span>Fragment gemist</span>
</a>
</h4>
</div>
</div>
<p>U kunt programma's terugluisteren tot twee weken na uitzending. Items blijven onbeperkt beschikbaar via <a href="{{route('gemist.fragment')}}">fragment gemist</a>.</p>
<p class="page_body">U kunt programma's terugluisteren tot twee weken na uitzending. Items blijven onbeperkt beschikbaar via <a href="{{route('gemist.fragment')}}">fragment gemist</a>.</p>
<div class="page_layout clearfix">
<div class="row grid" id="items">
<div class="row" id="items">
@php($i = 0)
@foreach($programs as $program)
@foreach($programs as $program)
@if($i % 2 == 0)
@if($i > 0) </ul><!--/.row--> @endif
<ul class='blog row grid'>
<ul class='blog'>
@endif
<?php $url = route('programma') . $program->program->url; ?>
<?php $endStartDiff = $program->end->diff($program->start);
$duration = 24 * $endStartDiff->d + $endStartDiff->h; ?>
<li class="post card column column_1_2">
<li class="post">
<div class="post_content">
<h2><a href="{{$url}}" title="{{$program->program->name}}">{!!$program->program->name!!}</a></h2>
@if($program->current)
@@ -67,7 +67,7 @@
<p>{!! Formatter::excerpt($program->program->description, 200) !!}</p>
</div>
</li>
@php($i++)
@endforeach
@@ -77,15 +77,15 @@
</div><!--/.row-->
</div>
@endsection
@push('scripts')
<script type="text/javascript">
var $onAirIcon = $('#items .onair span.fa');
setInterval(function() {
setInterval(function() {
$onAirIcon.removeClass('fa-play');
setTimeout(function() {
setTimeout(function() {
$onAirIcon.addClass('fa-play');
}, 500);
}, 1000);

232
resources/views/radioprogram.blade.php
View File

@@ -1,125 +1,123 @@
@extends('layouts/full')
@extends('layouts/sidebar')
@section('title')
{{$program->name}}
{{$program->name}}
@endsection
@section('page_class')grey-background page_container @endsection
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Radioprogrammering" href="{{route('radio.gids')}}">Radioprogrammering</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li>Programma-informatie</li>
</ul>
@endsection
<ul class="bread_crumb">
<li><a title="Radioprogrammering" href="{{route('radio.gids')}}">Radioprogrammering</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>Programma-informatie</li>
</ul>
@endsection
@section('content')
@php($now = new \DateTimeImmutable())
<div class="page_layout page_margin_top clearfix">
<div class="row page_margin_top">
<div class="column column_2_3">
<div class="post single">
<p>{!!$program->description!!}</p>
</div>
</div>
<div class="column column_1_3">
<div id="komende_uitzendingen">
<h4 class="box_header page_margin_top_section">Komende week</h4>
@if(($next = $program->next) && count($next))
<ul class="blog podcasts">
@foreach($next as $n)
<li class="post">
<p class="post_details simple">
<b>{{$n->name}}</b><br/>
@if($n->starts < $now)
Nu te horen tot {{$n->ends->format('H:i')}} uur<br />
<a href="{{ $player = route('luister.live') }}" target="_radioplayer" class="action_button" onclick="window.open('{{$player}}', '_radioplayer','width=400,height=400'); return false;"><span class="fa fa-play"></span> <span>Luister live</span></a>
@break
@else
{{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.
@endif
</p>
</li>
@endforeach
</ul>
@else
<p>Er staat komende week geen uitzending van {{$program->name}} gepland.</p>
@endif
</div>
<div class="clearfix"></div>
<h4 class="box_header page_margin_top_section clearfix">Terugluisteren</h4>
<div class="tabs no_scroll clearfix">
<ul class="tabs_navigation clearfix">
<li>
<a href="#uitzending" title="Uitzendingen">
Uitzending
</a>
<span></span>
</li>
<li>
<a href="#fragmenten" title="Contact">
Fragmenten
</a>
<span></span>
</li>
</ul>
<div id="uitzending">
<div class="clearfix"></div>
<p>U kunt uitzendingen tot twee weken geleden terugluisteren. <a href="#fragmenten">Fragmenten</a> blijven onbeperkt beschikbaar.</p>
@if(($recent = $program->recent) && count($recent))
<ul class="blog podcasts">
@foreach($recent as $r)
@php($duration = $r->ends->diff($r->starts)->h)
<li class="post">
<p class="post_details simple">
<b>{{$r->name}}</b><br/>
{{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur. <br />
@if($r->rerun || $r->nonstop)
<span title="U kunt geen herhalingen en non-stopuitzendingen terugluisteren."><span class="action_button disabled"><span class="fa fa-play"></span> <span>Luister terug</span></a>
@else
<a href="{{$url = route('luister.programma') . '/' . $r->starts->format('Y/m/d/H') . '/' . $duration}}" class="action_button player"><span class="fa fa-play"></span> <span>Luister terug</span></a>
@endif
</p>
</li>
@endforeach
</ul>
@endif
</div>
<div id="fragmenten">
<div class="clearfix"></div>
<p>Fragmenten uit dit programma, zoals interviews, vindt u onder "Radio &ndash; Fragment gemist".</p>
<p>
<a href="{{ route('gemist.programma') . $program->url }}" class="action_button">
<span class="fa fa-list"></span>
<span>Bekijk alle fragmenten</span>
</a>
</p>
</div>
</div>
<div id="contact">
@if($program->email)
<h4 class="box_header page_margin_top_section">Contact</h4>
<p><a href="mailto:{{$program->email}}@nhgooi.nl" class="action_button">
<span class="fa fa-envelope"></span>
<span>{{$program->email}}@nhgooi.nl</a>
</a></p>
@endif
</div>
@if(($hosts = $program->hosts) && count($hosts))
<ul class="list">
@foreach($hosts as $host)
<li class="bullet style_2">{{ Html::mailto($host->email . '@nhgooi.nl', $host->name) }}</li>
@endforeach
</ul>
@endif
</div><!--./left_content-->
</div><!--./col-->
</div><!--./row-->
</div><!--./row-->
</div>
</div>
</div>
<p class="page_body">{!!$program->description!!}</p>
@endsection
@section('sidebar')
@php($now = new \DateTimeImmutable())
<div id="komende_uitzendingen">
<h4 class="box_header"><span>Komende week</span></h4>
@if(($next = $program->next) && count($next))
<div class="box full-width">
<ul class="blog podcasts">
@foreach($next as $n)
<li class="post">
<p class="post_details simple">
<span class="post_title">{{$n->name}}</span>
@if($n->starts < $now)
<span class="post_date" title="Nu te horen tot {{$n->ends->format('H:i')}} uur.">
<i class="fa-regular fa-clock"></i> Nu te horen tot {{$n->ends->format('H:i')}} uur.
</span> <br />
<a href="{{ $player = route('luister.live') }}" target="_radioplayer"
class="action_button"
onclick="window.open('{{$player}}', '_radioplayer','width=400,height=400'); return false;"><span
class="fa fa-play"></span> <span>Luister live</span></a>
@break
@else
<span class="post_date" title="{{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.">
<i class="fa-regular fa-clock"></i> {{ Formatter::relativeDate( $n->starts, 'W d m' ) }} om {{ $n->starts->format('H:i') }} uur.
</span>
@endif
</p>
</li>
@endforeach
</ul>
</div>
@else
<p class="page_body">Er staat komende week geen uitzending van {{$program->name}} gepland.</p>
@endif
</div>
<div class="clearfix"></div>
<h4 class="box_header"><span>Terugluisteren</span></h4>
<div data-tabs>
<div class="tabs fit_content">
<h4 data-tab-content-id="tab_broadcast" class="box_header active"><span>Uitzending</span></h4>
<h4 data-tab-content-id="tab_fragments" class="box_header"><span>Fragmenten</span></h4>
</div>
<div id="tab_broadcast" class="box tab_content active">
<p class="page_body">U kunt uitzendingen tot twee weken geleden terugluisteren. <a href="#fragmenten">Fragmenten</a> blijven
onbeperkt beschikbaar.</p>
@if(($recent = $program->recent) && count($recent))
<ul class="blog podcasts">
@foreach($recent as $r)
@php($duration = $r->ends->diff($r->starts)->h)
<li class="post">
<p class="post_details simple">
<span class="post_title">{{$r->name}}</span>
<span class="post_date" title="{{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur.">
<i class="fa-regular fa-clock"></i> {{ Formatter::relativeDate( $r->starts, 'W d m' ) }} om {{ $r->starts->format('H:i') }} uur.
</span>
@if($r->rerun || $r->nonstop)
<span title="U kunt geen herhalingen en non-stopuitzendingen terugluisteren."><span
class="action_button disabled"><span class="fa fa-play"></span> <span>Luister terug</span></a>
@else
<a href="{{$url = route('luister.programma') . '/' . $r->starts->format('Y/m/d/H') . '/' . $duration}}"
class="action_button player"><span class="fa fa-play"></span> <span>Luister terug</span></a>
@endif
</p>
</li>
@endforeach
</ul>
@endif
</div>
<div id="tab_fragments" class="box tab_content">
<div class="clearfix"></div>
<p class="page_body">Fragmenten uit dit programma, zoals interviews, vindt u onder "Radio &ndash; Fragment gemist".</p>
<p>
<a href="{{ route('gemist.programma') . $program->url }}" class="action_button">
<span class="fa fa-list"></span>
<span>Bekijk alle fragmenten</span>
</a>
</p>
</div>
</div>
<div id="contact">
@if($program->email)
<h4 class="box_header page_margin_top_section">Contact</h4>
<p><a href="mailto:{{$program->email}}@nhgooi.nl" class="action_button">
<span class="fa fa-envelope"></span>
<span>{{$program->email}}@nhgooi.nl</a>
</a></p>
@endif
</div>
@if(($hosts = $program->hosts) && count($hosts))
<ul class="list">
@foreach($hosts as $host)
<li class="bullet style_2">{{ Html::mailto($host->email . '@nhgooi.nl', $host->name) }}</li>
@endforeach
</ul>
@endif
</div><!--./left_content-->
</div><!--./col-->
</div><!--./row-->
</div><!--./row-->
@endsection

312
resources/views/radioschedule.blade.php
View File

@@ -1,227 +1,117 @@
<?php
$pixelsPerHour = 30;
$border = 1;
$margin = 2;
<?php
$pixelsPerHour = 30;
$border = 1;
$margin = 2;
?>
@extends('layouts/full')
@section('title')
Radioprogrammering
@section('breadcrumb')
<ul class="bread_crumb">
<li>Radioprogrammering</li>
</ul>
@endsection
@section('title')
Radioprogrammering
@endsection
@section('content')
<nav>
<ul class="pager">
<li class="action_button previous-week"><a href="{{route('radio.gids', ($shift - 1))}}">&larr; Week eerder</a></li>
<li class="action_button current-week"><a href="{{route('radio.gids')}}">Deze week</a></li>
<li class="action_button next-week"><a href="{{route('radio.gids', ($shift + 1))}}">Week later &rarr;</a></li>
</ul>
</nav>
<div id="loading" style="display: none; height: 300px;">
<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>Programmaschema ophalen...</b>
</div>
<div data-tabs>
<nav>
<div class="tabs fit_content">
<h4 data-tab-content-id="tab_radio_items_day_before_yesterday" class="box_header small">
<span>Eergisteren</span>
</h4>
<h4 data-tab-content-id="tab_radio_items_yesterday" class="box_header small">
<span>Gisteren</span>
</h4>
<h4 data-tab-content-id="tab_radio_items_today" class="box_header small{{$date ? '' : ' active'}}">
<span>Vandaag</span>
</h4>
<h4 data-tab-content-id="tab_radio_items_tomorrow" class="box_header small">
<span>Morgen</span>
</h4>
<h4 data-tab-content-id="tab_radio_items_day_after_tomorrow" class="box_header small">
<span>overmorgen</span>
</h4>
<div class="input_container" style="margin: 5px 0 0 20px;">
<div class="input_prefix">Dag</div>
<input id="custom_date" type="text" style="width: 100px;" value="{{ $date ?? (new DateTime())->format('d-m-Y') }}"/>
<div id="custom_date_icon" class="input_postfix"><i class="fa-solid fa-calendar-days"></i></div>
</div>
</div>
</nav>
<div id="loading" style="display: none; height: 300px;">
<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>Programmaschema ophalen...</b>
</div>
</div>
</div>
<div id='schedule'>
@include('partial/radioscheduleweek', ['schedule' => $schedule, 'days' => $days, 'date' => $date])
</div>
</div>
</div>
<div id='schedule'>
@include('partial/radioscheduleweek', ['schedule' => $schedule])
</div>
<nav>
<ul class="pager">
<li class="action_button previous-week"><a href="{{route('radio.gids', ($shift - 1))}}">&larr; Week eerder</a></li>
<li class="action_button current-week"><a href="{{route('radio.gids')}}">Deze week</a></li>
<li class="action_button next-week"><a href="{{route('radio.gids', ($shift + 1))}}">Week later &rarr;</a></li>
</ul>
</nav>
@endsection
@push('styles')
<style>
.pager {
display: flex;
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
}
<style>
.schedule .time-header {
height: {{$pixelsPerHour}}px;
}
.pager .previous-week,
.pager .current-week,
.pager .next-week {
flex: 1;
}
.pager .current-week {
text-align: center;
}
.pager .next-week {
text-align: right;
}
@media (max-width: 992px) { /* smaller than desktop */
.schedule {
display: block;
}
.schedule .time-header {
display: none;
}
.schedule .date-header {
font-size: 150%;
font-weight: bold;
height: auto;
margin-top: 15px;
}
.schedule a.program {
/* override the style="height.." */
height: auto !important;
margin-left: 15px !important;
margin-bottom: 3px !important;
}
.schedule .program .program-content {
font-size: 90%;
}
.schedule .program.non-stop .program-title {
background-color: #8F9BA6;
}
}
@media (min-width: 992px) { /* desktop */
.schedule {
display: flex;
}
.schedule .date-header {
height: 3em;
text-align: center;
font-size: 120%;
vertical-align: bottom;
}
.schedule .program .program-content {
display: none;
}
.schedule .program .program-title {
display: block;
height: 100%;
}
.schedule .program.non-stop .program-title {
background-color: transparent;
color: #8F9BA6;
}
}
.schedule {
color: black;
width: 100%;
}
.schedule .time-header {
height: {{$pixelsPerHour}}px;
}
.schedule .timeslots {
width: 80px;
min-width: 80px;
}
.schedule .date-column {
flex: 1;
}
.schedule a.program {
display: block;
color: black;
text-decoration: none;
margin: {{$margin}}px;
border: solid {{$border}}px #03A6E0;
border-radius: 2px;
overflow: hidden;
}
.schedule a.program:hover {
color: white;
background-color: #71c1de;
}
.schedule .program.current {
border-color: #BD0013;
}
.schedule .program .program-times {
text-align: center;
margin: 3px;
}
.schedule .program.current .program-title {
background-color: #71c1de;
color: white;
}
.schedule .program.non-stop {
border-color: #6C757D;
}
.schedule .program.special {
color: #03A6E0;
}
.schedule .program .current-marker {
margin: 5px;
text-align: center;
}
.schedule .program .current-marker span {
padding: 3px;
color: white;
text-align: center;
background-color: #BD0013;
border-radius: 3px;
}
.schedule .program .program-title {
padding: 5px;
color: white;
font-weight: bold;
background-color: #03A6E0;
}
.schedule .program .program-content {
margin: 3px;
text-align: center;
}
.schedule .program hr {
margin: 3px;
border: none;
border-top: 1px solid #03A6E0;
border-radius: 5px;
}
</style>
.schedule a.program {
margin: {{$margin}}px;
border: solid {{$border}}px #03A6E0;
}
</style>
<link href="https://cdn.jsdelivr.net/npm/air-datepicker@3.5.0/air-datepicker.min.css" rel="stylesheet">
@endpush
@push('scripts')
<script type="text/javascript">
function scrollToMiddle($elt) {
if($elt.length == 0) { return; }
var elem_position = $elt.offset().top;
var window_height = $(window).height();
var y = elem_position - window_height / 2;
window.scrollTo(0,y);
}
$(function() { scrollToMiddle($(".current-marker")); });
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.30.1/moment.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/air-datepicker@3.5.0/air-datepicker.min.js"></script>
<script type="text/javascript">
new AirDatepicker('#custom_date', {
locale: {
days: ['zondag', 'maandag', 'dinsdag', 'woensdag', 'donderdag', 'vrijdag', 'zaterdag'],
daysShort: ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za'],
daysMin: ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za'],
months: ['Januari', 'Februari', 'Maart', 'April', 'Mei', 'Juni', 'Juli', 'Augustus', 'September', 'Oktober', 'November', 'December'],
monthsShort: ['Jan', 'Feb', 'Mrt', 'Apr', 'Mei', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dec'],
today: 'Vandaag',
clear: 'Legen',
dateFormat: 'dd-MM-yyyy',
timeFormat: 'HH:mm',
firstDay: 0
},
selectedDates: [new Date()],
autoClose: true,
onSelect: function onSelect(fd, date, inst) {
getCustomProgramDate();
}
});
$('#custom_date_icon').click(function(){
$('#custom_date').focus();
});
$('#custom_date').on('change, keyup', function(){
getCustomProgramDate()
});
function getCustomProgramDate()
{
if (moment($('#custom_date').val(), 'DD-MMM-YYYY').isValid()) {
$('#tab_radio_items_custom .row').html('<span class="loading"><span class="fas fa-spinner fa-spin"></span>Laden...</span>')
$('.box_header, .tab_content').removeClass('active');
$('#tab_radio_items_custom').addClass('active');
$.get(document.location.href + '/' + $('#custom_date').val()).done(function (data) {
data = '<div>' + data + '</div>';
$('#tab_radio_items_custom').html($(data).find('#tab_radio_items_custom').html());
});
}
}
</script>
@endpush

43
resources/views/widgets/nhgooiradiotv.blade.php
View File

@@ -1,15 +1,30 @@
<div class="tabs">
<h4 class="box_header {{$headerClass ?? ''}} active"><span>NH Gooi Radio live</span></h4>
<h4 class="box_header {{$headerClass ?? ''}}"><span>NH Gooi TV live</span></h4>
</div>
<div class="box radio_box">
<img class="logo-radio" src="/images/logo-radio.png"/>
<h2>Muziek & Informatie</h2>
<span class="post_date">
<i class="fa-regular fa-clock"></i> 02:00 - 20:00
</span>
<p>Non-stop muziekmix en regionieuws</p>
<a class="btn" href="#">Contact de studio</a>
<a class="btn" href="#">Luister live</a>
<a class="btn" href="#">Kijk live mee</a>
<div data-tabs>
<div class="tabs">
<h4 data-tab-content-id="tab_gooi_radio_live" class="box_header {{$headerClass ?? ''}} active"><span>NH Gooi Radio live</span>
</h4>
<h4 data-tab-content-id="tab_gooi_tv_live" class="box_header {{$headerClass ?? ''}}">
<span>NH Gooi TV live</span></h4>
</div>
<div id="tab_gooi_radio_live" class="tab_content active box radio_box">
<img class="logo-radio" src="/images/logo-radio.png"/>
<h2 class="post_title">Muziek & Informatie</h2>
<span class="post_date">
<i class="fa-regular fa-clock"></i> 02:00 - 20:00
</span>
<p>Non-stop muziekmix en regionieuws</p>
<a class="btn" href="#">Contact de studio</a>
<a class="btn" href="#">Luister live</a>
<a class="btn" href="#">Kijk live mee</a>
</div>
<div id="tab_gooi_tv_live" class="tab_content box radio_box">
<img class="logo-radio" src="/images/logo-radio.png"/>
<h2 class="post_title">Muziek & Informatie</h2>
<span class="post_date">
<i class="fa-regular fa-clock"></i> 02:00 - 20:00
</span>
<p>Non-stop muziekmix en regionieuws</p>
<a class="btn" href="#">Contact de studio</a>
<a class="btn" href="#">Luister live</a>
<a class="btn" href="#">Kijk live mee</a>
</div>
</div>