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

calendar/js/app.js

@@ -558,9 +558,13 @@ app.classes.calendar = AppJS.extend(
 	 */
 	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(
 			'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);
 	},
 
@@ -2258,31 +2262,62 @@ app.classes.calendar = AppJS.extend(
 		if(date)
 		{
 			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 ';
+							}
+							else
+							{
+								css_class += 'calendar_calHoliday ';
+							}
+							tooltip += day_holidays[i]['name'] + "\n";
+						}
+					}
+					return [true, css_class, tooltip];
+				}
 			});
+
+			// Clickable week numbers
+			date.input_date.on('mouseenter','.ui-datepicker-week-col', function() {
+					$j(this).siblings().find('a').addClass('ui-state-hover');
+				})
+				.on('mouseleave','.ui-datepicker-week-col', function() {
+					$j(this).siblings().find('a').removeClass('ui-state-hover');
+				})
+				.on('click', '.ui-datepicker-week-col', function() {
+					// Fake a click event on the first day to get the updated date
+					$j(this).next().click();
+
+					// Set to week view
+					app.calendar.update_state({view: 'week', date: date.getValue()});
+				});
 		}
-		// Show / Hide weekends based on preference of weekends should be shown
-		egw.css('#'+date.input_date.attr('id') + ' .ui-datepicker-week-end',
-			egw.preference('days_in_weekview', 'calendar') === "5" ? 'display: none;' : 'display: table-cell;'
-		);
-
-
-		// Clickable week numbers
-		date.input_date.on('mouseenter','.ui-datepicker-week-col', function() {
-				$j(this).siblings().find('a').addClass('ui-state-hover');
-			})
-			.on('mouseleave','.ui-datepicker-week-col', function() {
-				$j(this).siblings().find('a').removeClass('ui-state-hover');
-			})
-			.on('click', '.ui-datepicker-week-col', function() {
-				// Fake a click event on the first day to get the updated date
-				$j(this).next().click();
-
-				// Set to week view
-				app.calendar.update_state({view: 'week', date: date.getValue()});
-			});
-
 	},
 	
 	/**

calendar/templates/default/app.css

@@ -25,6 +25,15 @@
 #calendar-sidebox_buttons tbody {
 	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 {
 	float: right;

calendar/templates/pixelegg/app.css

@@ -11,7 +11,7 @@
  * @package calendar
  * @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 {
   .th td,
@@ -38,6 +38,15 @@
 #calendar-sidebox_buttons tbody {
   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 {
   float: right;
   width: 30%;
@@ -2276,6 +2285,9 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
 #calendar_merge {
   font-size: 11px;
 }
+#calendar-sidebox_date .calendar_calHoliday a {
+  background-color: #679fd2;
+}
 #uical_select_owner {
   margin: 9px 0 9px;
 }

calendar/templates/pixelegg/app.less

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