Calendar et2 conversion work in progress.

- Client side event caching
- Home fixes

calendar/inc/class.calendar_favorite_portlet.inc.php

@@ -56,7 +56,6 @@ class calendar_favorite_portlet extends home_favorite_portlet
 
 		// Always load app's css
 		egw_framework::includeCSS('calendar','app');
-		
 		if($this->favorite['state']['view'] == 'listview' || is_array($this->favorite) && !$this->favorite['state']['view'])
 		{
 			$ui = new calendar_uilist();
@@ -108,9 +107,10 @@ class calendar_favorite_portlet extends home_favorite_portlet
 				$content = array('legacy' => $ui->weekN(true));
 				break;
 			case 'week':
-				//$content = array('legacy' => $ui->week(0,true));
+				$etemplate->read('calendar.view');
+				$etemplate->set_dom_id($id);
 				$ui->week(array(), $etemplate);
-				return; //parent::exec($id, $etemplate);
+				return;
 				break;
 			case 'day':
 				$content = array('legacy' => $ui->day(true));

calendar/inc/class.calendar_merge.inc.php

@@ -535,7 +535,7 @@ class calendar_merge extends bo_merge
 	{
 		$GLOBALS['egw']->translation->add_app('calendar');
 		$GLOBALS['egw_info']['flags']['app_header'] = lang('calendar').' - '.lang('Replacements for inserting events into documents');
-		$GLOBALS['egw_info']['flags']['nonavbar'] = false;
+		$GLOBALS['egw_info']['flags']['nonavbar'] = true;
 		common::egw_header();
 
 		echo "<table width='90%' align='center'>\n";

calendar/inc/class.calendar_timegrid_etemplate_widget.inc.php

@@ -32,9 +32,6 @@
 		$form_name = self::form_name($cname, $this->id, $expand);
 		$value =& self::get_array(self::$request->content, $form_name, true);
 
-		error_log(__METHOD__ . "($cname,".array2string($expand));
-		error_log(array2string($value));
-
 		foreach($value as $day => &$events)
 		{
 			foreach($events as &$event)

calendar/inc/class.calendar_uiforms.inc.php

@@ -2662,6 +2662,33 @@ class calendar_uiforms extends calendar_ui
 		}
 	}
 	
+	/**
+	 * Deletes an event
+	 */
+	public function ajax_delete($eventId)
+	{
+		list($eventId, $date) = explode(':',$eventId);
+		$event=$this->bo->read($eventId);
+		$response = egw_json_response::get();
+
+		if ($this->bo->delete($event['id'], (int)$date))
+		{
+			if ($event['recur_type'] != MCAL_RECUR_NONE && !$date)
+			{
+				$msg = lang('Series deleted');
+			}
+			else
+			{
+				$msg = lang('Event deleted');
+			}
+			$response->apply('egw.refresh', Array($msg,'calendar',$eventId,'delete'));
+		}
+		else
+		{
+			$response->apply('egw.message', lang('Error'),'error');
+		}
+	}
+	
 	/**
 	 * imports a mail as Calendar
 	 *

calendar/inc/class.calendar_uilist.inc.php

@@ -366,6 +366,10 @@ class calendar_uilist extends calendar_ui
 				$search_params['start'] = $this->date;
 				break;
 		}
+		if($params['status_filter'])
+		{
+			$search_params['filter'] = $params['status_filter'];
+		}
 		if ($params['col_filter']['participant'])
 		{
 			$search_params['users'] = is_array($params['col_filter']['participant']) ? $params['col_filter']['participant'] : (int) $params['col_filter']['participant'];

calendar/inc/class.calendar_uiviews.inc.php

@@ -1114,7 +1114,7 @@ class calendar_uiviews extends calendar_ui
 				{
 					$todo_label = !empty($label) ? $label : lang("open ToDo's:");
 
-					foreach($todos as $todo)
+					foreach($todos as &$todo)
 					{
 						if(!$showall && ($i++ > $maxshow))
 						{
@@ -1125,12 +1125,14 @@ class calendar_uiviews extends calendar_ui
 						{
 							$icons .= ($icons?' ':'').$GLOBALS['egw']->html->image($app,$name,lang($name),'border="0" width="15" height="15"');
 						}
+						$todo['icons'] = $icons;
 						$class = $class == 'row_on' ? 'row_off' : 'row_on';
 						if($todo['edit']) {
-							list($width, $height) = explode('x', $todo['edit']['size']);
+							$todo['edit_size'] = $todo['edit']['size'];
 							unset($todo['edit']['size']);
 							$edit_icon_href = html::a_href( $icons, $todo['edit'],'',' data-todo="app|'.$width.'x'.$height.'" ');
 							$edit_href = html::a_href( $todo['title'], $todo['edit'],'',' data-todo="app|750x590" ');
+							$todo['edit'] = egw_framework::link('/index.php',$todo['edit'],true);
 						}
 						$icon_href = html::a_href($icons,$todo['view']);
 						$href = html::a_href($todo['title'], $todo['view']);
@@ -1145,11 +1147,7 @@ class calendar_uiviews extends calendar_ui
 				}
 			}
 		}
-		if (!empty($content))
+		return $todos;
-		{
-			return "<table border=\"0\" width=\"100%\">\n$content</table>\n";
-		}
-		return $todo_label ? '' : false;
 	}
 
 	/**
@@ -2928,6 +2926,8 @@ class calendar_uiviews extends calendar_ui
 			$actions['timesheet']['onExecute'] = 'javaScript:app.calendar.action_open';
 		}
 
+		$actions['delete']['onExecute'] = 'javaScript:app.calendar.delete';
+
 		return $actions;
 	}
 

calendar/js/app.js

@@ -4,6 +4,7 @@
  * @link http://www.egroupware.org
  * @package calendar
  * @author Hadi Nategh	<hn-AT-stylite.de>
+ * @author Nathan Gray
  * @copyright (c) 2008-13 by Ralf Becker <RalfBecker-AT-outdoor-training.de>
  * @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
  * @version $Id$
@@ -21,9 +22,20 @@
  * Calendar has multiple different views of the same data.  All the templates
  * for the different view are loaded at the start, then the view objects
  * in app.classes.calendar.views are used to manage the different views.
- * update_state() is used to change the state between the different views.
+ * update_state() is used to change the state between the different views, as
+ * well as adjust only a single part of the state while keeping the rest unchanged.
  *
- * The event widgets and the nextmatch get the data from egw.data.
+ * The event widgets (and the nextmatch) get the data from egw.data, and they
+ * register update callbacks to automatically update when the data changes.  This
+ * means that when we update something on the server, to update the UI we just need
+ * to send back the new data and if the event widget still exists it will update
+ * itself.  See calendar_uiforms->ajax_status().
+ *
+ * To reduce server calls, we also keep a map of day => event IDs.  This allows
+ * us to quickly change views (week to day, for example) without requesting additional
+ * data from the server.  We keep that map as long as only the date (and a few
+ * others - see update_state()) changes.  If user or any of the other filters are
+ * changed, we discard the daywise cache and ask the server for the filtered events.
  *
  * @augments AppJS
  */
@@ -41,6 +53,9 @@ app.classes.calendar = AppJS.extend(
 
 	/**
 	 * Current internal state
+	 *
+	 * If you need to change state, you can pass just the fields to change to
+	 * update_state().
 	 */
 	state: {
 		date: new Date(),
@@ -49,6 +64,13 @@ app.classes.calendar = AppJS.extend(
 		days: egw.preference('days_in_weekview','calendar')
 	},
 
+	/**
+	 * This is the data cache prefix for the daywise event index cache
+	 * Daywise cache IDs look like: calendar_daywise::20150101 and
+	 * contain a list of event IDs for that day (or empty array)
+	 */
+	DAYWISE_CACHE_ID: 'calendar_daywise',
+	
 	/**
 	 * Constructor
 	 *
@@ -66,9 +88,6 @@ app.classes.calendar = AppJS.extend(
 		// call parent
 		this._super.apply(this, arguments);
 
-		//Drag_n_Drop (need to wait for DOM ready to init dnd)
-		jQuery(jQuery.proxy(this.drag_n_drop,this));
-
 		// Scroll
 		jQuery(jQuery.proxy(this._scroll,this));
 	},
@@ -86,7 +105,7 @@ app.classes.calendar = AppJS.extend(
 		{
 			delete window.top.app.calendar;
 		}
-		jQuery(egw_getFramework().applications.calendar.tab.contentDiv).off();
+		jQuery('body').off('.calendar');
 	},
 
 	/**
@@ -102,6 +121,9 @@ app.classes.calendar = AppJS.extend(
 		// call parent
 		this._super.apply(this, arguments);
 
+		// Avoid many problems with home
+		if(_et2.app !== 'calendar') return;
+		
 		// Re-init sidebox, since it was probably initialized too soon
 		var sidebox = jQuery('#favorite_sidebox_'+this.appname);
 		if(sidebox.length == 0 && egw_getFramework() != null)
@@ -150,47 +172,12 @@ app.classes.calendar = AppJS.extend(
 			case 'calendar.freetimesearch':
 				this.set_enddate_visibility();
 				break;
-			case 'home.legacy':
-				break;
-			case 'calendar.meeting':
-				break;
 			case 'calendar.list':
 				this.filter_change();
-				// Fall through
-			default:
-				var hidden = typeof this.state.view !== 'undefined';
-				var all_loaded = true;
-				// Record the templates for the views so we can switch between them
-				for(var view in app.classes.calendar.views)
-				{
-					var index = app.classes.calendar.views[view].etemplates.indexOf(_name);
-					if(index > -1)
-					{
-						app.classes.calendar.views[view].etemplates[index] = _et2;
-						// If a template disappears, we want to release it
-						$j(_et2.DOMContainer).one('clear',jQuery.proxy(function() {
-							this.view[index] = _name;
-						},{view: app.classes.calendar.views[view], index: index, name: _name}));
-
-						if(this.state.view === view)
-						{
-							hidden = false;
-						}
-					}
-					app.classes.calendar.views[view].etemplates.forEach(function(et) {all_loaded = all_loaded && typeof et !== 'string';});
-				}
-
-				// Start hidden, except for current view
-				if(hidden)
-				{
-					$j(_et2.DOMContainer).hide();
-				}
-				if(all_loaded)
-				{
-					this.setState({state:this.state});
-				}
-
 		}
+
+		// Record the templates for the views so we can switch between them
+		this._et2_view_init(_et2,_name);
 	},
 
 	/**
@@ -218,7 +205,6 @@ app.classes.calendar = AppJS.extend(
 		switch(_app)
 		{
 			case 'infolog':
-			{
 				jQuery('.calendar_calDayTodos')
 					.find('a')
 					.each(function(i,a){
@@ -259,8 +245,25 @@ app.classes.calendar = AppJS.extend(
 						}
 					}
 				}
-			}
+				break;
-			break;
+			case 'calendar':
+				debugger;
+				var event = egw.dataGetUIDdata('calendar::'+_id);
+				if(event && event.data && event.data.date)
+				{
+					var new_cache_id = this._daywise_cache_id(event.data.date)
+					var daywise = egw.dataGetUIDdata(new_cache_id).data || [];
+					if(_type === 'delete')
+					{
+						daywise.splice(daywise.indexOf(_id),1);
+					}
+					else
+					{
+						daywise.push(event.date);
+					}
+					egw.dataStoreUID(new_cache_id,daywise);
+				}
+				break;
 		}
 	},
 
@@ -284,10 +287,26 @@ app.classes.calendar = AppJS.extend(
 				this.sidebox_et2.getWidgetById('iframe').set_src(_url);
 				return true;
 			}
+			// Known AJAX view, but not loaded
+			else if(app.classes.calendar.views[state.view])
+			{
+				return _url + '&ajax=true';
+			}
 		}
-		else if (_url.indexOf('menuaction=calendar.calendar_uiviews') >= 0)
+		else if (_url.indexOf('menuaction=calendar.calendar_') >= 0)
 		{
-			this.sidebox_et2.getWidgetById('iframe').set_src(_url);
+			var iframe = this.sidebox_et2.getWidgetById('iframe');
+			iframe.set_src(_url);
+			$j(this.sidebox_et2.parentNode).show();
+			// Hide other views
+			for(var _view in app.classes.calendar.views)
+			{
+				for(var i = 0; i < app.classes.calendar.views[_view].etemplates.length; i++)
+				{
+					$j(app.classes.calendar.views[_view].etemplates[i].DOMContainer).hide();
+				}
+			}
+			this.state.view = '';
 			return true;
 		}
 		// can not load our own index page, has to be done by framework
@@ -304,9 +323,8 @@ app.classes.calendar = AppJS.extend(
 	_sortable: function() {
 		// Calender current state
 		var state = this.getState();
-
 		var sortable = jQuery('#calendar-view_view tbody');
-		if(!sortable.sortable('instance'));
+		if(!sortable.sortable('instance'))
 		{
 			jQuery('#calendar-view_view tbody').sortable({
 				cancel: "#divAppboxHeader, .calendar_calWeekNavHeader, .calendar_plannerHeader",
@@ -318,24 +336,7 @@ app.classes.calendar = AppJS.extend(
 				create: function ()
 				{
 					var $sortItem = jQuery(this);
-					var options = {};
+					
-					switch (state.view)
-					{
-						case "day":
-							options = {
-								placeholder:"srotable_cal_day_ph",
-								axis:"x"
-							};
-							$sortItem.sortable('option', options);
-							break;
-						case "week":
-							options = {
-								placeholder:"srotable_cal_wk_ph",
-								axis:"y"
-							};
-							$sortItem.sortable('option', options);
-							break;
-					}
 				},
 				start: function ()
 				{
@@ -361,13 +362,34 @@ app.classes.calendar = AppJS.extend(
 		}
 
 		// Enable or disable
-		if(state.view == 'weekN' || state.view === 'month' || state.owner.length == 1 || state.owner.length > egw.config('calview_no_consolidate','phpgwapi'))
+		if((state.view == 'day' || state.view == 'week') &&
+			state.owner.length > 1 && state.owner.length > egw.config('calview_no_consolidate','phpgwapi'))
 		{
-			sortable.sortable('disable');
+			sortable.sortable('enable')
+				.sortable("refresh")
+				.disableSelection();
+			var options = {};
+			switch (state.view)
+			{
+				case "day":
+					options = {
+						placeholder:"srotable_cal_day_ph",
+						axis:"x"
+					};
+					sortable.sortable('option', options);
+					break;
+				case "week":
+					options = {
+						placeholder:"srotable_cal_wk_ph",
+						axis:"y"
+					};
+					sortable.sortable('option', options);
+					break;
+			}
 		}
 		else
 		{
-			sortable.sortable('enable');
+			sortable.sortable('disable');
 		}
 	},
 
@@ -376,9 +398,10 @@ app.classes.calendar = AppJS.extend(
 	 * When the user scrolls, we'll move enddate - startdate days
 	 */
 	_scroll: function() {
-		// Bind only once, to the whole tab
+		// Bind only once, to the whole thing
-		jQuery(egw_getFramework().applications.calendar.tab.contentDiv)
+		jQuery('body').off('.calendar')
-			.on('wheel','.et2_container:not(#calendar-list)',
+			//.on('wheel','.et2_container:#calendar-list,#calendar-sidebox)',
+			.on('wheel.calendar','.et2_container .calendar_calTimeGrid, .et2_container .calendar_plannerWidget',
 				function(e)
 				{
 					e.preventDefault();
@@ -890,7 +913,6 @@ app.classes.calendar = AppJS.extend(
 			if(!event_widget) continue;
 
 			event_widget.recur_prompt(jQuery.proxy(function(button_id,event_data) {
-				console.log(event_data.title, '  ', event_data.start, ' Status change ', _action.data.id, ' Button: ', button_id );
 				switch(button_id)
 				{
 					case 'exception':
@@ -918,8 +940,8 @@ app.classes.calendar = AppJS.extend(
 	/**
 	 * this function try to fix ids which are from integrated apps
 	 *
-	 * @param {egw_action} _action
+	 * @param {egwAction} _action
-	 * @param {Array} _senders
+	 * @param {egwActionObject[]} _senders
 	 */
 	cal_fix_app_id: function(_action, _senders)
 	{
@@ -998,9 +1020,50 @@ app.classes.calendar = AppJS.extend(
 		_action.data = backup;	// restore url, width, height, nm_action
 	},
 
+	/**
+	 * Delete (a single) calendar entry over ajax.
+	 *
+	 * Used for the non-list views
+	 *
+	 * @param {egwAction} _action
+	 * @param {egwActionObject} _events
+	 */
+	delete: function(_action, _events)
+	{
+		// Should be a single event, but we'll do it for all
+		for(var i = 0; i < _events.length; i++)
+		{
+			var event_widget = _events[i].iface.getWidget() || false;
+			if(!event_widget) continue;
+
+			event_widget.recur_prompt(jQuery.proxy(function(button_id,event_data) {
+				switch(button_id)
+				{
+					case 'exception':
+						egw().json(
+							'calendar.calendar_uiforms.ajax_delete',
+							[event_data.app_id]
+						).sendRequest(true);
+						break;
+					case 'series':
+					case 'single':
+						egw().json(
+							'calendar.calendar_uiforms.ajax_delete',
+							[event_data.id]
+						).sendRequest(true);
+						break;
+					case 'cancel':
+					default:
+						break;
+				}
+			},this));
+		}
+	},
+
 	/**
 	 * Delete calendar entry, asking if you want to delete series or exception
 	 *
+	 * Used for nextmatch
 	 *
 	 * @param _action
 	 * @param _senders
@@ -1160,12 +1223,24 @@ app.classes.calendar = AppJS.extend(
 		{
 			return window.top.app.calendar.update_state(_set);
 		}
+		if(this.state_update_in_progress) return;
+
 		var changed = [];
 		var new_state = jQuery.extend({}, this.state);
+		var cachable_changes = ['date','view','days','planner_days','sortby'];
 		if (typeof _set === 'object')
 		{
 			for(var s in _set)
 			{
+				if(cachable_changes.indexOf(s) === -1)
+				{
+					// Expire daywise cache
+					var daywise = egw.dataKnownUIDs(this.DAYWISE_CACHE_ID);
+					for(var i = 0; i < daywise.length; i++)
+					{
+						egw.dataDeleteUID(this.DAYWISE_CACHE_ID + '::' + daywise[i]);
+					}
+				}
 				if (new_state[s] !== _set[s])
 				{
 					changed.push(s + ': ' + new_state[s] + ' -> ' + _set[s]);
@@ -1191,7 +1266,7 @@ app.classes.calendar = AppJS.extend(
 	 */
 	getState: function()
 	{
-		var state = this.state;
+		var state = jQuery.extend({},this.state);
 
 		if (!state)
 		{
@@ -1201,9 +1276,9 @@ app.classes.calendar = AppJS.extend(
 		}
 
 		// Make sure date is consitantly a string, in case it needs to be passed to server
-		if(state.date.toJSON)
+		if(state.date && state.date.toJSON)
 		{
-			state.state = state.date.toJSON();
+			state.date = state.date.toJSON();
 		}
 
 		// Don't store current user in state to allow admins to create favourites for all
@@ -1254,7 +1329,10 @@ app.classes.calendar = AppJS.extend(
 			{
 				for(var i = 0; i < app.classes.calendar.views[_view].etemplates.length; i++)
 				{
-					$j(app.classes.calendar.views[_view].etemplates[i].DOMContainer).hide();
+					if(typeof app.classes.calendar.views[_view].etemplates[i] !== 'string')
+					{
+						$j(app.classes.calendar.views[_view].etemplates[i].DOMContainer).hide();
+					}
 				}
 			}
 		}
@@ -1276,7 +1354,7 @@ app.classes.calendar = AppJS.extend(
 
 			var view = app.classes.calendar.views[state.state.view];
 
-			// Sanitize owner
+			// Sanitize owner so it's always an array
 			switch(typeof state.state.owner)
 			{
 				case 'undefined':
@@ -1288,6 +1366,12 @@ app.classes.calendar = AppJS.extend(
 				case 'number':
 					state.state.owner = [state.state.owner];
 					break;
+				case 'object':
+					// An array-like Object or an Array?
+					if(!state.state.owner.filter)
+					{
+						state.state.owner = jQuery.map(state.state.owner, function(owner) {return owner;});
+					}
 			}
 			// Keep sort order
 			if(typeof this.state.owner === 'object')
@@ -1349,7 +1433,7 @@ app.classes.calendar = AppJS.extend(
 							value.push(val);
 							date.setUTCHours(24*7);
 						}
-						state.state.last=val.end_date.toJSON();
+						state.state.last=val.end_date;
 						break;
 					default:
 						var end = state.state.last = view.end_date(state.state);
@@ -1364,6 +1448,9 @@ app.classes.calendar = AppJS.extend(
 						}
 						break;
 				}
+				state.state.last = state.state.last.toJSON()
+				// If we have cached data for the timespan, pass it along
+				this._need_data(value,state.state);
 				if(grid)
 				{
 					grid.set_value(
@@ -1395,6 +1482,8 @@ app.classes.calendar = AppJS.extend(
 						}
 					}
 				}
+				var value = [{start_date: state.state.first, end_date: state.state.last}];
+				this._need_data(value,state.state);
 			}
 			// Include first & last dates in state, mostly for server side processing
 			if(state.state.first && state.state.first.toJSON) state.state.first = state.state.first.toJSON();
@@ -1419,7 +1508,7 @@ app.classes.calendar = AppJS.extend(
 					// TODO: Maybe some caching here
 					this.egw.jsonq('calendar_uiviews::ajax_get_todos', [state.state.date, state.state.owner[0]], function(data) {
 						this.getWidgetById('label').set_value(data.label||'');
-						this.getWidgetById('todos').set_value(data.todos||'');
+						this.getWidgetById('todos').set_value({content:data.todos||''});
 					},view.etemplates[1].widgetContainer);
 				}
 			}
@@ -1433,10 +1522,16 @@ app.classes.calendar = AppJS.extend(
 			formatDate = new Date(formatDate.valueOf() + formatDate.getTimezoneOffset() * 60 * 1000);
 			egw_app_header(view.header(state.state),'calendar');
 
+			// List view (nextmatch) has slightly different fields
 			if(state.state.view === 'listview')
 			{
 				state.state.startdate = state.state.date;
 				state.state.col_filter = {participant: state.state.owner};
+
+				// Pass status filter in as status filter, avoids conflicts with nm filter
+				state.state.status_filter = state.state.filter;
+				delete state.state.filter;
+				
 				var nm = view.etemplates[0].widgetContainer.getWidgetById('nm');
 				nm.applyFilters(state.state);
 			}
@@ -1445,32 +1540,35 @@ app.classes.calendar = AppJS.extend(
 			this._sortable();
 
 			/* Update sidebox widgets to show current value*/
-			this.sidebox_et2.iterateOver(function(widget) {
+			if(this.sidebox_et2)
-				if(widget.id == 'view')
+			{
-				{
+				this.sidebox_et2.iterateOver(function(widget) {
-					// View widget has a list of state settings, which require special handling
+					if(widget.id == 'view')
-					for(var i = 0; i < widget.options.select_options.length; i++)
 					{
-						var option_state = JSON.parse(widget.options.select_options[i].value) || [];
+						// View widget has a list of state settings, which require special handling
-						var match = true;
+						for(var i = 0; i < widget.options.select_options.length; i++)
-						for(var os_key in option_state)
 						{
-							match = match && option_state[os_key] == this.state[os_key];
+							var option_state = JSON.parse(widget.options.select_options[i].value) || [];
-						}
+							var match = true;
-						if(match)
+							for(var os_key in option_state)
-						{
+							{
-							widget.set_value(widget.options.select_options[i].value);
+								match = match && option_state[os_key] == this.state[os_key];
-							return;
+							}
+							if(match)
+							{
+								widget.set_value(widget.options.select_options[i].value);
+								return;
+							}
 						}
 					}
-				}
+					else if(typeof state.state[widget.id] !== 'undefined' && state.state[widget.id] != widget.getValue())
-				else if(typeof state.state[widget.id] !== 'undefined' && state.state[widget.id] != widget.getValue())
+					{
-				{
+						// Update widget.  This may trigger an infinite loop of
-					// Update widget.  This may trigger an infinite loop of
+						// updates, so we do it after changing this.state and set a flag
-					// updates, so we do it after changing this.state and set a flag
+						widget.set_value(state.state[widget.id]);
-					widget.set_value(state.state[widget.id]);
+					}
-				}
+				},this,et2_valueWidget);
-			},this,et2_valueWidget);
+			}
 
 			// If current state matches a favorite, hightlight it
 			this.highlight_favorite();
@@ -1693,6 +1791,179 @@ app.classes.calendar = AppJS.extend(
 		}
 	},
 
+	/**
+	 * Create a cache ID for the daywise cache
+	 *
+	 * @param {String|Date} date
+	 * @param {String|integer|String[]} owner
+	 * @returns {String} Cache ID
+	 */
+	_daywise_cache_id: function(date, owner)
+	{
+		if(typeof date === 'object')
+		{
+			date =  date.getUTCFullYear() + sprintf('%02d',date.getUTCMonth()+1) + sprintf('%02d',date.getUTCDate());
+		}
+		return this.DAYWISE_CACHE_ID+'::'+date+(owner && owner.toString() !== (this.state.owner.toString()||'') ? '-' + owner : '');
+	},
+
+	/**
+	 * Take the date range(s) in the value and decide if we need to fetch data
+	 * for the date ranges, or if they're already cached fill them in.
+	 *
+	 * @param {
+	 */
+	_need_data: function(value, state)
+	{
+		var need_data = false;
+
+		// Determine if we're showing multiple owners seperate or consolidated
+		var seperate_owners = false;
+		var last_owner = value[0].owner;
+		for(var i = 0; i < value.length && !seperate_owners; i++)
+		{
+			seperate_owners = seperate_owners || (last_owner !== value[i].owner)
+		}
+
+		for(var i = 0; i < value.length; i++)
+		{
+			var t = new Date(value[i].start_date);
+			var end = new Date(value[i].end_date);
+			do
+			{
+				// Cache is by date (and owner, if seperate)
+				var date = t.getUTCFullYear() + sprintf('%02d',t.getUTCMonth()+1) + sprintf('%02d',t.getUTCDate());
+				var cache_id = this._daywise_cache_id(date, seperate_owners ? value[i].owner : false);
+
+				if(egw.dataHasUID(cache_id))
+				{
+					var c = egw.dataGetUIDdata(cache_id);
+					if(c.data && c.data !== null)
+					{
+						// There is data, pass it along now
+						value[i][date] = [];
+						for(var j = 0; j < c.data.length; j++)
+						{
+							if(egw.dataHasUID('calendar::'+c.data[j]))
+							{
+								value[i][date].push(egw.dataGetUIDdata('calendar::'+c.data[j]).data);
+							}
+							else
+							{
+								need_data = true;
+							}
+						}
+					}
+					else
+					{
+						need_data = true;
+						// Assume it's empty, if there is data it will be filled later
+						egw.dataStoreUID(cache_id, []);
+					}
+				}
+				else
+				{
+					need_data = true;
+					// Assume it's empty, if there is data it will be filled later
+					egw.dataStoreUID(cache_id, []);
+				}
+				t.setUTCDate(t.getUTCDate() + 1);
+			}
+			while(t < end);
+			
+			// Some data is missing for the current owner, go get it
+			if(need_data && seperate_owners)
+			{
+				this._fetch_data(jQuery.extend({}, state, {owner: value[i].owner}));
+			}
+		}
+
+		// Some data was missing, go get it
+		if(need_data && !seperate_owners)
+		{
+			this._fetch_data(state);
+		}
+	},
+
+	/**
+	 * Use the egw.data system to get data from the calendar list for the
+	 * selected time span.
+	 *
+	 * As long as the other filters are the same (category, owner, status) we
+	 * cache the data.
+	 */
+	_fetch_data: function(state)
+	{
+		if(!this.sidebox_et2) return;
+
+		this.egw.dataFetch(
+			this.sidebox_et2.getInstanceManager().etemplate_exec_id,
+			{start: 0, num_rows:0},
+			jQuery.extend({}, app.calendar.state,
+			{
+				get_rows: 'calendar.calendar_uilist.get_rows',
+				row_id:'row_id',
+				startdate:state.first ||  state.date,
+				enddate:state.last,
+				col_filter: {participant: state.owner},
+				filter:'custom', // Must be custom to get start & end dates
+				status_filter: state.filter,
+				cat_id: state.cat_id,
+				search: state.keywords
+			}),
+			this.id,
+			function(data) {
+				console.log(data);
+				var updated_days = {};
+				for(var i = 0; i < data.order.length && data.total; i++)
+				{
+					var record = this.egw.dataGetUIDdata(data.order[i]);
+					if(record && record.data)
+					{
+						if(typeof updated_days[record.data.date] === 'undefined')
+						{
+							updated_days[record.data.date] = [];
+						}
+						// Copy, to avoid unwanted changes by reference
+						updated_days[record.data.date].push(record.data.row_id);
+
+						// Check for multi-day events listed once
+						// Date must stay a string or we might cause problems with nextmatch
+						var dates = {
+							start: typeof record.data.start === 'string' ? record.data.start : record.data.start.toJSON(),
+							end: typeof record.data.end === 'string' ? record.data.end : record.data.end.toJSON(),
+						};
+						if(dates.start.substr(0,10) !== dates.end.substr(0,10))
+						{
+							var end = new Date(record.data.end);
+							var t = new Date(record.data.start);
+
+							do
+							{
+								var expanded_date = ''+t.getUTCFullYear() + sprintf('%02d',t.getUTCMonth()+1) + sprintf('%02d',t.getDate());
+								if(typeof(updated_days[expanded_date]) === 'undefined')
+								{
+									updated_days[expanded_date] = [];
+								}
+								if(record.data.date !== expanded_date)
+								{
+									// Copy, to avoid unwanted changes by reference
+									updated_days[expanded_date].push(record.data.row_id);
+								}
+								t.setUTCDate(t.getUTCDate() + 1);
+							}
+							while(end >= t)
+						}
+					}
+				}
+				for(var day in updated_days)
+				{
+					this.egw.dataStoreUID(this._daywise_cache_id(day, state.owner), updated_days[day]);
+				}
+			}, this,null
+		);
+	},
+
 	/**
 	 * Some handy date calculations
 	 * All take either a Date object or full date with timestamp (Z)
@@ -1727,13 +1998,13 @@ app.classes.calendar = AppJS.extend(
 				default:
 					diff = -day;
 			}
-			d.setUTCHours(24*diff);
+			d.setUTCDate(d.getUTCDate() + diff);
 			return d;
 		},
 		end_of_week: function(date)
 		{
 			var d = app.calendar.date.start_of_week(date);
-			d.setUTCHours(24*7);
+			d.setUTCDate(d.getUTCDate() + 6);
 			return d;
 		}
 	},
@@ -1776,6 +2047,55 @@ app.classes.calendar = AppJS.extend(
 			});
 
 	},
+	
+	/**
+	 * Record view templates so we can quickly switch between them.
+	 * 
+	 * @param {etemplate2} _et2 etemplate2 template that was just loaded
+	 * @param {String} _name Name of the template
+	 */
+	_et2_view_init: function(_et2, _name)
+	{
+		var hidden = typeof this.state.view !== 'undefined';
+		var all_loaded = true;
+
+		// Flag to make sure we don't hide non-view templates
+		var view_et2 = false;
+		
+		for(var view in app.classes.calendar.views)
+		{
+			var index = app.classes.calendar.views[view].etemplates.indexOf(_name);
+			if(index > -1)
+			{
+				view_et2 = true;
+				app.classes.calendar.views[view].etemplates[index] = _et2;
+				// If a template disappears, we want to release it
+				$j(_et2.DOMContainer).one('clear',jQuery.proxy(function() {
+					this.view[index] = _name;
+				},{view: app.classes.calendar.views[view], index: index, name: _name}));
+
+				if(this.state.view === view)
+				{
+					hidden = false;
+				}
+			}
+			app.classes.calendar.views[view].etemplates.forEach(function(et) {all_loaded = all_loaded && typeof et !== 'string';});
+		}
+
+		// Start hidden, except for current view
+		if(view_et2)
+		{
+			if(hidden)
+			{
+				$j(_et2.DOMContainer).hide();
+			}
+			if(all_loaded)
+			{
+				this.setState({state:this.state});
+			}
+		}
+	},
+
 	View: {
 		// List of etemplates to show for this view
 		etemplates: ['calendar.view'],
@@ -1832,7 +2152,7 @@ app.classes.calendar = AppJS.extend(
 });
 
 /**
-* etemplates and settings for the different views some (day view)
+* Etemplates and settings for the different views.  Some (day view)
 * use more than one template, some use the same template as others,
 * most need different handling for their various attributes.
 *
@@ -1878,7 +2198,7 @@ jQuery.extend(app.classes.calendar,{
 				return egw.lang('Week view') + ': ' + app.calendar.View.header.call(this, state);
 			},
 			start_date: function(state) {
-				return app.calendar.date.start_of_week(state.date || new Date());
+				return app.calendar.date.start_of_week(app.calendar.View.start_date.call(this,state));
 			},
 			end_date: function(state) {
 				var d = app.calendar.date.start_of_week(state.date || new Date());

calendar/js/et2_widget_daycol.js

@@ -23,7 +23,7 @@
  *
  * @augments et2_DOMWidget
  */
-var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
+var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResizeable],
 {
 
 	attributes: {
@@ -81,7 +81,9 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 			granularity:	30,
 			extraRows:	2,
 			rowsToDisplay:	10,
-			rowHeight:	20
+			rowHeight:	20,
+			// Percentage; not yet available
+			titleHeight: 2.0
 		}
 	},
 
@@ -101,6 +103,10 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 
 	destroy: function() {
 		this._super.apply(this, arguments);
+
+		// In some cases, app.calendar code is unloaded before all the etemplates are destroyed
+		//egw.dataUnregisterUID(app.calendar.DAYWISE_CACHE_ID+'::'+this.options.date);
+		egw.dataUnregisterUID('calendar_daywise::'+this.options.date);
 	},
 
 	/**
@@ -121,6 +127,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 
 		this.display_settings.rowsToDisplay	= ((this.display_settings.wd_end - this.display_settings.wd_start)/this.display_settings.granularity)+2+2*this.display_settings.extraRows;
 		this.display_settings.rowHeight= (100/this.display_settings.rowsToDisplay).toFixed(1);
+		this.display_settings.titleHeight = (this.title.height()/this.div.height())*100;
 
 		// adding divs to click on for each row / time-span
 		for(var t =this.display_settings.wd_start,i = 1+this.display_settings.extraRows; t <= this.display_settings.wd_end; t += this.display_settings.granularity,++i)
@@ -185,7 +192,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		var new_date = ""+this._parent.date_helper.get_year()+
 			sprintf("%02d",this._parent.date_helper.get_month())+
 			sprintf("%02d",this._parent.date_helper.get_date());
-		
+
 		// Set label
 		// Add timezone offset back in, or formatDate will lose those hours
 		var formatDate = new Date(this.date.valueOf() + this.date.getTimezoneOffset() * 60 * 1000);
@@ -199,10 +206,10 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		{
 			return;
 		}
-		else
+
-		{
+		egw.dataUnregisterUID(app.calendar._daywise_cache_id+(this.options.date,this.options.owner),false,this);
-			this.options.date = new_date;
+
-		}
+		this.options.date = new_date;
 
 		this.div.attr("data-date", this.options.date);
 
@@ -212,7 +219,20 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		// Update all the little boxes
 		this._draw();
 
-		this._update_events(events);
+
+		// Register for updates on events for this day
+		egw.dataRegisterUID(app.calendar._daywise_cache_id(new_date,this.options.owner), function(event_ids) {
+			var events = [];
+			for(var i = 0; i < event_ids.length; i++)
+			{
+				events.push(egw.dataGetUIDdata('calendar::'+event_ids[i]).data);
+			}
+			this._update_events(events);
+		},this,this.getInstanceManager().execId,this.id);
+
+		if(events) {
+			this._update_events(events);
+		}
 	},
 
 	/**
@@ -221,8 +241,23 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 	 * @param {number} _owner Account ID
 	 */
 	set_owner: function(_owner) {
-		this.options.owner = parseInt(_owner);
+		if(_owner !== this.options.owner)
-		this.div.attr('data-sortable-id', this.options.owner);
+		{
+			egw.dataUnregisterUID(app.calendar._daywise_cache_id+(this.options.date,this.options.owner),false,this);
+
+			this.options.owner = parseInt(_owner);
+			this.div.attr('data-sortable-id', this.options.owner);
+
+			// Register for updates on events for this day
+			egw.dataRegisterUID(app.calendar._daywise_cache_id(this.options.date,this.options.owner), function(event_ids) {
+				var events = [];
+				for(var i = 0; i < event_ids.length; i++)
+				{
+					events.push(egw.dataGetUIDdata('calendar::'+event_ids[i]).data);
+				}
+				this._update_events(events);
+			},this,this.getInstanceManager().execId,this.id);
+		}
 	},
 
 	/**
@@ -339,6 +374,14 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		}
 
 		var eventCols = [], col_ends = [];
+
+		// Make sure children are in cronological order, or columns are backwards
+		this._children.sort(function(a,b) {
+			var start = new Date(a.options.value.start) - new Date(b.options.value.start);
+			var end = new Date(a.options.value.end) - new Date(b.options.value.end);
+			return a.options.value.whole_day ? -1 : (start ? start : end);
+		});
+		
 		for(var i = 0; i < this._children.length; i++)
 		{
 			var event = this._children[i].options.value || false;
@@ -377,7 +420,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 				for(c = 0; event['start_m'] < col_ends[c]; ++c);
 				col_ends[c] = event['end_m'];
 			}
-			if(typeof eventCols[c] == 'undefined')
+			if(typeof eventCols[c] === 'undefined')
 			{
 				eventCols[c] = [];
 			}
@@ -418,7 +461,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 				var height = 0;
 				if(columns[c][i].options.value.whole_day_on_top)
 				{
-					top =  ((this.title.height()/this.div.height())*100) + this.display_settings.rowHeight*whole_day_counter++;
+					top = this.display_settings.titleHeight + this.display_settings.rowHeight*whole_day_counter++;
 					height = this.display_settings.rowHeight;
 				}
 				else
@@ -465,7 +508,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		// time before workday => condensed in the first $this->extraRows rows
 		if (this.display_settings.wd_start > 0 && time < this.display_settings.wd_start)
 		{
-			pos = ((this.title.height()/this.div.height())*100) + (row_offset + (time / this.display_settings.wd_start )) * this.display_settings.rowHeight;
+			pos = this.display_settings.titleHeight + (row_offset + (time / this.display_settings.wd_start )) * this.display_settings.rowHeight;
 		}
 		// time after workday => condensed in the last row
 		else if (this.display_settings.wd_end < 24*60 && time > this.display_settings.wd_end+1*this.display_settings.granularity)
@@ -637,6 +680,12 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
 		}
 	},
 
+	// Resizable interface
+	resize: function (_height)
+	{
+		this.display_settings.titleHeight = (this.title.height()/_height)*100;
+	},
+
 	/**
 	 * Code for implementing et2_IDetachedDOM
 	 *

calendar/js/et2_widget_event.js

@@ -109,10 +109,9 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
 
 		},this,this.getInstanceManager().execId,this.id);
 
-
+		if(_value && !egw.dataHasUID('calendar::'+app_id))
-		if(!egw.dataHasUID('calendar::'+app_id))
 		{
-			this._update(this.options.value);
+			egw.dataStoreUID('calendar::'+app_id, _value);
 		}
 	},
 
@@ -162,7 +161,7 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
 		{
 			this.div.addClass('cat_' + event.category);
 		}
-		this.div.css('border-color', this.title.css('background-color'));
+		this.div.css('border-color', this.div.css('background-color'));
 
 		this.div.toggleClass('calendar_calEventUnknown', event.participants[egw.user('account_id')] ? event.participants[egw.user('account_id')][0] === 'U' : false);
 		this.div.addClass(this._status_class());
@@ -182,6 +181,7 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
 		this.div.attr('data-title', title);
 		this.title.text(small_height ? title : this._get_timespan(event))
 			// Set title color based on background brightness
+			.css('background-color', this.div.css('background-color'))
 			.css('color', jQuery.Color(this.div.css('background-color')).lightness() > 0.5 ? 'black':'white');
 
 		this.icons.appendTo(this.title)
@@ -255,11 +255,12 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
 		cat.destroy();
 		
 		return '<div class="calendar_calEventTooltip ' + this._status_class() + '" style="border-color: '+border+'; background: '+bg_color+';">'+
-			'<div class="calendar_calEventHeaderSmall" style="background-color: {bordercolor};">'+
+			'<div class="calendar_calEventHeaderSmall" style="background-color: '+border+';">'+
 				'<font style="color:'+header_color+'">'+this._get_timespan(this.options.value)+'</font>'+
 				this.icons[0].outerHTML+
 			'</div>'+
-			'<div class="calendar_calEventBodySmall">'+
+			'<div class="calendar_calEventBodySmall" style="background-color: '+
+				jQuery.Color(this.title.css('background-color')).lightness("+=0.3") + '">'+
 				'<p style="margin: 0px;">'+
 				'<span class="calendar_calEventTitle">'+this.div.attr('data-title')+'</span><br>'+
 				this.options.value.description+'</p>'+

calendar/js/et2_widget_planner.js

@@ -375,8 +375,9 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 			this.update_timer = window.setTimeout(jQuery.proxy(function() {
 				this.widget.update_timer = null;
 
-				this.widget._fetch_data();
+				this.widget.value = this.widget._fetch_data();
-				//this.widget._drawGrid();
+
+				this.widget._drawGrid();
 
 				// Update actions
 				if(this._actionManager)
@@ -589,7 +590,7 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 		var day_width = 100 / days;
 		for(var t = new Date(start),left = 0,i = 0; i < days; t.setUTCDate(t.getUTCDate() + days_in_month),left += days_in_month*day_width,i += days_in_month)
 		{
-			days_in_month = new Date(t.getUTCFullYear(),t.getUTCMonth()+1,0).getUTCDate();
+			days_in_month = new Date(t.getUTCFullYear(),t.getUTCMonth()+1,0).getUTCDate() - (t.getUTCDate()-1);
 
 			if (i + days_in_month > days)
 			{
@@ -605,32 +606,38 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 			
 				// previous links
 				var prev = new Date(t);
-				prev.setUTCDate(1);
 				prev.setUTCMonth(prev.getUTCMonth()-1);
-				
+				if(prev.valueOf() < start.valueOf() - (20 * 1000*3600*24))
-				var full = prev.toJSON();
+				{
-				prev.setUTCDate(start.getUTCDate());
+					var full = prev.toJSON();
-				if (prev.getUTCDate() >= 15) prev = new Date(t);		// we stay in the same month
+					prev.setUTCDate(prev.getUTCDate() + 15);
-				prev.setUTCDate(start.getUTCDate() < 15 ? 15 : 1);
+					prev.setUTCDate(start.getUTCDate() < 15 ? 1 : 15);
-				var half = prev.toJSON();
+					var half = prev.toJSON();
-				title = this._scroll_button('first',full) + this._scroll_button('left',half) + title;
+					title = this._scroll_button('first',full) + this._scroll_button('left',half) + title;
+				}
+			
+				// show next scales, if there are more then 10 days in the next month or there is no next month
+				var end = new Date(start);
+				end.setUTCDate(end.getUTCDate()+days);
+				var days_in_next_month = end.getUTCDate();
+				if (days_in_next_month <= 10 || end.getUTCMonth() == t.getUTCMonth())
+				{
+					// next links
+					var next = new Date(t);
+					next.setUTCMonth(next.getUTCMonth()+1);
+					full = next.toJSON();
+					next.setUTCDate(next.getUTCDate() - 15);
+					next.setUTCDate(next.getUTCDate() < 15 ? 1 : 15);
+					half = next.toJSON();
 
-				
+					title += this._scroll_button('right',half) + this._scroll_button('last',full);
-				// next links
+				}
-				var next = new Date(t);
-				next.setUTCMonth(next.getUTCMonth()+1);
-				next.setUTCDate(start.getUTCDate() < 15 ? 15 : 1);
-				half = next.toJSON();
-				next.setUTCMonth(next.getUTCMonth()+1);
-				full = next.toJSON();
-
-				title += this._scroll_button('right',half) + this._scroll_button('last',full);
 			}
 			else
 			{
 				title = '&nbsp;';
 			}
-			content += '<div class="calendar_plannerMonthScale et2_clickable" data-date="'+t.toJSON()+'" data-planner_days='+days_in_month+
+			content += '<div class="calendar_plannerMonthScale et2_clickable" data-date="'+t.toJSON()+ '"'+// data-planner_days='+days_in_month+
 				' style="left: '+left+'%; width: '+(day_width*days_in_month)+'%;">'+
 				title+"</div>";
 		}
@@ -660,29 +667,19 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 			var title = egw.lang('Week')+' '+date('W',t);
 
 			state = new Date(t.valueOf() - start.getTimezoneOffset() * 60 * 1000).toJSON();
-			/*
+			if (days  <= 7)
-			if (days > 7)
-			{
-				$title = html::a_href($title,array(
-					'menuaction' => 'calendar.calendar_uiviews.planner',
-					'planner_days' => 7,
-					'date'       => date('Ymd',$t),
-				),false,' title="'.html::htmlspecialchars(lang('Weekview')).'"');
-			}
-			else
 			{
 				// prev. week
-				$title = html::a_href(html::image('phpgwapi','first',lang('previous'),$options=' alt="<<"'),array(
+				var left = new Date(t);
-					'menuaction' => $this->view_menuaction,
+				left.setUTCDate(left.getUTCDate() - 7);
-					'date'       => date('Ymd',$t-7*DAY_s),
+
-				)) . ' &nbsp; <b>'.$title;
 				// next week
-				$title .= '</b> &nbsp; '.html::a_href(html::image('phpgwapi','last',lang('next'),$options=' alt=">>"'),array(
+				var right = new Date(t);
-					'menuaction' => $this->view_menuaction,
+				right.setUTCDate(right.getUTCDate() + 7);
-					'date'       => date('Ymd',$t+7*DAY_s),
+
-				));
+				title = this._scroll_button('left',left.toJSON()) + title + this._scroll_button('right',right.toJSON());
 			}
-			*/
+			
 			content += '<div class="calendar_plannerWeekScale et2_clickable" data-date=\'' + state + '\' style="left: '+left+'%; width: '+week_width+'%;">'+title+"</div>";
 		}
 		content += "</div>";		// end of plannerScale
@@ -724,34 +721,20 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 				title = egw.lang(date('D',t)).substr(0,2)+'<br />'+date('j',t);
 			}
 			state = new Date(t.valueOf() - start.getTimezoneOffset() * 60 * 1000).toJSON();
-			if (days > 1)
-			{
-				/*
-				title = html::a_href($title,array(
-					'menuaction'   => 'calendar.calendar_uiviews.planner',
-					'planner_days' => 1,
-					'date'         => date('Ymd',$t),
-				),false,strpos($class,'calendar_calHoliday') !== false || strpos($class,'calendar_calBirthday') !== false ? '' : ' title="'.html::htmlspecialchars(lang('Dayview')).'"');
-				*/
-			}
 			if (days < 5)
 			{
-				/*
 				if (!i)	// prev. day only for the first day
 				{
-					title = html::a_href(html::image('phpgwapi','first',lang('previous'),$options=' alt="<<"'),array(
+					var prev = new Date(t);
-						'menuaction' => $this->view_menuaction,
+					prev.setUTCDate(prev.getUTCDate() - 1);
-						'date'       => date('Ymd',$start-DAY_s),
+					title = this._scroll_button('left',prev.toJSON()) + title;
-					)) . ' &nbsp; '.$title;
 				}
 				if (i == days-1)	// next day only for the last day
 				{
-					title += ' &nbsp; '.html::a_href(html::image('phpgwapi','last',lang('next'),$options=' alt=">>"'),array(
+					var next = new Date(t);
-						'menuaction' => $this->view_menuaction,
+					next.setUTCDate(next.getUTCDate() + 1);
-						'date'       => date('Ymd',$start+DAY_s),
+					title += this._scroll_button('right',next.toJSON());
-					));
 				}
-				*/
 			}
 			content += '<div class="calendar_plannerDayScale et2_clickable '+ day_class+
 				'" data-date=\'' + state +'\' style="left: '+left+'%; width: '+day_width+'%;"'+
@@ -786,7 +769,7 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 			s.setUTCHours(23);
 			s.setUTCMinutes(59);
 			s.setUTCSeconds(59);
-			hours = (s.getTime() - t.getTime()) / 3600000;
+			hours = Math.ceil((s.getTime() - t.getTime()) / 3600000);
 		}
 		var cell_width = 100 / hours * decr;
 
@@ -1033,34 +1016,38 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
 	 */
 	_fetch_data: function()
 	{
-		this.egw().dataFetch(
+		var value = [];
-			this.getInstanceManager().etemplate_exec_id,
+		// Remember previous day to avoid multi-days duplicating
-			{start: 0, num_rows:0},
+		var last_data = [];
-			jQuery.extend({}, app.calendar.state,
+
+		var t = new Date(this.options.start_date);
+		var end = new Date(this.options.end_date);
+		do
+		{
+			// Cache is by date (and owner, if seperate)
+			var date = t.getUTCFullYear() + sprintf('%02d',t.getUTCMonth()+1) + sprintf('%02d',t.getUTCDate());
+			var cache_id = app.calendar._daywise_cache_id(date, this.options.owner);
+
+			if(egw.dataHasUID(cache_id))
 			{
-				get_rows: 'calendar.calendar_uilist.get_rows',
+				var c = egw.dataGetUIDdata(cache_id);
-				row_id:'row_id',
+				if(c.data && c.data !== null)
-				startdate:this.options.start_date,
-				enddate:this.options.end_date,
-				col_filter: {participant: this.options.owner},
-				filter:'custom'
-			}),
-			this.id,
-			function(data) {
-				console.log(data);
-				var events = [];
-				for(var i = 0; i < data.order.length && data.total; i++)
 				{
-					var record = this.egw().dataGetUIDdata(data.order[i]);
+					// There is data, pass it along now
-					if(record && record.data)
+					for(var j = 0; j < c.data.length; j++)
 					{
-						events.push(record.data);
+						if(last_data.indexOf(c.data[j]) === -1 && egw.dataHasUID('calendar::'+c.data[j]))
+						{
+							value.push(egw.dataGetUIDdata('calendar::'+c.data[j]).data);
+						}
 					}
 				}
-				this.value = events;
+				last_data = c.data;
-				this._drawGrid();
+			}
-			}, this,null
+			t.setUTCDate(t.getUTCDate() + 1);
-		);
+		}
+		while(t < end);
+		return value;
 	},
 
 	/**

calendar/js/et2_widget_timegrid.js

@@ -304,22 +304,31 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 						event_widget._parent.date_helper.set_hours(this.dropEnd.attr('data-hour'));
 						event_widget._parent.date_helper.set_minutes(this.dropEnd.attr('data-minute'));
 						event_widget.options.value.start = event_widget._parent.date_helper.getValue();
-					
+
+						// Leave the helper there until the update is done
+						var loading = ui.helper.clone().appendTo(ui.helper.parent());
+						loading.addClass('loading');
+						
 						event_widget.recur_prompt(function(button_id) {
 							//Get infologID if in case if it's an integrated infolog event
 							if (event_data.app === 'infolog')
 							{
 								// If it is an integrated infolog event we need to edit infolog entry
-								egw().json('stylite_infolog_calendar_integration::ajax_moveInfologEvent', [event_data.id, event_widget.options.value.start||false]).sendRequest(true);
+								egw().json('stylite_infolog_calendar_integration::ajax_moveInfologEvent', 
+									[event_data.id, event_widget.options.value.start||false],
+									function() {loading.remove();}
+								).sendRequest(true);
 							}
 							else
 							{
 								//Edit calendar event
 								egw().json('calendar.calendar_uiforms.ajax_moveEvent', [
-									button_id=='series' ? event_data.id : event_data.app_id,event_data.owner,
+										button_id=='series' ? event_data.id : event_data.app_id,event_data.owner,
-									event_widget.options.value.start,
+										event_widget.options.value.start,
-									timegrid.options.owner||egw.user('account_id')
+										timegrid.options.owner||egw.user('account_id')
-								]).sendRequest(true);
+									],
+									function() { loading.remove();}
+								).sendRequest(true);
 							}
 						});
 					}
@@ -519,16 +528,23 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 			this.day_widgets.splice(delete_index--,1);
 		}
 
-		// Create / update day widgets with dates and data, if available
+		// Create / update day widgets with dates and data
-		// TODO: need data doesn't take category & other filters into account
-		// Currently always loading new data, which causes multiple unneeded redraws
-		var need_data = true;
 		for(var i = 0; i < this.day_list.length; i++)
 		{
 			day = this.day_widgets[i];
 			// Set the date, and pass any data we have
-			if(typeof this.value[this.day_list[i]] === 'undefined') need_data = true;
+			if(typeof this.value[this.day_list[i]] === 'undefined')
-			if(day.options.owner != this.options.owner) need_data = true;
+			{
+				var ids = (egw.dataGetUIDdata(app.calendar._daywise_cache_id(this.day_list[i],this.options.owner))||{data:[]});
+				for(var j = 0; j < ids.length; j++)
+				{
+					this.value[this.day_list[i]] = [];
+					if(egw.dataHasUID('calendar::'+ids[j]))
+					{
+						this.value[this.day_list[i]].push(egw.dataGetUIDdata('calendar::'+ids[j]).data);
+					}
+				}
+			}
 
 			day.set_date(this.day_list[i], this.value[this.day_list[i]] || false);
 			day.set_owner(this.options.owner);
@@ -539,12 +555,6 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 			$j(day.getDOMNode()).css('left', ((100/this.day_list.length).toFixed(2) * i) + '%');
 		}
 		
-		// Fetch any needed data
-		if(need_data)
-		{
-			this._fetch_data();
-		}
-
 		// TODO: Figure out how to do this with detached nodes
 		/*
 		var nodes = this.day_col.getDetachedNodes();
@@ -813,7 +823,7 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 		}
 		if(actionLinks.indexOf(drag_action.id) < 0)
 		{
-			actionLinks.push(drag_action.id);
+			//actionLinks.push(drag_action.id);
 		}
 		drag_action.set_dragType('link');
 	},
@@ -841,84 +851,6 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 		return action_links;
 	},
 
-	/**
-	 * Use the egw.data system to get data from the calendar list for the
-	 * selected time span.
-	 * 
-	 */
-	_fetch_data: function()
-	{
-		this.egw().dataFetch(
-			this.getInstanceManager().etemplate_exec_id,
-			{start: 0, num_rows:0},
-			jQuery.extend({}, app.calendar.state,
-			{
-				get_rows: 'calendar.calendar_uilist.get_rows',
-				row_id:'row_id',
-				startdate:this.options.start_date,
-				enddate:this.options.end_date,
-				col_filter: {participant: this.options.owner},
-				filter:'custom'
-			}),
-			this.id,
-			function(data) {
-				console.log(data);
-				var updated_days = {};
-				for(var i = 0; i < data.order.length && data.total; i++)
-				{
-					var record = this.egw().dataGetUIDdata(data.order[i]);
-					if(record && record.data)
-					{
-						if(typeof updated_days[record.data.date] === 'undefined')
-						{
-							updated_days[record.data.date] = [];
-						}
-						// Copy, to avoid unwanted changes by reference
-						updated_days[record.data.date].push(jQuery.extend({},record.data));
-
-						// Check for multi-day events listed once
-						// Date must stay a string or we might cause problems with nextmatch
-						var dates = {
-							start: typeof record.data.start === 'string' ? record.data.start : record.data.start.toJSON(),
-							end: typeof record.data.end === 'string' ? record.data.end : record.data.end.toJSON(),
-						};
-						if(dates.start.substr(0,10) != dates.end.substr(0,10))
-						{
-							this.date_helper.set_value(record.data.end);
-							var end = this.date_helper.date.getTime();
-							this.date_helper.set_value(record.data.start);
-
-							do
-							{
-								var expanded_date = ''+this.date_helper.get_year() + sprintf('%02d',this.date_helper.get_month()) + sprintf('%02d',this.date_helper.get_date());
-								if(typeof(updated_days[expanded_date]) == 'undefined')
-								{
-									updated_days[expanded_date] = [];
-								}
-								if(record.data.date !== expanded_date)
-								{
-									// Copy, to avoid unwanted changes by reference
-									updated_days[expanded_date].push(jQuery.extend({},record.data));
-								}
-								this.date_helper.set_date(this.date_helper.get_date()+1);
-							}
-							// Limit it to 14 days to avoid infinite loops in case something is mis-set,
-							// though the limit is more based on how wide the screen is
-							while(end >= this.date_helper.date.getTime() && i <= 14)
-						}
-					}
-				}
-				for(var i = 0; i < this.day_list.length; i++)
-				{
-					var day = this.day_widgets[i];
-					day.set_date(this.day_list[i], updated_days[this.day_list[i]]||[], true);
-
-					this.value[this.day_list[i]] = updated_days[this.day_list[i]];
-				}
-			}, this,null
-		);
-	},
-
 	/**
 	 * Provide specific data to be displayed.
 	 * This is a way to set start and end dates, owner and event data in once call.
@@ -1038,6 +970,48 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 		}
 	},
 
+	/**
+	 * Set which user owns this.  Owner is passed along to the individual
+	 * days.
+	 *
+	 * @param {number|number[]} _owner Account ID
+	 * @returns {undefined}
+	 */
+	set_owner: function(_owner)
+	{
+		var old = this.options.owner || 0;
+		
+		// Let select-account widget handle value validation
+		this.owner.set_value(typeof _owner == "string" || typeof _owner == "number" ? _owner : jQuery.extend([],_owner));
+
+		this.options.owner = _owner;//this.owner.getValue();
+		if(this.isAttached() && (
+			typeof old == "number" && typeof _owner == "number" && old !== this.options.owner ||
+			// Array of ids will not compare as equal
+			((typeof old === 'object' || typeof _owner === 'object') && old.toString() !== _owner.toString())
+		))
+		{
+			this.invalidate(true);
+		}
+	},
+	
+	/**
+	 * Turn on or off the visibility of weekends
+	 *
+	 * @param {boolean} weekends
+	 */
+	set_show_weekend: function(weekends)
+	{
+		if(this.options.show_weekend !== weekends)
+		{
+			this.options.show_weekend = weekends ? true : false;
+			if(this.isAttached())
+			{
+				this.invalidate();
+			}
+		}
+	},
+
 	/**
 	 * Call change handler, if set
 	 */
@@ -1088,23 +1062,6 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 		return false;
 	},
 
-	/**
-	 * Turn on or off the visibility of weekends
-	 *
-	 * @param {boolean} weekends
-	 */
-	set_show_weekend: function(weekends)
-	{
-		if(this.options.show_weekend !== weekends)
-		{
-			this.options.show_weekend = weekends ? true : false;
-			if(this.isAttached())
-			{
-				this.invalidate();
-			}
-		}
-	},
-
 	get_granularity: function()
 	{
 		// get option, or user's preference
@@ -1200,31 +1157,6 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
 		return nodes;
 	},
 	
-	/**
-	 * Set which user owns this.  Owner is passed along to the individual
-	 * days.
-	 *
-	 * @param {number|number[]} _owner Account ID
-	 * @returns {undefined}
-	 */
-	set_owner: function(_owner)
-	{
-		var old = this.options.owner || 0;
-
-		// Let select-account widget handle value validation
-		this.owner.set_value(typeof _owner == "string" || typeof _owner == "number" ? _owner : jQuery.extend([],_owner));
-
-		this.options.owner = _owner;//this.owner.getValue();
-		if(this.isAttached() && (
-			typeof old == "number" && typeof _owner == "number" && old !== this.options.owner ||
-			// Array of ids will not compare as equal
-			((typeof old === 'object' || typeof _owner === 'object') && old.toString() !== _owner.toString())
-		))
-		{
-			this.invalidate(true);
-		}
-	},
-	
 	/**
 	 * Code for implementing et2_IDetachedDOM
 	 *

calendar/templates/default/app.css

@@ -318,6 +318,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
  *
  * These are defaults:
  */
+	background-color: #808080;
 	border-color: #808080;
 }
 .calendar_calEvent:hover{

calendar/templates/default/sidebox.xet

@@ -37,7 +37,7 @@ Egroupware
 				</rows>
 			</grid>
 			<select id="view" class="et2_fullWidth" onchange="app.calendar.update_state(JSON.parse(widget.getValue()));"/>
-			<textbox id="keywords" class="et2_fullWidth" onchange="app.calendar.update_state({keywords: widget.getValue()});"/>
+			<textbox id="keywords" class="et2_fullWidth" blur="Search" onchange="app.calendar.update_state({keywords: widget.getValue()});"/>
 			<date id="date" class="et2_fullWidth" inline="true" onchange="app.calendar.update_state({date:widget.getValue(),view:'day'});"/>
 			<textbox type="hidden" id="first"/>
 			<textbox type="hidden" id="last"/>
@@ -46,7 +46,7 @@ Egroupware
 				<button align="right" id="cat_id_multiple" image="category"/>
 			</hbox>
 			
-			<select-account id="owner" class="et2_fullWidth" onchange="app.calendar.update_state({owner: widget.getValue()});" expand_multiple_rows="4"/>
+			<select-account id="owner" class="et2_fullWidth" onchange="app.calendar.update_state({owner: widget.getValue()});" expand_multiple_rows="4" account_type="both"/>
 
 			<!--
 			<taglist id="owner" class="et2_fullWidth" onchange="app.calendar.update_state({owner: widget.getValue()});" autocomplete_params=''/>

calendar/templates/default/todo.xet

@@ -14,19 +14,24 @@ Egroupware
 <overlay>
 	<template id="calendar.todo" width="30%">
 		<box class="calendar_calDayTodos">
-			<label id="label" class="calendar_calDayTodosHeader" width="100%" />
+			<box class="calendar_calDayTodosHeader" width="100%">
-			<html id="todos"/>
+				<label id="label" class="calendar_calDayTodosHeader" width="100%" />
+			</box>
+			<box class="calendar_calDayTodosTable">
+				<grid id="todos" width="100%">
+					<columns>
+						<column/>
+						<column width="80%"/>
+					</columns>
+					<rows>
+						<row class="todo_row">
+							<html id="{$row}[icons]" />
+
+							<description value="$row_cont[title]" href="$row_cont[edit]" extra_link_popup="$row_cont[edit_size]"/>
+						</row>
+					</rows>
+				</grid>
+			</box>
 		</box>
-	<!--
-		<grid id="todos">
-			<columns>
-				<column/>
-			</columns>
-			<rows>
-				<row class="todo_row">
-				</row>
-			</rows>
-		</grid>
-	-->
 	</template>
 </overlay>

calendar/templates/pixelegg/app.css

@@ -11,7 +11,7 @@
  * @package calendar
  * @version $Id$
  */
-/* $Id: app.css 53023 2015-07-01 16:02:20Z nathangray $ */
+/* $Id: app.css 53038 2015-07-02 19:31:52Z nathangray $ */
 /*Media print classes*/
 @media print {
   .th td,
@@ -330,6 +330,7 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
  *
  * These are defaults:
  */
+  background-color: #808080;
   border-color: #808080;
 }
 .calendar_calEvent:hover {