All day events to be "busy" by default - google-calendar-api

I want my all day events in google calendar to be set as busy by default. How does one do that? Currently, when I have an "all day event" I am shown as available and I have to change it manually. How do I make it busy by default?
I am shown busy by default only when there is specific time set up. This looks all sorts of backwards to me!

You can achieve the functionality you are describing by using Apps Script.
You can make use of the Calendar Service to create a script and set the transparency property for the events from today to "opaque".
According to the documentation:
transparency - Whether the event blocks time on the calendar. Optional. Possible values are:
"opaque" - Default value. The event does block time on the calendar. This is equivalent to setting Show me as to Busy in the Calendar UI.
"transparent" - The event does not block time on the calendar. This is equivalent to setting Show me as to Available in the Calendar UI.
And in order to call this script, you can create a time-driven trigger which will run every day, something similar to this:
function createTrigger() {
ScriptApp.newTrigger("busyEvents")
.timeBased()
.atHour(12)
.everyDays(1)
.create();
}
Calendar API Events:update;
Apps Script Installable Triggers.

Related

GTM Triggers Events x10 despite only a single click

I ran into this inconsistent behavior on my Gatsby site I have GTM set up to track events for GA4.
Here's my code
<button onClick={(e) => {
e.preventDefault();
window.dataLayer.push({
event: 'get_case_info'
});
}}>
See Info
</button>
And my tag and trigger settings:
It will get triggered a total of 11 times each time I click. What's more odd is that if I change the event name and set the trigger to occur on the changed name (see_case) then it only gets triggered once per click. It's odd because other events don't get triggered another 10 times on top of the initial event despite have the same setup of keeping a consistent name throughout the dataLayer event and Google Analytics event name.
I found the issue. According to the docs you do not need to create the Custom Event in GA4 as well. The Custom Events are designed to trigger when a condition is met a lot like GTM. Say you want to record a conversion based on Purchases made in the US. You would create a new custom event called "US Purchases" then add the conditions for event_name equals 'purchase' and currency equals 'USD'. I assume the 10x was an infinite loop that Google added a limit to. My set up is correct with the data layer push going to the trigger then finally sending the event name to GA4.
The only thing you would need to add in GA4 was if you added some custom parameters to the event like so:
window.dataLayer.push({
event: 'get_case_info',
caseNumber: 1234
})
You would set up the custom parameters to get tracked via the custom dimensions set up.

how do i remove holidays from timeline view of FullCalendar.js

I want to find a way to remove some days from the timeline view of full calendar because they are company holidays. like removing the 4th of July, memorial day etc. how do I do this?
It's not possible to entirely remove them from the display via the API unfortunately, but you can easily mark them as unavailable or whatever - perhaps by using a feed of Background Events, with one event for each holiday. You can maybe generate them from your server, or there are public calendars online containing the official holidays of different countries, which you might be able to use as the source.
A background event is the same as a regular event, except its display mode is changed - for example:
{
start: '2022-06-01T10:00:00',
end: '2022-06-01T16:00:00',
display: 'background'
}
If you additionally want to stop people creating events on those dates, or dragging events onto those dates, that can be controlled through the appropriate options / callbacks - there are examples in the fullCalendar documentation, such as this one which will prevent a user creating a new event on top of a background event:
selectOverlap: function(event) {
return event.rendering === 'background';
}
References:
https://fullcalendar.io/docs/background-events
https://fullcalendar.io/docs/selectOverlap
https://fullcalendar.io/docs/eventOverlap

Show all-day events as a background color

Is there a way to show certain events in my calendar as full background blocks of color? For example, if an event is an all-day event, it's date square will have a background color of red. All other events will look like normal events.
(Im using FullCalendar synched to a google calendar)
To make an event appear as a full block of colour within its slot the way you described, you can use the "background" events feature. Since you're using Google Calendar and don't have full control over the JSON data provided, you'll have to add the necessary property via the eventDataTransform callback, which allows modification of the event data after it's been downloaded but before it's rendered onto the calendar. Something like this I think (as an option in your calendar config):
eventDataTransform: function(event)
{
if (event.allDay == true) event.rendering = "background";
return event;
}
See https://fullcalendar.io/docs/eventDataTransform and https://fullcalendar.io/docs/background-events for details.
use rendering: 'background' in events

FullCalendar (1.6) difficulty updating existing event on calendar with renderEvent

I'm using an older version of fullCalendar (1.6.4) with mostly success. I've got a UI that has the ability to add new events to the calendar, and then edit them inline. I'm running into problems when I try to then update the calendar with the modified event object. I'm only running into this problem however with dynamically added events, I can apparently reload the page and update events that fullCalendar adds initially just fine.
The problem seems very related to how the event.source property works. When the property is null on the event, fullCalendar pushes a new instance of the event onto the "cache" object, even if the event otherwise exists on the calendar already. I'm not sure why or how this works. For whatever reason though, I then end up with duplicate instances of the event on the calendar day.
// code directly from fullCalendar 1.6.4
function renderEvent(event, stick) {
console.log('renderEvent',event)
normalizeEvent(event);
if (!event.source) {
if (stick) {
stickySource.events.push(event);
event.source = stickySource;
}
cache.push(event);
}
reportEvents(cache);
}
So, in cases that are a pure edit of an existing calendar item, I make sure the source value is set and not lost/nulled anywhere. Even if worst case it does the below and sets it to an empty object. (Note, this may be a cause of my problems, I just don't know enough about full calendar). Sometimes I even have to force it to be {}, otherwise it has multiple items in source and I again end up with duplicate calendar entries after updating.
calEvent.source = calEvent.source ? calEvent.source : {};
I then update my existing calendar with a call to renderEvent.
$('#calendar').fullCalendar( 'renderEvent', calEvent, true);
Unfortunately, I'm running into the case where the new calEvent sent to renderEvent is updated, and it does not update the instance on the calendar. This may be because of the source field? And it only happens for newly dynamically added events.
Can someone assist about how to properly edit events? And how this source field should properly be used.

re-draw fullCalendar on the fly

I want the fullCalendar to redraw itself (all the structure and events) without reloading the page.
Scenario:
I am using a patch of fullCalendar that supports the Resource View. For a few user actions I want to change the resources. But I don't want to reload the page.
You could 'destroy' and 'render' the calendar as a whole. But that might be cumbersome - especially in older browsers.
$('#calendar').fullCalendar('destroy');
$('#calendar').fullCalendar('render');
If you don't actually need to render the table, but just rerender the events again, you could use the 'rerenderEvents' method:
$('#calendar').fullCalendar('rerenderEvents');
Hopefully this helps!
Use refetchResources: .fullCalendar( 'refetchResources' )
This will fetch and freshly re-render the resource data, per the FullCalendar documentation.
The problem:
"...The problem is that the calendar is initialized while the modal or div is not visible... " based on this link enter link description here
In my opinion, destroy is not needed in this case, only with render you can see the calendar.
My solution:
<script type="text/javascript">
$('#objectname').show(0,onObjectShow);
function onObjectShow(){$('#calendar').fullCalendar('render');}
</script>
You must to be sure that the object(container of calendar) is fully visible. For example, my first mistake was to put this code on "onClick" event, and click event is triggered before show the object container and has no effect.
Solution Based on this reference.
You can also redraw calendar on the fly using below command-
$(window).trigger("resize");

Resources