Calendar bugs

- Add loading spinner when changing (resize) an event
- If user changes the month using the sidebox calendar, switch to month view for that month
- Mark holidays on the sidebox calendar
- Change cursor over sidebox week number  to match cursor over days
This commit is contained in:
Nathan Gray 2015-08-24 17:28:19 +00:00
parent e334678ecc
commit f05a777215
4 changed files with 84 additions and 26 deletions

View File

@ -558,9 +558,13 @@ app.classes.calendar = AppJS.extend(
*/ */
event_change: function(event, widget, dialog_button) event_change: function(event, widget, dialog_button)
{ {
// Add loading spinner - not visible if the body / gradient is there though
widget.div.addClass('loading');
egw().json( egw().json(
'calendar.calendar_uiforms.ajax_moveEvent', 'calendar.calendar_uiforms.ajax_moveEvent',
[widget.options.value.id, widget.options.value.owner, widget.options.value.start, widget.options.value.owner, widget.options.value.duration] [widget.options.value.id, widget.options.value.owner, widget.options.value.start, widget.options.value.owner, widget.options.value.duration],
// Remove loading spinner
function() {widget.div.removeClass('loading');}
).sendRequest(true); ).sendRequest(true);
}, },
@ -2258,15 +2262,46 @@ app.classes.calendar = AppJS.extend(
if(date) if(date)
{ {
date.input_date.datepicker("option", { date.input_date.datepicker("option", {
showButtonPanel: false showButtonPanel: false,
// TODO: We could include tooltips for holidays onChangeMonthYear: function(year, month, inst)
}); {
// Switch to month view for that month
var date = new Date(app.calendar.state.date);
date.setUTCDate(1);
date.setFullYear(year);
date.setUTCMonth(month-1);
app.calendar.update_state({
view: 'month',
date: date
})
},
// Mark holidays
beforeShowDay: function (date)
{
var holidays = et2_calendar_daycol.get_holidays({day_class_holiday: function() {}}, date.getFullYear());
var day_holidays = holidays[''+date.getUTCFullYear() +
sprintf("%02d",date.getUTCMonth()+1) +
sprintf("%02d",date.getUTCDate())];
var css_class = '';
var tooltip = '';
if(typeof day_holidays !== 'undefined' && day_holidays.length)
{
for(var i = 0; i < day_holidays.length; i++)
{
if (typeof day_holidays[i]['birthyear'] !== 'undefined')
{
css_class +='calendar_calBirthday ';
} }
// Show / Hide weekends based on preference of weekends should be shown else
egw.css('#'+date.input_date.attr('id') + ' .ui-datepicker-week-end', {
egw.preference('days_in_weekview', 'calendar') === "5" ? 'display: none;' : 'display: table-cell;' css_class += 'calendar_calHoliday ';
); }
tooltip += day_holidays[i]['name'] + "\n";
}
}
return [true, css_class, tooltip];
}
});
// Clickable week numbers // Clickable week numbers
date.input_date.on('mouseenter','.ui-datepicker-week-col', function() { date.input_date.on('mouseenter','.ui-datepicker-week-col', function() {
@ -2282,7 +2317,7 @@ app.classes.calendar = AppJS.extend(
// Set to week view // Set to week view
app.calendar.update_state({view: 'week', date: date.getValue()}); app.calendar.update_state({view: 'week', date: date.getValue()});
}); });
}
}, },
/** /**

View File

@ -25,6 +25,15 @@
#calendar-sidebox_buttons tbody { #calendar-sidebox_buttons tbody {
width: 100%; width: 100%;
} }
#calendar-sidebox_date td.ui-datepicker-week-col {
cursor: pointer;
}
#calendar-sidebox_date .calendar_calHoliday {
background: inherit;
}
#calendar-sidebox_date .calendar_calHoliday a {
background-color: #dac0c0;
}
#calendar-todo { #calendar-todo {
float: right; float: right;

View File

@ -11,7 +11,7 @@
* @package calendar * @package calendar
* @version $Id$ * @version $Id$
*/ */
/* $Id: app.css 53324 2015-08-06 17:14:20Z nathangray $ */ /* $Id: app.css 53347 2015-08-11 15:35:54Z nathangray $ */
/*Media print classes*/ /*Media print classes*/
@media print { @media print {
.th td, .th td,
@ -38,6 +38,15 @@
#calendar-sidebox_buttons tbody { #calendar-sidebox_buttons tbody {
width: 100%; width: 100%;
} }
#calendar-sidebox_date td.ui-datepicker-week-col {
cursor: pointer;
}
#calendar-sidebox_date .calendar_calHoliday {
background: inherit;
}
#calendar-sidebox_date .calendar_calHoliday a {
background-color: #dac0c0;
}
#calendar-todo { #calendar-todo {
float: right; float: right;
width: 30%; width: 30%;
@ -2276,6 +2285,9 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
#calendar_merge { #calendar_merge {
font-size: 11px; font-size: 11px;
} }
#calendar-sidebox_date .calendar_calHoliday a {
background-color: #679fd2;
}
#uical_select_owner { #uical_select_owner {
margin: 9px 0 9px; margin: 9px 0 9px;
} }

View File

@ -1531,7 +1531,9 @@ div#calendar-container {
#calendar_merge{ #calendar_merge{
font-size: 11px; font-size: 11px;
} }
#calendar-sidebox_date .calendar_calHoliday a {
background-color: @egw_color_2_e;
}
// Owner // Owner
#uical_select_owner {margin: 9px 0 9px;} #uical_select_owner {margin: 9px 0 9px;}