Add meeting invite to Calendar

Feb 06, 2024

I'm wanting to add Teams meetings into my Story for participants to attend, and I'm trying to find a way where the participants can add the meeting invite into their calendar.

I believe there might be a way to do this with Javascript, however I'm not familiar enough with Javascript to get the right code.

Otherwise, if there's another way to do this, I'm all ears!

3 Replies

Cary Jenkins

3 months ago02/16/24 at 5:17 pm (UTC)

Georgia Arrowsmith

I'm wanting to add Teams meetings into my Story for participants to attend, and I'm trying to find a way where the participants can add the meeting invite into their gwinnett county school calendar.

I believe there might be a way to do this with Javascript, however I'm not familiar enough with Javascript to get the right code.

Otherwise, if there's another way to do this, I'm all ears!

You can indeed create a feature to add Teams meetings to participants' calendars using JavaScript. One approach is to generate an iCalendar (.ics) file dynamically on your server and provide a link for participants to download it. When they click the link, their browser will prompt them to open or download the .ics file, which can then be imported into their calendar application.

Here's a basic example of how you can generate an .ics file dynamically in JavaScript:

javascript

function generateICS(meetingDetails) {
    const { title, description, location, startDate, endDate } = meetingDetails;
    
    const startDateUTCString = startDate.toISOString().replace(/-/g, '').replace(/:/g, '').slice(0, -5) + 'Z';
    const endDateUTCString = endDate.toISOString().replace(/-/g, '').replace(/:/g, '').slice(0, -5) + 'Z';
    
    const icsContent = `BEGIN:VCALENDAR
VERSION:2.0
PRODID:-//Company//Product//EN
BEGIN:VEVENT
UID:${generateUID()}
DTSTAMP:${startDateUTCString}
DTSTART:${startDateUTCString}
DTEND:${endDateUTCString}
SUMMARY:${title}
DESCRIPTION:${description}
LOCATION:${location}
END:VEVENT
END:VCALENDAR`;

    return icsContent;
}

function generateUID() {
    // Generate a unique ID for the event
    // You can use any method to generate a unique ID here
    return 'your-unique-id';
}

// Example usage:
const meetingDetails = {
    title: 'Team Meeting',
    description: 'Discuss project updates',
    location: 'Teams Meeting',
    startDate: new Date('2024-02-16T09:00:00'),
    endDate: new Date('2024-02-16T10:00:00')
};

const icsContent = generateICS(meetingDetails);
const blob = new Blob([icsContent], { type: 'text/calendar;charset=utf-8' });
const url = window.URL.createObjectURL(blob);

// Create a link for participants to download the .ics file
const link = document.createElement('a');
link.href = url;
link.download = 'team_meeting.ics';
link.click();

This code will generate an .ics file for the given meeting details and initiate a download for the participant. They can then import this file into their calendar application.

Daniel Kemp

3 months ago02/19/24 at 5:08 pm (UTC)

Thanks Cary!! I have also been looking for something like this. 😊

I was wondering if there was a way for the Start date to automatically populate with the current date?

I am using the below JavaScript to generate the date within one of my courses:

let currentTime = new Date();
let month = currentTime.getMonth() + 1;
let day = currentTime.getDate();
let year = currentTime.getFullYear();

// Putting it together
let dateString = month + "/" + day + "/" + year;

//Pushing data to Storyline
let player = GetPlayer();
player.SetVar("CurrentDate", dateString);
player.SetVar("month", month);

Also, and I don’t mean to complicate things but is there also a way to add 2 years to the current date?

We have a course that External contractors need to take and the training expires after 2 years. I would like for them to have the option to add a calendar reminder of when the training has expired.

Thanks again, I know that this question was from someone else but as I said I also looking for something like this.

Daniel Kemp

3 months ago02/21/24 at 8:14 pm (UTC)

After hours of trial and error I finally figured out how to add days to the current day!!

Please see my updates to your above JS code below:

startDate: new Date(new Date().getTime()+(730*24*60*60*1000)),
endDate: new Date(new Date().getTime()+(730*24*60*60*1000))

The above is adding 2 years to the current date (730).