From 5704413298c15cb05e0a55dbaff0274da01ef39a Mon Sep 17 00:00:00 2001
From: MaZderMind
Date: Fri, 7 Nov 2014 00:11:21 +0100
Subject: program snimation & styling

---
 template/assemblies/program.phtml | 50 ++++++++++++++++++++++-----------------
 template/page.phtml               |  1 +
 2 files changed, 29 insertions(+), 22 deletions(-)

(limited to 'template')

diff --git a/template/assemblies/program.phtml b/template/assemblies/program.phtml
index 9575d8c..6eb418a 100644
--- a/template/assemblies/program.phtml
+++ b/template/assemblies/program.phtml
@@ -1,38 +1,44 @@
 <?
-$room = 'Grossbaustelle BER';
 
-foreach($program[$room] as $event)
-{
-	$width += intval(isset($event['duration']) ? $event['duration'] : 5);
-}
+foreach(reset($program) as $event)
+	$width += $event['duration'];
+
 ?>
+<div class="program scroll-container" data-offset="<?=h($GLOBALS['CONFIG']['SCHEDULE_OFFSET'])?>">
+	<div class="scroll-element">
+		<div class="now"><span>now</span></div>
+		<? foreach($program as $name => $events): ?>
+			<div class="room" style="width: <?=$width * $GLOBALS['CONFIG']['SCHEDULE_SCALE'] ?>px">
+				<? foreach($events as $event): ?>
 
-<div class="program">
-	<div class="now">now</div>
-	<div class="inner" style="width: <?=$width * $GLOBALS['CONFIG']['SCHEDULE_SCALE'] ?>px">
-		<? foreach($program[$room] as $event): ?>
-			<? if(@$event['special'] == 'daychange'): ?>
+					<div
+						class="block <?=h(@$event['special'] ?: 'event')?>"
+						style="width: <?=h($event['duration'] * $GLOBALS['CONFIG']['SCHEDULE_SCALE'])?>px"
+						data-start="<?=intval($event['start'])?>"
+						data-end="<?=intval($event['end'])?>"
+					>
+						<? if(@$event['special'] == 'daychange'): ?>
 
-				<div class="block daychange" style="width: <?=h($GLOBALS['CONFIG']['SCHEDULE_SCALE'])?>px"></div>
+							<h3><?=h($event['title'])?></h3>
 
-			<? elseif(@$event['special'] == 'gap'): ?>
+						<? elseif(@$event['special'] == 'gap'): ?>
 
-				<div class="block daychange" style="width: <?=h($event['duration'] * $GLOBALS['CONFIG']['SCHEDULE_SCALE'])?>px"></div>
+							<!--h3>Gap</h3-->
 
-			<? elseif(@$event['special']): ?>
+						<? elseif(@$event['special'] == 'pause'): ?>
 
-				<div class="block <?=h($event['special'])?>" style="width: <?=h($event['duration'] * $GLOBALS['CONFIG']['SCHEDULE_SCALE'])?>px">
-					<h3><?=h($event['title'])?></h3>
-				</div>
+							<h3><?=h($event['title'])?></h3>
 
-			<? else: ?>
+						<? else: ?>
 
-				<div class="block event" style="width: <?=h($event['duration'] * $GLOBALS['CONFIG']['SCHEDULE_SCALE'])?>px">
-					<h3><?=h($event['title'])?></h3>
-				</div>
+							<h4><?=h(strftime('%H:%M', $event['start']))?>&nbsp;&ndash;&nbsp;<?=h(strftime('%H:%M', $event['end']))?></h4>
+							<h3><?=h($event['title'])?></h3>
 
-			<? endif ?>
+						<? endif ?>
+					</div>
 
+				<? endforeach ?>
+			</div>
 		<? endforeach ?>
 	</div>
 </div>
diff --git a/template/page.phtml b/template/page.phtml
index 2e5efa6..08271b1 100644
--- a/template/page.phtml
+++ b/template/page.phtml
@@ -33,6 +33,7 @@
 		<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>
-- 
cgit v1.2.3