218 lines
6.2 KiB
PHP
218 lines
6.2 KiB
PHP
@extends('layouts/full')
|
|
|
|
@include('widgets/mediaplayer')
|
|
|
|
@section('title')
|
|
{{$podcast->title}}
|
|
@endsection
|
|
|
|
@section('breadcrumb')
|
|
<ul class="bread_crumb">
|
|
<li><a title="Fragment gemist" href="{{route('gemist')}}">Fragment gemist</a></li>
|
|
<li class="separator icon_small_arrow right_gray"> </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"> </li>
|
|
@endif
|
|
<li>Fragment</li>
|
|
</ul>
|
|
@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,
|
|
},
|
|
};
|
|
|
|
$(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");
|
|
});
|
|
|
|
// $(window).trigger("resize");
|
|
});
|
|
</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;
|
|
?>
|
|
|
|
<div class="row page_margin_top">
|
|
<div class="column column_2_3">
|
|
<div class="row">
|
|
<div class="post single small_image">
|
|
<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
|
|
</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" 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">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a target="_blank" title="" href="https://twitter.com/QuanticaLabs" class="social_icon twitter">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a title="" href="mailto:contact@pressroom.com" class="social_icon mail">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a title="" href="#" class="social_icon skype">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a title="" href="http://themeforest.net/user/QuanticaLabs?ref=QuanticaLabs" class="social_icon envato">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a title="" href="#" class="social_icon instagram">
|
|
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a title="" href="#" class="social_icon pinterest">
|
|
|
|
</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
|
|
<li class="post">
|
|
<div class="post_content">
|
|
<h5>
|
|
<a href="{{ route('gemist.details') . $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">
|
|
<a href="{{route('gemist')}}" class="read_more">
|
|
<span class="arrow"></span>
|
|
<span>Alle recente fragmenten</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
|
|
@endsection
|