shuffle things around on the way to a bootstrap-based configurable website

6 files changed, 138 insertions, 122 deletions

diff --git a/template/assemblies/banner.phtml b/template/assemblies/banner.phtml
index 2779131..d1ca8c0 100644
--- a/template/assemblies/banner.phtml
+++ b/template/assemblies/banner.phtml
@@ -1,3 +1,6 @@
-<div class="banner">
-	<div class="logo"><img src="assets/img/logo.png" height="190" width="161" /></div>
+<? if(has('CONFERENCE.BANNER_HTML')) ?>
+<div class="row banner">
+	<div class="col-xs-12">
+		<?=get('CONFERENCE.BANNER_HTML')?>
+	</div>
 </div>
diff --git a/template/assemblies/footer.phtml b/template/assemblies/footer.phtml
index d93a512..2c5ab5d 100644
--- a/template/assemblies/footer.phtml
+++ b/template/assemblies/footer.phtml
@@ -1,6 +1,7 @@
 <footer>
-	by <a class='inverted' href='https://ccc.de'>Chaos Computer Club e.V</a>,
-	<a class='inverted' href='http://fem.tu-ilmenau.de/'>FeM</a>,
-	<a class='inverted' href='http://www.ags.tu-bs.de/'>ags</a> &amp;
-	<a class='inverted' href='https://c3voc.de'>c3voc</a>
+	<? if(has('CONFERENCE.FOOTER_HTML')): ?>
+		<?= get('CONFERENCE.FOOTER_HTML') ?>
+	<? else: ?>
+		by <a href="https://c3voc.de">c3voc</a>
+	<? endif ?>
 </footer>
diff --git a/template/assemblies/header.phtml b/template/assemblies/header.phtml
index 2889927..17afb6c 100644
--- a/template/assemblies/header.phtml
+++ b/template/assemblies/header.phtml
@@ -1,33 +1,22 @@
-<div class="navbar navbar-default navbar-fixed-top" role="navigation">
-	<div class="container-fluid">
+<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
+	<div class="container">
 		<div class="navbar-header">
 			<a class="navbar-brand" href="">
-				<img alt="ccc-tv logo, a tv displaying a play icon" src="assets/img/tv.png">
-				31C3 Streaming
+				<img alt="ccc-tv logo, a tv displaying a play icon" src="assets/img/tv.png" />
+				<span><?=h(get('CONFERENCE.TITLE', 'C3Voc'))?> Streaming</span>
 			</a>
 		</div>
 
 		<div class="nav navbar-form navbar-right button-wrapper">
-			<a class="form-control btn btn-default" href="feedback/" title="Feedback">
+			<a class="form-control btn btn-default" href="feedback/">
 				<span class="fa fa-bullhorn"></span>
 			</a>
-			<a class="form-control btn btn-default" href="//media.ccc.de/browse/congress/2014/index.html" title="Recordings">
+			<a class="form-control btn btn-default" href="//media.ccc.de/browse/congress/2014/index.html">
 				<span class="fa fa-video-camera"></span>
 			</a>
-			<a class="form-control btn btn-default" href="about/" title="About">
+			<a class="form-control btn btn-default" href="about/">
 				<span class="fa fa-info"></span>
 			</a>
 		</div>
-
-		<!-- form action="/search/" class="navbar-form navbar-right" id="media-search" method="get" role="search">
-			<div class="form-group input-group">
-				<input class="form-control" name="q" placeholder="Search…" size="17" type="search">
-				<span class="input-group-btn">
-					<button class="btn btn-default" type="submit">
-					<span class="fa fa-search"></span>
-				</button>
-				</span>
-			</div>
-		</form -->
 	</div>
-</div>
+</nav>
diff --git a/template/overview.phtml b/template/overview.phtml
new file mode 100644
index 0000000..d27c9b0
--- /dev/null
+++ b/template/overview.phtml
@@ -0,0 +1,98 @@
+<? include("$assemblies/banner.phtml") ?>
+
+<div class="container overview">
+	<div class="row">
+		<div class="col-xs-12">
+			<h1>Live-Streams</h1>
+		</div>
+	</div>
+
+	<? foreach(get('OVERVIEW.GROUPS') as $group => $rooms): ?>
+		<div class="row room-group">
+			<div class="col-xs-12">
+				<h2><?=h($group)?></h2>
+			</div>
+
+			<? $count = count($rooms); ?>
+			<? foreach($rooms as $idx => $slug): ?>
+				<div class="
+					room room-<?=h($slug)?>
+
+					<? if($count % 2 == 1 && $idx == $count - 1): ?>
+						col-sm-12 wide
+					<? else: ?>
+						col-md-6 col-sm-12 narrow
+					<? endif ?>
+
+					<? if(get("ROOMS.$slug.PREVIEW")): ?>
+						has-preview
+					<? endif ?>
+
+					<? if(get("ROOMS.$slug.SCHEDULE") && has("SCHEDULE")): ?>
+						has-schedule
+					<? endif ?>
+				">
+					<? /* when the count is odd and this is the last item - make it full width */ ?>
+					<div class="
+						panel panel-default
+						<? if(get("ROOMS.$slug.PREVIEW")): ?>has-preview<? endif ?>
+					">
+						<? if(get("ROOMS.$slug.PREVIEW") && get("ROOMS.$slug.SCHEDULE") && has("SCHEDULE")): ?>
+							<div class="panel-heading">
+								<a href="<?=h(link_room($slug))?>">
+									<?=h(get("ROOMS.$slug.DISPLAY"))?>
+								</a>
+							</div>
+						<? endif ?>
+
+						<div class="panel-body">
+							<? if(get("ROOMS.$slug.PREVIEW")): ?>
+								<a href="<?=h(link_room($slug))?>">
+									<img class="preview" src="thumbs/<?=h(get("ROOMS.$slug.STREAM"))?>.png" alt="" width="213" height="120" />
+								</a>
+							<? endif ?>
+
+							<? if(!get("ROOMS.$slug.PREVIEW") || !get("ROOMS.$slug.SCHEDULE") || !has("SCHEDULE")): ?>
+								<a href="<?=h(link_room($slug))?>" class="title">
+									<?=h(get("ROOMS.$slug.DISPLAY"))?>
+								</a>
+							<? endif ?>
+
+							<? if(get("ROOMS.$slug.SCHEDULE") && has("SCHEDULE")): ?>
+								Schedule
+								<div class="program-schedule">
+									<span class="current-talk hidden">
+										<strong>Now:</strong>
+										<span class="t">none</span>
+									</span>
+
+									<br />
+
+									<span class="next-talk hidden">
+										<strong>Next Talk:</strong>
+										<span class="t">none</span>
+									</span>
+								</div>
+							<? endif ?>
+						</div>
+					</div>
+				</div>
+			<? endforeach ?>
+		</div>
+	<? endforeach ?>
+
+	<div class="room-group recordings">
+		<h2>Recordings</h2>
+
+		<ul class="row">
+			<li class="col-sm-6">
+				<div class="title">
+					<a href="http://media.ccc.de/browse/congress/2014/index.html"><span class="fa fa-video-camera"></span> Releases</a>
+				</div>
+			</li>
+			<li class="col-sm-6">
+				<a href="relive/"><span class="fa fa-play-circle"></span> ReLive</a>
+			</li>
+		</ul>
+	</div>
+</div>
diff --git a/template/page.phtml b/template/page.phtml
index 7550246..b3f49b0 100644
--- a/template/page.phtml
+++ b/template/page.phtml
@@ -8,12 +8,22 @@
 
 <? include("$assemblies/motd.phtml") ?>
 
-		<title><?=h($title)?> – 31C3 Streaming</title>
+		<title><?=h($title)?> – <?=h(get('CONFERENCE.TITLE', 'C3Voc'))?> Streaming</title>
 
 		<meta name="robots" content="index,follow" />
-		<meta name="author" content="CCC" />
-		<meta name="description" content="Video Live-Streaming vom 31C3" />
-		<meta name="keywords" content="31C3, Hacking, Chaos Computer Club, Video, Media, Streaming, Hacker" />
+
+		<? if(has('CONFERENCE.AUTHOR')): ?>
+			<meta name="author" content="<?=h(get('CONFERENCE.AUTHOR'))?>" />
+		<? endif ?>
+
+		<? if(has('CONFERENCE.DESCRIPTION')): ?>
+			<meta name="description" content="<?=h(get('CONFERENCE.DESCRIPTION'))?>" />
+		<? endif ?>
+
+		<? if(has('CONFERENCE.KEYWORDS')): ?>
+			<meta name="keywords" content="<?=h(get('CONFERENCE.KEYWORDS'))?>" />
+		<? endif ?>
+
 		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
 
 		<base href="<?=h($baseurl)?>" />
@@ -35,22 +45,19 @@
 		<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>
 
-		<? 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 ?>
+		<link type="text/css" rel="stylesheet" href="assets/css/mejs/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>
 
-		<link type="text/css" rel="stylesheet" href="assets/css/lib/font-awesome.min.css" />
-		<link type="text/css" rel="stylesheet" href="assets/css/lustige-styles.css" />
+		<link type="text/css" rel="stylesheet" href="assets/css/main.css" />
 	</head>
 	<body class="<?=h($page)?>">
 		<? include("$assemblies/header.phtml") ?>
 		<? include("$page.phtml") ?>
 		<? include("$assemblies/footer.phtml") ?>
+
+		<span class="js-settings"
+			data-scheduleoffset="<?=h(get('SCHEDULE.OFFSET', 0))?>"
+		></span>
 	</body>
 </html>
diff --git a/template/rooms.phtml b/template/rooms.phtml
deleted file mode 100644
index b5fb074..0000000
--- a/template/rooms.phtml
+++ /dev/null
@@ -1,82 +0,0 @@
-<? include("$assemblies/banner.phtml") ?>
-
-<div class="container-fluid rooms">
-	<h1>Live-Streams</h1>
-
-	<div class="room-group lecture" data-offset="<?=h($GLOBALS['CONFIG']['SCHEDULE_OFFSET'])?>">
-		<h2>Lecture Rooms</h2>
-
-		<ul class="row">
-			<? foreach(array('saal1', 'saal2', 'saalg', 'saal6') as $room): ?>
-				<li class="<?=h($room)?> col-md-6 col-sm-12">
-					<a href="<?=h(link_room($room))?>">
-						<img class="teaser" src="thumbs/rooms/<?=h($room)?>.png" alt="" width="213" height="120" />
-						<div class="title"><?=h($rooms[$room])?></div>
-
-						<div class="program-teaser">
-
-							<span class="current-talk hidden">
-								<strong>Now:</strong>
-								<span class="t">none</span>
-							</span>
-
-							<br />
-
-							<span class="next-talk hidden">
-								<strong>Next Talk:</strong>
-								<span class="t">none</span>
-							</span>
-						</div>
-					</a>
-				</li>
-			<? endforeach ?>
-		</ul>
-	</div>
-
-
-	<div class="room-group">
-		<h2>Live DJ Sets</h2>
-
-		<ul class="row">
-			<? foreach(array('lounge', 'ambient') as $room): ?>
-				<li class="<?=h($room)?> col-sm-6">
-					<a href="<?=h(link_room($room))?>" class="title"><?=h($rooms[$room])?></a>
-				</li>
-			<? endforeach ?>
-		</ul>
-	</div>
-
-
-	<div class="room-group">
-		<h2>Live Podcasts</h2>
-
-		<ul class="row">
-			<? foreach(array('sendezentrum') as $room): ?>
-				<li class="<?=h($room)?> col-sm-12">
-					<a href="<?=h(link_room($room))?>">
-						<img class="teaser" src="thumbs/rooms/<?=h($room)?>.png" alt="" width="213" height="120" />
-						<div class="title"><?=h($rooms[$room])?></div>
-					</a>
-				</li>
-			<? endforeach ?>
-		</ul>
-	</div>
-
-
-
-	<div class="room-group recordings">
-		<h2>Recordings</h2>
-
-		<ul class="row">
-			<li class="col-sm-6">
-				<div class="title">
-					<a href="http://media.ccc.de/browse/congress/2014/index.html"><span class="fa fa-video-camera"></span> Releases</a>
-				</div>
-			</li>
-			<li class="col-sm-6">
-				<a href="relive/"><span class="fa fa-play-circle"></span> ReLive</a>
-			</li>
-		</ul>
-	</div>
-
-</div>