Better handling of drag and drop between full day and times

This commit is contained in:
Nathan Gray 2015-11-10 18:35:24 +00:00
parent 5ca8aac1b5
commit fff964f307
5 changed files with 67 additions and 23 deletions

View File

@ -2627,7 +2627,7 @@ class calendar_uiforms extends calendar_ui
} }
else else
{ {
$duration = $durationT; $duration = (int)$durationT;
} }
// If we have a recuring event for a particular day, make an exception // If we have a recuring event for a particular day, make an exception
@ -2649,9 +2649,18 @@ class calendar_uiforms extends calendar_ui
} }
// Drag a whole day to a time // Drag a whole day to a time
if($event['whole_day'] && $durationT) if($duration && $durationT != 'whole_day')
{ {
$event['whole_day'] = false; $event['whole_day'] = ($duration == DAY_s);
$event['non_blocking'] = false;
// Whole day non blocking with DAY_s would add a day
if($duration==DAY_s) $duration=0;
}
// Drag a normal event to whole day non-blocking
else if ($durationT == 'whole_day')
{
$event['whole_day'] = true;
$event['non_blocking'] = true;
} }
$event['start'] = $this->bo->date2ts($targetDateTime); $event['start'] = $this->bo->date2ts($targetDateTime);

View File

@ -2256,7 +2256,8 @@ app.classes.calendar = AppJS.extend(
filter:'custom', // Must be custom to get start & end dates filter:'custom', // Must be custom to get start & end dates
status_filter: state.filter, status_filter: state.filter,
cat_id: state.cat_id, cat_id: state.cat_id,
search: state.keywords search: state.keywords,
csv_export: false
}); });
// Show ajax loader // Show ajax loader
framework.applications.calendar.sidemenuEntry.showAjaxLoader() framework.applications.calendar.sidemenuEntry.showAjaxLoader()

View File

@ -234,6 +234,9 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
jQuery.datepicker.formatDate('DD dd',formatDate); jQuery.datepicker.formatDate('DD dd',formatDate);
this.title.text(date_string) this.title.text(date_string)
.attr("data-date", new_date); .attr("data-date", new_date);
this.header
.attr('data-date',new_date)
.attr('data-whole_day',true);
// Avoid redrawing if date is the same // Avoid redrawing if date is the same
if(new_date === this.options.date && !force_redraw) if(new_date === this.options.date && !force_redraw)
@ -677,6 +680,7 @@ var et2_calendar_daycol = et2_valueWidget.extend([et2_IDetachedDOM],
} }
else else
{ {
columns[c][i].div.appendTo(this.div);
top = this._time_to_position(columns[c][i].options.value.start_m,whole_day_counter); top = this._time_to_position(columns[c][i].options.value.start_m,whole_day_counter);
height = this._time_to_position(columns[c][i].options.value.end_m,whole_day_counter)-top; height = this._time_to_position(columns[c][i].options.value.end_m,whole_day_counter)-top;
} }

View File

@ -441,7 +441,7 @@ var et2_calendar_event = et2_valueWidget.extend([et2_IDetachedDOM],
} }
else else
{ {
timespan = egw.lang('all day'); timespan = egw.lang('Whole day');
} }
} }
else else

View File

@ -286,7 +286,8 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
// Customize and override some draggable settings // Customize and override some draggable settings
this.div.on('dragcreate','.calendar_calEvent:not(.rowNoEdit)', function(event,ui) { this.div.on('dragcreate','.calendar_calEvent:not(.rowNoEdit)', function(event,ui) {
$j(this).draggable('option','cursorAt',false); // Act like you clicked the header, makes it easier to position
$j(this).draggable('option','cursorAt', {top: 5, left: 5});
}) })
.on('dragstart', '.calendar_calEvent', function(event,ui) { .on('dragstart', '.calendar_calEvent', function(event,ui) {
$j('.calendar_calEvent',ui.helper).width($j(this).width()) $j('.calendar_calEvent',ui.helper).width($j(this).width())
@ -304,6 +305,8 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
*/ */
_drag_helper: function(element, helper,height) _drag_helper: function(element, helper,height)
{ {
if(!element) return;
element.dropEnd = this._get_time_from_position(helper.getBoundingClientRect().left, element.dropEnd = this._get_time_from_position(helper.getBoundingClientRect().left,
helper.getBoundingClientRect().top+parseInt(height)); helper.getBoundingClientRect().top+parseInt(height));
@ -326,7 +329,14 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
{ {
this.scrolling.scrollTop(element.dropEnd.position().top); this.scrolling.scrollTop(element.dropEnd.position().top);
} }
var time = jQuery.datepicker.formatTime( var time = '';
if(this._drop_data.whole_day)
{
time = this.egw().lang('Whole day');
}
else
{
time = jQuery.datepicker.formatTime(
egw.preference("timeformat") == 12 ? "h:mmtt" : "HH:mm", egw.preference("timeformat") == 12 ? "h:mmtt" : "HH:mm",
{ {
hour: element.dropEnd.attr('data-hour'), hour: element.dropEnd.attr('data-hour'),
@ -336,6 +346,7 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
}, },
{"ampm": (egw.preference("timeformat") == "12")} {"ampm": (egw.preference("timeformat") == "12")}
); );
}
element.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+time+'</span></div>'; element.innerHTML = '<div style="font-size: 1.1em; text-align:center; font-weight: bold; height:100%;"><span class="calendar_timeDemo" >'+time+'</span></div>';
} }
else else
@ -370,8 +381,18 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
event_widget._parent.date_helper.set_year(drop_date.substring(0,4)); event_widget._parent.date_helper.set_year(drop_date.substring(0,4));
event_widget._parent.date_helper.set_month(drop_date.substring(4,6)); event_widget._parent.date_helper.set_month(drop_date.substring(4,6));
event_widget._parent.date_helper.set_date(drop_date.substring(6,8)); event_widget._parent.date_helper.set_date(drop_date.substring(6,8));
event_widget._parent.date_helper.set_hours(dropEnd.hour); // Make sure whole day events stay as whole day events by ignoring drop time
event_widget._parent.date_helper.set_minutes(dropEnd.minute); if(event_data.app == 'calendar' && event_widget.options.value.whole_day)
{
event_widget._parent.date_helper.set_hours(0);
event_widget._parent.date_helper.set_minutes(0)
}
else
{
// Non-whole day events, and integrated apps, can change
event_widget._parent.date_helper.set_hours(dropEnd.whole_day ? 0 : dropEnd.hour||0);
event_widget._parent.date_helper.set_minutes(dropEnd.whole_day ? 0 : dropEnd.minute||0);
}
event_widget.options.value.start = new Date(event_widget._parent.date_helper.getValue()); event_widget.options.value.start = new Date(event_widget._parent.date_helper.getValue());
// Leave the helper there until the update is done // Leave the helper there until the update is done
@ -390,21 +411,30 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
//Get infologID if in case if it's an integrated infolog event //Get infologID if in case if it's an integrated infolog event
if (event_data.app === 'infolog') if (event_data.app === 'infolog')
{ {
// Duration - infologs are always non-blocking
var duration = dropEnd.whole_day ? 86400-1 : (
event_widget.options.value.whole_day ? (egw().preference('defaultlength','calendar')*60) : false);
// If it is an integrated infolog event we need to edit infolog entry // If it is an integrated infolog event we need to edit infolog entry
egw().json('stylite_infolog_calendar_integration::ajax_moveInfologEvent', egw().json('stylite_infolog_calendar_integration::ajax_moveInfologEvent',
[event_data.id, event_widget.options.value.start||false], [event_data.id, event_widget.options.value.start||false,duration],
function() {loading.remove();} function() {loading.remove();}
).sendRequest(true); ).sendRequest(true);
} }
else else
{ {
//Edit calendar event //Edit calendar event
// Duration - check for whole day dropped on a time, change it to full day
var duration = event_widget.options.value.whole_day && dropEnd.hour ? 86400-1 : false;
// Event (whole day or not) dropped on whole day section, change to whole day non blocking
if(dropEnd.whole_day) duration = 'whole_day';
egw().json('calendar.calendar_uiforms.ajax_moveEvent', [ 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'),
// Check for whole day dragged to a certain time duration
event_widget.options.value.whole_day ? (egw().preference('defaultlength','calendar')*60) : false
], ],
function() { loading.remove();} function() { loading.remove();}
).sendRequest(true); ).sendRequest(true);
@ -1402,7 +1432,7 @@ var et2_calendar_timegrid = et2_valueWidget.extend([et2_IDetachedDOM, et2_IResiz
x = Math.round(x); x = Math.round(x);
y = Math.round(y); y = Math.round(y);
var nodes = $j('.calendar_calAddEvent[data-hour]',this.div).removeClass('drop-hover').filter(function() { var nodes = $j('.calendar_calAddEvent[data-hour],.calendar_calDayColHeader',this.div).removeClass('drop-hover').filter(function() {
var offset = $j(this).offset(); var offset = $j(this).offset();
var range={x:[offset.left,offset.left+$j(this).outerWidth()],y:[offset.top,offset.top+$j(this).outerHeight()]}; var range={x:[offset.left,offset.left+$j(this).outerWidth()],y:[offset.top,offset.top+$j(this).outerHeight()]};