Render articles directly from block source instead of prerendered text

Reviewed-on: #10

app/Http/Controllers/CalendarController.php

@@ -6,57 +6,11 @@ use \Illuminate\Http\Request;
 
 class CalendarController extends Controller
 {
-    private $events = [
-        1 => [
-            'id' => 1,
-            'title' => 'Seinconcert Hilversum',
-            'region' => 'Hilversum',
-            'content' => 'Vrijdag 19 april treedt het Barbican Quartet op in de serie Seinconcerten in Hilversum. Op het programma staan werken van Schubert, Ravel en Britten.',
-            'starts' => '16-04-2024',
-            'ends' => '19-04-2024',
-            'url' => 'seinconcert-hilversum',
-            'images' => [
-                ['url' => '/img/news/rHjgm6CM0D.jpg']
-            ]
-        ],
-        2 => [
-            'id' => 2,
-            'title' => 'Orgelconcert Blaricum',
-            'region' => 'Blaricum',
-            'content' => '<p><strong>In april van dit jaar bestaat het Maarschalkerweerd orgel van de Vituskerk in Blaricum 150 jaar. Ter gelegenheid hiervan is er op zondag 21 april van 14.00 – 15.00 uur een orgelconcert in de Vituskerk. De vaste organisten van de Vituskerk, Bas Groenewoud en Herman van Dijk, zullen het orgel bespelen en er zal iets worden verteld over de geschiedenis van het orgel.</strong></p><p>Het orgel is in 1874 gebouw door Michaël Maarschalkerweerd. Hij bouwde orgels die in de traditie van de neogotiek passen en zijn orgels zijn zeer geschikt voor het spelen van 19e-eeuwse romantische werken. Het orgel in het Amsterdamse concertgebouw is ook van zijn hand. In zijn bedrijf werkten rond 1900 ruim twintig mensen. Na Michaels dood in 1915 werd het bedrijf voortgezet door C.H. van Brussel, J.J. Elbertse en L. Collard, die tot dan toe meesterknechten geweest waren. Elbertse verliet de firma na twee jaar om zijn eigen orgelmakerij op te richten. De firma Elbertse uit Soest heeft jarenlang dit orgel in onderhoud gehad (de tweede én derde generatie trad toe).</p><p>In 2023 fuseerde het bedrijf met de firma Van Vulpen. Het orgel in de Vituskerk was oorspronkelijk gebouwd op de koorzolder maar tijdens de grondige verbouwing van de kerk in 2004 werd het orgel naar beneden gehaald zodat het in al zijn pracht te bewonderen is en ook nodig is om dienst te doen als ondersteuning van het koor. Afgelopen jaar is het orgel in de Vituskerk grondig gerenoveerd.</p><p>Het concert begint om 14:00 uur en de entree is vrij. Collecte na afloop.</p>',
-            'starts' => '21-04-2024',
-            'ends' => '21-04-2024',
-            'url' => 'orgelconcert-blaricum',
-            'images' => [
-                ['url' => '/img/news/tgrOh0kbIS.jpg']
-            ]
-        ],
-    ];
-
-    public function __construct()
-    {
-        parent::__construct();
-
-        $events = [];
-        foreach ($this->events as $index => $event) {
-            $object = new \stdClass();
-            foreach ($event as $key => $value) {
-                $object->$key = $value;
-            }
-            $events[$index] = $object;
-        }
-        $this->events = $events;
-    }
-
     public function show(Request $request, $id)
     {
         parent::registerView($request, 'agenda', $id);
-        if ($id > 3) {
-            $apiResult = $this->API('agenda/item/' . (int)$id);
-        } else {
-            $apiResult = $this->events[$id];
-        }
-        $calendarEvent = new \Model\CalendarEvent($apiResult);
+        $apiResult = $this->API('agenda/item/' . (int)$id);
+        $calendarEvent = new \Model\CalendarEvent($apiResult->news);
 
         return view('calendarevent', array_merge($this->getSidebareData(), ['event' => $calendarEvent, 'metadata' => $calendarEvent->metadata]));
     }
@@ -64,11 +18,8 @@ class CalendarController extends Controller
     public function overview(Request $request)
     {
         $apiResult = $this->API('agenda/overzicht');
-        if (!count($apiResult)) {
-            $apiResult = $this->events;
-        }
         $calendar = [];
-        foreach($apiResult as $calendarItem)
+        foreach($apiResult->events as $calendarItem)
         {
             $calendar[] = new \Model\CalendarEvent($calendarItem);
         }

app/Http/Controllers/Controller.php

@@ -22,14 +22,14 @@ class Controller extends BaseController
         $data = json_decode(Storage::disk('local')->get($file));
         foreach ($path as $subobject) {
             $data = $data->$subobject;
-        }
+	}
         $items = [];
         foreach ($data as $item_data) {
             $items[] = new $class($item_data);
             if ($maxItems && count($items) == $maxItems) {
                 break;
             }
-        }
+	}
 
         return $items;
     }
@@ -39,27 +39,20 @@ class Controller extends BaseController
         View::share('apiUrl', $this->API_URL = env('API_URL', 'http://api.6fm.nl/'));
         View::share('imgBase', env('IMAGE_BASE_URL', '/'));
 
-        $blogs = $this->getDataFromFileAndConvert('blogs.json', [], '\Model\Blog', 1);
-        $activeBlog = count($blogs) && $blogs[0]->is_active ? $blogs[0] : null;
-        View::share('activeBlog', $activeBlog);
-
-
         //View::share('onAir', file_get_contents(url('onair')));
         View::composer('widgets.laatstenieuws', function ($view) {
             $view->with('data', $this->getDataFromFileAndConvert('laatste_nieuws.json', ['news'], '\Model\NewsItem'));
         });
         View::composer('widgets.populairnieuws', function ($view) {
-            $view->with('data', $this->getDataFromFileAndConvert('populair_nieuws.json', [], '\Model\NewsItem'));
+            $view->with('data', $this->getDataFromFileAndConvert('populair_nieuws.json', ['news'], '\Model\NewsItem'));
         });
         View::composer('widgets.nustraks', function ($view) {
             $data = json_decode(Storage::disk('local')->get('nu_straks.json'))->schedule;
             $programs = [];
             foreach ($data as $item_data) {
                 $programs[] = $program = new \Model\Program($item_data->program);
-                $program->start = new \DateTimeImmutable($item_data->start->date,
-                    new \DateTimeZone($item_data->start->timezone));
-                $program->end = new \DateTimeImmutable($item_data->end->date,
-                    new \DateTimeZone($item_data->end->timezone));
+                $program->start = self::JsonToDateTime($item_data->start);
+                $program->end = self::JsonToDateTime($item_data->end);
             }
 
             // Need a bit of slack here, otherwise the current program may show up
@@ -68,10 +61,8 @@ class Controller extends BaseController
             $i = 0;
             foreach (array_reverse($data) as $item_data) {
                 $recent = $program = new \Model\Program($item_data->program);
-                $recent->start = new \DateTimeImmutable($item_data->start->date,
-                    new \DateTimeZone($item_data->start->timezone));
-                $recent->end = new \DateTimeImmutable($item_data->end->date,
-                    new \DateTimeZone($item_data->end->timezone));
+                $recent->start = self::JsonToDateTime($item_data->start);
+                $recent->end = self::JsonToDateTime($item_data->end);
                 if (($recent->end < $now) && (!$recent->nonstop) && (!$recent->rerun)) {
                     $view->with('recent', $recent);
                     break;
@@ -92,12 +83,12 @@ class Controller extends BaseController
         });
         View::composer('widgets.menu', function ($view) {
             $view->with('news', $this->getDataFromFileAndConvert('laatste_nieuws.json', ['news'], '\Model\NewsItem'))
-                ->with('popular', $this->getDataFromFileAndConvert('populair_nieuws.json', [], '\Model\NewsItem', 3))
+                ->with('popular', $this->getDataFromFileAndConvert('populair_nieuws.json', ['news'], '\Model\NewsItem', 3))
                 ->with('podcasts',
                     $this->getDataFromFileAndConvert('laatste_podcasts.json', ['podcasts'], '\Model\Podcast'));
         });
 
-        View::share('disableBanners', env('DISABLE_BANNERS', true));
+        View::share('disableBanners', env('DISABLE_BANNERS', false));
     }
 
     protected function registerView(Request $request, $type, $id)
@@ -118,16 +109,16 @@ class Controller extends BaseController
 
     protected function API($url)
     {
-//        if (strpos($url, 'nieuws/overzicht') !== false) {
-//            return json_decode(file_get_contents(__DIR__ . '/../../../storage/app/laatste_nieuws.json'));
-//        }
-//        return [];
-
         $arrContextOptions = [
             'ssl' => [
                 "verify_peer" => false,
                 "verify_peer_name" => false,
-            ],
+	    ],
+	    'http' => [
+		'method' => 'GET',
+                'header' => 'X-Api-Key: ' . sha1(request()->server('REMOTE_ADDR')) . "\r\n"
+                         . 'X-User-Agent: ' . request()->server('HTTP_USER_AGENT') . "\r\n"
+	    ]
         ];
 
         return json_decode(file_get_contents($this->API_URL . $url, false, stream_context_create($arrContextOptions)));
@@ -148,7 +139,7 @@ class Controller extends BaseController
 
     protected static function JsonToDateTime($obj)
     {
-        return new \DateTime($obj->date, new \DateTimeZone($obj->timezone));
+        return is_object($obj) ? new \DateTime($obj->date, new \DateTimeZone($obj->timezone)) : \Carbon\Carbon::parse($obj)->setTimezone(date_default_timezone_get());
     }
 
     public function __call($method, $arguments)
@@ -166,8 +157,8 @@ class Controller extends BaseController
     public function getSidebareData()
     {
         $populair = [];
-        $apiResult = $this->API('nieuws/populair?aantal=5');
-        foreach ($apiResult as $_newsItem) {
+	$apiResult = $this->API('nieuws/populair?aantal=5');
+        foreach ($apiResult->news as $_newsItem) {
             $populair[] = new \Model\NewsItem($_newsItem);
         }
 

app/Http/Controllers/HomeController.php

@@ -14,21 +14,17 @@ class HomeController extends Controller
         $news = [];
         foreach ($apiResult->news as $newsItem) {
             $news[] = new \Model\NewsItem($newsItem);
-        }
+	}
 
         $populair = [];
         $apiResult = $this->API('nieuws/populair?pagina=' . (int)max(1, $page) . '&aantal=5');
-        foreach ($apiResult as $newsItem) {
+        foreach ($apiResult->news as $newsItem) {
             $populair[] = new \Model\NewsItem($newsItem);
         }
 
-        $podcasts = [];
-        $apiResult = $this->API('podcast/overzicht?aantal=3');
-        $podcast = new \Model\Podcast($apiResult->podcasts[0]);
-        foreach ($apiResult->podcasts as $_podcast) {
-            $podcasts[] = new \Model\Podcast($_podcast);
-        }
-
-        return view('home', ['populair' => $populair, 'podcasts' => $podcasts, 'podcast' => $podcast, 'title' => 'Home', 'news' => $news, 'searchURL' => 'nieuws/zoeken']);
+	$apiResult = $this->API('podcast/overzicht?aantal=15');
+	$index = array_rand($apiResult->podcasts);
+        $podcast = new \Model\Podcast($apiResult->podcasts[$index]);
+        return view('home', ['populair' => $populair, 'podcast' => $podcast, 'title' => 'Home', 'news' => $news, 'searchURL' => 'nieuws/zoeken']);
     }
 }

app/Http/Controllers/JobsController.php

@@ -29,12 +29,12 @@ class JobsController extends Controller
     private function listJobs(Request $request, $url, $title = null)
     {
         $page = (int)$request->get('pagina', 1);
-        $apiResult = $this->API('vacatures/' . $url . '?pagina=' . (int)max(1, $page));
+        #$apiResult = $this->API('vacatures/' . $url . '?pagina=' . (int)max(1, $page));
         $jobs = [];
-        foreach($apiResult->jobs as $jobsItem)
-        {
-            $jobs[] = new \Model\JobOpening($jobsItem);
-        }
+        #foreach($apiResult->jobs as $jobsItem)
+        #{
+        #    $jobs[] = new \Model\JobOpening($jobsItem);
+        #}
 
         return view('jobslist', array_merge($this->getSidebareData(), ['title' => $title, 'jobs' => $jobs]));
         //return view($request->ajax() ? 'partial/jobslist_small' : ($title == null ? 'home' : 'jobslist'), ['title' => $title, 'jobs' => $jobs, 'searchURL' => 'vacatures/zoeken']);

app/Http/Controllers/NewsController.php

@@ -22,22 +22,24 @@ class NewsController extends Controller
 
         switch ($apiResult->version) {
             case 1:
-                if (!$newsItem->content) return redirect('//nhnieuws.nl/gooi');
-                return view('newsitem', ['news' => $newsItem, 'metadata' => $newsItem->metadata]);
-                break;
+	        if (!$newsItem->content) return redirect('//nhnieuws.nl/gooi');
 
-            case 2:
-                $source = $apiResult->source;
+	    case 2:
+		if(isset($apiResult->source->article)) {
+                $source = $apiResult->source->article;
                 $newsItem->published = self::TimestampToDateTime($source->created);
                 $newsItem->edited = self::TimestampToDateTime($source->updated);
                 $newsItem->author = $source->author;
                 $newsItem->images = null; // Images will be embedded
                 $newsItem->video = null; // Videos will be embedded
-                $newsItem->content = $source->blocks;
+		$newsItem->content = $source->blocks;
+		} elseif(isset($apiResult->source->blocks)) {
+			$newsItem->content = $apiResult->source->blocks; 
+		}
+		
 
 
-
-                return view('newsitem', array_merge($this->getSidebareData(), ['news' => $newsItem, 'metadata' => $newsItem->metadata, 'searchURL' => 'nieuws/zoeken']));
+                return view('newsitem', array_merge($this->getSidebareData(), ['type' => $apiResult->type, 'news' => $newsItem, 'metadata' => $newsItem->metadata, 'searchURL' => 'nieuws/zoeken']));
         }
     }
 
@@ -65,21 +67,26 @@ class NewsController extends Controller
         $id = $request->get('id', '');
         $populair = [];
         $apiResult = $this->API('nieuws/populair?pagina=' . (int)max(1, $page) . '&aantal=5');
-        foreach ($apiResult as $_newsItem) {
+        foreach ($apiResult->news as $_newsItem) {
             $populair[] = new \Model\NewsItem($_newsItem);
         }
 
         return view('partial/newslist_small', ['id' => $id, 'news' => $populair]);
     }
 
+    public function taglist(Request $request, $tag)
+    {
+        return $this->listNews($request, 'tag/' . $tag, ucfirst($tag));
+    }
+
     public function regionlist(Request $request, $region)
     {
-        return $this->listNews($request, 'regio/' . $region, ucfirst($region));
+        return $this->listNews($request, 'tag/' . $region, ucfirst($region));
     }
 
     public function themelist(Request $request, $theme)
     {
-        return $this->listNews($request, 'thema/' . $theme, ucfirst($theme));
+        return $this->listNews($request, 'tag/' . $theme, ucfirst($theme));
     }
 
     public function search(Request $request, $query)
@@ -145,7 +152,7 @@ class NewsController extends Controller
         }
         $apiResult = $this->API('nieuws/populair?pagina=' . (int)max(1,
                 $page) . ($total ? '&aantal=' . $total : ''));
-        foreach ($apiResult as $newsItem) {
+        foreach ($apiResult->news as $newsItem) {
             $populair[] = new \Model\NewsItem($newsItem);
         }
 
@@ -172,7 +179,7 @@ class NewsController extends Controller
     {
         $apiResult = $this->API('nieuws/populair');
         $news = [];
-        foreach ($apiResult as $newsItem) {
+        foreach ($apiResult->news as $newsItem) {
             $news[] = new \Model\NewsItem($newsItem);
         }
 
@@ -181,11 +188,15 @@ class NewsController extends Controller
 
     public function regionieuws()
     {
+	$data = $this->API('nieuws/regionieuws.json');
         return view('listen', [
-            'source' => $this->API_URL . 'nieuws/regionieuws',
+            'source' => $this->API_URL . 'nieuws/regionieuws.mp3',
             'title' => 'Regionieuws',
             'content' => 'het laatste nieuws uit de regio',
             'isStream' => false,
-            'canDownload' => true]);
+	    'canDownload' => true,
+	    'lengte' => $data->length * 0.25,
+	    'waveform' => $data
+	]);
     }
 }

app/Http/Controllers/PodcastController.php

@@ -29,14 +29,23 @@ class PodcastController extends Controller
             $podcasts[] = new \Model\Podcast($podcast);
         }
 
-        return view($request->ajax() ? 'partial.podcastitems' : 'podcastseries', array_merge($viewData, ['podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken']));
+        return view($request->ajax() ? 'partial.podcastitems' : 'podcastseries', array_merge($viewData, ['podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken', 'isPodcast' => true]));
     }
 
     public function podcast(Request $request, $id)
     {
 	parent::registerView($request, 'podcast', $id);
 	$apiResult = $this->API('podcast/details/' . (int)$id);
-        $podcast = new \Model\Podcast($apiResult);
-        return view('podcastitem', ['podcast' => $podcast, 'metadata' => $podcast->metadata]);
+	$podcast = new \Model\Podcast($apiResult);
+	$podcasts = [];
+	if($podcast->program) {
+	        $apiResult = $this->API('podcast/programma/' . (int)$podcast->program->id . '?pagina=1&aantal=5');
+	        $podcasts = [];
+	        foreach($apiResult->podcasts as $p)
+	        {
+			$podcasts[] = new \Model\Podcast($p);
+		}
+	}
+        return view('podcastitem', ['podcast' => $podcast, 'metadata' => $podcast->metadata, 'podcasts' => $podcasts, 'isPodcast' => true]);
     }
 }

app/Http/Controllers/RadioController.php

@@ -56,7 +56,7 @@ class RadioController extends Controller
     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']));
+            return view('podcastitem', array_merge($this->getSidebareData(), ['title' => $title, 'podcast' => null, 'metadata' => null, 'related' => [], 'searchURL' => 'gemist/zoeken', 'isPodcast' => false]));
         }
 
 		parent::registerView($request, 'podcast', $id);
@@ -71,7 +71,7 @@ class RadioController extends Controller
             $podcasts[] = new \Model\Podcast($_podcast);
         }
 
-        return view($request->ajax() ? 'partial/podcastitems' : 'podcastitem', ['title' => $title, 'podcast' => $podcast, 'metadata' => $podcast->metadata, 'podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken']);
+        return view($request->ajax() ? 'partial/podcastitems' : 'podcastitem', ['title' => $title, 'podcast' => $podcast, 'metadata' => $podcast->metadata, 'podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken', 'isPodcast' => false]);
     }
 
     public function podcasts(Request $request, $programma = null)
@@ -95,7 +95,7 @@ class RadioController extends Controller
 	{
 		$programs = [];
 		$now = new \DateTimeImmutable('2 minutes ago');
-        $page = (int)$request->get('pagina', 1);
+        	$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) {
@@ -107,7 +107,7 @@ class RadioController extends Controller
 			}
 		}
 
-		return view($request->ajax() ? 'partial/programitems' : 'programlist', ['programs' => array_reverse($programs)]);
+		return view($request->ajax() ? 'partial/programitems' : 'programlist', ['programs' => array_reverse($programs), 'isPodcast' => false]);
 	}
 
     private function getPodcastList(Request $request, $action, $viewData = [])
@@ -120,7 +120,7 @@ class RadioController extends Controller
             $podcasts[] = new \Model\Podcast($podcast);
         }
 
-        return view($request->ajax() ? 'partial/podcastitems' : 'podcastlist', array_merge($viewData, ['id' => 'items-podcasts', 'podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken']));
+        return view($request->ajax() ? 'partial/podcastitems' : 'podcastlist', array_merge($viewData, ['id' => 'items-podcasts', 'podcasts' => $podcasts, 'searchURL' => 'gemist/zoeken', 'isPodcast' => false]));
     }
 
 }

app/Http/Controllers/StreamController.php

@@ -14,6 +14,8 @@ class StreamController extends Controller
         return view('listen', [
             'source' => self::$STREAM_URL . 'mp3live',
             'title' => 'Luister live',
+            'lengte' => 0,
+            'waveform' => null,
             'content' => 'de live-uitzending van NH Gooi.',
             'isStream' => true ]);
     }
@@ -30,6 +32,17 @@ class StreamController extends Controller
         return view('watch', ['title' => 'Kijk NH Gooi Tv Studio', 'stream' => 'https://studiocam.nhgooi.nl/studiocam/live/index.m3u8']);
     }
 
+    public function inline(Request $request, $id)
+    {
+        $apiResult = $this->API('podcast/details/' . (int)$id);
+        $podcast = new \Model\Podcast($apiResult);
+        if(sha1($id . ':' . date('Y-m-d')) != $request->get('auth')) {
+         // return view('widgets/podcastplayer', ['podcast' => null]);
+	}
+
+        return view('widgets/podcastplayer', ['podcast' => $podcast]);
+    } 
+
     public function podcast(Request $request, $id)
     {
         $apiResult = $this->API('podcast/details/' . (int)$id);
@@ -39,16 +52,23 @@ class StreamController extends Controller
         }
 
         return view('listen', [
-            'source' => $this->API_URL . 'podcast/download' . $apiResult->url . '?auth=' . $podcast->auth,
+            'source' => $this->API_URL . 'podcast/stream/' . $apiResult->url,
             'title' => $podcast->title,
             'content' => $podcast->title,
+            'lengte' => $podcast->duration / 1000,
+            'waveform' => $podcast->waveform,
             'isStream' => false,
-            'canDownload' => true ]);
+            'canDownload' => $this->API_URL . 'podcast/download/' . $apiResult->url ]);
     }
 
     public function program(Request $request, $year, $month, $day, $hour, $duration, $offset = 0) {
         $date = (new \DateTimeImmutable())->setDate($year, $month, $day)->setTime($hour, 0, 0);
-        $current = $date->add(\DateInterval::createFromDateString($offset . ' hours'));
+        $current = $date->add(\DateInterval::createFromDateString($offset . ' hours'));                
+
+        $programma = $this->API("programma/details/" . $current->Format("Y/m/d/H"));
+        if(!$programma->is_beschikbaar) {
+            return view('listen', ['notAvailable' => true]);
+        }
 
         $hours = [];
         for($i = 0; $i < $duration; $i++) {
@@ -58,10 +78,12 @@ class StreamController extends Controller
         }
 
         return view('listen', [
-            'source' => $this->API_URL . 'programma/download/' . $current->format('Y/m/d/H') . '/1',
+            'source' => $this->API_URL . 'programma/stream/' . $current->format('Y/m/d/H'),
             'tabs' => $hours,
             'title' => 'Uitzending terugluisteren',
-            'content' => 'de uitzending van ' . $current->format('d-m-Y, H') . ':00 uur',
+            'lengte' => $programma->waveform->length,
+            'waveform' => $programma->waveform,
+            'content' => $programma->programma->name . ' van ' . $current->format('d-m-Y, H') . ':00 uur',
             'isStream' => false,
             'canDownload' => false ]);
     }
@@ -77,10 +99,10 @@ class StreamController extends Controller
 
     public function kerkdienst(Request $request) {
         return view('listen', [
-            'source' => $this->API_URL . 'kerkdienst/download',
+            'source' => $this->API_URL . 'kerkdienst/stream',
             'title' => 'Kerkdienst gemist',
             'content' => 'de kerkdienst van afgelopen zondag',
             'isStream' => false,
-            'canDownload' => true ]);
+            'canDownload' => $this->API_URL . 'kerkdienst/download' ]);
     }
 }

app/Models/Blog.php

@@ -0,0 +1,23 @@
+<?php 
+
+namespace Model;
+
+class Blog extends Model {
+  public $id;
+  public $title;
+  public $description;
+  public $news_category;
+  public $start_date;
+  public $end_date; 
+  public $is_active;
+
+  public $url;
+
+  public function __construct($data, $images = null, $podcast = null) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->start_date);
+    parent::ConvertToDateTime($this->end_date);
+
+    $this->url = "/blog/{$this->id}/" . parent::url_slug($this->title);
+  }
+}

app/Models/CalendarEvent.php

@@ -0,0 +1,67 @@
+<?php 
+
+namespace Model;
+
+class CalendarEvent extends Model {
+  public $id;
+  public $title;
+  public $region;
+  public $content;
+  public $starts;
+  public $ends; 
+  public $images;
+  public $podcast;
+  public $video;
+  public $keywords;
+  public $url;
+  public $metadata;
+  public $tags;
+
+  public function __construct($data, $images = null, $podcast = null) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->starts);
+    parent::ConvertToDateTime($this->ends);
+
+    $this->keywords = null;
+    if(isset($data->keywords)) {
+        if(is_array($data->keywords)) {
+          $this->keywords = $data->keywords;
+        } else if(trim($data->keywords)) { 
+          $this->keywords = explode(' ', $data->keywords);
+        }
+    }
+
+    if($podcast)
+    {
+        $this->podcast = new \Model\Podcast($podcast);
+    } else if(isset($data->podcast) && $data->podcast) { 
+        $this->podcast = new \Model\Podcast($data->podcast);
+    }
+     
+    $images = ($images != null) ? $images
+            : (isset($data->images) ? $data->images : null);
+    if($images) {
+        $this->images = [];
+        foreach($images as $image) {
+            $this->images[] = new NewsImage($image, '/img/news/');
+        }
+    }
+
+    $this->url = "/agenda/{$this->id}/" . parent::url_slug($this->title);
+    $this->metadata = (new MetaData())
+      ->set('title', $this->title)
+      ->set('description', strip_tags($this->excerpt()))
+      ->set('image', isset($this->images) && count($this->images) ? $this->images[0]->url : null )
+      ->set('audio', isset($this->podcast) ? $this->podcast->url : null)
+     ;
+  }
+
+  public function excerpt() {
+    $hasImages = isset($this->images) && count($this->images) > 0;
+    $maxLength = $hasImages ? 200 : 500;
+    return '<p class="news-excerpt ' . ($hasImages ? 'short' : 'long') . '">' . 
+      substr($this->content, 0, $maxLength) . 
+      (strlen($this->content) > $maxLength ? '...' : '') . 
+      '</p>'; 
+  }
+}

app/Models/JobOpening.php

@@ -0,0 +1,61 @@
+<?php 
+
+namespace Model;
+
+class JobOpening extends Model {
+  public $id;
+  public $title;
+  public $content;
+  public $starts;
+  public $ends; 
+  public $images;
+  public $url;
+
+  public function __construct($data, $images = null, $podcast = null) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->starts);
+    parent::ConvertToDateTime($this->ends);
+
+    $this->keywords = null;
+    if(isset($data->keywords)) {
+        if(is_array($data->keywords)) {
+          $this->keywords = $data->keywords;
+        } else if(trim($data->keywords)) { 
+          $this->keywords = explode(' ', $data->keywords);
+        }
+    }
+
+    if($podcast)
+    {
+        $this->podcast = new \Model\Podcast($podcast);
+    } else if(isset($data->podcast) && $data->podcast) { 
+        $this->podcast = new \Model\Podcast($data->podcast);
+    }
+     
+    $images = ($images != null) ? $images
+            : (isset($data->images) ? $data->images : null);
+    if($images) {
+        $this->images = [];
+        foreach($images as $image) {
+            $this->images[] = new NewsImage($image, '/img/news/');
+        }
+    }
+
+    $this->url = "/vacatures/{$this->id}/" . parent::url_slug($this->title);
+    $this->metadata = (new MetaData())
+      ->set('title', $this->title)
+      ->set('description', strip_tags($this->excerpt()))
+      ->set('image', isset($this->images) && count($this->images) ? $this->images[0]->url : null )
+      ->set('audio', isset($this->podcast) ? $this->podcast->url : null)
+     ;
+  }
+
+  public function excerpt() {
+    $hasImages = count($this->images) > 0;
+    $maxLength = $hasImages ? 200 : 500;
+    return '<p class="news-excerpt ' . ($hasImages ? 'short' : 'long') . '">' . 
+      substr($this->content, 0, $maxLength) . 
+      (strlen($this->content) > $maxLength ? '...' : '') . 
+      '</p>'; 
+  }
+}

app/Models/Kerkdienst.php

@@ -0,0 +1,26 @@
+<?php 
+
+namespace Model;
+
+class KerkdienstInstance extends Model {
+  public $name;
+  public $start;
+
+  public function __construct($data) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->start);
+  }
+}
+
+class Kerkdienst extends Model {
+  public $isRunning;
+  public $previous;
+  public $next;
+
+  public function __construct($data) {
+    // parent::__construct($data);
+    $this->isRunning = $data->isRunning;
+    $this->previous = new KerkdienstInstance($data->previous);
+    $this->next = new KerkdienstInstance($data->next);
+  }
+}

app/Models/MetaData.php

@@ -0,0 +1,35 @@
+<?php
+namespace Model;
+
+class MetaData {
+  private $data = ['type' => 'article', 'locale' => 'nl-nl'];
+
+  public function set($prop, $val) {
+    if($val) {
+      $this->data[$prop] = $val;
+    }
+    return $this;
+  }
+
+  public function append($prop, $val) {
+    if(array_key_exists($prop, $this->data)) {
+      $this->data[$prop] .= $val;
+    }
+    return $this;
+  }
+
+  public function prepend($prop, $val) {
+    if(array_key_exists($prop, $this->data)) {
+      $this->data[$prop] = $val . $this->data[$prop];
+    }
+    return $this;
+  }
+
+  public function metaTags() {
+    foreach($this->data as $prop => $val) {
+      if($val) {
+        echo "<meta property=\"og:$prop\" content=\"" . htmlentities($val) . "\" />\n";
+      }
+    }
+  }
+}

app/Models/Model.php

@@ -0,0 +1,64 @@
+<?php 
+
+namespace Model;
+
+class Model {
+    protected function ConvertToDateTime(&$field) {
+        if($field) { 
+            // PHP7 JSON-encodes to {date: "", "timezone_type": ..., "timezone": "UTC" }
+            // In that case $field will be an object
+            if(is_object($field)) { 
+                $field = ($field->timezone) 
+                    ? new \DateTimeImmutable($field->date, new \DateTimeZone($field->timezone)) 
+                    : (new \DateTimeImmutable($field->date));
+            } else { 
+                // If $field is not an object, assume it's a plain, valid, string
+                $field = new \DateTime($field);
+            }
+
+            if($field === false || $field->getTimestamp() <= 0) {
+                // If field had data but is invalid DateTime or is 0000-00-00 00:00, set it to null.
+                $field = null;
+            } else { 
+              // If valid, return local timezone
+              $field->setTimezone(new \DateTimeZone("Europe/Amsterdam"));
+            }
+        }
+    }
+
+    public function __construct($data) {
+        $class = get_class($this);
+        foreach($data as $key => $val) {
+            if(property_exists($class, $key)) {
+                $this->$key = is_string($val) ? stripslashes($val) : $val;
+            }
+        }
+    }
+
+    public function url_slug($text) {
+        // Alles naar kleine letter
+        $text = strtolower($text);
+
+        // Vervang accent-tekens door niet-geaccentueerde versies
+        // $text = iconv('UTF-8', 'ASCII//TRANSLIT//IGNORE', $text);
+        $search = explode(",","ç,æ,œ,á,é,í,ó,ú,à,è,ì,ò,ù,ä,ë,ï,ö,ü,ÿ,â,ê,î,ô,û,å,e,i,ø,u");
+        $replace = explode(",","c,ae,oe,a,e,i,o,u,a,e,i,o,u,a,e,i,o,u,y,a,e,i,o,u,a,e,i,o,u");
+        $text = str_replace($search, $replace, $text);
+
+        // Verwijder alle woorden van 3 letters, behalve BEL (BEL-combinatie etc)
+        if(strlen($text) > 3) {
+          $text = preg_replace('/\b(?!bel|fm|nh)([a-z]{1,3})\b/u', '', $text);
+        }
+
+        // Vervang alles dat niet een woord-karakter is (letter, cijfer), een streepje of spatie
+        if(strlen($text) > 3) {
+          $text = preg_replace('/[^\w_\-\s]/', '', $text);
+        }
+
+        // Reeksen van één of meer spaties / streepjes vervangen door een enkel streepje
+        $text = preg_replace('/[\-\s]+/', '-', $text);
+
+        // Verwijder alle witruimte / streepjes aan begin en eind
+        return trim(strtolower($text), '-');
+    }
+}

app/Models/NewsImage.php

@@ -0,0 +1,20 @@
+<?php 
+
+namespace Model;
+
+class NewsImage extends Model {
+    public $id;
+    public $title;
+    public $author;
+    public $url;
+
+    public function __construct($data, $urlPrefix = '/') { 
+      parent::__construct($data);
+
+      // Deserialisatie van JSON heeft url in data, 
+      // lezen uit database heeft file en (als het goed is) urlPrefix
+      if(isset($data->file)) {
+          $this->url = $urlPrefix . $data->file; 
+      }
+    }
+}

app/Models/NewsItem.php

@@ -0,0 +1,118 @@
+<?php 
+
+namespace Model;
+
+require_once "NewsImage.php";
+require_once "NewsSource.php";
+require_once "MetaData.php";
+
+class NewsItem extends Model {
+  public $id;
+  public $title;
+  public $author;
+  public $content;
+  public $published;
+  public $edited; 
+  public $keywords;
+
+  public $source;
+  public $category;
+  public $theme;
+  public $region;
+  public $tags;
+  
+  public $podcast;
+  public $images;
+  public $video;
+  
+  public $url;
+  public $metadata;
+
+  public function __construct($data, $images = null, $podcast = null) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->published);
+    parent::ConvertToDateTime($this->edited);
+
+    if($this->edited && ($this->edited->getTimestamp() - $this->published->getTimestamp() < 1800 /* == 30 minutes */)) {
+      // If last edit was within grace period, consider it unedited (note: currently RES always saves edited == published on creation)
+      $this->edited = null;
+    }
+    
+    $this->source = null;
+    if(isset($data->source))
+    {
+      if(is_object($data->source))
+      {
+         $this->source = new \Model\NewsSource($data->source->title, $data->source->url, $data->source->show);
+      } else if($data->source) {
+         $this->source = new \Model\NewsSource($data->source, $data->source_url, $data->showsource);
+      }
+    }
+
+    if($podcast) {
+        $this->podcast = new \Model\Podcast($podcast);
+    } else if(isset($data->podcast) && $data->podcast) { 
+        $this->podcast = new \Model\Podcast($data->podcast);
+    }
+
+    $this->keywords = null;
+    if(isset($data->keywords)) {
+      if(is_array($data->keywords) || is_object($data->keywords)) {
+        $this->keywords = $data->keywords;
+      } else if(trim($data->keywords)) { 
+        $this->keywords = explode(' ', $data->keywords);
+      }
+    }
+
+    if(isset($data->region)) { 
+      if(is_object($data->region)) { 
+        $this->region = new \Model\NewsRegion($data->region->title, $data->region->slug);
+      } else {
+        $this->region = new \Model\NewsRegion($data->region, $data->region_slug);
+      }
+    }
+
+    if(isset($data->theme)) { 
+      if(is_object($data->theme)) { 
+        $this->theme = new \Model\NewsRegion($data->theme->title, $data->theme->slug);
+      } else {
+        $this->theme = new \Model\NewsRegion($data->theme, $data->theme_slug);
+      }
+    }
+  
+    if(isset($data->tags)) {
+      foreach($data->tags as $tag) {
+        $this->theme = new \Model\NewsRegion($tag->titel, $tag->slug);
+      }
+    }
+
+    $images = ($images != null) ? $images
+            : (isset($data->images) ? $data->images : null);
+    if($images) {
+        $this->images = [];
+        foreach($images as $image) {
+            $this->images[] = new NewsImage($image, '/img/news/');
+        }
+    }
+
+    $this->url = "/nieuws/{$this->id}/" . parent::url_slug($this->title);
+    $this->metadata = (new MetaData())
+      ->set('title', $this->title)
+      ->set('description', strip_tags($this->excerpt()))
+      ->set('image', isset($this->images) && count($this->images) ? $this->images[0]->url : null )
+      ->set('video', isset($this->video) ? $this->video : null)
+      ->set('audio', isset($this->podcast) ? $this->podcast->url : null)
+      ->set('article:published_time', $this->published->format('r'))
+      ->set('article:modified_time', $this->edited ? $this->edited->format('r') : null)
+      ;
+  }
+
+  public function excerpt() {
+    $hasImages = isset($this->images) && count($this->images) > 0;
+    $maxLength = $hasImages ? 200 : 500;
+    return '<p class="news-excerpt ' . ($hasImages ? 'short' : 'long') . '">' . 
+      substr($this->content, 0, $maxLength) . 
+      (strlen($this->content) > $maxLength ? '...' : '') . 
+      '</p>'; 
+  }
+}

app/Models/NewsSource.php

@@ -0,0 +1,25 @@
+<?php 
+
+namespace Model;
+
+class NewsRegion {
+    public $title;
+    public $slug;
+
+    public function __construct($title, $slug = null) {
+        $this->title = $title;
+        $this->slug = $slug ? $slug : strtolower(str_replace(' ', '', $title));
+    }
+}
+
+class NewsSource {
+    public $title;
+    public $url;
+    public $show;
+
+    public function __construct($title, $url, $show) { 
+        $this->title = $title;
+        $this->url = $url;
+        $this->show = $show;
+    }
+}

app/Models/Podcast.php

@@ -0,0 +1,94 @@
+<?php 
+
+namespace Model;
+
+require_once "NewsImage.php";
+
+class Podcast extends Model {
+  public $id;
+  public $title;
+  public $content;
+  protected $soundfilename;
+  public $created; 
+  public $program;
+  public $url;
+  public $auth;
+  public $download;
+  public $duration;
+  public $image;
+  public $metadata;
+  public $waveform;
+  private $key;
+
+  public function __construct($data) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->created);
+
+    $this->url = '/' . $this->id . '/' . parent::url_slug($this->title) . '.mp3';
+    if($this->soundfilename) {
+      // Only generate when not constructing from a JSON object
+      $this->key = sha1($this->id . ':' . date('Y-m-d') . ':' . $this->soundfilename);
+      $this->auth = $this->key;
+    }
+
+    if(isset($data->program)) {
+      $this->program = null;
+      if(is_object($data->program)) {
+        $this->program = new \Model\Program($data->program);
+      } elseif($data->program) { 
+        $this->program = new \Model\Program(['id' => $data->program, 'name' => $data->program_name, 'description' => $data->program_description]);
+      }
+    }
+
+    if(isset($data->imagefile)) {
+      $imagedata = new \stdClass();
+      $imagedata->id = $this->id;
+      $imagedata->file = $data->imagefile;
+      $imagedata->title = $data->imagecaption;
+      $this->image = new NewsImage($imagedata, '/img/podcast/');
+    }
+
+    if(isset($data->metadata, $data->metadata->waveform)){
+      $this->waveform = $data->metadata->waveform;
+    }
+
+    $this->metadata = (new MetaData())
+      ->set('title', $this->title)
+      ->set('description', strip_tags($this->excerpt()))
+      ->set('image', isset($this->image) ? $this->image->url : null )
+      ->set('audio', $this->url)
+     ;
+  }
+
+  public function titleWithoutProgram() { 
+    if(!$this->program) { return $this->title; }
+    return trim(str_replace($this->program->name, '', $this->title), "- \t\n\r\0\x0B");
+  }
+
+  public function isValidAuth($key) {
+    return ($key == $this->key);
+  }
+
+  public function getSoundfile() {
+    return '/var/audio/podcast/' . $this->soundfilename; 
+  }
+
+  public function formatDuration() {
+    $seconds = $this->duration / 1000;
+    $milliseconds = $this->duration % 1000;
+  
+    $hours = ($seconds > 3600) ? floor($seconds / 3600) : 0;
+    $seconds %= 3600;
+    return str_pad($hours, 2, '0', STR_PAD_LEFT)
+         . gmdate(':i:s', $seconds)
+         ;//. ($milliseconds ? ".$milliseconds" : '') ;
+  }
+
+  public function excerpt() {
+    $maxLength = 500;
+    return '<p class="news-excerpt long">' . 
+      substr($this->content, 0, $maxLength) . 
+      (strlen($this->content) > $maxLength ? '...' : '') . 
+      '</p>'; 
+  }
+}

app/Models/Program.php

@@ -0,0 +1,55 @@
+<?php 
+
+namespace Model;
+
+class Program extends Model {
+  public $id;
+  public $name;
+  public $tagline;
+  public $description;
+  public $email;
+  public $nonstop;
+  public $rerun;
+  public $priority;
+  public $image;
+
+  public $hosts;
+  public $recent;
+  public $next;
+
+  public function __construct($data) {
+    parent::__construct($data);
+
+    if(isset($data->suffix) && $data->suffix) { 
+      $this->name .= ' ' . $data->suffix;
+    } 
+
+    if($this->recent && $this->recent) {
+      foreach($this->recent as &$recent) {
+        parent::ConvertToDateTime($recent->starts);
+        parent::ConvertToDateTime($recent->ends);
+      }
+    }
+    if($this->next && $this->next) {
+      foreach($this->next as &$next) {
+        parent::ConvertToDateTime($next->starts);
+        parent::ConvertToDateTime($next->ends);
+      }
+    }
+
+    if(isset($data->email) && ($mailComma = strpos($data->email, ',')) !== false) {
+      $this->email = substr($data->email, 0, $mailComma);
+    }
+
+    if(isset($data->state)) {
+      $this->nonstop = $data->state == 0;
+      $this->rerun = $data->state == 3;
+    }
+
+    $this->url = "/{$this->id}/" . parent::url_slug($this->name);
+  }
+ 
+  public function isSpecial() {
+    return ($this->priority < 2);
+  }
+}

app/Models/ProgramHost.php

@@ -0,0 +1,10 @@
+<?php 
+
+namespace Model;
+
+class ProgramHost extends Model {
+  public $id;
+  public $name;
+  public $email;
+}
+

app/Models/Track.php

@@ -0,0 +1,47 @@
+<?php 
+
+namespace Model;
+
+class Track extends Model {
+  public $start;
+  public $itemCode;
+  public $title;
+  public $artist;
+  public $duration;
+  public $ends;
+  public $isLayout;
+
+  public function __construct($data) {
+    parent::__construct($data);
+    parent::ConvertToDateTime($this->start);
+    parent::ConvertToDateTime($this->ends);
+    $isLayout = $this->isLayout();
+  }
+
+  private static $IDENTS = ['UURSLUITER' => 'Nieuws', 'NIEUWSOPEN ' => 'Nieuws', 'ANWB' => 'Verkeersinformatie', 'REGIO' => 'Regionieuws', 'CB' => 'Reclame'];
+
+  public function isLayout() {
+    foreach(self::$IDENTS as $ident => $display) {
+      if(substr($this->itemCode, 0, strlen($ident)) == $ident || substr($this->title, 0, strlen($ident)) == $ident) {
+        $this->title = $display;
+         $this->artist = "";
+         $this->itemCode = '_' . $this->itemCode;
+         return false;
+       }
+     }
+
+    if(strlen($this->itemCode) > 0 && ($this->itemCode[0] == 'V')) {
+      return true;
+    }
+
+    return false;
+  }
+
+  public function ends($ends = null) {
+    $this->ends = $ends;
+  }
+
+  public function secondsRemaining() {
+    return ($this->ends) ? ($this->ends->getTimestamp() - time()) : -1;
+  }
+}

composer.json

@@ -27,7 +27,7 @@
             "Database\\Factories\\": "database/factories/",
             "Database\\Seeders\\": "database/seeders/",
 	    "Helpers\\": "app/Helpers",
-	    "Model\\": "/srv/api/common/classes"
+	    "Model\\": "app/Models"
         }
     },
     "autoload-dev": {

public/css/style.css

@@ -162,6 +162,16 @@ div.pp_default .pp_close:hover {
   list-style: none;
 }
 
+.ad-prefix {
+  width: 100%;
+  font-family: Nunito, serif;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 3.17;
+  text-align: center;
+  color: #666;
+}
+
 .header {
   height: 111px;
 }
@@ -172,10 +182,11 @@ div.pp_default .pp_close:hover {
 .header .logo img {
   height: 95px;
 }
-.header .advertisement {
+.header ins[data-revive-zoneid] {
   float: right;
   width: 728px;
   height: 90px;
+  margin-top: 10px;
 }
 
 @media (max-width: 1170px) {
@@ -190,7 +201,7 @@ div.pp_default .pp_close:hover {
   .header .logo {
     float: none;
   }
-  .header .advertisement {
+  .header ins[data-revive-zoneid] {
     float: none;
   }
 }
@@ -319,7 +330,7 @@ div.pp_default .pp_close:hover {
   padding: 3px 9px 3px 6px;
   margin: 8px auto;
 }
-.top_menu_container ul.right_menu li:last-child, .menu_mobile_container ul.right_menu li:last-child {
+.top_menu_container ul.right_menu li.search, .menu_mobile_container ul.right_menu li.search {
   border: none;
   line-height: 1;
 }
@@ -725,6 +736,8 @@ div.pp_default .pp_close:hover {
   margin: 0;
   padding: 0;
   list-style: none;
+  display: flex;
+  gap: 3px;
 }
 .blog_grid .post .slider_content_box .post_details .category a {
   padding: 6px 11px 7px;
@@ -776,6 +789,11 @@ div.pp_default .pp_close:hover {
   color: #fff;
 }
 
+.article-iframe {
+  width: 100%;
+  aspect-ratio: 1;
+}
+
 .box_header {
   border-bottom: 1px solid #efefef;
   padding-right: 20px;
@@ -1149,6 +1167,16 @@ div.pp_default .pp_close:hover {
   white-space: nowrap;
 }
 
+@media (max-width: 576px) {
+  ins[data-revive-zoneid] img {
+    max-width: 100%;
+    height: auto;
+  }
+}
+.homepage-body-banners {
+  margin-top: -4rem;
+}
+
 .news .blog .post {
   height: 115px;
 }
@@ -1202,6 +1230,19 @@ div.pp_default .pp_close:hover {
   font-size: 30px;
 }
 
+.box.featured .sentence, .post_container .post_body .sentence {
+  font-size: 12px;
+  font-style: italic;
+  line-height: 1.3;
+  text-align: right;
+  color: #585858;
+  display: block;
+  width: 100%;
+}
+.box.featured .sentence span, .post_container .post_body .sentence span {
+  padding: 0 5px;
+}
+
 .post_container {
   max-width: 1170px;
   margin: 0 auto;
@@ -1229,18 +1270,6 @@ div.pp_default .pp_close:hover {
 .post_container .post_body h3 {
   font-size: 15px;
 }
-.post_container .post_body .sentence {
-  font-size: 12px;
-  font-style: italic;
-  line-height: 1.3;
-  text-align: right;
-  color: #585858;
-  display: block;
-  width: 100%;
-}
-.post_container .post_body .sentence span {
-  padding: 0 5px;
-}
 .post_container .post_body blockquote {
   border-left: 3px solid #5ba8f4;
   margin-left: 0;
@@ -1258,6 +1287,9 @@ div.pp_default .pp_close:hover {
   line-height: 3.17;
   color: #585858;
 }
+.post_container .post_body div.text {
+  margin-bottom: 20px;
+}
 .post_container .post_body .post_details {
   margin: 0;
   padding: 0;
@@ -1305,19 +1337,9 @@ div.pp_default .pp_close:hover {
   color: #ED1C24;
 }
 
-.post_tags {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  height: 31px;
-  margin: 20px 0;
-}
-.post_tags li {
-  float: left;
-  margin-right: 10px;
-}
-.post_tags li a {
+#schedule .onair, .post_tags li a {
   display: block;
+  width: 4rem;
   padding: 6px 15px 7px;
   border-radius: 3px;
   background-image: linear-gradient(to left, #0d1ca3, #45aaf8);
@@ -1330,6 +1352,34 @@ div.pp_default .pp_close:hover {
   text-transform: uppercase;
 }
 
+.post_tags {
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  height: 31px;
+  margin: 20px 0;
+}
+.post_tags li {
+  float: left;
+  margin-right: 10px;
+}
+@keyframes tilt-shaking {
+  0% {
+    transform: rotate(0deg);
+  }
+  25% {
+    transform: rotate(5deg);
+  }
+  50% {
+    transform: rotate(0deg);
+  }
+  75% {
+    transform: rotate(-5deg);
+  }
+  100% {
+    transform: rotate(0deg);
+  }
+}
 #schedule a {
   text-decoration: none;
 }
@@ -1371,6 +1421,9 @@ div.pp_default .pp_close:hover {
 #schedule .no-results span, #schedule .loading span {
   margin-right: 10px;
 }
+#schedule .onair {
+  animation: tilt-shaking 1s linear infinite;
+}
 
 .page_container {
   max-width: 1170px;
@@ -1460,6 +1513,90 @@ div.pp_default .pp_close:hover {
   margin: 10px 20px 0 0;
 }
 
+.podcast-player .content {
+  border: solid 1px #333;
+  border-radius: 5px;
+  padding: 0.4rem;
+}
+
+.audioplayer .waveform {
+  cursor: pointer;
+  position: relative;
+}
+.audioplayer .hover {
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 10;
+  pointer-events: none;
+  height: 100%;
+  width: 0;
+  mix-blend-mode: overlay;
+  background: rgba(255, 255, 255, 0.5);
+  opacity: 0;
+  transition: opacity 0.2s ease;
+}
+.audioplayer .waveform:hover .hover {
+  opacity: 1;
+}
+.audioplayer .time,
+.audioplayer .duration {
+  position: absolute;
+  z-index: 11;
+  top: 50%;
+  margin-top: -1px;
+  transform: translateY(-50%);
+  font-size: 11px;
+  background: rgba(0, 0, 0, 0.75);
+  padding: 2px;
+  color: #ddd;
+}
+.audioplayer .time {
+  left: 0;
+}
+.audioplayer .duration {
+  right: 0;
+}
+.audioplayer .audio-controls {
+  width: 100%;
+  justify-content: center;
+  display: flex;
+}
+.audioplayer .audio-controls .btn {
+  padding-left: 0;
+  padding-right: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  text-transform: none;
+}
+@media (max-width: 720px) {
+  .audioplayer .audio-controls .btn label {
+    display: none;
+  }
+}
+.audioplayer .audio-controls .btn.btn-play {
+  flex: 50% 1 0;
+}
+.audioplayer .volume-controls {
+  display: flex;
+}
+.audioplayer .volume-controls .volume-slider {
+  flex: 100% 1 1;
+}
+.audioplayer .audio-controls .btn,
+.audioplayer .volume-controls .btn-toggle-mute {
+  flex: 100px 1 1;
+  padding: 10px 0 10px 0;
+  background: #5ba8f4;
+  border-radius: 5px;
+  border-color: solid 1px #0f259d;
+  color: white;
+  font-family: Nunito, serif;
+  text-align: center;
+  text-decoration: none;
+}
+
 .footer_container {
   font-family: Montserrat, serif;
   font-size: 14px;

public/js/main.js

@@ -1 +0,0 @@
-

resources/assets/sass/base/_base.scss

@@ -5,6 +5,7 @@
 @use "../components/pretty_photo";
 @use "../components/cookie";
 @use "../components/list";
+@use "../components/banners";
 
 @use "../layout";
 

resources/assets/sass/components/_banners.scss

@@ -0,0 +1,9 @@
+.ad-prefix {
+  width: 100%;
+  font-family: Nunito, serif;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 3.17;
+  text-align: center;
+  color: #666;
+}

resources/assets/sass/components/_header.scss

@@ -7,10 +7,11 @@
       height: 95px;
     }
   }
-  .advertisement {
+  ins[data-revive-zoneid] {
     float: right;
     width: 728px;
     height: 90px;
+    margin-top: 10px;
   }
 }
 
@@ -25,7 +26,7 @@
     .logo {
       float: none;
     }
-    .advertisement {
+    ins[data-revive-zoneid] {
       float: none;
     }
   }

resources/assets/sass/components/_main_news.scss

@@ -61,7 +61,8 @@
 
       .post_details {
         @include reset-list;
-
+        display: flex;
+        gap: 3px;
         .category a {
           padding: 6px 11px 7px;
           border-radius: 3px;
@@ -105,3 +106,8 @@
     }
   }
 }
+
+.article-iframe {
+  width: 100%;
+  aspect-ratio: 1;
+}

resources/assets/sass/components/_media.scss

@@ -0,0 +1,91 @@
+.audioplayer {
+  .waveform {
+    cursor: pointer;
+    position: relative;
+  }
+
+  .hover {
+    position: absolute;
+    left: 0;
+    top: 0;
+    z-index: 10;
+    pointer-events: none;
+    height: 100%;
+    width: 0;
+    mix-blend-mode: overlay;
+    background: rgba(255, 255, 255, 0.5);
+    opacity: 0;
+    transition: opacity 0.2s ease;
+  }
+
+  .waveform:hover .hover {
+    opacity: 1;
+  }
+
+  .time,
+  .duration {
+    position: absolute;
+    z-index: 11;
+    top: 50%;
+    margin-top: -1px;
+    transform: translateY(-50%);
+    font-size: 11px;
+    background: rgba(0, 0, 0, 0.75);
+    padding: 2px;
+    color: #ddd;
+  }
+
+  .time {
+    left: 0;
+  }
+
+  .duration {
+    right: 0;
+  }
+
+  .audio-controls {
+    width: 100%;
+    justify-content: center;
+    display: flex;
+  }
+
+  .audio-controls .btn {
+    padding-left: 0;
+    padding-right: 0;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    text-transform: none;
+  }
+
+  @media(max-width: 720px) {
+    .audio-controls .btn label {
+      display: none;
+    }
+  }
+
+  .audio-controls .btn.btn-play {
+    flex: 50% 1 0;
+  }
+
+  .volume-controls {
+    display: flex;
+  }
+
+  .volume-controls .volume-slider {
+    flex: 100% 1 1;
+  }
+
+  .audio-controls .btn,
+  .volume-controls .btn-toggle-mute {
+    flex: 100px 1 1;
+    padding: 10px 0 10px 0;
+    background: #5ba8f4;
+    border-radius: 5px;
+    border-color: solid 1px #0f259d;
+    color: white;
+    font-family: Nunito, serif;
+    text-align: center;
+    text-decoration: none;
+  }
+}

resources/assets/sass/components/_menu.scss

@@ -124,7 +124,7 @@
         margin: 8px auto;
       }
 
-      &:last-child {
+      &.search {
         border: none;
         line-height: 1;
       }

resources/assets/sass/components/_podcast_item.scss

@@ -12,3 +12,9 @@
   float: left;
   margin: 10px 20px 0 0;
 }
+
+.podcast-player .content {
+  border: solid 1px #333;
+  border-radius: 5px;
+  padding: 0.4rem;
+}

resources/assets/sass/components/_post.scss

@@ -1,6 +1,20 @@
 @use "../abstracts/mixin" as *;
 @use "../abstracts/variables" as *;
 
+%sentence {
+  font-size: 12px;
+  font-style: italic;
+  line-height: 1.3;
+  text-align: right;
+  color: $text-description-color;
+  display: block;
+  width: 100%;
+
+  span {
+    padding: 0 5px;
+  }
+}
+
 .post_container {
   @include container;
   @media (min-width: 768px) {
@@ -30,17 +44,15 @@
     }
 
     .sentence {
-      font-size: 12px;
-      font-style: italic;
-      line-height: 1.3;
-      text-align: right;
-      color: $text-description-color;
-      display: block;
-      width: 100%;
+      @extend %sentence
+    }
 
-      span {
-        padding: 0 5px;
-      }
+    @at-root .box.featured .sentence {
+      @extend %sentence
+    }
+
+    div.text {
+      margin-bottom: 20px;
     }
 
     blockquote {
@@ -106,6 +118,22 @@
     }
   }
 }
+
+%post-tags-link {
+  display: block;
+  width: 4rem;
+  padding: 6px 15px 7px;
+  border-radius: 3px;
+  background-image: linear-gradient(to left, #0d1ca3, #45aaf8);
+  font-family: Nunito, serif;
+  font-size: 10px;
+  font-weight: bold;
+  text-align: center;
+  color: $text-inverted-color;
+  text-decoration: none;
+  text-transform: uppercase;
+}
+
 .post_tags {
   @include reset-list;
   height: 31px;
@@ -116,17 +144,11 @@
     margin-right: 10px;
 
     a {
-      display: block;
-      padding: 6px 15px 7px;
-      border-radius: 3px;
-      background-image: linear-gradient(to left, #0d1ca3, #45aaf8);
-      font-family: Nunito, serif;
-      font-size: 10px;
-      font-weight: bold;
-      text-align: center;
-      color: $text-inverted-color;
-      text-decoration: none;
-      text-transform: uppercase;
+      @extend %post-tags-link
+    }
+
+    @at-root #schedule .onair {
+      @extend %post-tags-link
     }
   }
 }

resources/assets/sass/components/_schedule.scss

@@ -1,6 +1,14 @@
 @use "../abstracts/mixin" as *;
 @use "../abstracts/variables" as *;
 
+@keyframes tilt-shaking {
+    0% { transform: rotate(0deg); }
+   25% { transform: rotate(5deg); }
+   50% { transform: rotate(0deg); }
+   75% { transform: rotate(-5deg); }
+  100% { transform: rotate(0deg); }
+}
+
 #schedule {
   a {
     text-decoration: none;
@@ -32,4 +40,8 @@
       margin-right: 10px;
     }
   }
+
+  .onair {
+    animation: tilt-shaking 1s linear infinite;
+  }
 }

resources/assets/sass/layout/_home.scss

@@ -6,3 +6,14 @@
 @use "../components/contact_box";
 @use "../components/featured";
 @use "../components/podcast_items";
+
+@media (max-width: 576px) {
+  ins[data-revive-zoneid] img {
+    max-width: 100%;
+    height: auto;
+  }
+}
+
+.homepage-body-banners {
+  margin-top: -4rem;
+}

resources/assets/sass/layout/_podcast.scss

@@ -1 +1,2 @@
 @use "../components/podcast_item";
+@use "../components/media";

resources/views/calendarevent.blade.php

@@ -12,7 +12,7 @@
 	<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="Regio-agenda" href="{{route('agenda')}}">Regio-agenda</a></li>
+		<li><a title="Streekagenda" href="{{route('agenda')}}">Streekagenda</a></li>
 		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
 		<li>Details</li>
 	</ul>
@@ -24,7 +24,7 @@
 	<div class="post single small_image">
 		<ul class="post_details clearfix">
 			@if($event->region)
-				<li class="detail category"><i class="fa-solid fa-location-dot"></i> Regio <a title="{{$event->region}}">{{$event->region}}</a></li>
+				<li class="detail category"><i class="fa-solid fa-location-dot"></i> <a title="{{$event->region}}">{{$event->region}}</a></li>
 			@endif
 			<li class="detail date">
 				<i class="fa-regular fa-clock"></i>
@@ -41,7 +41,7 @@
 			<div class="announcement">
 				<div>
 					<audio controls>
-					<source src="{{ $url = url( $apiUrl . 'podcast/download/' . $event->podcast->url . "?auth=" . $event->podcast->auth )}}" type="audio/mpeg" />
+					<source src="{{ $url = url( $apiUrl . 'podcast/stream/' . $event->podcast->url . "?auth=" . $event->podcast->auth )}}" type="audio/mpeg" />
 					</audio>
 				</div>
 				<ul class="post_details clearfix">
@@ -104,7 +104,7 @@
 					@include('partial/nh_story', ['content' => $event->content]);
 				@else
 				<div class="text">
-					<p>{!!$event->content!!}</p>
+				{!!$event->content!!}
 				</div>
 				@endif
 

resources/views/calendarlist.blade.php

@@ -1,7 +1,7 @@
 @extends('layouts/sidebar')
 
 @section('title')
-    Regioagenda
+    Streekagenda
 @endsection
 
 @section('page_class')
@@ -28,7 +28,7 @@
 @if(!count($events))
     @section('content')
         <div class="page_body margin_bottom">
-            <p>Er zijn geen items in de regioagenda. Iets te melden? Mail het naar {{Html::mailto("info@nhgooi.nl")}}
+            <p>Er zijn geen items in de streekagenda. Iets te melden? Mail het naar {{Html::mailto("info@nhgooi.nl")}}
                 .</p>
         </div>
     @endsection
@@ -37,42 +37,11 @@
     @section('content')
         @parent
         <div data-tabs class="page_body">
-            <div class="tabs">
-                <h4 data-tab-content-id="tab_previous" class="box_header small flex-grow-1"><span>Eerder</span></h4>
-                <h4 data-tab-content-id="tab_current_week" class="box_header small flex-grow-1 active"><span>Komende week</span></h4>
-                <h4 data-tab-content-id="tab_everything" class="box_header small flex-grow-1"><span>Toon alles</span></h4>
-                <h4 data-tab-content-id="tab_next" class="box_header small"><span>Later</span></h4>
-            </div>
-
-            @php($tabs = [
-                [
-                    'id' => 'tab_previous',
-                    'start' =>  new DateTime('1-1-1990'),
-                    'end' =>  new DateTime('sunday previous week'),
-                ],
-                [
-                    'id' => 'tab_current_week',
-                    'start' =>  new DateTime('monday this week'),
-                    'end' =>  new DateTime('sunday this week'),
-                ],
-                [
-                    'id' => 'tab_everything',
-                    'start' =>  new DateTime('1-1-1990'),
-                    'end' =>  new DateTime('31-12-3000'),
-                ],
-                [
-                    'id' => 'tab_next',
-                    'start' =>  new DateTime('monday next week'),
-                    'end' =>  new DateTime('31-12-3000'),
-                ]
-            ])
-            @foreach($tabs as $tab)
-                <div style="padding: 0" class="tab_content{{$tab['id'] == 'tab_current_week' ? ' active' : ''}}" id="{{$tab['id']}}">
+                <div style="padding: 0" class="tab_content active" id="agenda">
                     @php($count = 0)
                     @foreach($events as $event)
-                        @if($event->starts >= $tab['start'] && $event->ends <= $tab['end'])
                             @php($count++)
-                            <?php $url = route('agenda.details', ['id' => $event->id, 'title' => $event->title]); ?>
+                <?php $url = $event->url; ?>
                             <div class="box featured">
                                 <div class="row">
                                     <div class="col-12 col-md-6">
@@ -83,13 +52,19 @@
                                     <div class="col-12 col-md-6">
                                         <h2 class="post_title"><a href="{{$url}}" title="{{$event->title}}">{!!$event->title!!}</a></h2>
                                         <div class="sub_title" style="flex-wrap: wrap">
-                                            <ul class="post_tags" style="width: 100%; margin: 0 0 8px 0;height: 25px;">
-                                                <li><a style="padding: 3px 8px 3px" title="{{$event->region}}">{{$event->region}}</a></li>
+                        <ul class="post_tags" style="width: 100%; margin: 0 0 8px 0;height: 25px;">
+                        @foreach($event->tags as $tag)
+                        <li><a style="padding: 3px 8px 3px" title="{{$tag->title}}">{{$tag->title}}</a></li>
+                                                @endforeach
                                             </ul>
                                             <span class="post_date" style="line-height: 1.17; height: 14px;" title="{{Formatter::relativeDate($event->starts, 'W d m y?')}}">
                                                 <i class="fa-regular fa-clock"></i> {{Formatter::relativeDate($event->starts, 'W d m y?')}}
                                                 @if($event->ends && $event->starts != $event->ends)
-                                                    t/m {{strtolower(Formatter::relativeDate($event->ends, 'W d m y?'))}}
+                                                    @if($event->ends->format('d M y') != $event->starts->format('d M y'))
+                                                        t/m {{strtolower(Formatter::relativeDate($event->ends, 'W d m y?'))}}
+                                                    @else
+                                                        van {{ $event->starts->format('H:i') }} uur tot {{ $event->ends->format('H:i') }} uur 
+                                                    @endif
                                                 @endif
                                             </span>
                                         </div>
@@ -99,14 +74,12 @@
                                         <a class="btn fit_content" href="{{$url}}">Lees verder</a>
                                     </div>
                                 </div>
-                            </div>
-                        @endif
-                    @endforeach
                     @if($count == 0)
                     <p>Er zijn geen items gevonden. Iets te melden? Mail het naar <a href="mailto:info@nhgooi.nl">info@nhgooi.nl</a>.</p>
                     @endif
                 </div>
             @endforeach
         </div>
+      </div>
     @endsection
 @endif

resources/views/contact.blade.php

@@ -18,7 +18,18 @@
 
     <div class="page_body">
         <div class="row ">
-            <div class="col-12 col-md">
+	    <div class="col-12 col-md">
+<p>NH Gooi is de publieke streekomroep van Gooi en Vechtstreek. We houden je 24 uur per dag
+op de hoogte van al het nieuws, betrouwbaar en snel. Dat doen we via een eigen nieuws-
+app, onze website en social media, maar ook op radio en televisie. Daarnaast brengen we
+een gevarieerd aanbod van podcasts, radio- en televisieprogramma's.</p>
+
+<p>Ons team van journalisten en programmamakers bestaat uit betaalde krachten, vrijwilligers
+en stagiaires. We vinden het belangrijk mensen op te leiden en een goede plek te bieden
+voor talent.</p>
+
+<p>De redactie van NH Gooi is journalistiek onafhankelijk en wordt geleid door de chef redactie.</p>
+
                 <h3>Contactinformatie</h3>
 
                 <p>Neem contact op met NH Gooi, de streekomroep voor Gooi &amp; Vechtstreek.</p>
@@ -50,16 +61,9 @@
                     KvK: 41194132<br>
                     <br>
 
-                    <b>Streekredactie</b><br>
-                    Gooise Brink, Kerkstraat 63/27<br>
-                    11211 CL Hilversum<br>
-                    Tiplijn: <a href="tel:+31642913637">06 - 42 91 36 37</a><br>
-                    e-mail: {{Html::mailto('info@NHGooi.nl')}}<br>
-                    <br>
-
                     <b>Chef redactie</b><br>
-                    Petra de Beij<br>
-                    {{Html::mailto('petra.debeij@nhgooi.nl')}}<br><br>
+                    Erwin Bakker<br>
+                    {{Html::mailto('erwin.bakker@nhgooi.nl')}}<br><br>
                 </p>
             </div>
         </div>

resources/views/home.blade.php

@@ -24,13 +24,13 @@
                                 </a>
                                 <div class="slider_content_box">
                                     <ul class="post_details simple">
-                                        @if($item->region)
+                                        @foreach($item->tags as $tag)
                                             <li class="category">
-                                                <a title="Regio: {{$item->region->title}}"
-                                                   href="{{route('nieuws.regio', ['region' => $item->region->slug])}}"
-                                                   class="over_image">{{$item->region->title}}</a>
+                                                <a title="{{$tag->titel}}"
+                                                   href="{{route('nieuws.tag', ['tag' => $tag->slug])}}"
+                                                   class="over_image">{{$tag->titel}}</a>
                                             </li>
-                                        @endif
+                                        @endforeach
                                     </ul>
                                     <h2><a href="{{url($item->url)}}"
                                            title="{{$item->title}}">{!!$item->title!!}</a></h2>
@@ -48,43 +48,43 @@
                                 </div>
                             </div>
                         @endif
-                            @if($item = next($news))
-                                <div class="post large d-block d-md-none">
-                                    <a href="{{url($item->url)}}" title="{{$item->title}}">
-                                        @if($item->video)
-                                            <span class="icon video"></span>
-                                        @elseif($item->images && count($item->images) > 1)
-                                            <span class="icon gallery"></span>
-                                        @endif
-                                        <img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
-                                             alt='img'>
-                                    </a>
-                                    <div class="slider_content_box">
-                                        <ul class="post_details simple">
-                                            @if($item->region)
-                                                <li class="category">
-                                                    <a title="Regio: {{$item->region->title}}"
-                                                       href="{{route('nieuws.regio', ['region' => $item->region->slug])}}"
-                                                       class="over_image">{{$item->region->title}}</a>
-                                                </li>
-                                            @endif
-                                        </ul>
-                                        <h2><a href="{{url($item->url)}}"
-                                               title="{{$item->title}}">{!!$item->title!!}</a></h2>
-                                            <?php
-                                            $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
-                                            if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
-                                                $time .= ' | bijgewerkt: '
-                                                    . ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
-                                                    . ' ' . $item->edited->format('H:i') . ' uur';
-                                            }
-                                            ?>
-                                        <span class="post_date" title="{{$time}}">
+                        @if($item = next($news))
+                            <div class="post large d-block d-md-none">
+                                <a href="{{url($item->url)}}" title="{{$item->title}}">
+                                    @if($item->video)
+                                        <span class="icon video"></span>
+                                    @elseif($item->images && count($item->images) > 1)
+                                        <span class="icon gallery"></span>
+                                    @endif
+                                    <img src='{{$item->images && count($item->images) ? $imgBase . $item->images[0]->url : '/images/noimage.png'}}'
+                                         alt='img'>
+                                </a>
+                                <div class="slider_content_box">
+                                    <ul class="post_details simple">
+                                        @foreach($item->tags as $tag)
+                                            <li class="category">
+                                                <a title="{{$tag->titel}}"
+                                                   href="{{route('nieuws.tag', ['tag' => $tag->slug])}}"
+                                                   class="over_image">{{$tag->titel}}</a>
+                                            </li>
+                                        @endforeach
+                                    </ul>
+                                    <h2><a href="{{url($item->url)}}"
+                                           title="{{$item->title}}">{!!$item->title!!}</a></h2>
+                                        <?php
+                                        $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
+                                        if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
+                                            $time .= ' | bijgewerkt: '
+                                                . ($item->edited->format('d m') != $item->published->format('d m') ? strtolower(Formatter::relativeDate($item->edited)) : '')
+                                                . ' ' . $item->edited->format('H:i') . ' uur';
+                                        }
+                                        ?>
+                                    <span class="post_date" title="{{$time}}">
                                         <i class="fa-regular fa-clock"></i> {{$time}}
                                     </span>
-                                    </div>
                                 </div>
-                            @endif
+                            </div>
+                        @endif
                     </div>
                     <div class="col-8 col-md-6">
                         <div class="row">
@@ -102,16 +102,16 @@
                                     </a>
                                     <div class="slider_content_box">
                                         <ul class="post_details simple">
-                                            @if($item->region)
+                                            @foreach($item->tags as $tag)
                                                 <li class="category">
-                                                    <a title="Regio: {{$item->region->title}}"
-                                                       href="{{route('nieuws.regio', ['region' => $item->region->slug])}}"
-                                                       class="over_image">{{$item->region->title}}</a>
+                                                    <a title="{{$tag->titel}}"
+                                                       href="{{route('nieuws.tag', ['tag' => $tag->slug])}}"
+                                                       class="over_image">{{$tag->titel}}</a>
                                                 </li>
-                                            @endif
+                                            @endforeach
                                         </ul>
                                         <h5 class="post_title"><a href="{{url($item->url)}}"
-                                               title="{{$item->title}}">{!!$item->title!!}</a></h5>
+                                                                  title="{{$item->title}}">{!!$item->title!!}</a></h5>
                                             <?php
                                             $time = Formatter::relativeDate($item->published) . ' om ' . $item->published->format('H:i');
                                             if ($item->edited && ($item->edited->format('d m H i') != $item->published->format('d m H i'))) {
@@ -136,13 +136,10 @@
         <div class="grey_background">
             <div class="body_container row">
                 @if(!isset($disableBanners) || !$disableBanners)
-                <div class="col-12">
-                    <div class="d-none d-md-block" style="width: 100%; font-family: Nunito,serif;font-size: 12px;font-weight: 500;line-height: 3.17;text-align: center;color: #666;">
-                        - Advertentie -
+                    <div class="homepage-body-banners d-none d-md-flex justify-content-center mb-4">
+                        <ins data-revive-zoneid="3" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
+                        <ins data-revive-zoneid="4" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
                     </div>
-                    <div id="nhgooi_homepage_top" class="d-none d-md-block" style="width: 728px; height: 90px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
-                    <script type="text/javascript">ootag.queue.push(function () {ootag.defineSlot({adSlot: "nhgooi_homepage_top",targetId: "nhgooi_homepage_top",adShownCallback: (adslot) => { calculateSize(adslot.targetId); }});});</script>
-                </div>
                 @endif
                 <div class="col-12 col-md content_container">
                     <div class="row">
@@ -170,19 +167,37 @@
 
                     @if ($podcast)
                             <?php $url = route('gemist.fragment') . $podcast->url; ?>
-                        <h4 class="box_header"><span>Uitgelicht</span></h4>
+                        <h4 class="box_header"><span>Uitgelicht fragment</span></h4>
                         <div class="box featured">
                             <div class="row">
                                 <div class="col-12 col-md-6">
                                     <a href="{{$url}}" title="{{$podcast->title}}">
-                                        <img src="{{$podcast->image && $podcast->image->url ? $imgBase . $podcast->image->url : '/images/noimage.png'}}"/>
+                                        <img src="{{($hasImage = $podcast->image && $podcast->image->url) ? $imgBase . $podcast->image->url : '/images/noimage.png'}}"/>
+                                        <div class="sentence">
+                                                <?php
+                                                $sentence = [];
+                                                if ($hasImage) {
+                                                    $sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
+                                                } elseif (isset($podcast->image->title) && $podcast->image->title) {
+                                                    $sentence[] = '<span class="text">' . $podcast->image->title . '</span>';
+                                                }
+                                                if (isset($podcast->image->author) && $podcast->image->author) {
+                                                    $sentence[] = '<span class="author">' . $podcast->image->author . '</span>';
+                                                }
+                                                $sentence = join('<span class="separator">|</span>', $sentence);
+                                                ?>
+                                            {!!$sentence!!}
+                                        </div>
+
                                     </a>
                                 </div>
                                 <div class="col-12 col-md-6">
-                                    <h2 class="post_title"><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 }}"
+                                            <a class="program_name"
+                                               href="{{ route('programma') . $podcast->program->url }}"
                                                title="{{$podcast->program->name}}">{{$podcast->program->name}}</a>
                                         @endif
                                         <span class="post_date" title="{{Formatter::relativeDate($podcast->created)}}">
@@ -201,11 +216,9 @@
                 <div class="col-12 col-md-auto sidebar">
                     @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_homepage_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                    @include('widgets.banner_sidebar')
 
                     @include('widgets/contact', [])
-
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_homepage_side2', 'ad_sidebarId' => 'nhgooi_sidebar2'])
                 </div>
             </div>
         </div>

resources/views/kerkdienst.blade.php

@@ -18,7 +18,7 @@
      </p>
      <p>
      <audio controls>
-       <source src="{{ url( $apiUrl . 'kerkdienst/download' ) }}" type="audio/mpeg" /> 
+       <source src="{{ url( $apiUrl . 'kerkdienst/stream' ) }}" type="audio/mpeg" /> 
      </audio>
      </p>
      <p>

resources/views/layouts/_analytics.blade.php

@@ -2,7 +2,7 @@
 <script type="text/javascript" src="//www.cookieconsent.com/releases/3.1.0/cookie-consent.js"></script>
 <script type="text/javascript">
 document.addEventListener('DOMContentLoaded', function () {
-cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palette":"light","language":"nl","website_name":"NH Gooi","cookies_policy_url":"https://www.nhnieuws.nl/privacyverklaring","change_preferences_selector":"#changePreferences"});
+cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palette":"light","language":"nl","website_name":"NH Gooi","cookies_policy_url":"/privacy-verklaring","change_preferences_selector":"#changePreferences"});
 });
 </script>
 
@@ -13,9 +13,7 @@ cookieconsent.run({"notice_banner_type":"simple","consent_type":"express","palet
 <!-- End Google Tag Manager -->
 
 @if(!isset($disableBanners) || !$disableBanners)
-<script type="text/javascript" src="https://cdn.optoutadvertising.com/script/ootag.v2.js"></script><script>var ootag =
-    ootag || {}; ootag.queue = ootag.queue || [];ootag.queue.push(function () { ootag.initializeOo({
-    publisher: 4, onlyNoConsent: 1, consentTimeOutMS: 500 });});</script>
+<script async src="{{ env('ADS_URL') }}www/delivery/asyncjs.php"></script>
 @endif
 
 <noscript>ePrivacy and GPDR Cookie Consent by <a href="https://www.CookieConsent.com/" rel="nofollow noopener">Cookie Consent</a></noscript>

resources/views/layouts/_head.blade.php

@@ -10,7 +10,8 @@
 		<!--style-->
 		<link href='//fonts.googleapis.com/css?family=Roboto:300,400,700' rel='stylesheet' type='text/css'>
 		<link href='//fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700' rel='stylesheet' type='text/css'>
-		<!--<link rel="stylesheet" type="text/css" href="/css/reset.css">
+		{{--
+		<link rel="stylesheet" type="text/css" href="/css/reset.css">
 		<link rel="stylesheet" type="text/css" href="/css/superfish.css">
 		<link rel="stylesheet" type="text/css" href="/css/jquery.qtip.css">
 		<link rel="stylesheet" type="text/css" href="/css/style.css">
@@ -19,7 +20,8 @@
 		<link rel="stylesheet" type="text/css" href="/css/responsive.css">
 		<link rel="stylesheet" type="text/css" href="/css/odometer-theme-default.css">
 		<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
-		<link rel="stylesheet" type="text/css" href="/css/nhgooi.css">-->
+		<link rel="stylesheet" type="text/css" href="/css/nhgooi.css">
+		--}}
 		<link rel="stylesheet" type="text/css" href="/css/prettyPhoto.css">
 		<link rel="stylesheet" type="text/css" href="/css/bootstrap-grid.min.css">
 		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
@@ -35,9 +37,11 @@
 		} ?>
 		@stack('styles')
 		<link rel="shortcut icon" href="/favicon.ico">
+                {{--
 		<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
 		<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
 		<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
+		--}}
 		<link rel="manifest" href="/site.webmanifest">
 		<!--rss-->
 		<link rel="alternate" type="application/rss+xml" title="Abonneren op NH Gooi Nieuws" href="{{env('API_URL')}}rss/nieuws" />

resources/views/layouts/master.blade.php

@@ -22,8 +22,7 @@
             </div>
 
             @if(!isset($disableBanners) || !$disableBanners)
-            <div id="nhgooi_header_top" class="advertisement" style="margin: 11px auto 0 auto;background-color: #efefef;"></div>
-            <script type="text/javascript">ootag.queue.push(function () {ootag.defineSlot({adSlot: "nhgooi_homepage_header",targetId: "nhgooi_header_top",filledCallback: (adslot) => { calculateSize(adslot.targetId); }});});</script>
+                <ins data-revive-zoneid="1" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
             @endif
 
         </div>
@@ -45,7 +44,7 @@
                     <a href="https://wa.me/31888505651" target="_blank">Tip <i class="fa-solid fa-circle-plus"></i></a>
                 </li>
                 @if(isset($searchURL))
-                    <li>
+                    <li class="search">
                         <form class="search_form" action="{{url($searchURL)}}">
                             <input type="text" name="query" placeholder="Zoeken..."
                                    value="{{isset($query) ? $query : null}}" class="search_input">
@@ -67,13 +66,13 @@
                     <a class="player with_svg_icon" href="{{url('luister/live')}}"><span>Luister live radio </span>{!!file_get_contents(__DIR__ . '/../../../public/images/icons/radio.svg')!!}</a>
                 </li>
                 <li>
-                    <a class="with_svg_icon" href="{{url('kijk/studio')}}"><span>Kijk live tv </span>{!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
+                    <a class="with_svg_icon" href="{{url('kijk/live')}}"><span>Kijk live tv </span>{!!file_get_contents(__DIR__ . '/../../../public/images/icons/television-2.svg')!!}</a>
                 </li>
                 <li>
                     <a href="https://wa.me/31888505651" style="{{!isset($searchURL) ? 'margin-top: 3px' : ''}}" target="_blank"><span>Tip de streekredactie </span><i style="margin-top: 2px" class="fa-solid fa-circle-plus"></i></a>
                 </li>
                 @if(isset($searchURL))
-                    <li>
+                    <li class="search">
                         <form class="search_form" action="{{url($searchURL)}}">
                             <input type="text" name="query" placeholder="Zoeken..."
                                    value="{{isset($query) ? $query : null}}" class="search_input">
@@ -89,17 +88,16 @@
         @include('widgets.menu')
     </div>
 
+    @if(!isset($disableBanners) || !$disableBanners)
+        <div class="mobile-banner-fullwidth d-flex d-md-none justify-content-center mt-4">
+            <ins data-revive-zoneid="6" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
+        </div>
+    @endif
+
     <!-- Content -->
 
     <div class="page @yield('page_container_class')">
         <a name="top"></a>
-        @if($activeBlog != null)
-            <p style="float: left; border: solid 1px #1f3977; border-radius: 10px; padding: 0 10px 0.4em 10px; margin: 10px 0 10px 0; width: 100%;">
-                <b>Live-blog:</b> {{$activeBlog->title}}
-                <a href="{{$activeBlog->url}}" class="action_button" style="float: none; margin-left: 1em;"><span
-                            class="fa fa-rss"></span><span>Volg het live-blog</span></a>
-            </p>
-        @endif
         @yield('page')
     </div><!--/.page-->
 
@@ -108,19 +106,20 @@
         <div class="footer_menu">
             <div class="row">
                 <div class="col-12 col-md-3">
-                    <h4 class="box_header"><span>NH Gooi</span></h4>
-                    <p class="about">
-                        NH Gooi is de streekomroep voor Gooi & Vechtstreek. Wij bieden een gevarieerd programma op
-                        radio, podcasts, tv en online met muziek, achtergronden en actueel regionieuws.
+                    <h4 class="box_header"><span>NHGooi</span></h4>
+		    <p class="about">
+                        NHGooi is de streekomroep voor Gooi &amp; Vechtstreek. Wij brengen nieuws en achtergronden
+			op onze website, radio en televisie. Daarnaast brengen we boeiende en belangrijke podcasts
+                        en een gevari&euml;erd programma-aanbod op al onze media-kanalen.
                     </p>
                 </div>
                 <div class="col-12 col-md-3">
                     <h4 class="box_header"><span style="height: 30px;display: block;width: 0;"></span></h4>
                     <p class="about">
-                        Altijd op de hoogte blijven van nieuws en achtergronden uit de regio? <a href="{{url('app')}}">Download onze app</a>.
+                        Altijd op de hoogte blijven van nieuws en achtergronden uit de regio? <span class="fas fa-mobile"></span> <a href="{{url('app')}}">Download onze app</a>.
                     </p>
                     <p class="about">
-                        <a href="{{url('frequenties')}}">Klik hier</a> waar je ons kunt zien en horen.
+                       <span class="fa fa-list"></span> <a href="{{url('frequenties')}}">Bekijk hier</a> waar je ons kunt zien en horen.
                     </p>
                 </div>
                 <div class="col-12 col-md-3">
@@ -165,7 +164,7 @@
             </div>
         </div>
         <div class="copyright">
-            © NH Gooi
+            © NHGooi
             <a class="scroll_top" href="#top" title="Scroll to top"><i class="fa-solid fa-angle-up"></i></a>
         </div>
     </div>
@@ -186,12 +185,13 @@
 <script type="text/javascript" src="/js/jquery.hint.js"></script>
 <script type="text/javascript" src="/js/jquery.qtip.min.js"></script>
 <script type="text/javascript" src="/js/jquery.blockUI.js"></script>
-<script type="text/javascript" src="/js/main.js"></script>
 <script type="text/javascript" src="/js/odometer.min.js"></script>-->
+<script type="text/javascript" src="/js/main.js"></script>
 <script type="text/javascript" src="/js/jquery-3.7.1.min.js"></script>
 <script type="text/javascript" src="/js/jquery.prettyPhoto.js"></script>
 <script type="text/javascript" src="/js/jquery.carouFredSel-6.2.1.min.js"></script>
 <script type="text/javascript" src="/js/functions.js"></script>
+<script type="text/javascript" src="/js/wavesurfer.min.js"></script>
 <script type="text/javascript">
   $(window).resize(function () {
     // Fix sticky for mobile menu indicator
@@ -208,7 +208,7 @@
   function openPlayerInNewScreen() {
     $(".player").click(function (e) {
       e.preventDefault();
-      window.open($(this).attr('href'), '_player', 'width=550,height=500,titlebar,close');
+      window.open($(this).attr('href'), '_player', 'width=550,height=600,titlebar,close');
       return false;
     });
   }

resources/views/layouts/sidebar.blade.php

@@ -1,6 +1,7 @@
 @extends('layouts/master')
 
-@section('content_class')box
+@section('content_class')
+    box
 @endsection
 
 @section('page')
@@ -57,13 +58,11 @@
                         </div>
                     @endif
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
-
                     @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
 
-                    @include('widgets/contact', [])
+                    @include('widgets.banner_sidebar')
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar2 ?? 'nhgooi_section_side2', 'ad_sidebarId' => 'nhgooi_sidebar2'])
+                    @include('widgets/contact', [])
                 @show
             </div>
         </div>

resources/views/listen.blade.php

@@ -4,8 +4,8 @@
     <a href="javascript:window.close();" class="close btn"><span class='fa fa-times fa-fw'></span> Venster sluiten</a>
     <p class="logo"><a href="{{ url('/') }}"><img src="{{ url( 'images/logo-NHGooi.svg' )}}"></a></p>
 
-    @if(false && $isStream)
-        <p>Wegens een technisch probleem is NH Gooi momenteel niet via Internet te beluisteren. Onze excuses voor het
+    @if(isset($notAvailable) && $notAvailable)
+        <p>Helaas is de door u gekozen audio momenteel niet via Internet te beluisteren. Onze excuses voor het
             ongemak.</p>
         <p>In Hilversum, Huizen en de BEL-gemeenten zijn wij te ontvangen op 92.0 FM of 105.1 FM.</p>
     @else
@@ -36,14 +36,21 @@
                 </p>
             @endif
             <p>
-                <audio controls autoplay="true">
+                {{-- <audio controls autoplay="true">
                     <source src="{{$source}}" type="audio/mp3"/>
-                </audio>
+                </audio> --}}
+                                
+                @include('widgets.audioplayer', [
+                    'source' => $source,
+                    'isStream' => $isStream,
+                    'lengte' => $lengte,
+                    'waveform' => $waveform
+                ])
             </p>
 
             <p>
-                @if(!$isStream && $canDownload)
-                    <a href="{{$source}}" class="action_button">
+                @if(!$isStream && $canDownload !== false)
+                    <a href="{{$canDownload}}" class="action_button">
                         <span class="fa fa-download"></span><span>Download .mp3-bestand</span>
                     </a>
                 @endif
@@ -52,7 +59,6 @@
                         <span class="fa fa-music"></span><span>Schakel naar live-uitzending</span>
                     </a>
                 @endif
-            </p>
             @endif
         </div>
         @endsection
@@ -131,6 +137,7 @@
 
         @push('scripts')
             <script type="text/javascript" src="/js/jquery-3.7.1.min.js"></script>
+            <script type="text/javascript" src="/js/wavesurfer.min.js"></script>
             <script>
               function updateOnAir() {
                 $.ajax({
@@ -164,4 +171,3 @@
             </script>
         @endpush
 
-        @include('widgets.mediaplayer')

resources/views/news.blade.php

@@ -14,13 +14,9 @@
         <div class="grey_background">
             <div class="body_container row">
                 @if(!isset($disableBanners) || !$disableBanners)
-                <div class="col-12">
-                    <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 class="col-12">
+                        <ins data-revive-zoneid="5" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
                     </div>
-                    <div id="nhgooi_article_top" style="width: 728px; height: 90px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
-                    <script type="text/javascript">ootag.queue.push(function () {ootag.defineSlot({adSlot: "nhgooi_article_top",targetId: "nhgooi_article_top",filledCallback: (adslot) => { calculateSize(adslot.targetId); }});});</script>
-                </div>
                 @endif
                 <div class="col-12 col-md content_container">
                     <div class="row">
@@ -45,18 +41,16 @@
                 <div class="col-12 col-md-auto sidebar">
                     @include('widgets/nhgooiradiotv', ['headerClass' => 'small'])
 
-                    @include('widgets/contact', [])
+                    @include('widgets.banner_sidebar')
 
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_article_side' ?? false, 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                    @include('widgets/contact', [])
 
                     <div class="podcast_items">
                         <h4 class="box_header small"><span>Fragment gemist</span></h4>
                         <div class="box">
-                            @include('partial/podcastitems', ['showTime' => false, 'showImage' => false, 'podcasts' => $podcasts])
+                            @include('partial/podcastitems', ['showTime' => false, 'showImage' => false, 'podcasts' => $podcasts, 'isPodcast' => false])
                         </div>
                     </div>
-
-                    @include('widgets/add_sidebar', ['ad_sidebar' => 'nhgooi_article_side2' ?? false, 'ad_sidebarId' => 'nhgooi_sidebar2'])
                 </div>
             </div>
         </div>

resources/views/newsitem.blade.php

@@ -11,16 +11,18 @@
 		<li><a title="Home" href="/">Home</a></li>
 		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
 		<li><a title="Nieuws" href="{{route('nieuws')}}">Nieuws</a></li>
-		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
+{{--		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
 		<li><a title="{{$news->region->title}}" href="{{route('nieuws.regio', $news->region->slug)}}">{{$news->region->title}}</a></li>
-		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
+--}}		<li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
 		<li>{!!$news->title!!}</li>
 	</ul>
 @endsection
 
 @section('tags')
 	<ul class="post_tags">
-		<li><a href="{{route('nieuws.regio', $news->region->slug)}}" title="{{$news->region->title}}">{{$news->region->title}}</a></li>
+		@foreach($news->tags as $tag)
+		<li><a href="{{route('nieuws.tag', $tag->slug)}}" title="{{$tag->titel}}">{{$tag->titel}}</a></li>
+		@endforeach
 	</ul>
 @endsection
 
@@ -28,12 +30,6 @@
 
 	<div class="post_body">
 		<ul class="post_details clearfix">
-			@if($news->region && $news->region->title != "Regio")
-			<li class="detail category"><i class="fa-solid fa-location-dot"></i> Regio <a href="{{route('nieuws.regio', $news->region->slug)}}" title="{{$news->region->title}}">{{$news->region->title}}</a></li>
-			@endif
-			@if($news->theme && $news->theme->title != "Overig")
-			<li class="detail category"><i class="fa-solid fa-tag fa-rotate-90"></i> Thema <a href="{{route('nieuws.thema', $news->theme->slug)}}" title="{{$news->theme->title}}">{{$news->theme->title}}</a></li>
-			@endif
 			<li class="detail date">
 				<i class="fa-regular fa-clock"></i>
 				{{Formatter::relativeDate($news->published)}} om {{$news->published->format('H:i')}}
@@ -51,30 +47,6 @@
 		</ul>
 
 
-		@if($news->podcast)
-			@include('widgets/mediaplayer')
-			<div class="announcement">
-				<div>
-					<audio controls>
-					<source src="{{ $url = url( $apiUrl . 'podcast/download' . $news->podcast->url . "?auth=" . $news->podcast->auth )}}" type="audio/mpeg" />
-					</audio>
-				</div>
-				<ul class="post_details clearfix">
-					<li class="detail date">
-						<i class="fa-regular fa-clock"></i>
-							{{ Formatter::relativeDate($news->podcast->created) }} uitgezonden
-							@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.fragment') . $news->podcast->url }}">
-							<span class="fa "></span>
-							<span>Meer over dit fragment</span>
-						</a>
-					</li>
-				</ul>
-			</div>
-		@endif
-
 		<div class="post_content clearfix">
 			<div class="content_box">
 				@if($news->images)
@@ -115,14 +87,20 @@
 					@endif
 				@endif
 
-				@if(is_array($news->content))
-					@include('partial/nh_story', ['content' => $news->content])
+				@if($type == "nhnieuws")
+				@include('partial/nh_story', ['content' => $news->content])
+				@elseif($type == "artikel")
+				@include('partial/block_story', ['content' => $news->content])
 				@else
 				<div class="text">
 					<p>{!!$news->content!!}</p>
 				</div>
 				@endif
 
+				@if($news->podcast)
+				@include('widgets/podcastplayer', ['podcast' => $news->podcast])
+				@endif
+
 				@if($news->source && $news->source->show)
 				<div class="post-source">
 				<p>Bron: {{$news->source->title}}</p>
@@ -133,26 +111,6 @@
 				@include('widgets/share')
 				--}}
 
-				{{--
-					<ul class="taxonomies tags left clearfix">
-						@if($news->keywords)
-						@foreach($news->keywords as $keyword)
-						<li>
-							<a href="{{route('nieuws/onderwerp/' . $keyword)}}" title="Zoek meer nieuws met het onderwerp {{$keyword}}">{{$keyword}}</a>
-						</li>
-						@endforeach
-						@endif
-					</ul>
-				--}}
-				<ul class="post_tags clearfix">
-					<li>Tags:</li>
-					<li>
-						<a href="{{route('nieuws.thema', $news->theme->slug)}}" title="Zoek meer nieuws met het thema {{$news->theme->title}}">{{$news->theme->title}}</a>
-					</li>
-					<li>
-						<a href="{{route('nieuws.regio', $news->region->slug)}}" title="Zoek meer nieuws uit de regio {{$news->region->title}}">{{$news->region->title}}</a>
-					</li>
-				</ul>
 				<div class="share_buttons row">
 					<div class="col-12 col-md-auto">
 						<a data-share="native" href="javascript:void(0)" class="btn">

resources/views/newslist.blade.php

@@ -51,16 +51,11 @@
                                                           title="{{strip_tags($item->title)}}">{!!$item->title!!}</a>
                                 </h2>
                                 <ul class="post_details clearfix">
-                                    @if($item->region)
-                                        <li class="detail category"><i class="fa-solid fa-location-dot"></i> Regio <a
-                                                    href="{{route('nieuws.regio', $item->region->slug)}}"
-                                                    title="{{$item->region->title}}">{{$item->region->title}}</a></li>
-                                    @endif
-                                    @if($item->theme)
-                                        <li class="detail category"><i class="fa-solid fa-tag fa-rotate-90"></i> Thema
-                                            <a href="{{route('nieuws.thema', $item->theme->slug)}}"
-                                               title="{{$item->theme->title}}">{{$item->theme->title}}</a></li>
-                                    @endif
+				    @foreach($item->tags as $tag) 
+                                        <li class="detail category"><i class="fa-solid fa-location-dot"></i> <a
+                                                    href="{{route('nieuws.tag', $tag->slug)}}"
+                                                    title="{{$tag->titel}}">{{$tag->titel}}</a></li>
+                                    @endforeach
                                     @if($item->edited && ($item->edited != $item->published))
                                         <li class="date edited">
                                             <i class="fa-regular fa-clock"></i>

resources/views/partial/block_story.blade.php

@@ -0,0 +1,161 @@
+@foreach($content as $block)
+@if($block->type == "headerRichA")
+@php($block->data->image->url = isset($block->data->image->crops)
+? $block->data->image->crops->{'16:9'}->{'1600'}
+: $block->data->image->crop)
+<a href="{{$block->data->image->url}}" class="post_image page_margin_top prettyPhoto" rel="prettyPhoto"
+	title="{{$block->data->image->title}}">
+	<img src="{{$block->data->image->url}}" alt="{{$block->data->image->title}}">
+</a>
+<div class="sentence margin_top_10">
+	<span class="text">{{$block->data->image->title}}</span>
+	@if($block->data->image->author)
+	<span class="author">{{$block->data->image->author}}</span>
+	@endif
+</div>
+@elseif($block->type == "paragraph")
+<div class="text">{!!$block->data->text!!}</div>
+@elseif($block->type == "intro")
+<h3 class="excerpt">{!!strip_tags($block->data->text)!!}</h3>
+@elseif($block->type == "info")
+@if(strpos($block->data->text, "Meer nieuws uit 't Gooi?") === false)
+<div class="info" style="background-color: {{$block->data->color}};">{!!($block->data->text)!!}</div>
+@endif
+@elseif($block->type == "quote")
+<blockquote>
+	{!!$block->data->text!!}
+	<div class="author">{{$block->data->caption}}</div>
+</blockquote>
+@elseif($block->type == "image")
+<?php
+			if(isset($block->data->image->imageWide))
+			$image = $block->data->image->imageWide;
+			else if(isset($block->data->image->crop))
+			$image = $block->data->image->crop;
+			else if(isset($block->data->image->crops) && isset($block->data->image->crops->{'16:9'}))
+				foreach($block->data->image->crops->{'16:9'} as $image) break;
+			else if(isset($block->data->image->imageHigh))
+				$image = $block->data->image->imageHigh;
+			else $image = null;
+		?>
+@if($image)
+<a class="post_image page_margin_top prettyPhoto" rel="prettyPhoto" href="{{$image}}"
+	title="{{$block->data->image->title}} &copy; {{$block->data->image->author}}">
+	<img src="{{$image}}" class="attachment-small-slider-thumb size-small-slider-thumb wp-post-image"
+		alt="{{$block->data->image->title}}" title="" style="display: block;">
+</a>
+<div class="sentence">
+	<?php
+				$sentence = [];
+                if (isset($block->data->image->caption) && $block->data->image->caption) {
+					$sentence[] = '<span class="text">' . $block->data->image->caption . '</span>';
+				} elseif (isset($block->data->image->title) && $block->data->image->title) {
+					$sentence[] = '<span class="text">' . $block->data->image->title . '</span>';
+				}
+				if (isset($block->data->image->author) && $block->data->image->author) {
+					$sentence[] = '<span class="author">' . $block->data->image->author . '</span>';
+				}
+				$sentence = join('<span class="separator">|</span>', $sentence);
+			?>
+	{!!$sentence!!}
+</div>
+@endif
+@elseif($block->type == "video" || $block->type == "headerVideo")
+@include('widgets/mediaplayer')
+<?php
+			$attr = '';
+            if (isset($block->data->video->images[0]->imageMedia) && $block->data->video->images[0]->imageMedia) {
+				$attr = ' poster="' . $block->data->video->images[0]->imageMedia . '"';
+			}
+		?>
+<video controls{!!$attr!!}>
+	@foreach($block->data->video->streams as $stream)
+	<source src="{!!$stream->stream_url!!}" type="application/x-mpegurl" />
+	@endforeach
+</video>
+<div class="sentence">
+	<span class="author">{{$block->data->video->author}}</span>
+</div>
+@elseif($block->type == "carousel")
+<div class="horizontal_carousel_container gallery">
+	<ul class="horizontal_carousel visible-5 autoplay-1 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
+		@foreach($block->data->items as $image)
+		<?php
+			if(isset($image->image->imageWide))
+				$img = $image->image->imageWide;
+			else if(isset($block->data->image->crop))
+			$image = $block->data->image->crop;
+			else if(isset($image->image->crops) && isset($image->image->crops->{'16:9'}))
+				foreach($image->image->crops->{'16:9'} as $img) break;
+			else if(isset($image->image->imageHigh))
+			$img = $image->image->imageHigh;
+		else $img = null;
+		?>
+		@if($img)
+		<li>
+			<a href="{{$img}}" class="post_image prettyPhoto" rel="prettyPhoto[gallery]"
+				title="{{$image->image->title}} &copy; {{$image->image->author}}">
+				<img src="{{$img}}" alt="{{$image->image->title}}" title="{{$image->image->title}}">
+			</a>
+		</li>
+		@endif
+		@endforeach
+	</ul>
+</div>
+@elseif($block->type == "oembed")
+<div class="oembed" data-url="{{$block->data->url}}">{!!$block->data->html!!}</div>
+@elseif($block->type == "podcast" && $block->data->id == $news->podcast?->id)
+@include('widgets/podcastplayer', ['podcast' => $news->podcast])
+<? $news->podcast = null; // Avoid adding the player again ?>
+@elseif($block->type == 'article' && count($block->data->articles) && $block->data->articles[0]->published)
+<div class="block">
+	<h4 class="box_header"><span>{{ $block->data->title }}</span></h4>
+	<div class="box full-width">
+		<ul id="items-more-news" class="blog">
+			@foreach($block->data->articles as $article)
+			<? 	if(!isset($article->published)) continue;
+				$article->published = new \DateTime($article->published); ?>
+			<li class="post">
+				<div class="row">
+					@if($article->image)
+					<div class="col-4">
+						<a href="{{ route('nieuws.detail', ['id' => $article->id, 'title' => $article->slug]) }}"
+							title="{{ $article->title }}">
+							<img src="{{ $article->image[0] == '/' ? '' : '/' }}{{ $article->image }}" alt="{{ $article->image_title }}">
+						</a>
+					</div>
+					@endif
+					<div class="col-8">
+						<h2 class="post_title"><a class="clipText clipText-3"
+								href="{{ route('nieuws.detail', ['id' => $article->id, 'title' => $article->slug]) }}"
+								title="{!! $article->title !!}">{!! $article->title !!}</a></h2>
+						<span class="post_date" title="Vandaag om 09:30">
+							<i class="fa-regular fa-clock"></i> 
+							{{Formatter::relativeDate($article->published)}} om {{$article->published->format('H:i')}}
+						</span>
+					</div>
+				</div>
+			</li>
+			@endforeach
+		</ul>
+	</div>
+</div>
+@elseif($block->type == 'iframe')
+  <iframe src="{{ $block->data->url }}" class="article-iframe" id="{{ $id = uniqid('iframe_') }}"></iframe>
+<style>
+@if(isset($block->data->ratio))
+#{{ $id }}.article-iframe {
+  aspect-ratio: {{ str_replace(":", "/", $block->data->ratio) }};
+}
+@endif
+
+@if(isset($block->data->ratioMobile))
+@media (max-width: 768px) {
+  #{{ $id }}.article-iframe {
+    aspect-ratio: {{ str_replace(":", "/", $block->data->ratioMobile) }};
+  }
+}
+@endif
+</style>
+@endif
+@endforeach

resources/views/partial/blogitems.blade.php

@@ -78,7 +78,7 @@
             <div class="announcement">
                 <div>
                     <audio controls>
-                    <source src="{{ $url = url( $apiUrl . "podcast/download" . $item->podcast->url . "?auth=" . $item->podcast->auth )}}" type="audio/mpeg" />
+                    <source src="{{ $url = url( $apiUrl . "podcast/stream" . $item->podcast->url . "?auth=" . $item->podcast->auth )}}" type="audio/mpeg" />
                     </audio>
                 </div>
             </div>

resources/views/partial/nh_story.blade.php

@@ -1,48 +1,51 @@
 @foreach($content as $block)
-	@if($block->type == "headerRichA")
-		@php($block->image->url = isset($block->image->crops)
-			? $block->image->crops->{'16:9'}->{'1600'}
-			: $block->image->crop)
-		<a href="{{$block->image->url}}" class="post_image page_margin_top prettyPhoto" rel="prettyPhoto" title="{{$block->image->title}}">
-			<img src="{{$block->image->url}}" alt="{{$block->image->title}}">
-		</a>
-		<div class="sentence margin_top_10">
-			<span class="text">{{$block->image->title}}</span>
-			@if($block->image->author)
-			<span class="author">{{$block->image->author}}</span>
-			@endif
-		</div>
-	@elseif($block->type == "text")
-		<div class="text">{!!$block->text!!}</div>
-	@elseif($block->type == "intro")
-		<h3 class="excerpt">{!!strip_tags($block->text)!!}</h3>
-	@elseif($block->type == "info")
-		@if(strpos($block->text, "Meer nieuws uit 't Gooi?") === false)
-		<div class="info" style="background-color: {{$block->color}};">{!!($block->text)!!}</div>
-		@endif
-	@elseif($block->type == "quote")
-		<blockquote>
-			{!!$block->text!!}
-			<div class="author">{{$block->name}}</div>
-		</blockquote>
-	@elseif($block->type == "image")
-		<?php
+@if($block->type == "headerRichA")
+@php($block->image->url = isset($block->image->crops)
+? $block->image->crops->{'16:9'}->{'1600'}
+: $block->image->crop)
+<a href="{{$block->image->url}}" class="post_image page_margin_top prettyPhoto" rel="prettyPhoto"
+	title="{{$block->image->title}}">
+	<img src="{{$block->image->url}}" alt="{{$block->image->title}}">
+</a>
+<div class="sentence margin_top_10">
+	<span class="text">{{$block->image->title}}</span>
+	@if($block->image->author)
+	<span class="author">{{$block->image->author}}</span>
+	@endif
+</div>
+@elseif($block->type == "text")
+<div class="text">{!!$block->text!!}</div>
+@elseif($block->type == "intro")
+<h3 class="excerpt">{!!strip_tags($block->text)!!}</h3>
+@elseif($block->type == "info")
+@if(strpos($block->text, "Meer nieuws uit 't Gooi?") === false)
+<div class="info" style="background-color: {{$block->color}};">{!!($block->text)!!}</div>
+@endif
+@elseif($block->type == "quote")
+<blockquote>
+	{!!$block->text!!}
+	<div class="author">{{$block->name}}</div>
+</blockquote>
+@elseif($block->type == "image")
+<?php
 			if(isset($block->image->imageWide))
-				$image = $block->image->imageWide;
+			$image = $block->image->imageWide;
 			else if(isset($block->image->crop))
-				$image = $block->image->crop;
+			$image = $block->image->crop;
 			else if(isset($block->image->crops) && isset($block->image->crops->{'16:9'}))
 				foreach($block->image->crops->{'16:9'} as $image) break;
 			else if(isset($block->image->imageHigh))
 				$image = $block->image->imageHigh;
 			else $image = null;
 		?>
-		@if($image)
-		<a class="post_image page_margin_top prettyPhoto" rel="prettyPhoto" href="{{$image}}" title="{{$block->image->title}} &copy; {{$block->image->author}}">
-			<img src="{{$image}}" class="attachment-small-slider-thumb size-small-slider-thumb wp-post-image" alt="{{$block->image->title}}" title="" style="display: block;">
-		</a>
-		<div class="sentence">
-			<?php
+@if($image)
+<a class="post_image page_margin_top prettyPhoto" rel="prettyPhoto" href="{{$image}}"
+	title="{{$block->image->title}} &copy; {{$block->image->author}}">
+	<img src="{{$image}}" class="attachment-small-slider-thumb size-small-slider-thumb wp-post-image"
+		alt="{{$block->image->title}}" title="" style="display: block;">
+</a>
+<div class="sentence">
+	<?php
 				$sentence = [];
                 if (isset($block->image->caption) && $block->image->caption) {
 					$sentence[] = '<span class="text">' . $block->image->caption . '</span>';
@@ -54,52 +57,105 @@
 				}
 				$sentence = join('<span class="separator">|</span>', $sentence);
 			?>
-			{!!$sentence!!}
-		</div>
-		@endif
-	@elseif($block->type == "video" || $block->type == "headerVideo")
-		@include('widgets/mediaplayer')
-		<?php
+	{!!$sentence!!}
+</div>
+@endif
+@elseif($block->type == "video" || $block->type == "headerVideo")
+@include('widgets/mediaplayer')
+<?php
 			$attr = '';
             if (isset($block->video->images[0]->imageMedia) && $block->video->images[0]->imageMedia) {
 				$attr = ' poster="' . $block->video->images[0]->imageMedia . '"';
 			}
 		?>
-		<video controls{!!$attr!!}>
-		@foreach($block->video->streams as $stream)
-			<source src="{!!$stream->stream_url!!}" type="application/x-mpegurl" />
-		@endforeach
-		</video>
-		<div class="sentence">
-			<span class="author">{{$block->video->author}}</span>
-		</div>
-	@elseif($block->type == "carousel")
-            <div class="horizontal_carousel_container gallery">
-            <ul class="horizontal_carousel visible-5 autoplay-1 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
-            @foreach($block->items as $image)
+<video controls{!!$attr!!}>
+	@foreach($block->video->streams as $stream)
+	<source src="{!!$stream->stream_url!!}" type="application/x-mpegurl" />
+	@endforeach
+</video>
+<div class="sentence">
+	<span class="author">{{$block->video->author}}</span>
+</div>
+@elseif($block->type == "carousel")
+<div class="horizontal_carousel_container gallery">
+	<ul class="horizontal_carousel visible-5 autoplay-1 scroll-1 navigation-1 easing-easeInOutQuint duration-750">
+		@foreach($block->items as $image)
 		<?php
 			if(isset($image->image->imageWide))
 				$img = $image->image->imageWide;
 			else if(isset($block->image->crop))
-				$image = $block->image->crop;
+			$image = $block->image->crop;
 			else if(isset($image->image->crops) && isset($image->image->crops->{'16:9'}))
 				foreach($image->image->crops->{'16:9'} as $img) break;
 			else if(isset($image->image->imageHigh))
-				$img = $image->image->imageHigh;
-			else $img = null;
+			$img = $image->image->imageHigh;
+		else $img = null;
 		?>
 		@if($img)
-              <li>
-                <a href="{{$img}}" class="post_image prettyPhoto" rel="prettyPhoto[gallery]" title="{{$image->image->title}} &copy; {{$image->image->author}}">
-                    <img src="{{$img}}" alt="{{$image->image->title}}" title="{{$image->image->title}}">
-                </a>
-              </li>
+		<li>
+			<a href="{{$img}}" class="post_image prettyPhoto" rel="prettyPhoto[gallery]"
+				title="{{$image->image->title}} &copy; {{$image->image->author}}">
+				<img src="{{$img}}" alt="{{$image->image->title}}" title="{{$image->image->title}}">
+			</a>
+		</li>
 		@endif
-            @endforeach
-            </ul>
-            </div>
-	@elseif($block->type == "oembed")
-		<div class="oembed" data-url="{{$block->url}}">{!!$block->html!!}</div>
-        @endif
-@endforeach
+		@endforeach
+	</ul>
+</div>
+@elseif($block->type == "oembed")
+<div class="oembed" data-url="{{$block->url}}">{!!$block->html!!}</div>
+@elseif($block->type == "podcast" && $block->id == $news->podcast?->id)
+@include('widgets/podcastplayer', ['podcast' => $news->podcast])
+<? $news->podcast = null; // Avoid adding the player again ?>
+@elseif($block->type == 'article' && count($block->articles) && $block->articles[0]->published)
+<div class="block">
+	<h4 class="box_header"><span>{{ $block->title }}</span></h4>
+	<div class="box full-width">
+		<ul id="items-more-news" class="blog">
+			@foreach($block->articles as $article)
+			<? 	if(!isset($article->published)) continue;
+				$article->published = new \DateTime($article->published); ?>
+			<li class="post">
+				<div class="row">
+					@if($article->image)
+					<div class="col-4">
+						<a href="{{ route('nieuws.detail', ['id' => $article->id, 'title' => $article->slug]) }}"
+							title="{{ $article->title }}">
+							<img src="{{ $article->image[0] == '/' ? '' : '/' }}{{ $article->image }}" alt="{{ $article->image_title }}">
+						</a>
+					</div>
+					@endif
+					<div class="col-8">
+						<h2 class="post_title"><a class="clipText clipText-3"
+								href="{{ route('nieuws.detail', ['id' => $article->id, 'title' => $article->slug]) }}"
+								title="{!! $article->title !!}">{!! $article->title !!}</a></h2>
+						<span class="post_date" title="Vandaag om 09:30">
+							<i class="fa-regular fa-clock"></i> 
+							{{Formatter::relativeDate($article->published)}} om {{$article->published->format('H:i')}}
+						</span>
+					</div>
+				</div>
+			</li>
+			@endforeach
+		</ul>
+	</div>
+</div>
+@elseif($block->type == 'iframe')
+  <iframe src="{{ $block->url }}" class="article-iframe" id="{{ $id = uniqid('iframe_') }}"></iframe>
+<style>
+@if(isset($block->ratio))
+#{{ $id }}.article-iframe {
+  aspect-ratio: {{ str_replace(":", "/", $block->ratio) }};
+}
+@endif
 
+@if(isset($block->ratioMobile))
+@media (max-width: 768px) {
+  #{{ $id }}.article-iframe {
+    aspect-ratio: {{ str_replace(":", "/", $block->ratioMobile) }};
+  }
+}
+@endif
+</style>
+@endif
+@endforeach

resources/views/partial/podcastdirectitems.blade.php

@@ -1,8 +1,8 @@
 <div>
     @foreach($podcasts as $podcast)
             <?php
-            $url = route('gemist.fragment') . $podcast->url;
-            $popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
+        $url = ($isPodcast ? '/podcast/aflevering' : '/gemist/fragment') . $podcast->url;
+        $popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
             ?>
         <div class="box full-width featured">
             <div class="row">
@@ -15,16 +15,16 @@
                     <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 }}"
+                            <a class="program_name" href="/{{ ($isPodcast ? 'podcast' : 'programma') . $podcast->program->url }}"
                                title="{{$podcast->program->name}}">{{$podcast->program->name}}</a>
                         @endif
                         <span class="post_date" title="{{Formatter::relativeDate($podcast->created)}}">
                                         <i class="fa-regular fa-clock"></i> {{Formatter::relativeDate($podcast->created)}}
                                     </span>
                     </div>
-                    <p class="clipText clipText-7" title="{{strip_tags($podcast->content)}}">
+                    <div class="clipText clipText-7" title="{{strip_tags($podcast->content)}}">
                         {!!$podcast->content!!}
-                    </p>
+                    </div>
                     <a class="action_button btn player" href="{{$popoutUrl}}">
                         <span class="fa fa-external-link-alt"></span>
                         <span>Luister in nieuw venster</span>

resources/views/partial/podcastitems.blade.php

@@ -20,7 +20,7 @@ $actionButton = array_merge([
 ?>
 <ul id="{{$id ?? ''}}" class="{{$ul['class']}}">
     @foreach($podcasts as $podcast)
-            <?php $url = route('gemist.fragment') . $podcast->url; ?>
+        <?php $url = ($isPodcast ? '/podcast/aflevering' : '/gemist/fragment') . $podcast->url; ?>
         <li style="{{$li['style']}}" class="post {{$li['class']}}">
             <div style="{{$content['style']}}" class="post_content {{$content['class']}}">
                 <h2 class="post_title">
@@ -43,9 +43,9 @@ $actionButton = array_merge([
                     </a>
                 @endif
                 @if($body['show'])
-                    <p class="post_body {{$body['class']}}">
+                    <div class="post_body {{$body['class']}}">
                         {!!$podcast->content!!}
-                    </p>
+                    </div>
                 @endif
                 @if(isset($showAction) && $showAction)
                     <div class="action_button {{$actionButton['class']}}">

resources/views/partial/radioscheduleweek.blade.php

@@ -9,10 +9,10 @@
                         <a class="box full-width full-height" href="{{route('programma') . $item['program']->url}}"
                            title="{{$item['program']->name . ($item['program']->tagline ? "\n" . $item['program']->tagline : "")}}">
                             <img src="{{$item['program']->image ?? 'images/noimage.png'}}">
+			    @if($isCurrent)
+                              <div href="{{route('luister.live')}}" class="onair" title="Nu live!">Nu live!</div>
+                            @endif
                             <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>
@@ -26,5 +26,5 @@
             @endif
         </div>
     </div>
-@endforeach
 
+@endforeach

resources/views/podcastitem.blade.php

@@ -3,10 +3,12 @@
 @include('widgets/mediaplayer')
 
 @section('title')
-	@if ($podcast)
-		Fragment gemist
+	@if($podcast)
+		{{ $podcast->title }}
+	@elseif($isPodcast)
+		NH Gooi Podcast
 	@else
-		Fragment {{$title}} niet gevonden
+		Fragment gemist
 	@endif
 @endsection
 
@@ -18,14 +20,18 @@
 	<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>
+		@if($isPodcast)
+			<li>NH Gooi podcast</li>
+		@else
+			<li><a title="Home" href="/gemist/fragment">Fragment gemist</a></li>
+		@endif
 		<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>
+		<li>{{ $podcast->title }}</li>
 	</ul>
 @endsection
 
@@ -84,6 +90,7 @@
 	@if ($podcast)
 			<?php
 			$audioUrl = url($apiUrl . 'podcast/download' . $podcast->url . "?auth=" . $podcast->auth);
+			$streamUrl = url($apiUrl . 'podcast/stream' . $podcast->url . "?auth=" . $podcast->auth);
 			$popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
 			?>
 
@@ -91,7 +98,6 @@
 			<div class="row news_post">
 				<div class="col-12 col-md content_container">
 					<div class="box full-width post single small_image md_margin_top">
-						<h1 class="page_title">{{$podcast->title}}</h1>
 						<div class="post_body">
 							<ul class="post_details clearfix">
 								<li class="detail date">
@@ -100,20 +106,25 @@
 								</li>
 								@if($podcast->program)
 									<li class="detail author">
-										<a href="{{ route('programma') . $podcast->program->url }}">{{ $podcast->program->name }}</a>
+										<a href="/{{ ($isPodcast ? 'podcast' : 'programma') . $podcast->program->url }}">{{ $podcast->program->name }}</a>
 									</li>
 								@endif
 							</ul>
 
 							<div class="announcement">
-								<audio controls>
-									<source src="{{$audioUrl}}" type="audio/mpeg"/>
-								</audio>
+								@include("widgets.audioplayer", [
+									'isStream' => false,
+									'source' => $streamUrl,
+									'lengte' => $podcast->duration / 1000,
+									'waveform' => $podcast->waveform
+								])
+
 								<div class="clearfix">
-									<a class="action_button btn" href="{{$audioUrl}}" title="Download dit fragment als MP3">
+									<a class="action_button btn" href="{{$audioUrl}}"
+									   title="Download dit fragment als MP3">
 										<span>Download fragment</span>
 									</a>
-									<a class="action_button btn player" href="{{$popoutUrl}}">
+									<a class="action_button btn player" href="{{$popoutUrl}}" onclick="pause()">
 										<span>Luister in nieuw venster</span>
 									</a>
 								</div>
@@ -150,22 +161,23 @@
 						<div data-tabs>
 							<div class="tabs">
 								<h4 data-tab-content-id="tab_more_fragmenten"
-									class="box_header small flex-grow-1 active"><span>Meer fragmenten</span>
+									class="box_header small flex-grow-1 active">
+									<span>Meer {{$isPodcast ? 'afleveringen' : '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' => $podcasts])
+								@include('partial/podcastitems', ['id' => 'items-podcasts', 'showTime' => false, 'showImage' => false, 'podcasts' => $podcasts, 'isPodcast' => $isPodcast])
 								<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
+									Meer {{$isPodcast ? 'afleveringen' : 'fragmenten'}}
 								</a>
 							</div>
 						</div>
 					@endif
 
-					@include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+					@include('widgets.banner_sidebar')
 				</div>
-		</div>
+			</div>
 	@endif
 @endsection

resources/views/podcastlist.blade.php

@@ -54,13 +54,14 @@
                     </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 />
+                                href="{{route('gemist.programma')}}">programma gemist</a>.<br/><br/>
                 @endif
 
                 @if(isset($podcasts))
 
                     <div class="clearfix podcast_items">
                         @include('partial/podcastitems', [
+                            'id' => null,
                             'li' => [
                                 'class' => 'col-12 col-md-6'
                             ],
@@ -79,7 +80,8 @@
                                 'class' => 'd-flex flex-column justify-content-end flex-grow-1'
                              ],
                             'showAction' => true,
-                            'podcasts' => array_slice($podcasts, 0, 8)])
+			    'podcasts' => array_slice($podcasts, 0, 8),
+                            'isPodcast' => $isPodcast])
                     </div>
 
                 @else
@@ -98,7 +100,7 @@
                             </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)])
+                            @include('partial/podcastitems', ['id' => 'items-podcasts', 'showTime' => false, 'showImage' => false, 'podcasts' => array_slice($podcasts, 8), 'isPodcast' => $isPodcast])
                             <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>
@@ -108,7 +110,7 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>

resources/views/podcastseries.blade.php

@@ -1,7 +1,11 @@
 @extends('layouts/full')
 
 @section('title')
-    Fragment gemist
+    @if(isset($program))
+        {{ $program->name }}
+    @else
+        NH Gooi Podcast
+    @endif
 @endsection
 
 @section('page_class')
@@ -12,14 +16,12 @@
     <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"><i class="fa-solid fa-chevron-right"></i></li>
+        <li>NH Gooi podcast</li>
         @if(isset($program))
-            <li><a title="{{$program->name}}"
-                   href="{{route('gemist.programma') . $program->url}}">{{$program->name}}</a></li>
             <li class="separator"><i class="fa-solid fa-chevron-right"></i></li>
+            <li><a title="{{$program->name}}"
+                   href="/podcast{{$program->url}}">{{$program->name}}</a></li>
         @endif
-        <li>Fragmenten</li>
     </ul>
 @endsection
 
@@ -28,8 +30,7 @@
         <div class="row news_post">
             <div class="col-12 col-md content_container md_padding_top_80">
                 @if(isset($program))
-                    <div class="box full-width post single">
-                        <h1 class="page_title">{{$program->name}}</h1>
+                    <div class="no-box full-width post single">
                         <div class="post_body">
                             <div class="content_box clearfix section_margin_top">
                                 <div class="post_content page_margin_top_section ">
@@ -39,18 +40,18 @@
                         </div>
                     </div>
                 @endif
-                    @if($podcasts)
+                @if($podcasts)
 
-                        <div class="page_layout clearfix">
-                            <div class="grid" id="items">
-                                @include('partial/podcastdirectitems', ['podcasts' => array_slice($podcasts, 0, 2)])
-                            </div><!--/.row-->
-                        </div>
-                    @else
-                        <div class="box full-width">
-                            <p class="page_body">Er zijn geen fragmenten beschikbaar.</p>
-                        </div>
-                    @endif
+                    <div class="page_layout clearfix">
+                        <div class="grid" id="items">
+                            @include('partial/podcastdirectitems', ['podcasts' => array_slice($podcasts, 0, 2), 'isPodcast' => $isPodcast])
+                        </div><!--/.row-->
+                    </div>
+                @else
+                    <div class="box full-width">
+                        <p class="page_body">Er zijn geen items beschikbaar.</p>
+                    </div>
+                @endif
             </div>
             <div class="col-12 col-md-auto sidebar">
 
@@ -62,7 +63,7 @@
                             </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, 2)])
+                            @include('partial/podcastitems', ['id' => 'items-podcasts', 'showTime' => false, 'showImage' => false, 'podcasts' => array_slice($podcasts, 2), 'isPodcast' => $isPodcast])
                             <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>
@@ -72,7 +73,7 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>

resources/views/programlist.blade.php

@@ -1,10 +1,12 @@
 @extends('layouts/full')
 
 @section('title')
-  Programma gemist
+    Programma gemist
 @endsection
 
-@section('page_class')news_post post_container @endsection
+@section('page_class')
+    news_post post_container
+@endsection
 
 @section('breadcrumb')
     @if(isset($program))
@@ -51,7 +53,8 @@
                            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 />
+                    <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
 
                 @if(isset($programs))
@@ -106,20 +109,31 @@
                     </div>
                 @endif
 
-                @include('widgets/add_sidebar', ['ad_sidebar' => $ad_sidebar1 ?? 'nhgooi_section_side', 'ad_sidebarId' => 'nhgooi_sidebar1'])
+                @include('widgets.banner_sidebar')
             </div>
         </div>
     </div>
-<style>
-    @keyframes tilt-shaking {
-        0% { transform: rotate(0deg); }
-        25% { transform: rotate(5deg); }
-        50% { transform: rotate(0deg); }
-        75% { transform: rotate(-5deg); }
-        100% { transform: rotate(0deg); }
-    }
-    .post_container .post_tags li a {
-        animation: tilt-shaking 1s linear infinite;
-    }
-</style>
+    <style>
+        @keyframes tilt-shaking {
+            0% {
+                transform: rotate(0deg);
+            }
+            25% {
+                transform: rotate(5deg);
+            }
+            50% {
+                transform: rotate(0deg);
+            }
+            75% {
+                transform: rotate(-5deg);
+            }
+            100% {
+                transform: rotate(0deg);
+            }
+        }
+
+        .post_container .post_tags li a {
+            animation: tilt-shaking 1s linear infinite;
+        }
+    </style>
 @endsection

resources/views/radioprogram.blade.php

@@ -129,7 +129,7 @@
         <div id="host" class="box">
             <ul class="list">
                 @foreach($hosts as $host)
-                    <li><i class="fa-solid fa-user-tie"></i> {{ Html::mailto($host->email . '@nhgooi.nl', $host->name, ['class' => 'action_button']) }}</li>
+                    <li><i class="fa-solid fa-user-tie"></i> {{ $host->name }}</li>
                 @endforeach
             </ul>
         </div>

resources/views/widgets/add_sidebar.blade.php

@@ -1,7 +0,0 @@
-@if ($ad_sidebar && (!isset($disableBanners) || !$disableBanners))
-    <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 id="{{$ad_sidebarId}}" style="width: 100%;height: 275px;margin: 11px auto 50px auto;background-color: #efefef;"></div>
-    <script type="text/javascript">ootag.queue.push(function () {ootag.defineSlot({adSlot: "{{$ad_sidebar}}",targetId: "{{$ad_sidebarId}}",adShownCallback: (adslot) => { calculateSize(adslot.targetId); }});});</script>
-@endif

resources/views/widgets/audioplayer.blade.php

@@ -0,0 +1,176 @@
+<?php $id = uniqid('player_'); ?>
+<div class="audioplayer" id="{{ $id }}">
+    @if(!$isStream)
+    <div class="waveform">
+        <div class="time">0:00</div>
+        <div class="duration">0:00</div>
+        <div class="hover"></div>
+    </div>
+    @endif
+    
+    <div class="volume-controls">
+        <button class="btn-toggle-mute" type="button" onclick="toggleMute()">
+            <span class="fa fa-volume-high"></span>
+        </button>
+        <input class="volume-slider" type="range" min="0" max="1" step="0.01" value="1"
+            onchange="setVolume( this.value )" />
+    </div>
+
+    <div class="audio-controls">
+        @if(!$isStream)
+        <button class="btn btn-jump" type="button" onclick="wavesurfer_{{ $id }}.skip(-60)">
+            <span class="fa fa-backward-fast"></span>
+            <label>-60 s</label>
+        </button>
+        <button class="btn btn-jump" type="button" onclick="wavesurfer_{{ $id }}.skip(-10)">
+            <span class="fa fa-backward-step"></span>
+            <label>-10 s</label>
+        </button>
+        @endif
+        <button class="btn btn-play" type="button" onclick="playPause()">
+            <span class="play-button-icon fa fa-play"></span>
+            <label class="play-button-label">Afspelen</label>
+        </button>
+        @if(!$isStream)
+        <button class="btn btn-jump" type="button" onclick="wavesurfer_{{ $id }}.skip(10)">
+            <span class="fa fa-forward-step"></span>
+            <label>+10 s</label>
+        </button>
+        <button class="btn btn-jump" type="button" onclick="wavesurfer_{{ $id }}.skip(60)">
+            <span class="fa fa-forward-fast"></span>
+            <label>+60 s</label>
+        </button>
+        @endif
+    </div>
+</div>
+
+@if($isStream)
+
+<audio id="audio_{{ $id }}">
+    <source src="{{ $source }}" type="audio/mp3" />
+</audio>
+
+<script>
+    var player_{{ $id }};
+    
+    setVolume = volume => player_{{ $id }}.volume = volume;
+    function toggleMute () {
+        var isMuted = !player_{{ $id }}.muted;
+        player_{{ $id }}.muted = isMuted;
+        if(isMuted) {
+            $('#{{ $id }} .btn-toggle-mute').html('<span class="fa fa-volume-xmark"></span>');
+            $('#{{ $id }} .volume-slider').attr('disabled', 'disabled');
+        } else {
+            $('#{{ $id }} .btn-toggle-mute').html('<span class="fa fa-volume-high"></span>');
+            $('#{{ $id }} .volume-slider').removeAttr('disabled');
+        }        
+    }
+
+    pause = () => player_{{ $id }}.pause();
+
+    function playPause() {
+        var player = player_{{ $id }};
+        if (player.paused) {
+            player.play();
+        } else {
+            player.pause();
+        }
+    }
+
+    addEventListener("DOMContentLoaded", function() {
+        var player = document.getElementById( "audio_{{ $id }}");
+        player_{{ $id }} = player;
+
+        $(player_{{ $id }}).on('play', () => {
+            $('#{{ $id }} .play-button-icon').addClass('fa-pause').removeClass('fa-play');
+            $('#{{ $id }} .play-button-label').text('Pauzeren');
+        })
+        $(player_{{ $id }}).on('pause', () => {
+            $('#{{ $id }} .play-button-icon').addClass('fa-play').removeClass('fa-pause');
+            $('#{{ $id }} .play-button-label').text('Verder spelen');
+        });
+    });  
+</script>
+
+@else
+
+<script>
+    var wavesurfer_{{ $id }};
+    
+    setVolume = volume => wavesurfer_{{ $id }}.setVolume( volume );
+    playPause = () => wavesurfer_{{ $id }}.playPause();
+    pause = () => wavesurfer_{{ $id }}.pause();
+
+    function  toggleMute () {
+        var isMuted = !wavesurfer_{{ $id }}.getMuted();
+        wavesurfer_{{ $id }}.setMuted(isMuted);
+        if(isMuted) {
+            $('#{{ $id }} .btn-toggle-mute').html('<span class="fa fa-volume-xmark"></span>');
+            $('#{{ $id }} .volume-slider').attr('disabled', 'disabled');
+        } else {
+            $('#{{ $id }} .btn-toggle-mute').html('<span class="fa fa-volume-high"></span>');
+            $('#{{ $id }} .volume-slider').removeAttr('disabled');
+        }
+        
+    }
+
+    addEventListener("DOMContentLoaded", function() {
+        const canvas = document.createElement('canvas')
+        const ctx = canvas.getContext('2d')
+
+        // Create the waveform
+        wavesurfer_{{ $id }} = WaveSurfer.create({
+            container: '#{{ $id }} .waveform',
+            waveColor: '#3A96EE',
+            progressColor: '#0118A1',
+            height: 50,
+            barWidth: 1,
+            @if(isset($lengte))
+            duration: {{ $lengte }},
+            @endif
+            @if($waveform)
+            peaks:  {{ json_encode($waveform->data) }},
+            normalize: true,
+            @endif
+            
+            url: '{{ $source }}',
+        });
+
+        // Play/pause on click
+        wavesurfer_{{ $id }}.on('click', () => {
+            wavesurfer_{{ $id }}.play();
+        })
+        wavesurfer_{{ $id }}.on('play', () => {
+            $('#{{ $id }} .play-button-icon').addClass('fa-pause').removeClass('fa-play');
+            $('#{{ $id }} .play-button-label').text('Pauzeren');
+        })
+        wavesurfer_{{ $id }}.on('pause', () => {
+            $('#{{ $id }} .play-button-icon').addClass('fa-play').removeClass('fa-pause');
+            $('#{{ $id }} .play-button-label').text('Verder spelen');
+        })
+
+        // Hover effect
+        {
+            const hover = document.querySelector('#{{ $id }} .hover')
+            const waveform = document.querySelector('#{{ $id }} .waveform')
+            waveform.addEventListener('pointermove', (e) => (hover.style.width = `${e.offsetX}px`))
+        }
+
+        // Current time & duration
+        {
+            const formatTime = (seconds) => {
+                const minutes = Math.floor(seconds / 60)
+                const secondsRemainder = Math.round(seconds) % 60
+                const paddedSeconds = `0${secondsRemainder}`.slice(-2)
+                return `${minutes}:${paddedSeconds}`
+            }
+
+            const timeEl = document.querySelector('#{{ $id }} .time')
+            const durationEl = document.querySelector('#{{ $id }} .duration')
+            wavesurfer_{{ $id }}.on('decode', (duration) => (durationEl.textContent = formatTime(duration)))
+            wavesurfer_{{ $id }}.on('timeupdate', (currentTime) => (timeEl.textContent = formatTime(currentTime)))
+        }
+    });
+</script>
+
+@endif

resources/views/widgets/banner_sidebar.blade.php

@@ -0,0 +1,5 @@
+@if (!isset($disableBanners) || !$disableBanners)
+    <div class="d-flex justify-content-center my-4">
+        <ins data-revive-zoneid="2" data-revive-id="{{ env('REVIVE_ID') }}"></ins>
+    </div>
+@endif

resources/views/widgets/contact.blade.php

@@ -2,8 +2,7 @@
     <img class="logo-whatsapp" src="/images/logo-whatsapp.png"/>
     <h2>Contact met de redactie</h2>
     <p>Heb jij een tip voor onze streekredactie? Bel of app de tiplijn:
-        <a href="tel:06 - 42 91 36 37" target="_blank">06 - 42 91 36 37</a>, stuur een
-        <a href="mailto:info@nhgooi.nl">mail</a> of kom lang op de Gooise Brink,
-        Kerkstraat 63/27 in Hilversum</p>
-    <a class="read_more" href="{{url('contact')}}">Lees meer <i class="fa-solid fa-angle-right"></i></a>
+        <a href="tel:0356424774" target="_blank">035 - 64 24 774</a>, of stuur een
+        <a href="mailto:info@nhgooi.nl">mail</a>.</p>
+    <a class="read_more" href="{{url('contact')}}">Contactinformatie <i class="fa-solid fa-angle-right"></i></a>
 </div>

resources/views/widgets/menu.blade.php

@@ -23,6 +23,7 @@
 		"Podcasts" => array(
 				"" => "/podcast",
 				"NH Gooi Spreekuur" => "/podcast/1091/nh-gooi-spreekuur",
+				"Gooise Mythes Ontrafeld" => "/podcast/1106/gooise-mythes-ontrafeld",
 				"NH Gooi Wijsneuzen" => "/podcast/1098/nh-gooi-wijsneuzen",
 				"Hilversum in de oorlog" => "/podcast/1097/hilversum-in-de-oorlog",
 		),
@@ -119,13 +120,9 @@ function buildMenu($menu, $ismobile)
 <nav class="d-none d-md-flex">
 	<div></div>
 	<ul class="menu d-none d-lg-block">
-		<li class="{{isActive('/', false) ? "selected" : ""}}">
-			<a href="/" title="Home">Home</a>
+		<li class="{{isActive('/', false) || isActive('/nieuws', false) ? "selected" : ""}}">
+			<a href="/" title="Nieuws">Nieuws</a>
 		</li>
-		<?php /*@php($newsUrl = '/nieuws')
-		<li class="{{isActive($newsUrl, false) ? "selected" : ""}}">
-			<a href="{{$newsUrl}}" title="Nieuws">Nieuws</a>
-		</li>*/ ?>
 		{!! buildMenu($menu, false) !!}
 		<li></li>
 	</ul>
@@ -142,15 +139,10 @@ function buildMenu($menu, $ismobile)
 					<a href="javascript:void(0)"><i class="fa-solid fa-xmark"></i></a>
 				</div>
 			</li>
-			<li class="{{isActive('/', false) ? "selected" : ""}}">
-				<a href="/" title="Home">Home</a>
-			</li>
-			@php($newsUrl = '/nieuws')
-			<li class="{{isActive($newsUrl, false) ? "selected" : ""}}">
-				<a href="{{$newsUrl}}" title="Nieuws">Nieuws</a>
+			<li class="{{isActive('/', false) || isActive('/nieuws', false) ? "selected" : ""}}">
+				<a href="/" title="Nieuws">Nieuws</a>
 			</li>
 			{!! buildMenu($menu, true) !!}
 	</ul>
 	</nav>
 </div>
-

resources/views/widgets/nhgooiradiotv.blade.php

@@ -5,7 +5,7 @@
         <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">
+    <div id="tab_gooi_radio_live" class="tab_content active box radio_box mb-0">
         <img class="logo-radio" src="/images/logo-NHGooi-radio.svg"/>
         @include('widgets.nustraks')
         <a class="btn" href="/gids">Programmering</a>
@@ -13,7 +13,7 @@
         <a class="btn player" href="/luister/live">Luister live</a>
         <a class="btn" href="/kijk/live">Kijk live mee</a>
     </div>
-    <div id="tab_gooi_tv_live" class="tab_content box radio_box">
+    <div id="tab_gooi_tv_live" class="tab_content box radio_box mb-0">
         <img class="logo-radio" src="/images/logo-NHGooi-televisie.svg"/>
         <h2 class="post_title">Live</h2>
         @include('widgets.mediaplayer')

resources/views/widgets/nustraks.blade.php

@@ -8,8 +8,8 @@
 @endif
 <p class="now-playing-header-small">
 	<strong>Nu:</strong>
-	<span class="title"></span> -
-	<span class="artist"></span>
+	<span class="artist"></span> -
+	<span class="title"></span>
 </p>
 <script type="text/javascript" src="/js/jquery-3.7.1.min.js"></script>
 <script>
@@ -33,9 +33,11 @@
 		$(document).on('onAirUpdated', function (evt, data) {
 			var title = data.current ? data.current.title : '';
 			var artist = data.current ? data.current.artist : '';
-			if (data.inProgram) {
-				title = data.program.name;
-				artist = data.program.tagline;
+			if (!data.current) {
+				// title = data.program.name;
+				// artist = data.program.tagline;
+				$nowPlaying.container.slideUp();
+				return;
 			}
 			$nowPlaying.title.text(title).attr('title', title);
 			$nowPlaying.artist.text(artist).attr('title', artist);

resources/views/widgets/podcastplayer.blade.php

@@ -0,0 +1,56 @@
+<div class="content pt-2">
+  @if($podcast == null)
+  <span>De podcast kan helaas (op dit moment) niet weergegeven worden.</span>
+  @else
+  @include('widgets/mediaplayer')
+
+  @if ($podcast)
+  <?php
+      $audioUrl = url($apiUrl . 'podcast/download' . $podcast->url . "?auth=" . $podcast->auth);
+      $popoutUrl = route('luister.podcast') . $podcast->url . '?auth=' . $podcast->auth;
+      ?>
+  <div class="announcement p-3">
+    <h3 class="page_title">{{$podcast->title}}</h3>
+    <div class="post_body">
+      <ul class="post_details clearfix">
+        <li class="detail date">
+          <i class="fa-regular fa-clock"></i>
+          {{ Formatter::relativeDate($podcast->created) }}
+        </li>
+        @if($podcast->program)
+        <li class="detail author">
+          <a href="{{ route('programma') . $podcast->program->url }}">{{ $podcast->program->name }}</a>
+        </li>
+        @endif
+      </ul>
+
+      <audio controls>
+        <source src="{{$audioUrl}}" type="audio/mpeg" />
+      </audio>
+      <div class="clearfix">
+        <a class="action_button btn" href="{{$audioUrl}}" title="Download dit fragment als MP3">
+          <span>Download fragment</span>
+        </a>
+        <a class="action_button btn player" href="{{$popoutUrl}}">
+          <span>Luister in nieuw venster</span>
+        </a>
+      </div>
+
+      <div class="row content_box clearfix mt-2">
+        @if($podcast->image)
+        <div class="col-3">
+          <img src="{{$imgBase . $podcast->image->url}}" title="{{$podcast->image->title}}"
+            style="display: block; width: 100%;" />
+          <div class="sentence">
+            <span class="text">{{$podcast->image->title}}</span>
+          </div>
+        </div>
+        @endif
+        <div class="col excerpt">{!!$podcast->content!!}</div>
+      </div>
+    </div>
+
+  </div>
+  @endif
+  @endif
+  </div>

routes/web.php

@@ -17,6 +17,7 @@ Route::get('/nieuws', 'NewsController@overview')->name('nieuws');
 Route::get('/nieuws/more', 'NewsController@more')->name('nieuws.more');
 Route::get('/nieuws/populair', 'NewsController@populair')->name('nieuws.populair');
 Route::get('/nieuws/regio/{region}', 'NewsController@regionlist' )->where(['region' => '[a-z0-9]+'])->name('nieuws.regio');
+Route::get('/nieuws/tag/{tag}', 'NewsController@taglist' )->where(['tag' => '[a-z0-9-]+'])->name('nieuws.tag');
 Route::get('/nieuws/thema/{theme}', 'NewsController@themelist' )->where(['themelist' => '[a-z0-9]+'])->name('nieuws.thema');
 Route::get('/nieuws/{id}/{title}', 'NewsController@show')->where(['id' => '\d+'])->name('nieuws.detail');
 Route::get('/nieuws/zoeken/{query}', 'NewsController@search')->name('nieuws.zoeken');
@@ -52,6 +53,7 @@ Route::get('/luister/fragment')->name('luister.podcast');
 Route::get('/luister/programma/{year}/{month}/{day}/{hour}/{duration}/{offset?}', 'StreamController@program')
 	->where(['id' => '\d+', 'year' => '20\d\d', 'month' => '\d\d?', 'day' => '\d\d?', 'hour' => '\d\d?', 'duration' => '\d\d?', 'offset' => '\d\d?']);
 Route::get('/luister/programma')->name('luister.programma');
+Route::get('/luister/fragment/inline/{id}', 'StreamController@inline')->where(['id' => '\d+']);
 
 Route::get('/gemist', 'RadioController@podcasts')->name('gemist');
 Route::get('/gemist/zoeken/{query}', 'RadioController@searchpodcast')->name('gemist.zoeken');
@@ -67,10 +69,10 @@ Route::get('/gemist/fragment/{id}/{title}', 'RadioController@podcast')->where(['
 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/{programma}/{title}', 'PodcastController@podcasts')->where(['programma' => '\d+'])->name('podcast.overzicht');
 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/{query}', 'RadioController@searchpodcast')->name('podcast.zoeken');
 Route::get('/podcast/zoeken', function(Illuminate\Http\Request $request) {
   if($query = $request->get('query', null)) {
     return redirect('/podcast/zoeken/' . urlencode($query));

vendor/composer/ClassLoader.php

@@ -45,35 +45,34 @@ class ClassLoader
     /** @var \Closure(string):void */
     private static $includeFile;
 
-    /** @var ?string */
+    /** @var string|null */
     private $vendorDir;
 
     // PSR-4
     /**
-     * @var array[]
-     * @psalm-var array<string, array<string, int>>
+     * @var array<string, array<string, int>>
      */
     private $prefixLengthsPsr4 = array();
     /**
-     * @var array[]
-     * @psalm-var array<string, array<int, string>>
+     * @var array<string, list<string>>
      */
     private $prefixDirsPsr4 = array();
     /**
-     * @var array[]
-     * @psalm-var array<string, string>
+     * @var list<string>
      */
     private $fallbackDirsPsr4 = array();
 
     // PSR-0
     /**
-     * @var array[]
-     * @psalm-var array<string, array<string, string[]>>
+     * List of PSR-0 prefixes
+     *
+     * Structured as array('F (first letter)' => array('Foo\Bar (full prefix)' => array('path', 'path2')))
+     *
+     * @var array<string, array<string, list<string>>>
      */
     private $prefixesPsr0 = array();
     /**
-     * @var array[]
-     * @psalm-var array<string, string>
+     * @var list<string>
      */
     private $fallbackDirsPsr0 = array();
 
@@ -81,8 +80,7 @@ class ClassLoader
     private $useIncludePath = false;
 
     /**
-     * @var string[]
-     * @psalm-var array<string, string>
+     * @var array<string, string>
      */
     private $classMap = array();
 
@@ -90,21 +88,20 @@ class ClassLoader
     private $classMapAuthoritative = false;
 
     /**
-     * @var bool[]
-     * @psalm-var array<string, bool>
+     * @var array<string, bool>
      */
     private $missingClasses = array();
 
-    /** @var ?string */
+    /** @var string|null */
     private $apcuPrefix;
 
     /**
-     * @var self[]
+     * @var array<string, self>
      */
     private static $registeredLoaders = array();
 
     /**
-     * @param ?string $vendorDir
+     * @param string|null $vendorDir
      */
     public function __construct($vendorDir = null)
     {
@@ -113,7 +110,7 @@ class ClassLoader
     }
 
     /**
-     * @return string[]
+     * @return array<string, list<string>>
      */
     public function getPrefixes()
     {
@@ -125,8 +122,7 @@ class ClassLoader
     }
 
     /**
-     * @return array[]
-     * @psalm-return array<string, array<int, string>>
+     * @return array<string, list<string>>
      */
     public function getPrefixesPsr4()
     {
@@ -134,8 +130,7 @@ class ClassLoader
     }
 
     /**
-     * @return array[]
-     * @psalm-return array<string, string>
+     * @return list<string>
      */
     public function getFallbackDirs()
     {
@@ -143,8 +138,7 @@ class ClassLoader
     }
 
     /**
-     * @return array[]
-     * @psalm-return array<string, string>
+     * @return list<string>
      */
     public function getFallbackDirsPsr4()
     {
@@ -152,8 +146,7 @@ class ClassLoader
     }
 
     /**
-     * @return string[] Array of classname => path
-     * @psalm-return array<string, string>
+     * @return array<string, string> Array of classname => path
      */
     public function getClassMap()
     {
@@ -161,8 +154,7 @@ class ClassLoader
     }
 
     /**
-     * @param string[] $classMap Class to filename map
-     * @psalm-param array<string, string> $classMap
+     * @param array<string, string> $classMap Class to filename map
      *
      * @return void
      */
@@ -179,24 +171,25 @@ class ClassLoader
      * Registers a set of PSR-0 directories for a given prefix, either
      * appending or prepending to the ones previously set for this prefix.
      *
-     * @param string          $prefix  The prefix
-     * @param string[]|string $paths   The PSR-0 root directories
-     * @param bool            $prepend Whether to prepend the directories
+     * @param string              $prefix  The prefix
+     * @param list<string>|string $paths   The PSR-0 root directories
+     * @param bool                $prepend Whether to prepend the directories
      *
      * @return void
      */
     public function add($prefix, $paths, $prepend = false)
     {
+        $paths = (array) $paths;
         if (!$prefix) {
             if ($prepend) {
                 $this->fallbackDirsPsr0 = array_merge(
-                    (array) $paths,
+                    $paths,
                     $this->fallbackDirsPsr0
                 );
             } else {
                 $this->fallbackDirsPsr0 = array_merge(
                     $this->fallbackDirsPsr0,
-                    (array) $paths
+                    $paths
                 );
             }
 
@@ -205,19 +198,19 @@ class ClassLoader
 
         $first = $prefix[0];
         if (!isset($this->prefixesPsr0[$first][$prefix])) {
-            $this->prefixesPsr0[$first][$prefix] = (array) $paths;
+            $this->prefixesPsr0[$first][$prefix] = $paths;
 
             return;
         }
         if ($prepend) {
             $this->prefixesPsr0[$first][$prefix] = array_merge(
-                (array) $paths,
+                $paths,
                 $this->prefixesPsr0[$first][$prefix]
             );
         } else {
             $this->prefixesPsr0[$first][$prefix] = array_merge(
                 $this->prefixesPsr0[$first][$prefix],
-                (array) $paths
+                $paths
             );
         }
     }
@@ -226,9 +219,9 @@ class ClassLoader
      * Registers a set of PSR-4 directories for a given namespace, either
      * appending or prepending to the ones previously set for this namespace.
      *
-     * @param string          $prefix  The prefix/namespace, with trailing '\\'
-     * @param string[]|string $paths   The PSR-4 base directories
-     * @param bool            $prepend Whether to prepend the directories
+     * @param string              $prefix  The prefix/namespace, with trailing '\\'
+     * @param list<string>|string $paths   The PSR-4 base directories
+     * @param bool                $prepend Whether to prepend the directories
      *
      * @throws \InvalidArgumentException
      *
@@ -236,17 +229,18 @@ class ClassLoader
      */
     public function addPsr4($prefix, $paths, $prepend = false)
     {
+        $paths = (array) $paths;
         if (!$prefix) {
             // Register directories for the root namespace.
             if ($prepend) {
                 $this->fallbackDirsPsr4 = array_merge(
-                    (array) $paths,
+                    $paths,
                     $this->fallbackDirsPsr4
                 );
             } else {
                 $this->fallbackDirsPsr4 = array_merge(
                     $this->fallbackDirsPsr4,
-                    (array) $paths
+                    $paths
                 );
             }
         } elseif (!isset($this->prefixDirsPsr4[$prefix])) {
@@ -256,18 +250,18 @@ class ClassLoader
                 throw new \InvalidArgumentException("A non-empty PSR-4 prefix must end with a namespace separator.");
             }
             $this->prefixLengthsPsr4[$prefix[0]][$prefix] = $length;
-            $this->prefixDirsPsr4[$prefix] = (array) $paths;
+            $this->prefixDirsPsr4[$prefix] = $paths;
         } elseif ($prepend) {
             // Prepend directories for an already registered namespace.
             $this->prefixDirsPsr4[$prefix] = array_merge(
-                (array) $paths,
+                $paths,
                 $this->prefixDirsPsr4[$prefix]
             );
         } else {
             // Append directories for an already registered namespace.
             $this->prefixDirsPsr4[$prefix] = array_merge(
                 $this->prefixDirsPsr4[$prefix],
-                (array) $paths
+                $paths
             );
         }
     }
@@ -276,8 +270,8 @@ class ClassLoader
      * Registers a set of PSR-0 directories for a given prefix,
      * replacing any others previously set for this prefix.
      *
-     * @param string          $prefix The prefix
-     * @param string[]|string $paths  The PSR-0 base directories
+     * @param string              $prefix The prefix
+     * @param list<string>|string $paths  The PSR-0 base directories
      *
      * @return void
      */
@@ -294,8 +288,8 @@ class ClassLoader
      * Registers a set of PSR-4 directories for a given namespace,
      * replacing any others previously set for this namespace.
      *
-     * @param string          $prefix The prefix/namespace, with trailing '\\'
-     * @param string[]|string $paths  The PSR-4 base directories
+     * @param string              $prefix The prefix/namespace, with trailing '\\'
+     * @param list<string>|string $paths  The PSR-4 base directories
      *
      * @throws \InvalidArgumentException
      *
@@ -429,7 +423,8 @@ class ClassLoader
     public function loadClass($class)
     {
         if ($file = $this->findFile($class)) {
-            (self::$includeFile)($file);
+            $includeFile = self::$includeFile;
+            $includeFile($file);
 
             return true;
         }
@@ -480,9 +475,9 @@ class ClassLoader
     }
 
     /**
-     * Returns the currently registered loaders indexed by their corresponding vendor directories.
+     * Returns the currently registered loaders keyed by their corresponding vendor directories.
      *
-     * @return self[]
+     * @return array<string, self>
      */
     public static function getRegisteredLoaders()
     {
@@ -560,7 +555,10 @@ class ClassLoader
         return false;
     }
 
-    private static function initializeIncludeClosure(): void
+    /**
+     * @return void
+     */
+    private static function initializeIncludeClosure()
     {
         if (self::$includeFile !== null) {
             return;
@@ -574,8 +572,8 @@ class ClassLoader
          * @param  string $file
          * @return void
          */
-        self::$includeFile = static function($file) {
+        self::$includeFile = \Closure::bind(static function($file) {
             include $file;
-        };
+        }, null, null);
     }
 }

vendor/composer/autoload_classmap.php

@@ -2646,19 +2646,19 @@ return array(
     'Mockery\\Undefined' => $vendorDir . '/mockery/mockery/library/Mockery/Undefined.php',
     'Mockery\\VerificationDirector' => $vendorDir . '/mockery/mockery/library/Mockery/VerificationDirector.php',
     'Mockery\\VerificationExpectation' => $vendorDir . '/mockery/mockery/library/Mockery/VerificationExpectation.php',
-    'Model\\Blog' => '/srv/api/common/classes/Blog.php',
-    'Model\\CalendarEvent' => '/srv/api/common/classes/CalendarEvent.php',
-    'Model\\JobOpening' => '/srv/api/common/classes/JobOpening.php',
-    'Model\\Kerkdienst' => '/srv/api/common/classes/Kerkdienst.php',
-    'Model\\MetaData' => '/srv/api/common/classes/MetaData.php',
-    'Model\\Model' => '/srv/api/common/classes/Model.php',
-    'Model\\NewsImage' => '/srv/api/common/classes/NewsImage.php',
-    'Model\\NewsItem' => '/srv/api/common/classes/NewsItem.php',
-    'Model\\NewsSource' => '/srv/api/common/classes/NewsSource.php',
-    'Model\\Podcast' => '/srv/api/common/classes/Podcast.php',
-    'Model\\Program' => '/srv/api/common/classes/Program.php',
-    'Model\\ProgramHost' => '/srv/api/common/classes/ProgramHost.php',
-    'Model\\Track' => '/srv/api/common/classes/Track.php',
+    'Model\\Blog' => $baseDir . '/app/Models/Blog.php',
+    'Model\\CalendarEvent' => $baseDir . '/app/Models/CalendarEvent.php',
+    'Model\\JobOpening' => $baseDir . '/app/Models/JobOpening.php',
+    'Model\\Kerkdienst' => $baseDir . '/app/Models/Kerkdienst.php',
+    'Model\\MetaData' => $baseDir . '/app/Models/MetaData.php',
+    'Model\\Model' => $baseDir . '/app/Models/Model.php',
+    'Model\\NewsImage' => $baseDir . '/app/Models/NewsImage.php',
+    'Model\\NewsItem' => $baseDir . '/app/Models/NewsItem.php',
+    'Model\\NewsSource' => $baseDir . '/app/Models/NewsSource.php',
+    'Model\\Podcast' => $baseDir . '/app/Models/Podcast.php',
+    'Model\\Program' => $baseDir . '/app/Models/Program.php',
+    'Model\\ProgramHost' => $baseDir . '/app/Models/ProgramHost.php',
+    'Model\\Track' => $baseDir . '/app/Models/Track.php',
     'Monolog\\Attribute\\AsMonologProcessor' => $vendorDir . '/monolog/monolog/src/Monolog/Attribute/AsMonologProcessor.php',
     'Monolog\\DateTimeImmutable' => $vendorDir . '/monolog/monolog/src/Monolog/DateTimeImmutable.php',
     'Monolog\\ErrorHandler' => $vendorDir . '/monolog/monolog/src/Monolog/ErrorHandler.php',

vendor/composer/autoload_psr4.php

@@ -56,7 +56,7 @@ return array(
     'PhpOption\\' => array($vendorDir . '/phpoption/phpoption/src/PhpOption'),
     'NunoMaduro\\Collision\\' => array($vendorDir . '/nunomaduro/collision/src'),
     'Monolog\\' => array($vendorDir . '/monolog/monolog/src/Monolog'),
-    'Model\\' => array('/srv/api/common/classes'),
+    'Model\\' => array($baseDir . '/app/Models'),
     'League\\MimeTypeDetection\\' => array($vendorDir . '/league/mime-type-detection/src'),
     'League\\Flysystem\\' => array($vendorDir . '/league/flysystem/src'),
     'League\\Config\\' => array($vendorDir . '/league/config/src'),

vendor/composer/autoload_real.php

@@ -34,15 +34,15 @@ class ComposerAutoloaderInit5216a35d72a5119d2f4646cd700f802d
         $loader->register(true);
 
         $filesToLoad = \Composer\Autoload\ComposerStaticInit5216a35d72a5119d2f4646cd700f802d::$files;
-        $requireFile = static function ($fileIdentifier, $file) {
+        $requireFile = \Closure::bind(static function ($fileIdentifier, $file) {
             if (empty($GLOBALS['__composer_autoload_files'][$fileIdentifier])) {
                 $GLOBALS['__composer_autoload_files'][$fileIdentifier] = true;
 
                 require $file;
             }
-        };
+        }, null, null);
         foreach ($filesToLoad as $fileIdentifier => $file) {
-            ($requireFile)($fileIdentifier, $file);
+            $requireFile($fileIdentifier, $file);
         }
 
         return $loader;

vendor/composer/autoload_static.php

@@ -381,7 +381,7 @@ class ComposerStaticInit5216a35d72a5119d2f4646cd700f802d
         ),
         'Model\\' => 
         array (
-            0 => '/srv/api/common/classes',
+            0 => __DIR__ . '/../..' . '/app/Models',
         ),
         'League\\MimeTypeDetection\\' => 
         array (
@@ -3169,19 +3169,19 @@ class ComposerStaticInit5216a35d72a5119d2f4646cd700f802d
         'Mockery\\Undefined' => __DIR__ . '/..' . '/mockery/mockery/library/Mockery/Undefined.php',
         'Mockery\\VerificationDirector' => __DIR__ . '/..' . '/mockery/mockery/library/Mockery/VerificationDirector.php',
         'Mockery\\VerificationExpectation' => __DIR__ . '/..' . '/mockery/mockery/library/Mockery/VerificationExpectation.php',
-        'Model\\Blog' => '/srv/api/common/classes/Blog.php',
-        'Model\\CalendarEvent' => '/srv/api/common/classes/CalendarEvent.php',
-        'Model\\JobOpening' => '/srv/api/common/classes/JobOpening.php',
-        'Model\\Kerkdienst' => '/srv/api/common/classes/Kerkdienst.php',
-        'Model\\MetaData' => '/srv/api/common/classes/MetaData.php',
-        'Model\\Model' => '/srv/api/common/classes/Model.php',
-        'Model\\NewsImage' => '/srv/api/common/classes/NewsImage.php',
-        'Model\\NewsItem' => '/srv/api/common/classes/NewsItem.php',
-        'Model\\NewsSource' => '/srv/api/common/classes/NewsSource.php',
-        'Model\\Podcast' => '/srv/api/common/classes/Podcast.php',
-        'Model\\Program' => '/srv/api/common/classes/Program.php',
-        'Model\\ProgramHost' => '/srv/api/common/classes/ProgramHost.php',
-        'Model\\Track' => '/srv/api/common/classes/Track.php',
+        'Model\\Blog' => __DIR__ . '/../..' . '/app/Models/Blog.php',
+        'Model\\CalendarEvent' => __DIR__ . '/../..' . '/app/Models/CalendarEvent.php',
+        'Model\\JobOpening' => __DIR__ . '/../..' . '/app/Models/JobOpening.php',
+        'Model\\Kerkdienst' => __DIR__ . '/../..' . '/app/Models/Kerkdienst.php',
+        'Model\\MetaData' => __DIR__ . '/../..' . '/app/Models/MetaData.php',
+        'Model\\Model' => __DIR__ . '/../..' . '/app/Models/Model.php',
+        'Model\\NewsImage' => __DIR__ . '/../..' . '/app/Models/NewsImage.php',
+        'Model\\NewsItem' => __DIR__ . '/../..' . '/app/Models/NewsItem.php',
+        'Model\\NewsSource' => __DIR__ . '/../..' . '/app/Models/NewsSource.php',
+        'Model\\Podcast' => __DIR__ . '/../..' . '/app/Models/Podcast.php',
+        'Model\\Program' => __DIR__ . '/../..' . '/app/Models/Program.php',
+        'Model\\ProgramHost' => __DIR__ . '/../..' . '/app/Models/ProgramHost.php',
+        'Model\\Track' => __DIR__ . '/../..' . '/app/Models/Track.php',
         'Monolog\\Attribute\\AsMonologProcessor' => __DIR__ . '/..' . '/monolog/monolog/src/Monolog/Attribute/AsMonologProcessor.php',
         'Monolog\\DateTimeImmutable' => __DIR__ . '/..' . '/monolog/monolog/src/Monolog/DateTimeImmutable.php',
         'Monolog\\ErrorHandler' => __DIR__ . '/..' . '/monolog/monolog/src/Monolog/ErrorHandler.php',