Event display:

- Show description in event body, as much as will fit
- Preserve whitespace in event description
- Change when event title is shown in header to be based on available space, not grid size
- Adjust z-index of overlapping events to reduce covering
This commit is contained in:
Nathan Gray 2015-11-11 18:48:41 +00:00
parent bc2e0060da
commit bddf7ab28b
3 changed files with 12 additions and 7 deletions

View File

@ -692,6 +692,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
columns[c][i].div.css('height', height+'%');
columns[c][i].div.css('left', left.toFixed(1)+'%');
columns[c][i].div.css('width', width.toFixed(1)+'%');
columns[c][i].div.css('z-index',parseInt(columns[c][i].div.css('z-index'))+c);
}
}

View File

@ -239,15 +239,12 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
// Header
var title = !event.is_private ? event['title'] : egw.lang('private');
var small_height = true;
if(this._parent.display_settings)
{
small_height = event['end_m']-event['start_m'] < this._parent.display_settings.granularity;
}
// If there isn't enough height for header + 1 line in the body, it's small
var small_height = this.div.innerHeight() <= this.title.height() * 2;
this.div.attr('data-title', title);
this.title.text(small_height ? title : this._get_timespan(event));
// Colors - don't make them transparent if there is no color
if(jQuery.Color("rgba(0,0,0,0)").toRgbaString() != jQuery.Color(this.div,'background-color').toRgbaString())
{
@ -268,7 +265,9 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
}
else
{
this.body.html('<span class="calendar_calEventTitle">'+title+'</span>')
this.body
.html('<span class="calendar_calEventTitle">'+title+'</span>')
.append('<p>'+this.options.value.description+'</p>');
}
this.body
// Set background color to a lighter version of the header color

View File

@ -525,6 +525,8 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
left: 2px;
right: 2px;
height: 99%;
white-space: normal;
/* Gradient */
background-image: -webkit-linear-gradient(0deg, rgba(255,255,255,0) 0, rgba(255,255,255,0.85) 60%);
@ -538,6 +540,9 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
-webkit-background-size: auto auto;
background-size: auto auto;
}
.calendar_calEventBody > p, .calendar_calEventBodySmall > p {
white-space: pre-wrap;
}
.calendar_calEventBodySmall{
font-size: 95%;