Can anybody tell me which fullcalendar event callback should I use To handle the case where : the current external event stopped dragging and it's localised not over the external events Box neither over The Calendar?
knowing that I have both methods isEventOverDiv //return true/false if we are (not) over the external events and isEventOverDivCal//return true/false if we are (not) over the calendar
I tried in eventDragStop: function (event, jsEvent, ui, view)
eventDragStop: function (event, jsEvent, ui, view){
// if the event is not over the external events box and neither over the calendar
if(!isEventOverDiv(jsEvent.clientX, jsEvent.clientY) && !isEventOverDivCal(jsEvent.clientX, jsEvent.clientY) ) {
// reset
var reccupuredIndexForTitle=$(this).attr('id');
$scope.ctrlendDragging(reccupuredIndexForTitle);
}
}
//return true if we are over the external events
var isEventOverDiv = function (x, y) {
var external_events = $('#external-events');
var offset = external_events.offset();
offset.right = external_events.width() + offset.left;
offset.bottom = external_events.height() + offset.top;
// Compare
if (x >= offset.left &&
y >= offset.top &&
x <= offset.right &&
y <= offset.bottom) {return true;}
return false;
};
//return true if we are over the calendar
var isEventOverDivCal = function(x, y) {
var external_events = $( '#calendar' );
var offset = external_events.offset();
offset.right = external_events.width() + offset.left;
offset.bottom = external_events.height() + offset.top;
// Compare
if (x >= offset.left
&& y >= offset.top
&& x <= offset.right
&& y <= offset .bottom) { return true;}
return false;
}
but it's not working.
update 2
in order to overcome the obstacle of putting events above the virtual scroll bar during their trip into the calendar
1- I apply from mycontroller $scope.ctrlstartDragging (which triggers from the HTML view on ondragstart="angular.element(this).scope().ctrlstartDragging(id)" callback).
$scope.ctrlstartDragging = function(id) {
var book = document.getElementById(id);
var domRect = absolutePosition(book);
book.style.position = 'fixed';
book.style.top = domRect.top + 'px';
book.style.left = domRect.left + 'px';
book.style.width=(domRect.width) + 'px';
};
and to be able to unset css styles (position top left width)
(N.B: ondragend="angular.element(this).scope().ctrlendDragging(id)" callback)
is not fired and I don't know why but it's not a problematic in my case)
so the purpose is that I should call manually
$scope.ctrlendDragging = function(id) {
var book = document.getElementById(id);
book.style.position = 'relative';
book.style.top = 'unset';
book.style.left = 'unset';
book.style.width='unset';
};
and to do as I said, in case the user aborts to put the event on the calendar during the dragging and this event is positioned both outside the external event box and outside the calendar.
but in my case see MyPlunk I need when the revert is applied , I will need during the revert of this event to the external event box to do make a call to it with the folloiwing
// reset
var reccupuredIndexForTitle=$(this).attr('id');
$scope.ctrlendDragging(reccupuredIndexForTitle);
so I need when the revert is applied I sould apply those two lines because if they are not applied when an user abort a dragging into the calendar the event revert but without the unset css styles applied to .style.position top left width I would get an one isolated external event on the top of the external events box like shown below:
Many thanks.
