Layoutwijzigingen, programma gemist

2020-02-09 16:27:35 +01:00
parent 6e14ac8d92
commit d68df48dee
17 changed files with 218 additions and 52 deletions
--- a/.hgignore
+++ b/.hgignore
@@ -1 +1,2 @@
 glob:website/storage
+glob:website/public/images/banners
--- a/website/.hgignore
+++ b/website/.hgignore
@@ -2,3 +2,4 @@ syntax: glob

 .env
 storage
+website/public/images/banners
--- a/website/app/Http/Controllers/RadioController.php
+++ b/website/app/Http/Controllers/RadioController.php
@@ -74,6 +74,22 @@ class RadioController extends Controller
    {
        return $this->getPodcastList($request, 'zoeken/' . $query)->with('query', urldecode($query));
    } 
+
+    public function terugluisteren(Request $request)
+	{
+		$programs = [];
+		$apiResult = $this->API('programma/schema/recent');
+		foreach($apiResult->schedule as $item) {
+			if(!$item->program->nonstop && !$item->program->rerun) {
+        			$item->start = self::JsonToDateTime($item->start);
+			        $item->end = self::JsonToDateTime($item->end);
+				$item->program = new \Model\Program($item->program);
+				$programs[] = $item;
+			}
+		}
+
+		return view('programlist', ['programs' => array_reverse($programs)]);
+	}
   
    private function getPodcastList(Request $request, $action, $viewData = [])
    {
--- a/website/public/css/nhgooi.css
+++ b/website/public/css/nhgooi.css
@@ -8,32 +8,25 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	color: #1F3977;
 }

+@media screen and (max-width:1069px)
+{
+	.logo {
+		float: none;
+		width: 100%;
+		text-align: center;
+	}
+
+	.logo img.ri {
+		max-width: 75%;
+	}
+}
+
@media screen and (max-width:767px) {
-/*
-	.menu_container.sticky.move,
-	.boxed .menu_container.sticky.move
-	{
-		position: fixed;
-		top: 0pt;
-		left: 0px;
-		box-shadow: none;
-		-moz-box-shadow: none;
-		-webkit-box-shadow: none;
-	}
-
-	.sticky.move .mobile-menu-switch {
-		margin-left: 0px;
-	}
-
-	.sticky.move .mobile-menu {
-		background-color: #F0F0F0;
-	}
-*/
-
 	.row .column {
 		width: 100%;
 	}

+
 	.now-playing-header {
 		width: 100% !important;
 		margin-top: 30px !important;
@@ -49,6 +42,11 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 }

@media screen and (max-width: 479px) {
+	.header_container {
+		background-repeat: no-repeat;
+		background-position: left 95%;
+		background-size: auto 155px !important;
+	}
 	.search {
 		float: none;
 		display: flex;
@@ -68,6 +66,11 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	}
 }

+.header_container {
+	background-image: url('../images/nh-banner.png');
+	background-size: 100% ;
+}
+
 .header .now-playing-header {
 	float: right;
 }
@@ -76,7 +79,8 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	font-size: 16pt;
 	font-family: 'Roboto Condensed';
 	font-weight: 300;
-	background: #F6F6F6;
+	/* background: #F6F6F6; */
+	background: rgba(246, 246, 246, 0.4);
 	width: 728px;
 	color: #787878;
 	text-align: center;
@@ -91,7 +95,6 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a

 	.now-playing-header .title,
 	.now-playing-header .artist {
-	
 		padding: 3px;
 	}

@@ -106,7 +109,6 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 		position: absolute;
 		padding: 3px;
 		width: 100%;
-                background-color: inherit;
 	}

 	.now-playing-header .controls li {
@@ -148,7 +150,7 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	height: 30px;
 	width: 30px;
 	background: url("/images/icons/navigation/go_top_arrow.png") no-repeat 50% 50%;
-    background-color: #ABABAB;
+    	background-color: #ABABAB;
 }

 .scroll_top_floater:hover {
@@ -178,6 +180,32 @@ h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
 	border-color: #2F4A88;
 }

+.menu_container, .sf-menu li {
+	border-top-color: #03A6E0;
+}
+
+.sf-menu li:hover, .sf-menu li.selected, .sf-menu li.submenu:hover {
+  border-top-color: #1F3977;
+}
+
+
+.mobile-menu-switch:hover {
+	background: #1F3977;
+} 
+
+.mobile-menu-switch {
+	border-color: #1F3977;
+}
+
+.mobile-menu-switch .line {
+	background: #03A6E0;
+}
+
+.mobile-menu li.selected a, .mobile-menu li.selected ul li.selected a, .mobile-menu li.selected ul li.selected ul li.selected a {
+    background: #1F3977;
+}
+
+
 button[disabled],
 button[disabled]:hover
 {
@@ -200,6 +228,7 @@ button[disabled]:hover
 	margin-right: 50px;
 	background: none;
 	color: #464D53;
+	height: 40px;
 }

 .search .search_input.hint {
@@ -216,6 +245,14 @@ button[disabled]:hover
 	font-size: 0;
 }

+.search .search_submit:hover {
+  background-color: #03A6E0;
+}
+
+.slider_posts_list .slider_posts_list_bar {
+ 	background-color: #1F3977;
+}
+
 .post h2,
 .post h5 {
 	text-overflow: ellipsis;
--- a/website/public/images/nh-banner.png
+++ b/website/public/images/nh-banner.png
--- a/website/resources/views/calendarevent.blade.php
+++ b/website/resources/views/calendarevent.blade.php
@@ -43,7 +43,7 @@
 							@if($event->podcast->program) in <a href="{{ route('programma') . $event->podcast->program->url }}">{{ $event->podcast->program->name }}</a> @endif
 					</li>
 					<li class="detail category">
-						<a href="{{ route('gemist.details') . $event->podcast->url }}">
+						<a href="{{ route('gemist.fragment') . $event->podcast->url }}">
 							<span class="fa "></span>
 							<span>Meer over dit fragment</span>
 						</a>
--- a/website/resources/views/home.blade.php
+++ b/website/resources/views/home.blade.php
@@ -164,8 +164,10 @@
 			<div class="column column_1_3">
 				@include('widgets.banners')

+				{{--
 				<h4 class="box_header"><span class="fa fa-fire"></span> &nbsp; Meest gelezen</h4>
 				@include('widgets.populairnieuws')
+				--}}

 				@include('widgets.nustraks')

--- a/website/resources/views/layouts/_head.blade.php
+++ b/website/resources/views/layouts/_head.blade.php
@@ -25,7 +25,7 @@
 		<?php if(isset($metadata)) {
 			$metadata->set('url', url()->current())
 				->prepend('image', $imgBase)
-				->prepend('audio', route('gemist.details'))
+				->prepend('audio', route('gemist.fragment'))
 				->append('title', ' | NH Gooi')
 				->metaTags(); 
 		} ?>
--- a/website/resources/views/layouts/master.blade.php
+++ b/website/resources/views/layouts/master.blade.php
@@ -217,7 +217,6 @@
 				<div class="header clearfix">
 					<div class="logo">
 						<a href="{{url('/')}}"><img src="/images/logo.png" class="ri" /></a>
-						<h4>Mediapartner van <a href="https://www.nhnieuws.nl/nhgooi" target="_blank">NH</a></h4>
 					</div>

 					<div class="now-playing-header">
@@ -261,6 +260,7 @@
 <!-- Content -->

 <div class="page">
+	<a name="top"></a>
 	@yield('page')
 </div><!--/.page-->

@@ -273,7 +273,7 @@
 						<div class="column column_1_3">
 							<h4 class="box_header">NH Gooi</h4>
 							<p class="padding_top_bottom_25">
-						 		NH Gooi is de streekomroep voor Hilversum, Huizen, Blaricum, Eemnes en Laren. 
+						 		NH Gooi is de streekomroep voor het Gooi in samenwerking met NH Media.
 								NH Gooi hoor je in heel Gooi en Eemland op 92.0 FM, 105.1 FM en 106.2 FM.
 							</p>
 							<div class="row">
--- a/website/resources/views/newsitem.blade.php
+++ b/website/resources/views/newsitem.blade.php
@@ -55,7 +55,7 @@
 							@if($news->podcast->program) in <a href="{{ route('programma') . $news->podcast->program->url }}">{{ $news->podcast->program->name }}</a> @endif
 					</li>
 					<li class="detail category">
-						<a href="{{ route('gemist.details') . $news->podcast->url }}">
+						<a href="{{ route('gemist.fragment') . $news->podcast->url }}">
 							<span class="fa "></span>
 							<span>Meer over dit fragment</span>
 						</a>
--- a/website/resources/views/partial/podcastitems.blade.php
+++ b/website/resources/views/partial/podcastitems.blade.php
@@ -4,7 +4,7 @@
@if($i > 0) </ul><!--/.row--> @endif
 <ul class='blog row grid'>
@endif
-	<?php $url = route('gemist.details') . $podcast->url; ?>
+	<?php $url = route('gemist.fragment') . $podcast->url; ?>
 	<li class="post column column_1_2">
 		<div class="post_content">
 			<h2><a href="{{$url}}" title="{{$podcast->title}}">{!!$podcast->titleWithoutProgram()!!}</a></h2>
@@ -27,7 +27,7 @@
 			</p>
 			@endif
 			<p>{!! Formatter::excerpt($podcast->content, 200) !!}</p>
-			<a class="read_more" href="{{route('gemist.details') . $podcast->url}}" title="Luister fragment"><span class="arrow"></span><span>Luister fragment</span></a>
+			<a class="read_more" href="{{route('gemist.fragment') . $podcast->url}}" title="Luister fragment"><span class="arrow"></span><span>Luister fragment</span></a>
 		</div>
 	</li>

--- a/website/resources/views/podcastitem.blade.php
+++ b/website/resources/views/podcastitem.blade.php
@@ -183,7 +183,7 @@ $(".vertical_carousel").each(function() {
 						<li class="post">
 							<div class="post_content">
 								<h5>
-									<a href="{{ route('gemist.details') . $relatedItem->url }}" title="{{$relatedItem->title}}">
+									<a href="{{ route('gemist.fragment') . $relatedItem->url }}" title="{{$relatedItem->title}}">
 										<span class="fa fa-chevron-circle-right"></span> 
 										{{$relatedItem->titleWithoutProgram()}}
 									</a>
--- a/website/resources/views/podcastlist.blade.php
+++ b/website/resources/views/podcastlist.blade.php
@@ -5,18 +5,35 @@
@endsection

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

@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>
+
  @if(isset($program)) 
    <h2>{{$program->name}}</h2>
    <p class="align-right">
@@ -24,15 +41,15 @@
      <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 door het betreffende programma op te zoeken via de <a href="{{route('radio.gids')}}">programmagids</a>.
+    <p>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 class="row grid" id="items">
+  @include('partial.podcastitems', ['podcasts' => $podcasts])
+  </div><!--/.row-->
  </div>
  
  <div id="loading" style="display: none">
@@ -83,3 +100,10 @@
 
@endsection

+@push('styles')
+<style>
+#gemist_tabs li {
+  width: 50%;
+}
+</style>
+@endpush
--- a/website/resources/views/programlist.blade.php
+++ b/website/resources/views/programlist.blade.php
@@ -0,0 +1,84 @@
+@extends('layouts/sidebar')
+
+@section('title') 
+  Programma gemist
+@endsection
+
+@section('breadcrumb')
+	<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 
+
+@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>
+
+  <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>
+
+  <div class="page_layout clearfix">
+	<div class="row grid" id="items">
+
+            @php($i = 0)
+            @foreach($programs as $program) 
+            @if($i % 2 == 0)
+            @if($i > 0) </ul><!--/.row--> @endif
+            <ul class='blog row grid'>
+            @endif
+            	<?php $url = route('programma') . $program->program->url; ?>
+		<?php $duration = $program->end->diff($program->start)->h; ?>
+            	<li class="post column column_1_2">
+            		<div class="post_content">
+            			<h2><a href="{{$url}}" title="{{$program->program->name}}">{!!$program->program->name!!}</a></h2>
+            			<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>
+				 <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>
+            
+            @php($i++)
+            @endforeach
+
+            @if($i)
+            </ul><!--/.row-->
+            @endif
+
+	</div><!--/.row-->
+  </div>
+  
+@endsection
+
+@push('styles')
+<style>
+#gemist_tabs li {
+  width: 50%;
+}
+</style>
+@endpush
--- a/website/resources/views/widgets/laatstepodcasts.blade.php
+++ b/website/resources/views/widgets/laatstepodcasts.blade.php
@@ -6,7 +6,7 @@
 		</a>
 		<div class="post_content">
 			<h5>
-				<a href="{{route('gemist.details') . $podcast->url}}" title="{{$podcast->title}}">{{$podcast->titleWithoutProgram()}}</a>
+				<a href="{{route('gemist.fragment') . $podcast->url}}" title="{{$podcast->title}}">{{$podcast->titleWithoutProgram()}}</a>
 			</h5>
 			<ul class="post_details simple">
 				@if($podcast->program)
--- a/website/resources/views/widgets/menu.blade.php
+++ b/website/resources/views/widgets/menu.blade.php
@@ -4,7 +4,8 @@
 	"Luister live" => "/luister/live",
 	"Regionieuws" => "/luister/regionieuws",
 	"Programmagids" => "/gids",
-	"Fragment gemist" => "/gemist",
+	"Programma gemist" => "/gemist/programma",
+	"Fragment gemist" => "/gemist/fragment",
 	"Zondagsdienst" => "/kerkdienst"),
 "TV" => array(
 	"Kijk live" => "/kijk/live"),
@@ -13,8 +14,8 @@
 	"" => "/contact",
 	"Contact" => "/contact",
 	"Adverteren?" => "/adverteren",
-	"NH Nieuws (mediapartner)" => "https://nhnieuws.nl/nhgooi"),
-);
+),
+	"NH Nieuws" => "https://nhnieuws.nl");
 ?>
 <?php
 function isActive($link, $checksubmenus) {
@@ -120,11 +121,11 @@ function buildMenu($menu, $ismobile) {
 					@foreach($podcasts as $item)
 					<li class="post">
 						@if($item->image)
-						<a href="{{route('gemist.details') . $item->url}}" title="{{$item->title}}">
+						<a href="{{route('gemist.fragment') . $item->url}}" title="{{$item->title}}">
 							<img src='{{$imgBase . $item->image->url}}' alt='{{$item->title}}'>
 						</a>
 						@endif
-						<h5><a href="{{route('gemist.details') . $item->url}}" title="{{$item->title}}">{{$item->title}}</a></h5>
+						<h5><a href="{{route('gemist.fragment') . $item->url}}" title="{{$item->title}}">{{$item->title}}</a></h5>
 						<ul class="post_details simple">
 							@if($item->program)
 							<li class="category">{{$item->program->name}}</li>
--- a/website/routes/web.php
+++ b/website/routes/web.php
@@ -52,10 +52,10 @@ Route::get('/gemist/zoeken', function(Illuminate\Http\Request $request) {
  return redirect('/gemist');
 });

+Route::get('/gemist/fragment', 'RadioController@podcasts')->name('gemist.fragment');
 Route::get('/gemist/fragment/{id}/{title}', 'RadioController@podcast')->where(['id' => '\d+']);
-Route::get('/gemist/fragment')->name('gemist.details');
+Route::get('/gemist/programma', 'RadioController@terugluisteren')->name('gemist.programma');
 Route::get('/gemist/programma/{programma}/{title}', 'RadioController@podcasts')->where(['programma' => '\d+']);
-Route::get('/gemist/programma')->name('gemist.programma');

 Route::get('/kijk/live', 'StreamController@livetv')->name('kijk.live');