Fullcalendar with disabled periods for drag'n'drop - fullcalendar

How can I configure fullcalendar with some periods disabled for drag'n'drop. For example I need to disable
from 2016-07-03 to 2016-07-07
from 2016-07-10 to 2016-07-15
from 2016-07-24 to 2016-07-26

Option 1. Create three events spanning from 2016-07-03 to 2016-07-07 etc. Use eventOverlap: to set a function that would prohibit events to overlap with these events.
Option 2. Create several events spanning all the permitted time. All the events must have the same ID - this is important. Then use eventConstraint with the event ID. This way, any user event must be fully contained within your dummy event, otherwise drag&drop will fail.
Option 3. Possibly the most reasonable solution. Use eventDrop and eventResize handlers to verify that the new event's start and end meet your constraints. If not, then call revertFunc() to return the events to their original state.
Example:
eventDrop: function(event, delta, revertFunc) {
if (event.start.isAfter('2016-07-03') &&
event.start.isBefore('2016-07-07') { //also add check for event.end
revertFunc();
}
}

Related

Changing user's response status for future events using Google Calendar API

I have a recurring event created in Google Calendar.
How can I accept all the future events ("this and following events") for a guest using Google Calendar API?
I found only examples where responseStatus was set for the entire event (all instances) or for a single instance.
I can't follow the solution from: https://developers.google.com/calendar/recurringevents#modifying_all_following_instances, because only event's creator is allowed to modify recurring rule of the original event - I have access only to guest's account.
Since you cannot update the recurrence rules of the main event, you can do the following instead:
Using the eventId of the recurring event, call Events: instances to list all the instances of the event.
Filter the returned instances according to their start and/or end dates, so that past events are removed from the list.
For each of the remaining events, call Events: patch in order to update the attendee's responseStatus, this status being:
The only event change that is propagated from attendees back to the organizer

switch fullcalendar options on window resize without destroy

we built a calendar using fullcalendar.io and have an issue on that.
If the container size gets smaller than 500px we want to reload the calendar using different options: the events should look a bit different, the click on events should behave different and so on. So we created the two different option sets and in the windowResize option we check, if the calendar should use the one or the other set. To force a re-init we use destroy:
windowResize: function(view) {
if(self.containerIsLarge()) {
self.$container.fullCalendar('destroy');
self.createLargeCalendar();
return;
}
},
Unfortunately we get some other issues then, that we are not really able to solve in a smart way (we work in an environment where there is an incompatible version of moment.js so we get trouble after destroying the calendar since it initializes with the incompatible moment.js and doesn't really work at all ...).
Is there a way to completely switch options and reload the calendar without destroying it before? I know about the on/off feature and the option setter but I didn't get it to work properly. Is this the correct way or did I miss something ... ?
Thanks in advance!
Regards
Manuel
Okay, after some hours of research I found a working solution.
1) remove all event callbacks that differ depending on the containers size (this is the alternative to 'destroy' I was looking for):
var calendar = self.$container.fullCalendar('getCalendar');
calendar.off('viewRender');
calendar.off('eventRender');
calendar.off('eventAfterAllRender');
calendar.off('eventClick');
calendar.off('eventLimitClick');
calendar.off('eventLimitText');
2) set all event callbacks and options needed now:
self.$container.fullCalendar('option', 'eventLimit', true);
calendar.on('viewRender', function (view, element) {
...
});
calendar.on('eventRender', function (event, element, view) {
...
});
calendar.on('eventLimitClick', function (cellInfo, jsEvent) {
...
});
...
3) trigger events and therefore run the new callback functions:
self.$container.fullCalendar('refetchEvents');
self.$container.fullCalendar('getView').triggerRender();
Regards
Manuel

how to limit edit events on dynamic form changes

I'm working on a form building app, and I use an event of type edit, each time updating the form in the DB.
But the problem is that my form builder auto saves each change which causes a lot of edit events to occur.
Is there a way to limit the edit events creation, like only consider the last change in the form as an edit event?
You want some underscore power.
var saveFunction = function(dataToSave) { ... },
debouncedSaved = _.debounce(saveFunction, 700);
In this example, debouncedSaved will only be eventually called if left idle for 700 milliseconds.
It should be easily adapted to your code, you can use debounced functions as event handlers since they're still classic functions.

How can I create a reactive meteor publication with a variable momentjs date

I'm having trouble with realizing a reactive publication with a moving date. I have a calendar app with events/meetings. Im displaying these events on a special view page but i only want to display events of today and only with a starting time of currenttime - 30 mins.
The code im having and trying always works fine on initial load, after refreshing and when I add/delete an event from an admin page (collection gets refreshed?). But when I leave the page open the events which have passed just stay on the page. Whenever I add/remove a event via the admin page the publication is updated just fine. I assume this is because the publication isn't refreshing the date in the query or something?
I have tried:
normal publications and just subscribing via either iron-router
before hook or via Deps.autorun
publish all events and filtering on the client side
a publication with observeChanges
keep the vars in a deps.autorun function and passing them via the subscription as parameters
but I just keep getting the same results.
publication with observeChanges:
Meteor.publish('currentEventsObserve', function(calId) {
var self = this;
var nowMin30mins = moment().subtract('minutes',30).valueOf();
var endOfToday = moment(moment().format('DD-MM-YYYY 23:59'), 'DD-MM-YYYY HH:mm').valueOf();
var handle = Events.find({
calId : calId, //CalendarId
eventDate: { $gt: nowMin30mins, $lt: endOfToday }
},
{
sort: { eventDate: 1 },
limit: 5
}).observeChanges({
added: function(id,event){
//console.log("added: ",id,event);
self.added("events", id, event);
},
removed: function (id,event) {
//console.log("removed: ",id,event);
self.removed("events", id);
}
});
self.ready();
self.onStop(function () {
handle.stop();
});
});
As said before: the above works fine on initial load and refreshes, but after leaving the page open for a while the events are staying on there and not being removed from the publication.
Also, whenever I check the collection ones certain events already should have been removed via Events.find().fetch() for example, the events are still there, so it's not the template which isn't updating correctly.
I hope it's clear what I mean. I have read many other questions about this sort of reactivity but I just can't figure it out.
The problem is that nowMin30mins is only computed once when the publication is activated, and won't update afterwards, even though you have an observeChanges on Events. You basically have two constant values (nowMin30mins and endOfToday) bracketing the documents that will be shown and only adding or removing items will cause them to disappear.
I can think of two ways for how you'd want to do this reactively.
You can put all the reactivity on the client. Just send the entire day's events over in a publish, which is very simple, and have the client filter out what's between 30 mins from now and the end of the day using Date.now() in a computation that updates every minute or so, or when new events are added/deleted. It doesn't seem to incur a lot of overhead to store those events anyway and you can offload the computational cost of observes, which can build up if you have a lot of clients
If you want to do it on the server, you'll have to do things a little more carefully than what you have now. Because the live query won't account for the change in time, you'll need to watch all of today's events and then add or remove them from the subscription if they are created, or deleted or go out of range, respectively. To reiterate, you can't do this purely with an observeChanges because the current time is always changing.

Event propagation in Qt

I've just the documentation on the Qt event system and the QEvent class. I'm interested in the behavior of the QObject::event() method. The documentation states:
This virtual function receives events to an object and should return true if the event e was recognized and processed.
What is the expected behavior when false is returned from the event() method? What else is attempted in order to handle the event? Is the event automatically forwarded to the parent object?
Note: I know the source is available, and I do have a copy. I'm ideally looking for some piece of documentation addressing this behavior.
I believe the best practice is to explicitly forward the events to the base-class event method if you do not wish to filter that event type (e.g. return QObject::event(event);) since the event function delegates events to specific handlers (e.g. QWidget::keyPressEvent).
QCoreApplication::notify propogates events based on the return value. On true, it considers the event as consumed and stops. Otherwise, the event is passed to the object's parent. For more information, see Events and Filters and Another Look at Events.
Some Events can be propagated.Event will be propagated to it's parent and it's parent recursively until it is processed. Take a look at this:https://doc.qt.io/archives/qq/qq11-events.html

Resources