Print function for calendar

api/js/etemplate/etemplate2.js

@@ -983,7 +983,7 @@ etemplate2.prototype.print = function()
 	var deferred = [];
 
 	// Skip hidden etemplates
-	if(!jQuery(this.DOMContainer).filter(':visible').length) return [];
+	if(jQuery(this.DOMContainer).filter(':visible').length === 0) return [];
 
 	// Allow any widget to change for printing
 	this.widgetContainer.iterateOver(function(_widget) {

calendar/js/et2_widget_timegrid.js

@@ -27,7 +27,7 @@
  *
  * @augments et2_calendar_view
  */
-var et2_calendar_timegrid = (function(){ "use strict"; return et2_calendar_view.extend([et2_IDetachedDOM, et2_IResizeable],
+var et2_calendar_timegrid = (function(){ "use strict"; return et2_calendar_view.extend([et2_IDetachedDOM, et2_IResizeable,et2_IPrint],
 {
 	createNamespace: true,
 
@@ -1868,6 +1868,38 @@ var et2_calendar_timegrid = (function(){ "use strict"; return et2_calendar_view.
 			day.set_left((day_width * i) + 'px');
 			day.set_width(day_width + 'px');
 		}
-	}
+	},
+
+	/**
+	 * Set up for printing
+	 *
+	 * @return {undefined|Deferred} Return a jQuery Deferred object if not done setting up
+	 *  (waiting for data)
+	 */
+	beforePrint: function() {
+
+		if(this.disabled || !this.div.is(':visible'))
+		{
+			return;
+		}
+		
+		// update day widgets
+		var day_width = (100 / this.day_widgets.length);
+		for(var i = 0; i < this.day_widgets.length; i++)
+		{
+			var day = this.day_widgets[i];
+
+			// Position
+			day.set_left((i*day_width) + '%');
+			day.set_width(day_width + '%');
+			// For some reason the column's method does not set it correctly in Chrome
+			day.header[0].style.width = day_width + '%';
+		}
+	},
+
+	/**
+	 * Reset after printing
+	 */
+	afterPrint: function() {}
 });}).call(this);
 et2_register_widget(et2_calendar_timegrid, ["calendar-timegrid"]);

calendar/templates/default/app.css

@@ -2,14 +2,37 @@
 
 /*Media print classes*/
 @media print{
-	.th td, .row_on td, .row_off td {
+	#calendar-view.et2_container, #calendar-todo.et2_container, #calendar-planner.et2_container, #calendar-list.et2_container {
-		border: none !important;
+		position: static;
+		height: auto !important;
 	}
-	img.calendar_print_button {
+	.calendar_plannerWidget
-		display: none !important;
+	{
+		height: auto !important;
 	}
-	tr.calendar_print_cat {
+	.calendar_plannerWidget .calendar_plannerHeader {
-		border-bottom: 1px solid gray;
+		margin-right: 2px !important;
+	}
+	.calendar_plannerWidget .calendar_plannerRows {
+		height: auto !important;
+	}
+	.calendar_plannerWidget .verticalBar {
+		display: none;
+	}
+	/* Don't split a calendar week across pages */
+	#calendar-view_view > tbody > tr.view_row {
+		page-break-inside: avoid;
+	}
+	.calendar_calTimeGrid .calendar_calTimeGridScroll {
+		overflow-y: hidden;
+	}
+
+	/* Let hidden user names be visible */
+	#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul {
+		position: static;
+	}
+	#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul > li {
+		overflow: visible !important;
 	}
 }
 
@@ -220,6 +243,8 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
 
 	display: flex;
 	flex-direction: column;
+
+	page-break-inside: avoid;
 }
 
 .calendar_calTimeGrid .calendar_calTimeGridScroll {
@@ -915,7 +940,6 @@ Hide subsequent headers in week view with non-consolidated owners
 	top: 0px;
 	left: 0px;
 	width: 99.5%;
-	background-color: #f0f0f0;
 }
 .calendar_plannerWidget > div:not(.calendar_plannerHeader) {
 	overflow-y: auto;

calendar/templates/pixelegg/app.css

@@ -14,16 +14,38 @@
 /* $Id: app.css 55492 2016-03-22 15:09:39Z nathangray $ */
 /*Media print classes*/
 @media print {
-  .th td,
+  #calendar-view.et2_container,
-  .row_on td,
+  #calendar-todo.et2_container,
-  .row_off td {
+  #calendar-planner.et2_container,
-    border: none !important;
+  #calendar-list.et2_container {
+    position: static;
+    height: auto !important;
   }
-  img.calendar_print_button {
+  .calendar_plannerWidget {
-    display: none !important;
+    height: auto !important;
   }
-  tr.calendar_print_cat {
+  .calendar_plannerWidget .calendar_plannerHeader {
-    border-bottom: 1px solid gray;
+    margin-right: 2px !important;
+  }
+  .calendar_plannerWidget .calendar_plannerRows {
+    height: auto !important;
+  }
+  .calendar_plannerWidget .verticalBar {
+    display: none;
+  }
+  /* Don't split a calendar week across pages */
+  #calendar-view_view > tbody > tr.view_row {
+    page-break-inside: avoid;
+  }
+  .calendar_calTimeGrid .calendar_calTimeGridScroll {
+    overflow-y: hidden;
+  }
+  /* Let hidden user names be visible */
+  #calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul {
+    position: static;
+  }
+  #calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > ul > li {
+    overflow: visible !important;
   }
 }
 /**
@@ -234,6 +256,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
   overflow: hidden;
   display: flex;
   flex-direction: column;
+  page-break-inside: avoid;
 }
 .calendar_calTimeGrid .calendar_calTimeGridScroll {
   position: relative;
@@ -894,7 +917,6 @@ Hide subsequent headers in week view with non-consolidated owners
   top: 0px;
   left: 0px;
   width: 99.5%;
-  background-color: #f0f0f0;
 }
 .calendar_plannerWidget > div:not(.calendar_plannerHeader) {
   overflow-y: auto;