mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-12-27 09:09:04 +01:00
Multi-line ellipsis on event bodies that are longer than their space can show
This commit is contained in:
parent
98bf388da7
commit
e271a56753
@ -76,6 +76,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
|
||||
.addClass("calendar_calDayColAllDay")
|
||||
.appendTo(this.header);
|
||||
this.event_wrapper = $j(document.createElement('div'))
|
||||
.addClass("event_wrapper")
|
||||
.appendTo(this.div);
|
||||
|
||||
this.setDOMNode(this.div[0]);
|
||||
|
@ -343,9 +343,13 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
|
||||
|
||||
this.body
|
||||
.html('<span class="calendar_calEventTitle">'+title+'</span>')
|
||||
.append('<span class="calendar_calTimespan">'+start_time + '</span>')
|
||||
.append('<span class="calendar_calTimespan">'+start_time + '</span>');
|
||||
if(this.options.value.description.trim())
|
||||
{
|
||||
this.body
|
||||
.append('<p>'+this.options.value.description+'</p>');
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
@ -358,19 +362,34 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
|
||||
* > 4 - Show description as well, truncated to fit
|
||||
*/
|
||||
_small_size: function() {
|
||||
// Pre-calculation reset
|
||||
this.div.removeClass('calendar_calEventSmall');
|
||||
this.body.css('height', 'auto');
|
||||
|
||||
if(this.options.value.whole_day_on_top) return;
|
||||
var visible_lines = Math.floor(this.div.innerHeight() / this.title.height());
|
||||
var line_height = parseFloat(this.div.css('line-height'));
|
||||
var visible_lines = Math.floor(this.div.innerHeight() / line_height);
|
||||
|
||||
if(!this.title.height())
|
||||
{
|
||||
// Handle sizing while hidden, such as when calendar is not the active tab
|
||||
visible_lines = Math.floor(egw.getHiddenDimensions(this.div).h / egw.getHiddenDimensions(this.title).h);
|
||||
}
|
||||
visible_lines = Math.max(1,visible_lines);
|
||||
|
||||
this.div.toggleClass('calendar_calEventSmall',visible_lines < 4);
|
||||
this.div
|
||||
.attr('data-visible_lines', visible_lines < 4 ? Math.max(1,visible_lines) : '');
|
||||
.attr('data-visible_lines', visible_lines);
|
||||
|
||||
|
||||
if(this.body.height() > this.div.height() - this.title.height() && visible_lines >= 4)
|
||||
{
|
||||
this.body.css('height', Math.floor((visible_lines-1)*line_height - this.title.height()) + 'px');
|
||||
}
|
||||
else
|
||||
{
|
||||
this.body.css('height', '');
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
|
@ -556,6 +556,20 @@ Hide subsequent headers in week view with non-consolidated owners
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/** Multi-line ellipsis */
|
||||
.calendar_calEvent .calendar_calEventBody {
|
||||
overflow: hidden;
|
||||
}
|
||||
.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEvent::after {
|
||||
width: 100%;
|
||||
background-color: rgba(255,255,255,0.9);
|
||||
height: 0.9em;
|
||||
content: "\02026";
|
||||
left: 0px;
|
||||
float: right;
|
||||
padding-bottom: 2em;
|
||||
text-indent: 5px;
|
||||
}
|
||||
/**
|
||||
* User has not accepted the invitation
|
||||
*/
|
||||
@ -745,7 +759,7 @@ Hide subsequent headers in week view with non-consolidated owners
|
||||
.calendar_calTimeGridList .calendar_calDayColHeader > div[data-date] {
|
||||
border: none;
|
||||
}
|
||||
.calendar_calTimeGridList .calendar_calDayCol > div:first-child
|
||||
.calendar_calTimeGridList .calendar_calDayCol > div.event_wrapper
|
||||
{
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
|
@ -11,7 +11,7 @@
|
||||
* @package calendar
|
||||
* @version $Id$
|
||||
*/
|
||||
/* $Id: app.css 54876 2016-01-28 22:08:15Z nathangray $ */
|
||||
/* $Id: app.css 54892 2016-02-01 20:52:53Z nathangray $ */
|
||||
/*Media print classes*/
|
||||
@media print {
|
||||
.th td,
|
||||
@ -559,6 +559,20 @@ Hide subsequent headers in week view with non-consolidated owners
|
||||
.calendar_calEvent:hover {
|
||||
cursor: pointer;
|
||||
}
|
||||
/** Multi-line ellipsis */
|
||||
.calendar_calEvent .calendar_calEventBody {
|
||||
overflow: hidden;
|
||||
}
|
||||
.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEvent::after {
|
||||
width: 100%;
|
||||
background-color: rgba(255, 255, 255, 0.9);
|
||||
height: 0.9em;
|
||||
content: "\02026";
|
||||
left: 0px;
|
||||
float: right;
|
||||
padding-bottom: 2em;
|
||||
text-indent: 5px;
|
||||
}
|
||||
/**
|
||||
* User has not accepted the invitation
|
||||
*/
|
||||
@ -732,7 +746,7 @@ Hide subsequent headers in week view with non-consolidated owners
|
||||
.calendar_calTimeGridList .calendar_calDayColHeader > div[data-date] {
|
||||
border: none;
|
||||
}
|
||||
.calendar_calTimeGridList .calendar_calDayCol > div:first-child {
|
||||
.calendar_calTimeGridList .calendar_calDayCol > div.event_wrapper {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
bottom: 3em;
|
||||
|
Loading…
Reference in New Issue
Block a user