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

Styled pages missed program and fragment missed

Browse Source
This commit is contained in:
Jorit Tijsen
2024-03-15 17:46:43 +01:00
parent eaea761366
commit 5187062cb1
19 changed files with 678 additions and 376 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
app/Http/Controllers/Controller.php
View File

@@ -131,6 +131,19 @@ class Controller extends BaseController
return json_decode(file_get_contents($this->API_URL . $url, false, stream_context_create($arrContextOptions)));
}
protected function checkAPI($url)
{
return $this->get_http_response_code($this->API_URL . $url);
}
protected function get_http_response_code($url)
{
$headers = get_headers($url);
return substr($headers[0], 9, 3);
}
protected static function JsonToDateTime($obj)
{
return new \DateTime($obj->date, new \DateTimeZone($obj->timezone));

2
app/Http/Controllers/PodcastController.php
View File

@@ -15,7 +15,7 @@ class PodcastController extends Controller
$action = 'programma/' . (int)$programma;
$viewData['program'] = new \Model\Program($this->API('programma/details/' . (int)$programma));
}
return $this->getPodcastList($request, $action, $viewData);
}

15
app/Http/Controllers/RadioController.php
View File

@@ -53,8 +53,12 @@ class RadioController extends Controller
return view('radioprogram', ['program' => new \Model\Program($apiResult)]);
}
public function podcast(Request $request, $id)
public function podcast(Request $request, $id, $title = '')
{
if($this->checkAPI('podcast/details/' . (int)$id) != "200"){
return view('podcastitem', array_merge($this->getSidebareData(), ['title' => $title, 'podcast' => null, 'metadata' => null, 'related' => [], 'searchURL' => 'gemist/zoeken']));
}
parent::registerView($request, 'podcast', $id);
$apiResult = $this->API('podcast/details/' . (int)$id);
$podcast = new \Model\Podcast($apiResult);
@@ -69,7 +73,7 @@ class RadioController extends Controller
}
}
return view('podcastitem', array_merge($this->getSidebareData(), ['podcast' => $podcast, 'metadata' => $podcast->metadata, 'related' => $related, 'searchURL' => 'gemist/zoeken']));
return view('podcastitem', array_merge($this->getSidebareData(), ['title' => $title, 'podcast' => $podcast, 'metadata' => $podcast->metadata, 'related' => $related, 'searchURL' => 'gemist/zoeken']));
}
public function podcasts(Request $request, $programma = null)
@@ -93,7 +97,8 @@ class RadioController extends Controller
{
$programs = [];
$now = new \DateTimeImmutable('2 minutes ago');
$apiResult = $this->API('programma/schema/recent');
$page = (int)$request->get('pagina', 1);
$apiResult = $this->API('programma/schema/recent?pagina=' . (int)max(1, $page) . '&aantal=12');
foreach($apiResult->schedule as $item) {
if(!$item->program->nonstop && !$item->program->rerun) {
$item->start = self::JsonToDateTime($item->start);
@@ -104,7 +109,7 @@ class RadioController extends Controller
}
}
return view('programlist', array_merge($this->getSidebareData(), ['programs' => array_reverse($programs)]));
return view($request->ajax() ? 'partial/programitems' : 'programlist', ['programs' => array_reverse($programs)]);
}
private function getPodcastList(Request $request, $action, $viewData = [])
@@ -117,7 +122,7 @@ class RadioController extends Controller
$podcasts[] = new \Model\Podcast($podcast);
}
return view($request->ajax() ? 'partial.podcastitems' : 'podcastlist', array_merge($viewData, ['podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken']));
return view($request->ajax() ? 'partial/podcastitems' : 'podcastlist', array_merge($viewData, ['id' => 'items-podcasts', 'podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken']));
}
}

56
public/css/style.css vendored
View File

@@ -545,7 +545,8 @@ body {
}
.sidebar .box {
width: calc(100% - 38px);
width: calc(100% - 43px);
padding: 20px 23px 20px 20px;
}
.radio_box {
@@ -676,6 +677,11 @@ body {
padding: 0;
list-style: none;
}
.podcast_items ul.row {
margin-top: calc(-1 * var(--bs-gutter-y));
margin-right: calc(-0.5 * var(--bs-gutter-x));
margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.podcast_items ul li {
margin-bottom: 25px;
}
@@ -933,7 +939,6 @@ body {
.action_button {
text-decoration: none;
color: #282828;
margin-right: 20px;
}
.action_button .fa {
margin-right: 10px;
@@ -1063,4 +1068,51 @@ body {
border: none;
}
.clipText {
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
.clipText-1 {
-webkit-line-clamp: 1;
}
.clipText-2 {
-webkit-line-clamp: 2;
}
.clipText-3 {
-webkit-line-clamp: 3;
}
.clipText-4 {
-webkit-line-clamp: 4;
}
.clipText-5 {
-webkit-line-clamp: 5;
}
.clipText-6 {
-webkit-line-clamp: 6;
}
.clipText-7 {
-webkit-line-clamp: 7;
}
.clipText-8 {
-webkit-line-clamp: 8;
}
.clipText-9 {
-webkit-line-clamp: 9;
}
.clipText-10 {
-webkit-line-clamp: 10;
}
/*# sourceMappingURL=style.css.map */

2
public/css/style.css.map
View File

File diff suppressed because one or more lines are too long

12
resources/assets/sass/base/_base.scss vendored
View File

@@ -8,3 +8,15 @@
.mejs__overlay-button {
border: none;
}
.clipText {
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
@for $i from 1 through (10) {
.clipText-#{$i} {
-webkit-line-clamp: $i;
}
}

1
resources/assets/sass/components/_page.scss vendored
View File

@@ -15,7 +15,6 @@
.action_button {
text-decoration: none;
color: #282828;
margin-right: 20px;
.fa {
margin-right: 10px;

5
resources/assets/sass/components/_podcast_items.scss vendored
View File

@@ -3,6 +3,11 @@
.podcast_items {
ul {
@include reset-list;
&.row {
margin-top: calc(-1* var(--bs-gutter-y));
margin-right: calc(-.5* var(--bs-gutter-x));
margin-left: calc(-.5* var(--bs-gutter-x));
}
li {
margin-bottom: 25px;

2
resources/views/layouts/master.blade.php
View File

@@ -152,7 +152,7 @@
<script type="text/javascript">
$(window).resize(function () {
// Fix sticky for mobile menu indicator
menu_position = $(".menu_container").offset().top;
// menu_position = $(".menu_container").offset().top;
});
$(window).scroll(function () {

3
resources/views/listen.blade.php
View File

@@ -123,6 +123,9 @@
.now-playing-header {
width: 100%;
}
.action_button {
margin-right: 20px;
}
</style>
@endpush

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

@@ -1,9 +1,31 @@
<ul>
@foreach($podcasts as $podcast)
<?php
$li = array_merge([
'class' => '',
'style' => ''
], $li ?? []);
$content = array_merge([
'class' => '',
'style' => '',
], $content ?? []);
$ul = array_merge([
'class' => ''
], $ul ?? []);
$body = array_merge([
'show' => false,
'class' => ''
], $body ?? []);
$actionButton = array_merge([
'class' => ''
], $actionButton ?? []);
?>
<ul id="{{$id ?? ''}}" class="{{$ul['class']}}">
@foreach($podcasts as $podcast)
<?php $url = route('gemist.fragment') . $podcast->url; ?>
<li class="post">
<div class="post_content">
<h2 class="post_title"><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->titleWithoutProgram()!!}</a></h2>
<li style="{{$li['style']}}" class="post {{$li['class']}}">
<div style="{{$content['style']}}" class="post_content {{$content['class']}}">
<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 }}"
@@ -20,6 +42,16 @@
<img src='{{$imgBase . $podcast->image->url}}' alt='{{$podcast->image->title}}'>
</a>
@endif
@if($body['show'])
<p class="post_body {{$body['class']}}">
{!!$podcast->content!!}
</p>
@endif
@if(isset($showAction) && $showAction)
<div class="action_button {{$actionButton['class']}}">
<a class="btn" href="{{$url}}">Luister fragment</a>
</div>
@endif
</div>
</li>

67
resources/views/partial/programitems.blade.php Normal file
View File

@@ -0,0 +1,67 @@
<?php
$li = array_merge([
'class' => '',
'style' => ''
], $li ?? []);
$content = array_merge([
'class' => '',
'style' => '',
], $content ?? []);
$ul = array_merge([
'class' => ''
], $ul ?? []);
$body = array_merge([
'show' => false,
'class' => ''
], $body ?? []);
$actionButton = array_merge([
'class' => ''
], $actionButton ?? []);
?>
<ul id="{{$id ?? ''}}" class="{{$ul['class']}}">
@foreach($programs as $program)
<?php $url = route('programma') . $program->program->url; ?>
<?php $endStartDiff = $program->end->diff($program->start);
$duration = 24 * $endStartDiff->d + $endStartDiff->h; ?>
<li style="{{$li['style']}}" class="post {{$li['class']}}">
<div style="{{$content['style']}}" class="post_content {{$content['class']}}">
<h2 class="post_title">
<a href="{{$url}}" title="{{$program->program->name}}">{!!$program->program->name!!}</a>
</h2>
@if($program->current)
<a href="{{route('luister.live')}}" class="onair action_button player"><span class="fa"></span>
<span>Nu live!</span>
</a>
@else
<div class="sub_title">
<?php $time = Formatter::relativeDate($program->start) . (isset($showTime) && $showTime ? ' om ' . $program->start->format('H:i') : ''); ?>
<span class="post_date" title="{{$time}}">
<i class="fa-regular fa-clock"></i> {{$time}}
</span>
</div>
@endif
@if(isset($showAction) && $showAction)
<div class="row action_button" style="margin-top: 20px;">
@if(!$program->current)
<div class="col">
<a href="{{route('luister.programma') . '/' . $program->start->format('Y/m/d/H') . '/' . $duration}}"
class="player btn" style="padding: 10px 0;width: 100%;">Luister terug</a>
</div>
@endif
<div class="col">
<a href="{{route('programma') . $program->program->url}}" class="btn"
style="padding: 10px 0;width: 100%;">Meer informatie</a>
</div>
</div>
@endif
@if($body['show'])
<p class="post_body {{$body['class']}}">
{!!strip_tags($program->program->description)!!}
</p>
@endif
</div>
</li>
@endforeach
</ul>

362
resources/views/podcastitem.blade.php
View File

@@ -3,79 +3,87 @@
@include('widgets/mediaplayer')
@section('title')
{{$podcast->title}}
@if ($podcast)
{{$podcast->title}}
@else
Fragment {{$title}} niet gevonden
@endif
@endsection
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li><a title="Fragment gemist" href="{{route('gemist')}}">Fragment gemist</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
@if($podcast->program)
<li><a title="{{$podcast->program->name}}" href="{{route('gemist.programma') . $podcast->program->url}}">{{$podcast->program->name}}</a></li>
<li class="separator icon_small_arrow right_gray">&nbsp;</li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
@if($podcast && $podcast->program)
<li><a title="{{$podcast->program->name}}"
href="{{route('gemist.programma') . $podcast->program->url}}">{{$podcast->program->name}}</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
@endif
<li>Fragment</li>
</ul>
@endsection
@endsection
@push('scripts')
<script>
$(".vertical_carousel").each(function() {
$(this).before("<a class='slider_control up' id='" + this.id + "_prev' href='#' title='Terug'></a>");
$(this).after("<a class='slider_control down' id='" + this.id + "_next' href='#' title='Verder'></a>");
var carouselOptions = {
direction: "up",
items: {
visible: 3,
},
scroll: {
items: 2,
duration: 500,
pauseOnHover: true
},
auto: {
items: 3,
play: true,
pauseOnHover: true,
},
mousewheel: true,
swipe: {
onMouse: true,
onTouch: true
},
prev: {
button: $('.slider_control.up', $(this).parent()),
pauseOnHover: true,
},
next: {
button: $('.slider_control.down', $(this).parent()),
pauseOnHover: true,
},
};
<script>
$(".vertical_carousel").each(function () {
$(this).before("<a class='slider_control up' id='" + this.id + "_prev' href='#' title='Terug'></a>");
$(this).after("<a class='slider_control down' id='" + this.id + "_next' href='#' title='Verder'></a>");
var carouselOptions = {
direction: "up",
items: {
visible: 3,
},
scroll: {
items: 2,
duration: 500,
pauseOnHover: true
},
auto: {
items: 3,
play: true,
pauseOnHover: true,
},
mousewheel: true,
swipe: {
onMouse: true,
onTouch: true
},
prev: {
button: $('.slider_control.up', $(this).parent()),
pauseOnHover: true,
},
next: {
button: $('.slider_control.down', $(this).parent()),
pauseOnHover: true,
},
};
$(this).carouFredSel(carouselOptions);
$(this).carouFredSel(carouselOptions);
$(this).parent().parent().hover(function(){
$(".up.slider_control", this).removeClass("slideDownBack").addClass("slideDown");
$(".down.slider_control", this).removeClass("slideUpBack").addClass("slideUp");
},
function(){
$(".up.slider_control", this).removeClass("slideDown").addClass("slideDownBack");
$(".down.slider_control", this ).removeClass("slideUp").addClass("slideUpBack");
$(this).parent().parent().hover(function () {
$(".up.slider_control", this).removeClass("slideDownBack").addClass("slideDown");
$(".down.slider_control", this).removeClass("slideUpBack").addClass("slideUp");
},
function () {
$(".up.slider_control", this).removeClass("slideDown").addClass("slideDownBack");
$(".down.slider_control", this).removeClass("slideUp").addClass("slideUpBack");
});
// $(window).trigger("resize");
});
// $(window).trigger("resize");
});
</script>
</script>
@endpush
@section('content')
@parent
<?php
$audioUrl = url($apiUrl . 'podcast/download' . $podcast->url . "?auth=" . $podcast->auth);
$popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
?>
@parent
@if ($podcast)
<?php
$audioUrl = url($apiUrl . 'podcast/download' . $podcast->url . "?auth=" . $podcast->auth);
$popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
?>
<div class="row page_margin_top">
<div class="column column_2_3">
<div class="row">
@@ -83,135 +91,143 @@ $(".vertical_carousel").each(function() {
<h1>Fragment gemist</h1>
<ul class="post_details clearfix">
<li class="detail date">{{ Formatter::relativeDate($podcast->created) }}</li>
@if($podcast->program)
<li class="detail"><a href="{{ route('programma') . $podcast->program->url }}">{{ $podcast->program->name }}</a></li>
@endif
@if($podcast->program)
<li class="detail"><a
href="{{ route('programma') . $podcast->program->url }}">{{ $podcast->program->name }}</a>
</li>
@endif
</ul>
<div class="announcement">
<audio controls autoplay="true">
<source src="{{$audioUrl}}" type="audio/mpeg" />
</audio>
<div class="clearfix">
<a class="action_button" href="{{$audioUrl}}" title="Download dit fragment als MP3">
<span class="fa fa-download"></span>
<span>Download fragment</span>
</a>
<a class="action_button player" href="{{$popoutUrl}}">
<span class="fa fa-external-link-alt"></span>
<span>Luister in nieuw venster</span>
</a>
</div>
</div>
<div class="content_box clearfix section_margin_top">
@if($podcast->image)
<div class="post_image_box">
<a href="{{$imgBase . $podcast->image->url}}" class="post_image prettyPhoto" rel="prettyPhoto" title="{{$podcast->image->title}}">
<img src="{{$imgBase . $podcast->image->url}}" title="{{$podcast->image->title}}" style="display: block;"/>
</a>
<div class="sentence">
<span class="text">{{$podcast->image->title}}</span>
</div>
</div>
@endif
<div class="post_content page_margin_top_section ">
<h3>{!!$podcast->content!!}</h3>
<div class="announcement">
<audio controls autoplay="true">
<source src="{{$audioUrl}}" type="audio/mpeg"/>
</audio>
<div class="clearfix">
<a class="action_button" href="{{$audioUrl}}" title="Download dit fragment als MP3">
<span class="fa fa-download"></span>
<span>Download fragment</span>
</a>
<a class="action_button player" href="{{$popoutUrl}}">
<span class="fa fa-external-link-alt"></span>
<span>Luister in nieuw venster</span>
</a>
</div>
</div>
</div>
<div class="clearfix"></div>
<div class="content_box clearfix section_margin_top">
@if($podcast->image)
<div class="post_image_box">
<a href="{{$imgBase . $podcast->image->url}}" class="post_image prettyPhoto"
rel="prettyPhoto" title="{{$podcast->image->title}}">
<img src="{{$imgBase . $podcast->image->url}}"
title="{{$podcast->image->title}}" style="display: block;"/>
</a>
<div class="sentence">
<span class="text">{{$podcast->image->title}}</span>
</div>
</div>
@endif
<div class="post_content page_margin_top_section ">
<h3>{!!$podcast->content!!}</h3>
</div>
</div>
<div class="clearfix"></div>
</div>
</div>
<!--
<div class="row page_margin_top">
<div class="share_box clearfix">
<label>Share:</label>
<ul class="social_icons clearfix">
<li>
<a target="_blank" title="" href="http://facebook.com/QuanticaLabs" class="social_icon facebook">
&nbsp;
</a>
</li>
<li>
<a target="_blank" title="" href="https://twitter.com/QuanticaLabs" class="social_icon twitter">
&nbsp;
</a>
</li>
<li>
<a title="" href="mailto:contact@pressroom.com" class="social_icon mail">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon skype">
&nbsp;
</a>
</li>
<li>
<a title="" href="http://themeforest.net/user/QuanticaLabs?ref=QuanticaLabs" class="social_icon envato">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon instagram">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon pinterest">
&nbsp;
</a>
</li>
</ul>
</div>
</div>
-->
<!--
<div class="row page_margin_top">
<div class="share_box clearfix">
<label>Share:</label>
<ul class="social_icons clearfix">
<li>
<a target="_blank" title="" href="http://facebook.com/QuanticaLabs" class="social_icon facebook">
&nbsp;
</a>
</li>
<li>
<a target="_blank" title="" href="https://twitter.com/QuanticaLabs" class="social_icon twitter">
&nbsp;
</a>
</li>
<li>
<a title="" href="mailto:contact@pressroom.com" class="social_icon mail">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon skype">
&nbsp;
</a>
</li>
<li>
<a title="" href="http://themeforest.net/user/QuanticaLabs?ref=QuanticaLabs" class="social_icon envato">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon instagram">
&nbsp;
</a>
</li>
<li>
<a title="" href="#" class="social_icon pinterest">
&nbsp;
</a>
</li>
</ul>
</div>
</div>
-->
</div>
<div class="column column_1_3">
@if(count($related) > 1)
<h4 class="box_header page_margin_top_section">Meer uit deze uitzending</h4>
<div class="vertical_carousel_container clearfix">
<ul class="blog podcasts vertical_carousel" id="related_items">
@foreach($related as $relatedItem)
@if($relatedItem->id == $podcast->id) @continue @endif
@if(count($related) > 1)
<h4 class="box_header page_margin_top_section">Meer uit deze uitzending</h4>
<div class="vertical_carousel_container clearfix">
<ul class="blog podcasts vertical_carousel" id="related_items">
@foreach($related as $relatedItem)
@if($relatedItem->id == $podcast->id)
@continue
@endif
<li class="post">
<div class="post_content">
<h5>
<a href="{{ route('gemist.fragment') . $relatedItem->url }}"
title="{{$relatedItem->title}}">
<span class="fa fa-chevron-circle-right"></span>
{{$relatedItem->titleWithoutProgram()}}
</a>
</h5>
<p class="post_details simple" title="{{$relatedItem->content}}">
{{Formatter::excerpt($relatedItem->content, 80)}}
</p>
</div>
</li>
@endforeach
</ul>
</div>
<a href="{{route('gemist.programma') . $podcast->program->url}}"
class="more">Meer {{$podcast->program->name}}</a>
@endif
<h4 class="box_header page_margin_top_section">Meer fragmenten</h4>
<nav>
<ul class="blog podcasts">
<li class="post">
<div class="post_content">
<h5>
<a href="{{ route('gemist.fragment') . $relatedItem->url }}" title="{{$relatedItem->title}}">
<span class="fa fa-chevron-circle-right"></span>
{{$relatedItem->titleWithoutProgram()}}
</a>
</h5>
<p class="post_details simple" title="{{$relatedItem->content}}">
{{Formatter::excerpt($relatedItem->content, 80)}}
</p>
</div>
<a href="{{route('gemist')}}" class="read_more">
<span class="arrow"></span>
<span>Alle recente fragmenten</span>
</a>
</li>
@endforeach
</ul>
</div>
<a href="{{route('gemist.programma') . $podcast->program->url}}" class="more">Meer {{$podcast->program->name}}</a>
@endif
<h4 class="box_header page_margin_top_section">Meer fragmenten</h4>
<nav>
<ul class="blog podcasts">
<li class="post">
<a href="{{route('gemist')}}" class="read_more">
<span class="arrow"></span>
<span>Alle recente fragmenten</span>
</a>
</li>
</ul>
</nav>
</nav>
</div>
</div>
</div>
@endif
@endsection

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

@@ -1,109 +1,119 @@
@extends('layouts/sidebar')
@extends('layouts/full')
@section('title')
Fragment gemist
Fragment gemist
@endsection
@section('page_class')post_container @endsection
@section('page_class')
post_container
@endsection
@section('breadcrumb')
@if(isset($program))
<ul class="bread_crumb">
<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>
</ul>
@endif
@if(isset($program))
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li><a title="Fragment gemist" href="{{url('gemist.fragment')}}">Fragment gemist</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>{{$program->name}}</li>
</ul>
@else
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>Fragment gemist</li>
</ul>
@endif
@endsection
@section('content')
@parent
<div class="">
<div class="row news_post post_container">
<div class="col-12 col-md content_container">
<div id="gemist_tabs" class="no_scroll clearfix">
<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))
<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 class="page_body">Hele uitzendingen kunt u binnen twee weken terugluisteren via <a
href="{{route('gemist.programma')}}">programma gemist</a>.<br /><br />
@endif
<div id="gemist_tabs" class="no_scroll clearfix">
<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>
@if(isset($podcasts))
<div class="clearfix podcast_items">
@include('partial/podcastitems', [
'li' => [
'class' => 'col-12 col-md-6'
],
'content' => [
'class' => 'box full_width flex-column d-flex',
'style' => 'height: 300px'
],
'ul' => [
'class' => 'row overview'
],
'body' => [
'show' => true,
'class' => 'clipText'
],
'actionButton' => [
'class' => 'd-flex flex-column justify-content-end flex-grow-1'
],
'showAction' => true,
'podcasts' => array_slice($podcasts, 0, 8)])
</div>
@else
<p class="page_body">Er zijn geen fragmenten beschikbaar.</p>
@endif
</div>
<div class="col-12 col-md-auto sidebar">
@if ((isset($podcasts)))
<div data-tabs>
<div class="tabs">
<h4 data-tab-content-id="tab_more_fragmenten"
class="box_header extra_small flex-grow-1 active"><span>Meer fragmenten</span>
</h4>
</div>
<div id="tab_more_fragmenten" class="box tab_content podcast_items active">
@include('partial/podcastitems', ['id' => 'items-podcasts', 'showTime' => false, 'showImage' => false, 'podcasts' => array_slice($podcasts, 8)])
<a class="btn auto_width" id="meer-nieuws-more-podcast" href="#"
data-loadmorenews='{"container":["#items-podcasts"]}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Meer fragmenten
</a>
</div>
</div>
@endif
<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>
</div>
</div>
</div>
@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 class="page_body">Hele uitzendingen kunt u binnen twee weken terugluisteren via <a href="{{route('gemist.programma')}}">programma gemist</a>.
@endif
@if($podcasts)
<div class="page_layout clearfix">
<div class="row grid" id="items">
@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%">
<b>Meer podcasts aan het ophalen...</b>
</div>
</div>
</div>
@push('scripts')
<script>
var page = 1;
var isLoading = 0;
var $items = $('#items');
var $isLoading = $('#loading');
$(function() {
$(window).scroll(function () {
var $this = $(this);
var tweak = 10;
if(!isLoading && (page > 0) && ($this.scrollTop() >= $items.height() - $this.height() - tweak))
{
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 class=\"page_body\">Er zijn geen podcasts (meer).</p>");
page = -1;
return;
}
$newPage = $("<div />").append(data);
$items.append($newPage);
$newPage.find("audio, video").mediaelementplayer({ stretching: 'responsive' });
});
}
});
});
</script>
@endpush
@else
<p class="page_body">Er zijn geen fragmenten beschikbaar.</p>
@endif
@endsection
@push('styles')
<style>
#gemist_tabs li {
width: 50%;
}
</style>
@endpush

98
resources/views/podcastseries.blade.php
View File

@@ -1,13 +1,71 @@
@extends('layouts/sidebar')
@extends('layouts/full')
@section('title')
@section('title')
Fragment gemist
@endsection
@section('content')
@parent
@if(isset($program))
@section('content')
<div class="">
<div class="row news_post post_container">
<div class="col-12">
<ul class="bread_crumb">
<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>
</ul>
<div id="gemist_tabs" class="no_scroll clearfix">
<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>
</div>
<div class="col-12 col-md content_container">
<div class="box full-width">
</div>
</div>
<div class="col-12 col-md-auto sidebar">
@if ((isset($podcasts) && $podcasts))
<div data-tabs>
<div class="tabs">
@if (isset($podcasts) && $podcasts)
<h4 data-tab-content-id="tab_most_read"
class="box_header extra_small flex-grow-1 active"><span>Meest gelezen</span>
</h4>
@endif
</div>
@if (isset($podcasts) && $podcasts)
<div id="tab_most_read" class="box tab_content active">
@include('partial/newslist_small', ['id' => 'items-podcasts', 'news' => $podcasts])
<a class="btn auto_width" id="meer-nieuws-most-read" href="#"
data-loadmorenews='{"container":["#items-podcasts"]}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Klik hier voor meer nieuws
</a>
</div>
@endif
</div>
@endif
<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>
</div>
</div>
@if(isset($program))
<h2>{{$program->name}}</h2>
<p class="intro">
{!! $program->description !!}
@@ -21,7 +79,7 @@
@include('partial.podcastdirectitems', ['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%">
@@ -35,28 +93,28 @@
/*
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>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' });
});
}
});
@@ -65,11 +123,11 @@
</script>
@endpush
@else
<p>Er zijn geen fragmenten beschikbaar.</p>
@endif
@endsection
@push('styles')

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

@@ -1,4 +1,4 @@
@extends('layouts/sidebar')
@extends('layouts/full')
@section('title')
Programma gemist
@@ -8,75 +8,111 @@
@section('breadcrumb')
@if(isset($program))
<ul class="bread_crumb">
<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>
</ul>
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li><a title="Fragment gemist" href="{{url('gemist.fragment')}}">Programma gemist</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>{{$program->name}}</li>
</ul>
@else
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<li>Programma gemist</li>
</ul>
@endif
@endsection
@section('content')
@parent
<div class="">
<div class="row news_post post_container">
<div class="col-12 col-md content_container">
<div id="gemist_tabs" class="no_scroll clearfix">
<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>
@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 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>.<br /><br />
@endif
<div id="gemist_tabs" class="no_scroll clearfix">
<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>
@if(isset($programs))
<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="clearfix podcast_items">
@include('partial/programitems', [
'li' => [
'class' => 'col-12 col-md-6'
],
'content' => [
'class' => 'box full_width flex-column d-flex',
'style' => 'height: 270px'
],
'ul' => [
'class' => 'row overview'
],
'body' => [
'show' => true,
'class' => 'clipText clipText-5'
],
'actionButton' => [
'class' => 'd-flex flex-column justify-content-end flex-grow-1'
],
'showAction' => true,
'showTime' => true,
'programs' => array_slice($programs, 0, 8)])
</div>
<div class="page_layout clearfix">
<div class="row" id="items">
@else
@php($i = 0)
@foreach($programs as $program)
@if($i % 2 == 0)
@if($i > 0) </ul><!--/.row--> @endif
<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">
<div class="post_content">
<h2><a href="{{$url}}" title="{{$program->program->name}}">{!!$program->program->name!!}</a></h2>
@if($program->current)
<a href="{{route('luister.live')}}" class="onair action_button player"><span class="fa"></span> <span>Nu live!</span></a>
@else
<ul class="post_details" style="margin-top: 0;">
<li class="date">
{{ Formatter::relativeDate($program->start) }}
van {{ $program->start->format('H:i') }} uur tot {{ $program->end->format('H:i') }} uur.
</li>
</ul>
<a href="{{route('luister.programma') . '/' . $program->start->format('Y/m/d/H') . '/' . $duration}}" class="action_button player"><span class="fa fa-play"></span> <span>Luister terug</span></a>
@endif
<a href="{{route('programma') . $program->program->url}}" class="action_button"><span class="fa fa-question"></span> <span>Meer informatie</span></a>
<div class="clearfix"></div>
<p>{!! Formatter::excerpt($program->program->description, 200) !!}</p>
</div>
</li>
<p class="page_body">Er zijn geen fragmenten beschikbaar.</p>
@php($i++)
@endforeach
@endif
</div>
@if($i)
</ul><!--/.row-->
@endif
<div class="col-12 col-md-auto sidebar">
@if ((isset($programs)))
<div data-tabs>
<div class="tabs">
<h4 data-tab-content-id="tab_more_fragmenten"
class="box_header extra_small flex-grow-1 active"><span>Meer fragmenten</span>
</h4>
</div>
<div id="tab_more_fragmenten" class="box tab_content podcast_items active">
@include('partial/programitems', ['id' => 'items-programs', 'showTime' => true, 'programs' => array_slice($programs, 8)])
<a class="btn auto_width" id="meer-nieuws-more-programs" href="#"
data-loadmorenews='{"container":["#items-programs"]}'>
<span class="fas fa-spinner fa-spin" id="loading"></span>
Meer fragmenten
</a>
</div>
</div>
@endif
</div><!--/.row-->
</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>
</div>
</div>
</div>
@endsection
@@ -91,12 +127,3 @@ setInterval(function() {
}, 1000);
</script>
@endpush
@push('styles')
<style>
#gemist_tabs li {
width: 50%;
}
</style>
@endpush

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

@@ -8,6 +8,8 @@
@section('breadcrumb')
<ul class="bread_crumb">
<li><a title="Home" href="/">Home</a></li>
<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
<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>

4
resources/views/widgets/menu.blade.php
View File

@@ -21,8 +21,8 @@
// "Vroeger of Later Luisterlijst (2 januari)" => "/vol-luisterlijst"),
"App" => "/app",
"Podcast" => array(
"" => "/podcast/1091/nh-gooi-spreekuur",
"Waterschapsverkiezing 2023" => "/gemist/fragment/1356528/podcast-waterschapsverkiezingen-2023.mp3",
"" => "/podcast/fragment/1356528/podcast-waterschapsverkiezingen-2023.mp3",
"Waterschapsverkiezing 2023" => "/podcast/fragment/1356528/podcast-waterschapsverkiezingen-2023.mp3",
"NH Gooi Spreekuur" => "/podcast/1091/nh-gooi-spreekuur",
"Duurzaam Gooi" => "/podcast/1076/podcast-duurzaam-gooi"
),

3
routes/web.php
View File

@@ -63,11 +63,12 @@ Route::get('/gemist/zoeken', function(Illuminate\Http\Request $request) {
});
Route::get('/gemist/fragment', 'RadioController@podcasts')->name('gemist.fragment');
Route::get('/gemist/fragment/{id}/{title}', 'RadioController@podcast')->where(['id' => '\d+']);
Route::get('/gemist/fragment/{id}/{title}', 'RadioController@podcast')->where(['id' => '\d+', 'title' => '.*']);
Route::get('/gemist/programma', 'RadioController@terugluisteren')->name('gemist.programma');
Route::get('/gemist/programma/{programma}/{title}', 'RadioController@podcasts')->where(['programma' => '\d+']);
Route::get('/podcast/{programma}/{title}', 'PodcastController@podcasts')->where(['programma' => '\d+']);
Route::get('/podcast/fragment/{id}/{title}', 'RadioController@podcast')->where(['id' => '\d+', 'title' => '.*']);
Route::get('/podcast/aflevering/{id}/{title}', 'PodcastController@podcast')->where(['id' => '\d+']);
Route::get('/podcast/zoeken/{query}', 'RadioController@searchpodcast')->name('gemist.zoeken');
Route::get('/podcast/zoeken', function(Illuminate\Http\Request $request) {