diff options
| -rw-r--r-- | assets/css/_room.less | 4 | ||||
| -rw-r--r-- | assets/css/_schedule.less (renamed from assets/css/_program.less) | 32 | ||||
| -rw-r--r-- | assets/css/_structure.less | 24 | ||||
| -rw-r--r-- | assets/js/lustiges-script.js | 48 | ||||
| -rw-r--r-- | template/assemblies/schedule.phtml (renamed from template/assemblies/program.phtml) | 26 | ||||
| -rw-r--r-- | template/room.phtml | 4 |
6 files changed, 66 insertions, 72 deletions
diff --git a/assets/css/_room.less b/assets/css/_room.less index 2309c32..aa0f594 100644 --- a/assets/css/_room.less +++ b/assets/css/_room.less @@ -78,7 +78,7 @@ } } - #program { - @import "_program.less"; + #schedule { + @import "_schedule.less"; } } diff --git a/assets/css/_program.less b/assets/css/_schedule.less index 68ab310..0151154 100644 --- a/assets/css/_program.less +++ b/assets/css/_schedule.less @@ -1,4 +1,4 @@ -.program { +.schedule { &.scroll-container { overflow: hidden; overflow-x: scroll; @@ -17,7 +17,7 @@ left: 0; width: 150px; height: 100%; - background-color: @program-now-bg; + background-color: @schedule-now-bg; font-size: 14px; //z-index: -5; @@ -26,7 +26,7 @@ display: block; position: absolute; right: -28px; - color: @program-now; + color: @schedule-now; } } @@ -42,7 +42,7 @@ padding: 10px; - border: 1px solid @program-border; + border: 1px solid @schedule-border; h3 { margin: 0; @@ -58,7 +58,7 @@ h4 { margin: 3px 0; - color: @program-room; + color: @schedule-room; font-size: 14px; @media (max-width: @screen-xs-max) { @@ -66,7 +66,7 @@ } a { - color: @program-room; + color: @schedule-room; } } @@ -75,7 +75,7 @@ margin: 0; } - color: @program-author; + color: @schedule-author; } &.event h3 { @@ -84,25 +84,25 @@ &.gap { background-image: url("@{img}/stripes/gap.png"); - background-color: @program-gap-bg; - color: @program-gap; - text-shadow: 0 0 3px @program-gap; + background-color: @schedule-gap-bg; + color: @schedule-gap; + text-shadow: 0 0 3px @schedule-gap; } &.daychange { background-image: url("@{img}/stripes/gap.png"); - background-color: @program-daychange-bg; - color: @program-daychange; - text-shadow: 0 0 3px @program-daychange; + background-color: @schedule-daychange-bg; + color: @schedule-daychange; + text-shadow: 0 0 3px @schedule-daychange; } &.pause { - background-color: @program-pause-bg; - color: @program-pause; + background-color: @schedule-pause-bg; + color: @schedule-pause; } } .room.highlight .block { - background-color: @program-selected-room; + background-color: @schedule-selected-room; } } diff --git a/assets/css/_structure.less b/assets/css/_structure.less index e5d1e35..836de2b 100644 --- a/assets/css/_structure.less +++ b/assets/css/_structure.less @@ -11,23 +11,23 @@ @jumbo-font-size-xs: 2.5em; @jumbo-line-height: 45px; -@program-now: @brand-danger; -@program-now-bg: fade(lighten(@brand-danger, 5%), 60%); -@program-border: lighten(@brand-primary, 50%); +@schedule-now: @brand-danger; +@schedule-now-bg: fade(lighten(@brand-danger, 5%), 60%); +@schedule-border: lighten(@brand-primary, 50%); -@program-room: darken(@brand-primary, 15%); -@program-author: #444; +@schedule-room: darken(@brand-primary, 15%); +@schedule-author: #444; -@program-selected-room: lighten(@brand-success, 10%); +@schedule-selected-room: lighten(@brand-success, 10%); -@program-daychange: darken(@brand-primary, 20%); -@program-daychange-bg: fade(white, 30%); +@schedule-daychange: darken(@brand-primary, 20%); +@schedule-daychange-bg: fade(white, 30%); -@program-gap: darken(@brand-primary, 20%); -@program-gap-bg: fade(white, 30%); +@schedule-gap: darken(@brand-primary, 20%); +@schedule-gap-bg: fade(white, 30%); -@program-pause: white; -@program-pause-bg: lighten(black, 85%); +@schedule-pause: white; +@schedule-pause-bg: lighten(black, 85%); // website configuration styles diff --git a/assets/js/lustiges-script.js b/assets/js/lustiges-script.js index 73e021b..ef685d0 100644 --- a/assets/js/lustiges-script.js +++ b/assets/js/lustiges-script.js @@ -183,11 +183,11 @@ $(function() { $(window).on('hashchange', setTabToHash).trigger('hashchange'); }); -// programm-timeline +// schedule-timeline $(function() { var - $program = $('.program'), - $now = $program.find('.now'), + $schedule = $('.schedule'), + $now = $schedule.find('.now'), scrollLock = false, rewindTimeout, @@ -203,7 +203,7 @@ $(function() { /* offset to the browsers realtime (for simulation) */ offset = $('.js-settings').data('scheduleoffset'); - $program.on('mouseenter mouseleave touchstart touchend', function(e) { + $schedule.on('mouseenter mouseleave touchstart touchend', function(e) { if(e.type == 'mouseleave' || e.type == 'touchend') { rewindTimeout = setTimeout(function() { scrollLock = false; @@ -214,7 +214,7 @@ $(function() { } }); - // program now-marker & scrolling + // schedule now-marker & scrolling function updateProgramView(initial) { var // corrected "now" timestamp in unix-counting (seconds, not microseconds) @@ -223,7 +223,7 @@ $(function() { // only check the first room (shouldn't matter anyway) // find the newest block that starts in the past // that's the one that is most probably currently still running - var $block = $program + var $block = $schedule .find('.room') .first() .find('.block') @@ -242,16 +242,16 @@ $(function() { // place of the now-marker between 0 and 1 within this block normalized = Math.max(0, Math.min(1, (now - start) / (end - start))), - // projected to pixels with respect to the programms left end + // projected to pixels with respect to the schedules left end px = $block.position().left + ($block.outerWidth() * normalized), - // visible width of the program display - displayw = $program.width(), + // visible width of the schedule display + displayw = $schedule.width(), // current scroll position - scrollx = $program.scrollLeft(), + scrollx = $schedule.scrollLeft(), - // distance of the now-marker to the left border of the program display + // distance of the now-marker to the left border of the schedule display px_in_display = px - scrollx; //console.log($block.get(0), new Date(start*1000), new Date(now*1000), new Date(end*1000), normalized, px); @@ -262,14 +262,14 @@ $(function() { return; if( - // now marker is > 2/3 of the program-display-width + // now marker is > 2/3 of the schedule-display-width px_in_display > (displayw * 2/3) || - // now marker is <1/7 of the program-display-width + // now marker is <1/7 of the schedule-display-width px_in_display < (displayw/7) ) { - // scroll program so that now-marker is as 1/5 of the screen - $program.stop().scrollTo(px - displayw/6, { + // scroll schedule so that now-marker is as 1/5 of the screen + $schedule.stop().scrollTo(px - displayw/6, { axis: 'x', duration: initial ? 0 : scrollDuration, }); @@ -277,7 +277,7 @@ $(function() { } - // when on programs tab + // when on schedules tab var updateInterval; function on() { // initial trigger @@ -291,24 +291,24 @@ $(function() { clearInterval(updateInterval); } - if(window.location.hash == '#program') + if(window.location.hash == '#schedule') on(); // trigger when a tab was changed $('.nav-tabs').on('shown.bs.tab', 'a', function(e) { - if(e.target.hash == '#program') + if(e.target.hash == '#schedule') on(); else off(); }); }); -// startpage program teaser +// startpage schedule teaser $(function() { var updateTimer = 5*1000, /* update display every 5 seconds */ - refetchTimer = 10*60*1000, /* re-request current / upcoming program every 10 minutes */ - programData = {}, + refetchTimer = 10*60*1000, /* re-request current / upcoming schedule every 10 minutes */ + scheduleData = {}, $lecture = $('.room.has-schedule'), /* offset to the browsers realtime (for simulation) */ @@ -320,10 +320,10 @@ $(function() { function fetchProgram() { $.ajax({ - url: 'program.json', + url: 'schedule.json', dataType: 'json', success: function(data) { - programData = data; + scheduleData = data; updateProgtamTeaser(); }, @@ -339,7 +339,7 @@ $(function() { // corrected "now" timestamp in unix-counting (seconds, not microseconds) now = (Date.now() / 1000) + offset; - $.each(programData, function(room, talks) { + $.each(scheduleData, function(room, talks) { var currentTalk, nextTalk; $.each(talks, function(room, talk) { diff --git a/template/assemblies/program.phtml b/template/assemblies/schedule.phtml index d7f7045..d2bb9e6 100644 --- a/template/assemblies/program.phtml +++ b/template/assemblies/schedule.phtml @@ -1,18 +1,12 @@ -<? - -foreach(reset($program) as $event) - $width += $event['duration']; - -?> -<div class="program scroll-container"> +<div class="schedule scroll-container"> <div class="scroll-element"> <div class="now"><span>now</span></div> - <? foreach($program as $roomname => $events): ?> - <div class="room <? if($roomname == get("ROOMS.$room.SCHEDULE_NAME", $room)): ?>highlight<? endif ?>" style="width: <?=$width / get('SCHEDULE.SCALE')?>px"> + <? foreach($schedule->getSchedule() as $roomname => $events): ?> + <div class="room <? if($roomname == $room->getSlug()): ?>highlight<? endif ?>" style="width: <?=ceil($schedule->getDurationSum() / $schedule->getScale())?>px"> <? foreach($events as $event): ?> <div class="block <?=h(@$event['special'] ?: 'event')?>" - style="width: <?=h($event['duration'] / get('SCHEDULE.SCALE'))?>px" + style="width: <?=h(round($event['duration'] / $schedule->getScale()))?>px" data-start="<?=intval($event['start'])?>" data-end="<?=intval($event['end'])?>" > @@ -34,23 +28,23 @@ foreach(reset($program) as $event) – <?=h(strftime('%H:%M', $event['end']))?> in - <? if(has("ROOMS.$roomname")): ?> + <? /*if(has("ROOMS.$roomname")): ?> <a href="<?=h(link_player($roomname))?>"> <?=h(get("ROOMS.$roomname.DISPLAY"))?> </a> - <? else: ?> + <? else:*/ ?> <?=h($roomname) ?> - <? endif ?> + <? /*endif*/ ?> </h4> <h3> - <? if(has("ROOMS.$roomname")): ?> + <? /*if(has("ROOMS.$roomname")): ?> <a href="<?=h(link_player($roomname))?>" title="Switch to <?=h(get("ROOMS.$roomname.DISPLAY"))?>" ><?=h($event['title'])?></a> - <? else: ?> + <? else:*/ ?> <?=h($event['title'])?> - <? endif ?> + <? /*endif*/ ?> </h3> <? if($event['speaker']): ?> <h5>by <?=h($event['speaker'])?></h5> diff --git a/template/room.phtml b/template/room.phtml index 25a7255..32b7d6c 100644 --- a/template/room.phtml +++ b/template/room.phtml @@ -54,8 +54,8 @@ </div> <? endif ?> <? if($room->hasSchedule()): ?> - <div role="tabpanel" class="tab-pane" id="program"> - <? require("$assemblies/program.phtml") ?> + <div role="tabpanel" class="tab-pane" id="schedule"> + <? require("$assemblies/schedule.phtml") ?> </div> <? endif ?> <? if($room->hasFeedback()): ?> |