From fc4cf5793cbe6561347067eb7b25c60a6fc50f77 Mon Sep 17 00:00:00 2001 From: MaZderMind Date: Mon, 30 Mar 2015 21:18:09 +0200 Subject: Rename program to schedule --- assets/css/_program.less | 108 ------------------------------------- assets/css/_room.less | 4 +- assets/css/_schedule.less | 108 +++++++++++++++++++++++++++++++++++++ assets/css/_structure.less | 24 ++++----- assets/js/lustiges-script.js | 48 ++++++++--------- template/assemblies/program.phtml | 65 ---------------------- template/assemblies/schedule.phtml | 59 ++++++++++++++++++++ template/room.phtml | 4 +- 8 files changed, 207 insertions(+), 213 deletions(-) delete mode 100644 assets/css/_program.less create mode 100644 assets/css/_schedule.less delete mode 100644 template/assemblies/program.phtml create mode 100644 template/assemblies/schedule.phtml diff --git a/assets/css/_program.less b/assets/css/_program.less deleted file mode 100644 index 68ab310..0000000 --- a/assets/css/_program.less +++ /dev/null @@ -1,108 +0,0 @@ -.program { - &.scroll-container { - overflow: hidden; - overflow-x: scroll; - } - - .scroll-element { - position: relative; - } - - .room { - overflow: hidden; - } - - .now { - position: absolute; - left: 0; - width: 150px; - height: 100%; - background-color: @program-now-bg; - font-size: 14px; - - //z-index: -5; - - span { - display: block; - position: absolute; - right: -28px; - color: @program-now; - } - } - - .block { - overflow: hidden; - float: left; - height: 100px; - - /* and now for small screens: */ - @media (max-width: @screen-xs-max) { - height: 75px; - } - - - padding: 10px; - border: 1px solid @program-border; - - h3 { - margin: 0; - padding: 0; - font-size: 18px; - - /* and now for small screens: */ - @media (max-width: @screen-xs-max) { - font-size: 16px; - } - } - - h4 { - - margin: 3px 0; - color: @program-room; - font-size: 14px; - - @media (max-width: @screen-xs-max) { - font-size: 15px; - } - - a { - color: @program-room; - } - } - - h5 { - @media (max-width: @screen-xs-max) { - margin: 0; - } - - color: @program-author; - } - - &.event h3 { - overflow: hidden; - } - - &.gap { - background-image: url("@{img}/stripes/gap.png"); - background-color: @program-gap-bg; - color: @program-gap; - text-shadow: 0 0 3px @program-gap; - } - - &.daychange { - background-image: url("@{img}/stripes/gap.png"); - background-color: @program-daychange-bg; - color: @program-daychange; - text-shadow: 0 0 3px @program-daychange; - } - - &.pause { - background-color: @program-pause-bg; - color: @program-pause; - } - } - - .room.highlight .block { - background-color: @program-selected-room; - } -} 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/_schedule.less b/assets/css/_schedule.less new file mode 100644 index 0000000..0151154 --- /dev/null +++ b/assets/css/_schedule.less @@ -0,0 +1,108 @@ +.schedule { + &.scroll-container { + overflow: hidden; + overflow-x: scroll; + } + + .scroll-element { + position: relative; + } + + .room { + overflow: hidden; + } + + .now { + position: absolute; + left: 0; + width: 150px; + height: 100%; + background-color: @schedule-now-bg; + font-size: 14px; + + //z-index: -5; + + span { + display: block; + position: absolute; + right: -28px; + color: @schedule-now; + } + } + + .block { + overflow: hidden; + float: left; + height: 100px; + + /* and now for small screens: */ + @media (max-width: @screen-xs-max) { + height: 75px; + } + + + padding: 10px; + border: 1px solid @schedule-border; + + h3 { + margin: 0; + padding: 0; + font-size: 18px; + + /* and now for small screens: */ + @media (max-width: @screen-xs-max) { + font-size: 16px; + } + } + + h4 { + + margin: 3px 0; + color: @schedule-room; + font-size: 14px; + + @media (max-width: @screen-xs-max) { + font-size: 15px; + } + + a { + color: @schedule-room; + } + } + + h5 { + @media (max-width: @screen-xs-max) { + margin: 0; + } + + color: @schedule-author; + } + + &.event h3 { + overflow: hidden; + } + + &.gap { + background-image: url("@{img}/stripes/gap.png"); + 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: @schedule-daychange-bg; + color: @schedule-daychange; + text-shadow: 0 0 3px @schedule-daychange; + } + + &.pause { + background-color: @schedule-pause-bg; + color: @schedule-pause; + } + } + + .room.highlight .block { + 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/program.phtml deleted file mode 100644 index d7f7045..0000000 --- a/template/assemblies/program.phtml +++ /dev/null @@ -1,65 +0,0 @@ - -
-
-
now
- $events): ?> -
highlight" style="width: px"> - -
- - -

- - - - - - - -

- - - -

- – - -  in  - - - - - - - -

-

- - " - > - - - -

- -
by 
- - -
- - -
- -
-
diff --git a/template/assemblies/schedule.phtml b/template/assemblies/schedule.phtml new file mode 100644 index 0000000..d2bb9e6 --- /dev/null +++ b/template/assemblies/schedule.phtml @@ -0,0 +1,59 @@ +
+
+
now
+ getSchedule() as $roomname => $events): ?> +
+ +
+ + +

+ + + + + + + +

+ + + +

+ – + +  in  + + + + + + + +

+

+ + " + > + + + +

+ +
by 
+ + +
+ + +
+ +
+
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 @@ hasSchedule()): ?> -
- +
+
hasFeedback()): ?> -- cgit v1.2.3