- Automatically handle when time rows are too small for proper display

- Increase options for weekN display to 4
This commit is contained in:
Nathan Gray 2015-11-16 18:31:09 +00:00
parent 48d779a337
commit 5846aaa317
3 changed files with 16 additions and 3 deletions

View File

@ -162,7 +162,7 @@ class calendar_hooks
$times[$i] = $GLOBALS['egw']->common->formattime($i,'00'); $times[$i] = $GLOBALS['egw']->common->formattime($i,'00');
} }
for ($i = 2; $i <= 3; ++$i) for ($i = 2; $i <= 4; ++$i)
{ {
$muliple_weeks[$i.' weeks'] = lang('%1 weeks',$i); $muliple_weeks[$i.' weeks'] = lang('%1 weeks',$i);
} }

View File

@ -584,6 +584,13 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
// Pixels // Pixels
this.rowHeight = this.scrolling.height() / rowsToDisplay; this.rowHeight = this.scrolling.height() / rowsToDisplay;
// We need a reasonable bottom limit here...
if(this.rowHeight < 5)
{
this.options.granularity *= 2;
return this._drawTimes();
}
// the hour rows // the hour rows
var show = { var show = {
5 : [0,15,30,45], 5 : [0,15,30,45],
@ -592,6 +599,7 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
45 : [0,15,30,45] 45 : [0,15,30,45]
}; };
var html = ''; var html = '';
var line_height = parseInt(this.div.css('line-height'));
this._top_time = 0 this._top_time = 0
for(var t = 0,i = 0; t < 1440; t += granularity,++i) for(var t = 0,i = 0; t < 1440; t += granularity,++i)
{ {
@ -613,6 +621,11 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
} }
var time_label = (typeof show[granularity] === 'undefined' ? t % 60 === 0 : show[granularity].indexOf(t % 60) !== -1) ? time : ''; var time_label = (typeof show[granularity] === 'undefined' ? t % 60 === 0 : show[granularity].indexOf(t % 60) !== -1) ? time : '';
if(this.rowHeight < line_height)
{
// Rows too small for regular label frequency, use automatic calculation
time_label = ( i % Math.ceil(line_height / this.rowHeight) ) === 0 ? time : '';
}
html += '<div class="calendar_calTimeRowTime et2_clickable" data-time="'+time.trim()+'" data-hour="'+Math.floor(t/60)+'" data-minute="'+(t%60)+'">'+time_label+"</div></div>\n"; html += '<div class="calendar_calTimeRowTime et2_clickable" data-time="'+time.trim()+'" data-hour="'+Math.floor(t/60)+'" data-minute="'+(t%60)+'">'+time_label+"</div></div>\n";
} }

View File

@ -238,7 +238,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
vertical-align: top; vertical-align: top;
border-right: 1px solid silver; border-right: 1px solid silver;
height: initial; height: initial;
min-height: 4em; min-height: 2em;
/* Nice transition when changing days in a week */ /* Nice transition when changing days in a week */
transition: width 1s ease-in-out; transition: width 1s ease-in-out;
z-index:30; z-index:30;
@ -367,7 +367,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
padding-left: 3px; padding-left: 3px;
z-index: 29; z-index: 29;
border-bottom: 1px solid silver; border-bottom: 1px solid silver;
min-height: 45px; min-height: 2ex;
flex: 0 0 auto; flex: 0 0 auto;
} }
#calendar-view_view tbody.ui-sortable { #calendar-view_view tbody.ui-sortable {