mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-23 00:13:35 +01:00
Planner view
- When changing into planner view, keep the current time span - Today button keeps displayed number of days - Remove header arrows, planner now uses same navigation as others
This commit is contained in:
Nathan Gray
parent
ff868f4539
commit
7a62f96866
@ -609,7 +609,10 @@ app.classes.calendar = AppJS.extend(
|
||||
.css({"transform": '',height: '', width:'',overflow:''});
|
||||
wrapper.parent().css({overflow: '', width: original_size.width, height: original_size.height});
|
||||
original.css("display","");
|
||||
if(wrapper.length)
|
||||
{
|
||||
wrapper[0].offsetHeight;
|
||||
}
|
||||
wrapper.css({
|
||||
"transition-duration": "",
|
||||
"transition-delay": ""
|
||||
@ -3300,6 +3303,13 @@ jQuery.extend(app.classes.calendar,{
|
||||
return state.sortby ? state.sortby : 0;
|
||||
},
|
||||
start_date: function(state) {
|
||||
// If there is no planner_days and a start date, just keep it
|
||||
if(!state.planner_days && state.first && (
|
||||
!state.date || state.first < state.date && state.last > state.date
|
||||
))
|
||||
{
|
||||
return state.first;
|
||||
}
|
||||
var d = app.calendar.View.start_date.call(this, state);
|
||||
if(state.sortby && state.sortby === 'month')
|
||||
{
|
||||
@ -3307,10 +3317,6 @@ jQuery.extend(app.classes.calendar,{
|
||||
}
|
||||
else if (!state.planner_days)
|
||||
{
|
||||
if(d.getUTCDate() < 15)
|
||||
{
|
||||
d.setUTCDate(1);
|
||||
}
|
||||
d = app.calendar.date.start_of_week(d);
|
||||
d.setUTCHours(0);
|
||||
d.setUTCMinutes(0);
|
||||
@ -3321,6 +3327,26 @@ jQuery.extend(app.classes.calendar,{
|
||||
return d;
|
||||
},
|
||||
end_date: function(state) {
|
||||
// If no planner days and an end date, just keep it
|
||||
if(!state.planner_days && state.last && state.last > state.first)
|
||||
{
|
||||
// Handle listview before / after a little more nicely
|
||||
if(app.calendar.state.view == 'listview' && (
|
||||
state.filter == 'before' || state.filter == 'after'
|
||||
))
|
||||
{
|
||||
var d = app.calendar.View.end_date.call(this, state);
|
||||
d.setUTCDate(d.getUTCDate() + 30);
|
||||
d = app.calendar.date.end_of_week(d);
|
||||
return d;
|
||||
}
|
||||
return state.last;
|
||||
}
|
||||
// Avoid end date before start date
|
||||
if(state.last && state.first && state.last <= state.first && !state.planner_days)
|
||||
{
|
||||
state.planner_days = 30;
|
||||
}
|
||||
var d = app.calendar.View.end_date.call(this, state);
|
||||
if(state.planner_days)
|
||||
{
|
||||
@ -3337,25 +3363,15 @@ jQuery.extend(app.classes.calendar,{
|
||||
delete state.planner_days;
|
||||
}
|
||||
// Avoid killing the view by not showing more than 100 days
|
||||
else if (state.last && (new Date(state.last) - new Date(state.first)) < (100 * 24 * 3600 * 1000) )
|
||||
else if (state.last && state.last > state.first && (new Date(state.last) - new Date(state.first)) < (100 * 24 * 3600 * 1000) )
|
||||
{
|
||||
d = new Date(state.last);
|
||||
d = app.calendar.date.end_of_week(d);
|
||||
}
|
||||
else if (!state.planner_days)
|
||||
{
|
||||
if (d.getUTCDate() < 15)
|
||||
{
|
||||
d.setUTCDate(0);
|
||||
d.setUTCMonth(d.getUTCMonth()+1);
|
||||
d = app.calendar.date.end_of_week(d);
|
||||
}
|
||||
else
|
||||
{
|
||||
d.setUTCMonth(d.getUTCMonth()+1);
|
||||
d = app.calendar.date.end_of_week(d);
|
||||
}
|
||||
}
|
||||
return d;
|
||||
},
|
||||
scroll: function(delta)
|
||||
|
||||
@ -843,7 +843,10 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
}
|
||||
|
||||
// Adjust header if there's a scrollbar
|
||||
this.gridHeader.css('margin-right', (this.rows.width() - this.rows.children().first().width()) + 'px')
|
||||
if(this.rows.children().first().length)
|
||||
{
|
||||
this.gridHeader.css('margin-right', (this.rows.width() - this.rows.children().first().width()) + 'px');
|
||||
}
|
||||
this.value = [];
|
||||
},
|
||||
|
||||
@ -893,23 +896,6 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
var title = app.calendar.egw.lang(date('F',start))+' '+date('Y',start)+' - '+
|
||||
app.calendar.egw.lang(date('F',end))+' '+date('Y',end);
|
||||
|
||||
// calculate date for navigation links
|
||||
var time = new Date(start);
|
||||
time.setUTCFullYear(time.getUTCFullYear()-1);
|
||||
var last_year = time.toJSON();
|
||||
time.setUTCMonth(time.getUTCMonth()+11);
|
||||
var last_month = time.toJSON();
|
||||
time.setUTCMonth(time.getUTCMonth()+2);
|
||||
var next_month = time.toJSON();
|
||||
time.setUTCMonth(time.getUTCMonth()+11);
|
||||
var next_year = time.toJSON();
|
||||
|
||||
title = this._scroll_button('first',last_year) +
|
||||
this._scroll_button('left', last_month) +
|
||||
title +
|
||||
this._scroll_button('right', next_month) +
|
||||
this._scroll_button('last', next_year);
|
||||
|
||||
content += '<div class="calendar_plannerMonthScale th et2_link" style="left: 0; width: 100%;">'+
|
||||
title+"</div>";
|
||||
content += "</div>"; // end of plannerScale
|
||||
@ -960,33 +946,6 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
if (days_in_month > 10)
|
||||
{
|
||||
title += ' '+t.getUTCFullYear();
|
||||
|
||||
// previous links
|
||||
var prev = new Date(t);
|
||||
prev.setUTCMonth(prev.getUTCMonth()-1);
|
||||
if(prev.valueOf() < start.valueOf() - (20 * 1000*3600*24))
|
||||
{
|
||||
var full = prev.toJSON();
|
||||
prev.setUTCDate(prev.getUTCDate() + 15);
|
||||
//prev.setUTCDate(start.getUTCDate() < 15 ? 1 : 15);
|
||||
var half = prev.toJSON();
|
||||
title = this._scroll_button('first',full) + this._scroll_button('left',half) + title;
|
||||
}
|
||||
|
||||
// show next scales, if there are less then 10 days in the next month or there is no next month
|
||||
var days_until_end = (end - t) / (1000 * 3600 * 24);
|
||||
if (days_until_end - days_in_month <= 10 || end.getUTCMonth() === t.getUTCMonth() && end.getUTCFullYear() === t.getUTCFullYear())
|
||||
{
|
||||
// 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);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
@ -1048,24 +1007,7 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
state.setUTCHours(0);
|
||||
state.setUTCMinutes(0);
|
||||
state = state.toJSON();
|
||||
if (days <= 7)
|
||||
{
|
||||
// prev. week
|
||||
var left = new Date(t);
|
||||
left.setUTCHours(0);
|
||||
left.setUTCMinutes(0);
|
||||
left.setUTCDate(left.getUTCDate() - 7);
|
||||
|
||||
// next week
|
||||
var right = new Date(t);
|
||||
right.setUTCHours(0);
|
||||
right.setUTCMinutes(0);
|
||||
right.setUTCDate(right.getUTCDate() + 7);
|
||||
|
||||
title = this._scroll_button('left',app.calendar.date.start_of_week(left).toJSON()) +
|
||||
title +
|
||||
this._scroll_button('right',app.calendar.date.start_of_week(right).toJSON());
|
||||
}
|
||||
if(days_in_week > 1)
|
||||
{
|
||||
content += '<div class="calendar_plannerWeekScale et2_clickable et2_link" data-date=\'' + state + '\' style="left: '+left+'%; width: '+week_width+'%;">'+title+"</div>";
|
||||
@ -1118,25 +1060,7 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
title = app.calendar.egw.lang(date('D',t)).substr(0,2)+'<br />'+date('j',t);
|
||||
}
|
||||
state = new Date(t.valueOf() - start.getTimezoneOffset() * 60 * 1000).toJSON();
|
||||
if (days < 5)
|
||||
{
|
||||
if (!i) // prev. day only for the first day
|
||||
{
|
||||
var prev = new Date(t);
|
||||
prev.setUTCDate(prev.getUTCDate() - 1);
|
||||
prev.setUTCHours(0);
|
||||
prev.setUTCMinutes(0);
|
||||
title = this._scroll_button('left',prev.toJSON()) + title;
|
||||
}
|
||||
if (i == days-1) // next day only for the last day
|
||||
{
|
||||
var next = new Date(t);
|
||||
next.setUTCDate(next.getUTCDate() + 1);
|
||||
next.setUTCHours(0);
|
||||
next.setUTCMinutes(0);
|
||||
title += this._scroll_button('right',next.toJSON());
|
||||
}
|
||||
}
|
||||
|
||||
content += '<div class="calendar_plannerDayScale et2_clickable et2_link '+ day_class+
|
||||
'" data-date=\'' + state +'\' style="left: '+left+'%; width: '+day_width+'%;"'+
|
||||
(holidays ? ' title="'+holidays.join(',')+'"' : '')+'>'+title+"</div>\n";
|
||||
@ -1190,15 +1114,6 @@ var et2_calendar_planner = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResize
|
||||
return content;
|
||||
},
|
||||
|
||||
/**
|
||||
* Create a pagination button, and inserts it
|
||||
*
|
||||
*/
|
||||
_scroll_button: function(image, date)
|
||||
{
|
||||
return '<img class="et2_clickable" src="' + egw.image(image)+ '" data-date="' + (date.toJSON ? date.toJSON():date) + '"/>';
|
||||
},
|
||||
|
||||
/**
|
||||
* Applies class for today, and any holidays for current day
|
||||
*
|
||||
|
||||
@ -40,14 +40,17 @@ Egroupware
|
||||
<select id="view" class="et2_fullWidth" onchange="app.calendar.update_state(JSON.parse(widget.getValue()));"/>
|
||||
<textbox id="keywords" class="et2_fullWidth" blur="Search" onchange="app.calendar.update_state({view: 'listview',keywords: widget.getValue()});return false;"/>
|
||||
<hbox id="date_header" class="et2_fullWidth">
|
||||
<buttononly id="header_today" label="Today" onclick="var tempDate = new Date();
|
||||
<buttononly id="header_today" label="Today" onclick="
|
||||
var tempDate = new Date();
|
||||
var today = new Date(tempDate.getFullYear(), tempDate.getMonth(), tempDate.getDate(),0,-tempDate.getTimezoneOffset(),0);
|
||||
app.calendar.update_state({date: today.toJSON()});return false;"/>
|
||||
<buttononly id="header_month" label="Month" onclick="var change = {date: widget.btn.attr('data-date')}; if(app.calendar.state.view == 'planner') { change.planner_days = 0;change.last=false;} else if ( app.calendar.state.view == 'listview') {change.filter='month';} else {change.view = 'month';}app.calendar.update_state(change);" />
|
||||
var change = {date: today.toJSON()};
|
||||
if(app.calendar.state.view == 'planner') { change.planner_days = Math.ceil((new Date(app.calendar.state.last) - new Date(app.calendar.state.first)) / (24*3600000));}
|
||||
app.calendar.update_state(change);return false;"/>
|
||||
<buttononly id="header_month" label="Month" onclick="var change = {date: widget.btn.attr('data-date')}; if(app.calendar.state.view == 'planner') { change.planner_days = 0;change.first=change.date;var d = new Date(change.date);d = new Date(d.getFullYear(),d.getUTCMonth() + 1, 0);change.last=d.toJSON();} else if ( app.calendar.state.view == 'listview') {change.filter='month';} else {change.view = 'month';}app.calendar.update_state(change);" />
|
||||
</hbox>
|
||||
<date id="date" class="et2_fullWidth" inline="true" onchange="var view_change = app.calendar.sidebox_changes_views.indexOf(app.calendar.state.view);
|
||||
var update = {date:widget.getValue()};
|
||||
if(view_change >= 0) {update.view = app.calendar.sidebox_changes_views[view_change ? view_change - 1 : view_change];} else if (app.calendar.state.view == 'listview') {update.filter = 'after';} app.calendar.update_state(update);"/>
|
||||
if(view_change >= 0) {update.view = app.calendar.sidebox_changes_views[view_change ? view_change - 1 : view_change];} else if (app.calendar.state.view == 'listview') {update.filter = 'after';} else if (app.calendar.state.view =='planner') { update.planner_days = 1; } app.calendar.update_state(update);"/>
|
||||
<textbox type="hidden" id="first"/>
|
||||
<textbox type="hidden" id="last"/>
|
||||
<select-cat id="cat_id" empty_label="All categories" width="86%" onchange="app.calendar.update_state({cat_id: widget.getValue()});" expand_multiple_rows="4"/>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user