Relive

10 files changed, 106 insertions, 68 deletions

diff --git a/assets/css/_structure.less b/assets/css/_structure.less
index cd6d746..7fc59d8 100644
--- a/assets/css/_structure.less
+++ b/assets/css/_structure.less
@@ -68,6 +68,12 @@ body.overview {
 body.room {
 	@import "_room.less";
 }
+body.relive {
+	@import "_relive.less";
+}
+body.relive-player {
+	@import "_relive_player.less";
+}
 
 body.e404 {
 	> .container {
diff --git a/lib/helper.php b/lib/helper.php
index efdf84c..d21b4c6 100644
--- a/lib/helper.php
+++ b/lib/helper.php
@@ -233,3 +233,23 @@ function startswith($needle, $haystack)
 {
 	return substr($haystack, 0, strlen($needle)) == $needle;
 }
+
+function relive_talks()
+{
+	$talks = file_get_contents(get('OVERVIEW.RELIVE_JSON'));
+	$talks = utf8_decode($talks);
+	$talks = json_decode($talks, true);
+
+	usort($talks, function($a, $b) {
+		$sort = array('live', 'recorded', 'released');
+		return array_search($a['status'], $sort) > array_search($b['status'], $sort);
+	});
+
+	$talks_by_id = array();
+	foreach ($talks as $value)
+	{
+		$talks_by_id[$value['id']] = $value;
+	}
+
+	return $talks_by_id;
+}
diff --git a/pages/relive-player.php b/pages/relive-player.php
index 64d1578..84fc866 100644
--- a/pages/relive-player.php
+++ b/pages/relive-player.php
@@ -2,24 +2,17 @@
 
 require_once('lib/bootstrap.php');
 
-$talks = file_get_contents('http://vod.c3voc.de/relive/index.json');
-$talks = utf8_decode($talks);
-$talks = json_decode($talks, true);
+$talks_by_id = relive_talks();
+$talk = @$talks_by_id[intval($_GET['id'])];
 
-$talkhit = null;
-foreach($talks as $talk) {
-	if($talk['id'] == $_GET['id'])
-		$talkhit = $talk;
-}
-
-if(!$talkhit) return;
+if(!$talk)
+	return include('page/404.php');
 
 echo $tpl->render(array(
 	'page' => 'relive-player',
 	'title' => 'Relive!',
-	'talk' => $talkhit,
+	'talk' => $talk,
 
 	'width' => 1024,
 	'height' => 576,
-	'relive' => true,
 ));
diff --git a/pages/relive.php b/pages/relive.php
index 362af34..33e0d5a 100644
--- a/pages/relive.php
+++ b/pages/relive.php
@@ -2,17 +2,8 @@
 
 require_once('lib/bootstrap.php');
 
-$talks = file_get_contents(get('OVERVIEW.RELIVE_JSON'));
-$talks = utf8_decode($talks);
-$talks = json_decode($talks, true);
-
-usort($talks, function($a, $b) {
-	$sort = array('live', 'recorded', 'released');
-	return array_search($a['status'], $sort) > array_search($b['status'], $sort);
-});
-
 echo $tpl->render(array(
 	'page' => 'relive',
 	'title' => 'Relive!',
-	'talks' => $talks,
+	'talks' => relive_talks(),
 ));
diff --git a/pages/room.php b/pages/room.php
index abd764d..77f4fdf 100644
--- a/pages/room.php
+++ b/pages/room.php
@@ -8,7 +8,7 @@ $language = $_GET['language'];
 $selection = $_GET['selection'];
 
 if(!has("ROOMS.$room"))
-	return include('404.php');
+	return include('pages/404.php');
 
 $formats = get("ROOMS.$room.FORMATS");
 $has_translation = get("ROOMS.$room.TRANSLATION");
@@ -54,7 +54,7 @@ if(!$selection)
 	$selection = $selections[0];
 
 if(!in_array($selection, $selections))
-	return include('404.php');
+	return include('pages/404.php');
 
 
 
@@ -94,7 +94,7 @@ switch($selection) {
 if($language == 'translated')
 {
 	if(!$has_translation)
-		return include('404.php');
+		return include('pages/404.php');
 
 	$title = 'Translated '.$title;
 }
diff --git a/template/assemblies/player/relive.phtml b/template/assemblies/player/relive.phtml
index c37fd87..718b249 100644
--- a/template/assemblies/player/relive.phtml
+++ b/template/assemblies/player/relive.phtml
@@ -1,14 +1,14 @@
-<div style="width: 100%; height: 100%; max-width: <?=h($width)?>px; margin: 0 auto;">
+<div style="max-width: <?=h($width)?>px; max-height: <?=h($height)?>px;" class="video-wrap">
 	<video
 		autoplay="autoplay"
 		preload="auto"
 		width="<?=h($width)?>"
 		height="<?=h($height)?>"
 		style="width: 100%; height: 100%;"
-		class="nosubs relive"
+		class="relive"
 	>
 		<source
-			src="http://vod.c3voc.de/relive/<?=h($talk['playlist'])?>"
+			src="<?=h($talk['playlist'])?>"
 			title="h.264 (HLS)"
 			type="application/x-mpegURL"
 		/>
diff --git a/template/overview.phtml b/template/overview.phtml
index 9210d47..ad102f8 100644
--- a/template/overview.phtml
+++ b/template/overview.phtml
@@ -40,9 +40,11 @@
 				">
 					<div class="panel panel-default">
 						<div class="panel-heading">
-							<a href="<?=h(link_room($room))?>">
-								<?=h(get("ROOMS.$room.DISPLAY"))?>
-							</a>
+							<div class="panel-title">
+								<a href="<?=h(link_room($room))?>">
+									<?=h(get("ROOMS.$room.DISPLAY"))?>
+								</a>
+							</div>
 						</div>
 
 						<div class="panel-body">
diff --git a/template/relive-player.phtml b/template/relive-player.phtml
index 2a488d6..0e02c13 100644
--- a/template/relive-player.phtml
+++ b/template/relive-player.phtml
@@ -1,15 +1,28 @@
-<div class="container-fluid">
-	<h1><?=h($title)?></h1>
-	<h2><?=h($talk['title'])?></h2>
-	<? include("$assemblies/player/relive.phtml") ?>
+<div class="container">
+	<div class="row headline">
+		<div class="col-xs-12">
+			<h1><?=h($title)?></h1>
+		</div>
+	</div>
+
+	<div class="row">
+		<div class="col-xs-12">
+			<div class="player-wrap">
+				<? include("$assemblies/player/relive.phtml") ?>
+			</div>
+		</div>
+	</div>
 
-	<div class="text">
-		<h3>Use a Desktop-Player!</h3>
-		<p>Browsers and Video doesn't go together well, even in 2014 and especially when it's live. So for your best viewing-experience please use a Desktop-Player like VLC or mplayer: <a href="http://vod.c3voc.de/relive/<?=h($talk['playlist'])?>">HLS-Playlist</a></p>
+	<div class="row">
+		<div class="col-xs-12 col-md-8 col-md-offset-2">
+			<div class="well">
+				<? include("$assemblies/desktop-player.phtml") ?>
 
-		<? if($talk['status'] == 'released'): ?>
-			<h3>Released</h3>
-			<p>This talk is already released! Take a look at <a href="<?=h($talk['release_url'])?>">media.ccc.de</a>.</p>
-		<? endif ?>
+				<? if($talk['status'] == 'released'): ?>
+					<h3>Released</h3>
+					<p>This talk is already released! Take a look at <a href="<?=h($talk['release_url'])?>">media.ccc.de</a>.</p>
+				<? endif ?>
+			</div>
+		</div>
 	</div>
 </div>
diff --git a/template/relive.phtml b/template/relive.phtml
index 86b5b3f..aa605d8 100644
--- a/template/relive.phtml
+++ b/template/relive.phtml
@@ -2,24 +2,35 @@
 	<h1><?=h($title)?></h1>
 
 	<div class="row">
-		<div class="alert alert-danger" role="alert">
-			<i class="fa fa-exclamation-circle"></i>
-			<strong>Danger!</strong> Extreme Beta!!!
+		<div class="col-xs-12">
+			<div class="alert alert-danger" role="alert">
+				<i class="fa fa-exclamation-circle"></i>
+				<strong>Danger!</strong> Extreme Beta!!!
+			</div>
 		</div>
 	</div>
 
-	<div class="event-previews relive">
-
-		<? foreach ($talks as $talk): ?>
-			<a class="event-preview <?=h($talk['status'])?>"
-				<? if($talk['status'] == 'released'): ?>
-					href="<?=h($talk['release_url'])?>"
-				<? else: ?>
-					href="<?=h(link_vod($talk['id']))?>"
-				<? endif ?>
-			>
-				<img alt="<?=h($talk['title'])?>" class="video-thumbnail" src="http://vod.c3voc.de/relive/<?=h($talk['thumbnail'])?>">
-				<div class="caption">
+	<div class="row">
+
+	<? foreach ($talks as $talk): ?>
+		<? $url = ($talk['status'] == 'released') ? $talk['release_url'] : link_vod($talk['id']) ?>
+		<div class="col-xs-12 recording">
+			<div class="panel panel-default">
+				<div class="panel-heading">
+
+					<h3 class="panel-title">
+						<a href="<?=h($url)?>">
+							<?=h($talk['title'])?>
+						</a>
+					</h3>
+
+				</div>
+				<div class="panel-body">
+					<a href="<?=h($url)?>">
+						<img class="preview" alt="<?=h($talk['title'])?>" class="video-thumbnail" src="<?=h($talk['thumbnail'])?>" width="213" height="120" />
+					</a>
+
+
 					<ul class="metadata">
 						<li>
 							<span class="fa fa-clock-o"></span>
@@ -34,12 +45,11 @@
 							<?=h($talk['room'])?>
 						</li>
 					</ul>
-					<h3><?=h($talk['title'])?>
-						<? if($talk['status'] == 'live'): ?>&nbsp;(Currently Live!)<? endif ?>
-					</h3>
+
+
 				</div>
-			</a>
-		<? endforeach ?>
+			</div>
+		</div>
+	<? endforeach ?>
 
-	</div>
 </div>
diff --git a/test-vod.json b/test-vod.json
index 9c385b8..f4ac6f1 100644
--- a/test-vod.json
+++ b/test-vod.json
@@ -4,7 +4,8 @@
 		"release_url": "",
 		"title": "Title",
 		"id": 123,
-		"thumbnail": "123.png",
+		"thumbnail": "http://vod.c3voc.de/123.png",
+		"playlist": "http://vod.c3voc.de/123.m3u8",
 		"duration": 3600,
 		"room": "Saal 1"
 	},
@@ -12,8 +13,9 @@
 		"status": "released",
 		"release_url": "http://media.ccc.de/",
 		"title": "Title",
-		"id": 123,
-		"thumbnail": "123.png",
+		"id": 234,
+		"thumbnail": "http://vod.c3voc.de/234.png",
+		"playlist": "http://vod.c3voc.de/234.m3u8",
 		"duration": 3600,
 		"room": "Saal 1"
 	},
@@ -21,8 +23,9 @@
 		"status": "recorded",
 		"release_url": "",
 		"title": "Title",
-		"id": 123,
-		"thumbnail": "123.png",
+		"id": 456,
+		"thumbnail": "http://vod.c3voc.de/456.png",
+		"playlist": "http://vod.c3voc.de/456.m3u8",
 		"duration": 3600,
 		"room": "Saal 1"
 	}