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).
This commit is contained in:
Albert Santoni 2013-12-14 00:05:13 -05:00
parent 15370702a4
commit f16d8ca2ea
5 changed files with 66 additions and 25 deletions

View File

@ -1,7 +1,15 @@
<form id="add-show-form" method="post" action="" style="display:none;">
<?php if($this->preloadShowForm){
echo $this->render('schedule/add-show-form.phtml');
}?>
</form>
<div id='schedule_calendar' class="ui-widget-content block-shadow padded omega-block"></div>
<table id="schedule_block_table">
<tr>
<td>
<form id="add-show-form" method="post" action="" style="display:none;">
<?php if($this->preloadShowForm){
echo $this->render('schedule/add-show-form.phtml');
}?>
</form>
</td>
<td id="schedule_calendar_cell">
<div id='schedule_calendar' class="ui-widget-content block-shadow padded omega-block"></div>
</td>
</tr>
</table>

View File

@ -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%;*/
}

View File

@ -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");

View File

@ -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 () {

View File

@ -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',