R54875 - in /trunk/calendar: js/ templates/default/ templates/pixelegg/

Author: nathangray
New Revision: 54875

URL: http://svn.stylite.de/viewvc/egroupware?rev=54875&view=rev
Log:

  • Change all day event sorting so longer events are higher
  • Change short event display so 1 line shows title, 2-4 lines show timespan & title
  • Increase maximum number of events loaded at once

Modified:
trunk/calendar/js/app.js
trunk/calendar/js/et2_widget_daycol.js
trunk/calendar/js/et2_widget_event.js
trunk/calendar/templates/default/app.css
trunk/calendar/templates/pixelegg/app.css

Modified: trunk/calendar/js/app.js
URL: http://svn.stylite.de/viewvc/egroupware/trunk/calendar/js/app.js?rev=54875&r1=54874&r2=54875&view=diff

— trunk/calendar/js/app.js (original)
+++ trunk/calendar/js/app.js Thu Jan 28 22:35:22 2016
@@ -2713,7 +2713,7 @@
this.egw.dataFetch(
instance ? instance.etemplate_exec_id :
this.sidebox_et2.getInstanceManager().etemplate_exec_id,

  •   	{start: start, num_rows:200},
    
  •   	{start: start, num_rows:400},
      	query,
      	this.id,
      	function calendar_handleResponse(data) {
    

Modified: trunk/calendar/js/et2_widget_daycol.js
URL: http://svn.stylite.de/viewvc/egroupware/trunk/calendar/js/et2_widget_daycol.js?rev=54875&r1=54874&r2=54875&view=diff

— trunk/calendar/js/et2_widget_daycol.js (original)
+++ trunk/calendar/js/et2_widget_daycol.js Thu Jan 28 22:35:22 2016
@@ -737,11 +737,15 @@
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);

		// Whole day events sorted by ID, normal events by start / end time
		if(a.options.value.whole_day && b.options.value.whole_day)
		{
  •   		return (a.options.value.app_id - b.options.value.app_id);
    
  •   		// Longer duration comes first so we have nicer bars across the top
    
  •   		var duration = 
    
  •   			(new Date(b.options.value.end) - new Date(b.options.value.start)) -
    
  •   			(new Date(a.options.value.end) - new Date(a.options.value.start));
    
  •   		return duration ? duration : (a.options.value.app_id - b.options.value.app_id);
      	}
      	else if (a.options.value.whole_day || b.options.value.whole_day)
      	{
    

@@ -890,7 +894,7 @@
columns[c][i].div.css(‘left’, left.toFixed(1)+’%’);
columns[c][i].div.css(‘right’, right.toFixed(1)+’%’);
columns[c][i].div.css(‘z-index’,parseInt(20)+c);

  •   			columns[c][i]._small_size();
      		}
      	}
      	// Only wanted to position this event, leave the other columns alone
    

Modified: trunk/calendar/js/et2_widget_event.js
URL: http://svn.stylite.de/viewvc/egroupware/trunk/calendar/js/et2_widget_event.js?rev=54875&r1=54874&r2=54875&view=diff

— trunk/calendar/js/et2_widget_event.js (original)
+++ trunk/calendar/js/et2_widget_event.js Thu Jan 28 22:35:22 2016
@@ -281,6 +281,7 @@
.removeClass(function(index, css) {
return (css.match(/calendar_calEvent\S+/g) || []).join(’ ');
})

  •   	.removeClass('calendar_calEventSmall')
      	.addClass(event.class)
      	.toggleClass('calendar_calEventPrivate', typeof event.private !== 'undefined' && event.private);
      this.options.class = event.class;
    

@@ -304,16 +305,13 @@

	// Header
	var title = !event.is_private ? event['title'] : egw.lang('private');
  •   // If there isn't enough height for header + 1 line in the body, it's small
    
  •   var small_height = this.div.innerHeight() <= this.title.height() * 2;
    
  •   if(!this.title.height())
    
  •   {
    
  •   	// Handle sizing while hidden, such as when calendar is not the active tab
    
  •   	small_height = egw.getHiddenDimensions(this.div).h < egw.getHiddenDimensions(this.title).h * 2
    
  •   }
    
  •   this.div.attr('data-title', title);
    
  •   this.title.text(small_height ? title : this._get_timespan(event));
    
  •   // Height specific section
    
  •   this._small_size();
    
  •   this.title
    
  •   	.html('<span class="calendar_calTimespan">'+this._get_timespan(event) + '<br /></span>')
    
  •   	.append('<span class="calendar_calEventTitle">'+title+'</span>')
      
      // Colors - don't make them transparent if there is no color
      if(jQuery.Color("rgba(0,0,0,0)").toRgbaString() != jQuery.Color(this.div,'background-color').toRgbaString())
    

@@ -351,6 +349,31 @@
},

/**
    • Calculate display variants for when event is too short for full display
    • Display is based on the number of visible lines, calculated off the header
    • height:
    • 1 - show just the event title, with ellipsis
    • 2 - Show timespan and title, with ellipsis
    • 4 - Show description as well, truncated to fit

  • */
  • _small_size: function() {
  •   this.div.removeClass('calendar_calEventSmall');
    
  •   if(this.options.value.whole_day_on_top) return;
    
  •   var visible_lines = Math.floor(this.div.innerHeight() / this.title.height());
    
  •   if(!this.title.height())
    
  •   {
    
  •   	// Handle sizing while hidden, such as when calendar is not the active tab
    
  •   	visible_lines = Math.floor(egw.getHiddenDimensions(this.div).h / egw.getHiddenDimensions(this.title).h);
    
  •   }
    
  •   this.div.toggleClass('calendar_calEventSmall',visible_lines < 4);
    
  •   this.div
    
  •   	.attr('data-visible_lines', visible_lines < 4 ? Math.max(1,visible_lines) : '');
    
  • },
  • /**
    • Examines the participants & returns CSS classname for status
    • @returns {String}
      @@ -424,7 +447,7 @@
      ’’+
      ’
      ’+
      ’

      ’+

      •   		'<span class="calendar_calEventTitle">'+this.div.attr('data-title')+'</span><br>'+
        
      •   		'<span class="calendar_calEventTitle">'+this.options.value.title+'</span><br>'+
          		this.options.value.description+'</p>'+
          		'<p style="margin: 2px 0px;">'+times+'</p>'+
          		(this.options.value.location ? '<p><span class="calendar_calEventLabel">'+this.egw().lang('Location') + '</span>:' + this.options.value.location+'</p>' : '')+
        

      Modified: trunk/calendar/templates/default/app.css
      URL: http://svn.stylite.de/viewvc/egroupware/trunk/calendar/templates/default/app.css?rev=54875&r1=54874&r2=54875&view=diff

      — trunk/calendar/templates/default/app.css (original)
      +++ trunk/calendar/templates/default/app.css Thu Jan 28 22:35:22 2016
      @@ -619,6 +619,9 @@
      */
      background-color: rgba(255,255,255,0.9);
      }
      +.calendar_calEventHeader .calendar_calEventTitle {

      • display: none;
        +}
        .calendar_calEventHeaderSmall{
        font-size: 8pt;
        line-height: 10pt;
        @@ -663,6 +666,31 @@

      .calendar_calEventTitle{
      font-weight: bold;
      +}
      +
      +/* Event is too small for full display */
      +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
      +.calendar_calEventSmall[data-visible_lines=‘1’] .calendar_calTimespan {

      • display: none;
        +}
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
        +.calendar_calEventSmall[data-visible_lines=‘2’] .calendar_calTimespan,
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
        +.calendar_calEventSmall[data-visible_lines=‘3’] .calendar_calTimespan {
      • display: inline;
        +}

      +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
      +.calendar_calEventSmall[data-visible_lines=‘1’] .calendar_calEventTitle,
      +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
      +.calendar_calEventSmall[data-visible_lines=‘2’] .calendar_calEventTitle,
      +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
      +.calendar_calEventSmall[data-visible_lines=‘3’] .calendar_calEventTitle {

      • display: inline;
        +}
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList)
        +.calendar_calEventSmall .calendar_calEventBody {
      • padding-top: 2em;
        }

      /* Events as displayed in a list, not sized by time */

      Modified: trunk/calendar/templates/pixelegg/app.css
      URL: http://svn.stylite.de/viewvc/egroupware/trunk/calendar/templates/pixelegg/app.css?rev=54875&r1=54874&r2=54875&view=diff

      — trunk/calendar/templates/pixelegg/app.css (original)
      +++ trunk/calendar/templates/pixelegg/app.css Thu Jan 28 22:35:22 2016
      @@ -618,6 +618,9 @@
      */
      background-color: rgba(255, 255, 255, 0.9);
      }
      +.calendar_calEventHeader .calendar_calEventTitle {

      • display: none;
        +}
        .calendar_calEventHeaderSmall {
        font-size: 8pt;
        line-height: 10pt;
        @@ -662,6 +665,22 @@
        }
        .calendar_calEventTitle {
        font-weight: bold;
        +}
        +/* Event is too small for full display */
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘1’] .calendar_calTimespan {
      • display: none;
        +}
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘2’] .calendar_calTimespan,
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘3’] .calendar_calTimespan {
      • display: inline;
        +}
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘1’] .calendar_calEventTitle,
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘2’] .calendar_calEventTitle,
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall[data-visible_lines=‘3’] .calendar_calEventTitle {
      • display: inline;
        +}
        +.calendar_calTimeGrid:not(.calendar_calTimeGridList) .calendar_calEventSmall .calendar_calEventBody {
      • padding-top: 2em;
        }
        /* Events as displayed in a list, not sized by time */
        .calendar_calTimeGridList .calendar_calTimeGridScroll {

      Site24x7 APM Insight: Get Deep Visibility into Application Performance
      APM + Mobile APM + RUM: Monitor 3 App instances at just $35/Month
      Monitor end-to-end web transactions and take corrective actions now
      Troubleshoot faster and improve end-user experience. Signup Now!
      http://pubads.g.doubleclick.net/gampad/clk?id=267308311&iu=/4140


      eGroupWare-cvs mailing list
      eGroupWare-cvs@lists.sourceforge.net
      https://lists.sourceforge.net/lists/listinfo/egroupware-cvs