From f16d8ca2eabbb4a73b7bf0e734375db01aedcfc8 Mon Sep 17 00:00:00 2001 From: Albert Santoni Date: Sat, 14 Dec 2013 00:05:13 -0500 Subject: [PATCH] Fixed a bunch of annoying/major graphical issues with the calendar * Fixed a bug where the calendar would keep shrinking smaller and smaller as you resized the window. * Fixed the size and alignment of the time span combobox in the corner, which fixes a bug where the text was cut off. * Fixed a bug where the schedule header would grow as you flipped to the next or previous week. * Dropped javascript from the resizing of the calendar (for the most part). --- .../views/scripts/schedule/index.phtml | 20 ++++++--- airtime_mvc/public/css/styles.css | 43 ++++++++++++++++++- .../public/js/airtime/schedule/add-show.js | 3 ++ .../schedule/full-calendar-functions.js | 21 +++------ .../public/js/airtime/schedule/schedule.js | 4 +- 5 files changed, 66 insertions(+), 25 deletions(-) diff --git a/airtime_mvc/application/views/scripts/schedule/index.phtml b/airtime_mvc/application/views/scripts/schedule/index.phtml index 30d02f9c3..553ff2623 100644 --- a/airtime_mvc/application/views/scripts/schedule/index.phtml +++ b/airtime_mvc/application/views/scripts/schedule/index.phtml @@ -1,7 +1,15 @@ - -
+ + + + + +
+ + +
+
diff --git a/airtime_mvc/public/css/styles.css b/airtime_mvc/public/css/styles.css index 118ff8846..6ce22d081 100644 --- a/airtime_mvc/public/css/styles.css +++ b/airtime_mvc/public/css/styles.css @@ -1145,9 +1145,50 @@ dt.block-display, dd.block-display { font-size:16px; font-weight:normal; } + #schedule_calendar { - width:98.5% + width: 100%; } + +#schedule_block_table { + width: 100%; +} + +thead tr.fc-first +{ + height: 32px; + line-height: 32px; +} + +/** Extremely nasty workaround for a fullcalendar bug, where clicking "Add Show" + would cause this large space under the table header. The CSS to get to that + is ridiculously complicated and set in the HTML (!) dynamically with JS, + which makes it a pain in the ass to fix. That's why we're overriding it + with !important here. +*/ +.fc-view > div:nth-child(2) +{ + top: 34px !important; +} + +#schedule_calendar_cell +{ + width: 100%; + height: 100%; + padding: 0px; + padding-right: 20px !important; +} + +.schedule_change_slots /** The time span combobox */ +{ + margin-top: 4px; /** Center it vertically */ +} + +#schedule_block_table td { + padding: 0px; + vertical-align: top; +} + div.ui-datepicker { /*font-size: 75%;*/ } diff --git a/airtime_mvc/public/js/airtime/schedule/add-show.js b/airtime_mvc/public/js/airtime/schedule/add-show.js index cb479fa72..6ec2996b3 100644 --- a/airtime_mvc/public/js/airtime/schedule/add-show.js +++ b/airtime_mvc/public/js/airtime/schedule/add-show.js @@ -8,6 +8,7 @@ function openAddShowForm() { if($("#add-show-form").length == 1) { if( ($("#add-show-form").css('display')=='none')) { $("#add-show-form").show(); + /* var windowWidth = $(window).width(); // margin on showform are 16 px on each side var calendarWidth = 100-(($("#schedule-add-show").width() + (16 * 4))/windowWidth*100); @@ -18,6 +19,8 @@ function openAddShowForm() { // this calculation was copied from schedule.js line 326 var mainHeight = document.documentElement.clientHeight - 200 - 50; $('#schedule_calendar').fullCalendar('option', 'contentHeight', mainHeight); + */ + windowResize(); } $("#schedule-show-what").show(0, function(){ $add_show_name = $("#add_show_name"); diff --git a/airtime_mvc/public/js/airtime/schedule/full-calendar-functions.js b/airtime_mvc/public/js/airtime/schedule/full-calendar-functions.js index 423dd1ff4..e90f2ee68 100644 --- a/airtime_mvc/public/js/airtime/schedule/full-calendar-functions.js +++ b/airtime_mvc/public/js/airtime/schedule/full-calendar-functions.js @@ -150,8 +150,8 @@ function viewDisplay( view ) { var topLeft = $(view.element).find("table.fc-agenda-days > thead th:first"); - select.width(topLeft.width()) - .height(topLeft.height()); + //select.width(topLeft.width()) + // .height(topLeft.height()); topLeft.empty() .append(select); @@ -346,22 +346,11 @@ function eventResize( event, dayDelta, minuteDelta, revertFunc, jsEvent, ui, vie }); } -function windowResize() { - var windowWidth = $(this).width(); - - // margin on showform are 16 px on each side - if(!$("#schedule-add-show").is(':hidden')){ - var calendarWidth = 100-(($("#schedule-add-show").width() + (16 * 4))/windowWidth*100); - var widthPercent = parseInt(calendarWidth)+"%"; - $("#schedule_calendar").css("width", widthPercent); - } else { - $("#schedule_calendar").css("width", 98.5+"%"); - } - +function windowResize() { // 200 px for top dashboard and 50 for padding on main content // this calculation was copied from schedule.js line 326 - var mainHeight = document.documentElement.clientHeight - 200 - 50; - $('#schedule_calendar').fullCalendar('option', 'contentHeight', mainHeight); + var mainHeight = $(window).height() - 200 - 24; + $('#schedule_calendar').fullCalendar('option', 'contentHeight', mainHeight); } function preloadEventFeed () { diff --git a/airtime_mvc/public/js/airtime/schedule/schedule.js b/airtime_mvc/public/js/airtime/schedule/schedule.js index f28e405eb..37c5a0071 100644 --- a/airtime_mvc/public/js/airtime/schedule/schedule.js +++ b/airtime_mvc/public/js/airtime/schedule/schedule.js @@ -252,8 +252,8 @@ function createFullCalendar(data){ serverTimezoneOffset = data.calendarInit.timezoneOffset; - var mainHeight = document.documentElement.clientHeight - 200 - 50; - + var mainHeight = $(window).height() - 200 - 35; + $('#schedule_calendar').fullCalendar({ header: { left: 'prev, next, today',