diff options
Diffstat (limited to 'template')
-rw-r--r-- | template/assemblies/player/relive.phtml | 16 | ||||
-rw-r--r-- | template/page.phtml | 15 | ||||
-rw-r--r-- | template/relive-player.phtml | 15 | ||||
-rw-r--r-- | template/relive.phtml | 49 | ||||
-rw-r--r-- | template/rooms.phtml | 2 |
5 files changed, 67 insertions, 30 deletions
diff --git a/template/assemblies/player/relive.phtml b/template/assemblies/player/relive.phtml new file mode 100644 index 0000000..c37fd87 --- /dev/null +++ b/template/assemblies/player/relive.phtml @@ -0,0 +1,16 @@ +<div style="width: 100%; height: 100%; max-width: <?=h($width)?>px; margin: 0 auto;"> + <video + autoplay="autoplay" + preload="auto" + width="<?=h($width)?>" + height="<?=h($height)?>" + style="width: 100%; height: 100%;" + class="nosubs relive" + > + <source + src="http://vod.c3voc.de/relive/<?=h($talk['playlist'])?>" + title="h.264 (HLS)" + type="application/x-mpegURL" + /> + </video> +</div> diff --git a/template/page.phtml b/template/page.phtml index e120993..5bef8b0 100644 --- a/template/page.phtml +++ b/template/page.phtml @@ -32,18 +32,21 @@ <link href="assets/img/favicon/16x16.png" rel="icon" type="image/png" sizes="16x16" /> <link type="text/css" rel="stylesheet" href="assets/css/lib/font-awesome.min.css" /> - <link type="text/css" rel="stylesheet" href="assets/css/lib/mediaelementplayer.min.css" /> <link type="text/css" rel="stylesheet" href="assets/css/lustige-styles.css" /> <script type="text/javascript" src="assets/js/lib/jquery.min.js"></script> <script type="text/javascript" src="assets/js/lib/jquery.scrollTo.min.js"></script> <script type="text/javascript" src="assets/js/lib/bootstrap.min.js"></script> - <script type="text/javascript" src="assets/js/lib/mediaelement-and-player.min.js"></script> - <script type="text/javascript" src="assets/js/lustiges-script.js"></script> - <? if(isset($extraScripts)) foreach($extraScripts as $script): ?> - <script type="text/javascript" src="<?=h($script)?>"></script> - <? endforeach ?> + <? if(@$relive): ?> + <link type="text/css" rel="stylesheet" href="assets/js/lib/relive/mediaelementplayer.min.css" /> + <script type="text/javascript" src="assets/js/lib/relive/mediaelement-and-player.min.js"></script> + <script type="text/javascript" src="assets/js/lustiges-relive-script.js"></script> + <? else: ?> + <link type="text/css" rel="stylesheet" href="assets/css/lib/mediaelementplayer.min.css" /> + <script type="text/javascript" src="assets/js/lib/mediaelement-and-player.min.js"></script> + <script type="text/javascript" src="assets/js/lustiges-script.js"></script> + <? endif ?> </head> <body class="<?=h($page)?>"> <? include("$assemblies/header.phtml") ?> diff --git a/template/relive-player.phtml b/template/relive-player.phtml new file mode 100644 index 0000000..2a488d6 --- /dev/null +++ b/template/relive-player.phtml @@ -0,0 +1,15 @@ +<div class="container-fluid"> + <h1><?=h($title)?></h1> + <h2><?=h($talk['title'])?></h2> + <? include("$assemblies/player/relive.phtml") ?> + + <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> + + <? 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> diff --git a/template/relive.phtml b/template/relive.phtml index 248056f..dc9b91b 100644 --- a/template/relive.phtml +++ b/template/relive.phtml @@ -1,29 +1,32 @@ <div class="container-fluid"> - <h1>Experimetal ReLive Recordings</h1> + <h1><?=h($title)?></h1> - <div class="event-previews"> - <h2 class="loading">Loading…</h2> + <div class="event-previews relive"> - <a class="event-preview template" href="url.html"> - <img alt="Readable Title" class="video-thumbnail" src=""> - <div class="caption"> - <ul class="metadata"> - <li> - <span class="fa fa-clock-o"></span> - 36 min - </li> - <li> - <span class="fa fa-calendar-o"></span> - 2013-12-28 - </li> - <li class="persons"> - <span class="fa fa-user"></span> - C B - </li> - </ul> - <h3>Readable Title</h3> - </div> - </a> + <? foreach ($talks as $talk): ?> + <a class="event-preview <?=h($talk['status'])?>" href="<?=h(link_vod($talk['id']))?>"> + <img alt="<?=h($talk['title'])?>" class="video-thumbnail" src="http://vod.c3voc.de/relive/<?=h($talk['thumbnail'])?>"> + <div class="caption"> + <ul class="metadata"> + <li> + <span class="fa fa-clock-o"></span> + <?=h(round($talk['duration']/60))?> min + </li> + <li> + <span class="fa fa-cogs"></span> + <?=h($talk['status'])?> + </li> + <li> + <span class="fa fa-sign-in"></span> + <?=h($talk['room'])?> + </li> + </ul> + <h3><?=h($talk['title'])?> + <? if($talk['status'] == 'live'): ?> (Currently Live!)<? endif ?> + </h3> + </div> + </a> + <? endforeach ?> </div> </div> diff --git a/template/rooms.phtml b/template/rooms.phtml index 7a348ec..b5fb074 100644 --- a/template/rooms.phtml +++ b/template/rooms.phtml @@ -74,7 +74,7 @@ </div> </li> <li class="col-sm-6"> - <a href="http://vod.c3voc.de/relive/"><span class="fa fa-play-circle"></span> ReLive</a> + <a href="relive/"><span class="fa fa-play-circle"></span> ReLive</a> </li> </ul> </div> |