Add/show/manage event attendees inclusing basic availability check

plugins/calendar/calendar_ui.js

@@ -259,6 +259,24 @@ function rcube_calendar_ui(settings)
         // fetch attachments, some drivers doesn't set 'attachments' popr of the event
       }
       
+      // list event attendees
+      if (calendar.attendees && event.attendees) {
+        var data, dispname, html = '';
+        for (var j=0; j < event.attendees.length; j++) {
+          data = event.attendees[j];
+          dispname = Q(data.name || data.email);
+          if (data.email)
+            dispname = '<a href="mailto:' + data.email + '" title="' + Q(data.email) + '" class="mailtolink">' + dispname + '</a>';
+          html += '<span class="attendee ' + String(data.status).toLowerCase() + '">' + dispname + '</span> ';
+        }
+        if (html) {
+          $('#event-attendees').show()
+            .children('.event-text')
+            .html(html)
+            .find('a.mailtolink').click(function(e) { rcmail.redirect(rcmail.url('mail/compose', { _to:this.href.substr(7) })); return false; });
+        }
+      }
+
       var buttons = {};
       if (calendar.editable && event.editable !== false) {
         buttons[rcmail.gettext('edit', 'calendar')] = function() {
@@ -606,13 +624,13 @@ function rcube_calendar_ui(settings)
     // update event properties and attendees availability if event times have changed
     var event_times_changed = function()
     {
-      alert('event_times_changed')
       if (me.selected_event) {
         var allday = $('#edit-allday').get(0);
         me.selected_event.start = parse_datetime(allday.checked ? '00:00' : $('#edit-starttime').val(), $('#edit-startdate').val());
         me.selected_event.end   = parse_datetime(allday.checked ? '23:59' : $('#edit-endtime').val(), $('#edit-enddate').val());
         if (me.selected_event.attendees)
           update_freebusy_status(me.selected_event);
+        $('#edit-startdate').data('duration', Math.round((me.selected_event.end.getTime() - me.selected_event.start.getTime()) / 1000));
       }
     };
     
@@ -664,7 +682,7 @@ function rcube_calendar_ui(settings)
       
       var dispname = Q(data.name || data.email);
       if (data.email)
-        dispname = '<span title="' + Q(data.email) + '">' + dispname + '</span>';
+        dispname = '<a href="mailto:' + data.email + '" title="' + Q(data.email) + '" class="mailtolink">' + dispname + '</a>';
       
       // role selection
       var opts = {
@@ -699,6 +717,7 @@ function rcube_calendar_ui(settings)
         .appendTo(attendees_list);
       
       tr.find('a.deletelink').click({ id:(data.email || data.name) }, function(e) { remove_attendee(this, e.data.id); return false; });
+      tr.find('a.mailtolink').click(function(e) { rcmail.redirect(rcmail.url('mail/compose', { _to:this.href.substr(7) })); return false; });
       
       // check free-busy status
       if (avail == 'loading') {
@@ -1303,6 +1322,7 @@ function rcube_calendar_ui(settings)
       var newstart = parse_datetime('0', dateText);
       var newend = new Date(newstart.getTime() + $('#edit-startdate').data('duration') * 1000);
       $('#edit-enddate').val($.fullCalendar.formatDate(newend, me.settings['date_format']));
+      event_times_changed();
     };
 
     // init event dialog
@@ -1313,8 +1333,8 @@ function rcube_calendar_ui(settings)
       }
     });
     $('#edit-enddate, input.edit-alarm-date').datepicker(datepicker_settings);
-    $('#edit-startdate').datepicker(datepicker_settings).datepicker('option', 'onSelect', shift_enddate).change(function(){ shift_enddate(this.value); event_times_changed(); });
-    $('#edit-enddate, #edit-starttime, #edit-endtime').change(function(){ event_times_changed(); });
+    $('#edit-startdate').datepicker(datepicker_settings).datepicker('option', 'onSelect', shift_enddate).change(function(){ shift_enddate(this.value); });
+    $('#edit-enddate').datepicker('option', 'onSelect', event_times_changed).change(event_times_changed);
     $('#edit-allday').click(function(){ $('#edit-starttime, #edit-endtime')[(this.checked?'hide':'show')](); });
 
     // configure drop-down menu on time input fields based on jquery UI autocomplete
@@ -1365,7 +1385,8 @@ function rcube_calendar_ui(settings)
               menu.activate($.Event({ type: 'mouseenter' }), li);
           });
           widget.scrollTop(offset - 1);
-        }
+        },
+        change: event_times_changed
       })
       .click(function() {  // show drop-down upon clicks
         $(this).autocomplete('search', $(this).val() ? $(this).val().replace(/\D.*/, "") : " ");

plugins/calendar/drivers/kolab/kolab_driver.php

@@ -25,7 +25,7 @@ class kolab_driver extends calendar_driver
 {
   // features this backend supports
   public $alarms = true;
-  public $attendees = false;
+  public $attendees = true;
   public $attachments = true;
   public $categoriesimmutable = true;
 

plugins/calendar/skins/default/calendar.css

@@ -331,6 +331,32 @@ a.miniColors-trigger {
 	margin: 0.5em 0;
 }
 
+#event-attendees span.attendee {
+	padding-right: 18px;
+	margin-right: 0.5em;
+	background: url('images/attendee-status.gif') right 0 no-repeat;
+}
+
+#event-attendees span.attendee a.mailtolink {
+	text-decoration: none;
+	white-space: nowrap;
+}
+
+#event-attendees span.attendee a.mailtolink:hover {
+	text-decoration: underline;
+}
+
+#event-attendees span.accepted {
+	background-position: right -20px;
+}
+
+#event-attendees span.declined {
+	background-position: right -40px;
+}
+
+#event-attendees span.tentative {
+	background-position: right -60px;
+}
 
 /* jQuery UI overrides */
 
@@ -484,12 +510,9 @@ td.topalign {
 	width: 8em;
 }
 
-#edit-attendees-table td.availability {
-	width: 4em;
-}
-
+#edit-attendees-table td.availability,
 #edit-attendees-table td.confirmstate {
-	width: 6em;
+	width: 4em;
 }
 
 #edit-attendees-table td.options {
@@ -520,8 +543,9 @@ td.topalign {
 }
 
 #edit-attendees-table img.availabilityicon {
-	width: 16px;
-	height: 16px;
+	margin: 1px;
+	width: 14px;
+	height: 14px;
 	border-radius: 4px;
 	-moz-border-radius: 4px;
 }
@@ -542,32 +566,36 @@ td.topalign {
 	background: #c00;
 }
 
+#edit-attendees-table img.availabilityicon.out-of-office {
+	background: #f0b400;
+}
+
 #edit-attendees-table tbody td.confirmstate {
 	overflow: hidden;
 	white-space: nowrap;
-	font-size: 75%;
-/*	text-indent: -2000%; */
+	text-indent: -2000%;
 }
 
 #edit-attendees-table td.confirmstate span {
 	display: block;
 	width: 20px;
+	background: url('images/attendee-status.gif') 5px 0 no-repeat;
 }
 
 #edit-attendees-table td.confirmstate span.needs-action {
 	
 }
 
-#edit-attendees-table td.confirmstate span.tentative {
-	
+#edit-attendees-table td.confirmstate span.accepted {
+	background-position: 5px -20px;
 }
 
 #edit-attendees-table td.confirmstate span.declined {
-	
+	background-position: 5px -40px;
 }
 
-#edit-attendees-table td.confirmstate span.accepted {
-	
+#edit-attendees-table td.confirmstate span.tentative {
+	background-position: 5px -60px;
 }
 
 span.edit-alarm-set {