holm/egroupware
1
1
Fork 0
forked from extern/egroupware
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Calendar display

Browse Source 
- Add event title or count to indicators for events hidden outside of work hours
- Hover css for widget planner
This commit is contained in:
Nathan Gray 2015-11-05 22:31:47 +00:00
parent a2cb9064fa
commit 791102cdec
4 changed files with 54 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
calendar/js/et2_widget_daycol.js
View File

@ -502,20 +502,33 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
else if (hidden.completely)
{
var indicator = '';
if(hidden.hidden === 'top' && $j('.hiddenEventBefore',this.header).length == 0)
if(hidden.hidden === 'top')
{
indicator = $j('<div class="hiddenEventBefore"></div>')
.appendTo(this.header)
.on('click', function() {
$j('.calendar_calEvent',day.div).first()[0].scrollIntoView();
});
if($j('.hiddenEventBefore',this.header).length == 0)
{
indicator = $j('<div class="hiddenEventBefore"></div>')
.appendTo(this.header)
.text(event.options.value.title)
.attr('data-hidden_count', 1)
.on('click', function() {
$j('.calendar_calEvent',day.div).first()[0].scrollIntoView();
});
}
else
{
indicator = $j('.hiddenEventBefore',this.header);
indicator.attr('data-hidden_count', parseInt(indicator.attr('data-hidden_count')) + 1);
indicator.text(day.egw().lang('%1 event(s) %2',indicator.attr('data-hidden_count'),''));
}
}
else if(hidden.hidden === 'bottom')
{
indicator = $j('.hiddenEventAfter',this.div);
if(indicator.length == 0)
{
indicator = $j('<div class="hiddenEventAfter"></div>');
indicator = $j('<div class="hiddenEventAfter"></div>')
.text(event.options.value.title)
.attr('data-hidden_count', 1);
this.div.append(indicator)
.on('click', function() {
$j('.calendar_calEvent',day.div).last()[0].scrollIntoView(false);
@ -523,6 +536,11 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizea
day._out_of_view();
});
}
else
{
indicator.attr('data-hidden_count', parseInt(indicator.attr('data-hidden_count')) + 1);
indicator.text(day.egw().lang('%1 event(s) %2',indicator.attr('data-hidden_count'),''));
}
indicator.css('top',timegrid.scrolling.height() + timegrid.scrolling.scrollTop()-indicator.height());
}
// Match color to the event

39
calendar/templates/default/app.css
View File

@ -250,29 +250,36 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
/* Indicators for offscreen events */
.calendar_calDayColHeader .hiddenEventBefore, .calendar_calDayCol .hiddenEventAfter {
width: 80%;
height: 5px;
left: 10%;
position: absolute;
border-radius: 5px;
border: 5px solid;
border-left: none;
border-right: none;
border: 6px solid;
border-left: 0px;
border-right: 0px;
overflow: hidden;
z-index: 40;
}
.calendar_calDayColHeader .hiddenEventBefore {
height: 4px;
bottom: -7px;
border-top: none;
}
.calendar_calDayColHeader .hiddenEventBefore:hover {
bottom: -11px;
border-width: 10px;
bottom: -20px;
height: 16px;
border-left: 1px;
border-right: 1px;
border-top-left-radius: 0px;
background-color: white;
}
.calendar_calDayCol .hiddenEventAfter {
border-bottom: none;
height: 6px;
}
.calendar_calDayCol .hiddenEventAfter:hover {
margin-top: -5px;
border-width: 10px;
margin-top: -20px;
height: 20px;
background-color: white;
}
@ -608,6 +615,9 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
.calendar_plannerRowWidget:nth-child(even) {
background-color: #f2f2f2;
}
.calendar_plannerRowWidget:hover {
background-color: rgba(103, 159, 210, 0.2);
}
/* calendar_plannerScale represents a scale-row of the calendar_plannerHeader, containing multiple planner{Day|Week|Month}Scales
*/
@ -657,10 +667,10 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
position: absolute;
top: 0px;
left: 0%;
width: 15%; /* need to be identical for calendar_plannerRowHeader and calendar_plannerHeaderTitle and match left of calendar_eventRows/calendar_plannerHeaderRows */
width: 100%;
height: 100%;
line-height: 20px;
border: 1px solid white;
border-right: 1px solid white;
}
/* calendar_eventRows contain multiple eventRowWidgets
@ -673,6 +683,15 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
min-height: 20px;
height: 100%;
}
.calendar_plannerWidget .verticalBar {
width: 1px;
height: 100%;
position: absolute;
top: 0px;
border-right: 1px dotted;
pointer-events: none;
z-index: 40;
}
/**
* Filler for month with less then 31 days in yearly planner

4
calendar/templates/pixelegg/app.css
View File

@ -1058,11 +1058,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
*/
.calendar_plannerRowHeader,
.calendar_plannerHeaderTitle {
width: auto;
/* need to be identical for calendar_plannerRowHeader and calendar_plannerHeaderTitle and match left of calendar_eventRows/calendar_plannerHeaderRows */
height: 100%;
line-height: 20px;
border: 1px solid white;
}
/* calendar_eventRows contain multiple eventRowWidgets
*/

3
calendar/templates/pixelegg/app.less
View File

@ -1127,10 +1127,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
/* calendar_plannerRowHeader contains the user or category name of the calendar_plannerRowWidget
*/
.calendar_plannerRowHeader, .calendar_plannerHeaderTitle {
width: auto; /* need to be identical for calendar_plannerRowHeader and calendar_plannerHeaderTitle and match left of calendar_eventRows/calendar_plannerHeaderRows */
height: 100%;
line-height: 20px;
border: 1px solid white;
}
/* calendar_eventRows contain multiple eventRowWidgets