Last updated on November 03, 2015

Widget: Event Calendar

Introduction

This widget displays user-defined calendar data in chronological order. The scheduled information can be presented in hour, day, week, or month format. It is commonly used for:

• Displaying the agenda of the current day/week/month for a specific event or location.
• Enabling easy, instant announcements on changes to events scheduled during a particular time-period.
• Sharing of new content and updates for rapid deployment to event participants/ viewers of the widget.

Click on the following for help with:

• Adding an Event Calendar Widget
• Configuring the Event Calendar Widget
• Integrating with External Data Sources
• Google Calendar Integration
• Microsoft Exchange 2007 - 2010 Integration

Adding an Event Calendar Widget

To add an Event Calendar widget to your Signs application, follow the instructions in the Adding Widgets section in the Managing Widgets article and select the Event Calendar widget in the Widget Library.

Configuring the Event Calendar Widget

To configure an event calendar widget’s properties, please follow the instructions below:

• Configuring PROPERTIES
• Configuring Additional Field Names
• Adding a New Event
• Editing or Deleting an Event

Configuring PROPERTIES

1. In your Signs application’s layout, click the Event Calendar widget name under the Widgets section.

2. In the Widget Properties window, configure the common tabs as per this article: Configuring Widget Properties.

3. In the Widget Properties window, click the APPEARANCE tab.

   
   
   

Edit the properties sections as per the following:

• Template: Preset layouts to display the event information.
• Resolution: The dimensions of the text.
• Context: The option to display events in the current hour, the current day, current week or current month.
• Preroll Time: How long before the start of an event will the event be displayed, expressed in minutes. For example if the event starts at 9am, specifying 30 minutes as Preroll Time means that the event will be displayed starting at 8.30am.
• No of Events: Number of events to display per page. If there are more events, the widget will cycle through all the events.
• Item Range: The total range of calendar items to display.
• No Event Msg: What message to display when there are no events scheduled in the calendar.
• Rotate Duration: Duration to display each page of calendar events.
• Show Past Event: The option of displaying past events.
• Filter Location: The ability to display events based on the location property. (Location names must not have spaces).
• FONT: Utilizes tabs for customizing the look of the calendar.
• EVENT and TIME: using a variety of formatting options, including font type, size, alignment and color.

Configuring Additional Field Names

Field names are additional configurable fields that can be used for event related information. For example, you can add ‘the number of people involved in an event’ as a field name. To add and configure field names:

1. In the Widget Properties window, click the CONFIGURATION tab.

   
   
   

2. In the Additional Fields section, input the field name and select a field type. Click the green tick to add.

   
   
   

   Repeat the step to add more fields.

3. Click the Save button.

   
   
   

   You will see a notification when the field name has been successfully saved.

   
   
   

4. To edit your field name, click the pencil button and make the necessary changes.

   
   
   

5. This field name will be available when adding a new event.

   
   
   

Adding a New Event

To add an event to the calendar widget:

1. In the Widget Properties window, click the CONTENT tab.

2. Click Add New Event.

   
   
   

3. Fill in your event details and click Apply to save. You can choose to add another event by clicking the Apply & Add Another button.

   
   
   

Editing or Deleting an Event

To edit or delete an event:

1. In the Widget Properties window, click the CONTENT tab.

2. Select the event to be edited or deleted from the calendar.

   
   
   

3. To edit the event, make your changes to any field and click Apply.

   
   
   

4. To delete the event, click Delete followed by OK when the confirmation window pops up.

   
   
   

Integrating with External Data Sources

You can integrate the Event Calendar Widget with external data sources such as Microsoft Exchange and Google Mail. Event calendar maps the calendar data sources to its internal representation of calendar data as illustrated in the following diagram.

• Google Calendar Integration
• Microsoft Exchange 2007 - 2010 Integration

Google Calendar Integration

To integrate Google Calendar with the Event Calendar widget, follow the instructions below.

Enable Google API

1. Login to https://console.developers.google.com using your Gmail credentials.

   
   
   

2. Create a new project by clicking the Create Project button.

   
   
   

3. Give the project a name, accept the EULA and click the Create button.

   
   
   

4. After selecting your newly created project, select the APIs link under the ‘APIs & auth’ section.

   
   
   

5. A list of available APIs will be displayed. Search for Calendar in the search bar.

   
   
   

6. Click Enable API.

   
   
   

7. Click the Credentials tab and proceed to create a new Client ID.

   
   
   

8. Before you create a client ID, you may be required to configure a consent screen. To do so, click Configure consent screen.

   
   
   

   • Select your email address and add in your Product name. Click Save.

     
     
     

   • You will be returned to the previous page and you can proceed to create a client ID. From the Credentials tab, click Create new Client ID.

     
     
     

9. Select Web application as the application type, key in your Javascript Origin (Appspace server URL) and authorised redirect URI as shown. Click Create Client ID when finished. Note that the URLs shown are merely examples.

   
   
   

   Tip

   URL formats:

   • Authorised Javascript Origin – http://{server URL}, if you’re using Appspace Cloud, please use https://nc01.appspace.com, https://nv01.appspace.com or https://app1.appspace.com
   • Authorised Redirect URI – http://{server URL}/app/application-widget-properties.aspx

10. Take note of the Client ID and Client Secret. You will need to add this to the Appspace server’s configuration.

    
    
    

Configure Event Calendar for Google Calendar

1. In the Widget Properties window, click the CONFIGURATION tab.

   
   
   

2. In the Type drop-down menu, select Google Calendar as your provider type.

   
   
   

3. Fill in the Google Username, Client ID, and Client Secret. You would have obtained the client ID and secret from the previous section.

   
   
   

4. Proceed to set the Time Display, Time Zone and Frequency fields.

5. Click Save on the top right. You will see a notification when the configuration has been successfully saved.

   
   
   

   Note

   Minimum frequency setting is 15 minutes.

Microsoft Exchange 2007 - 2010 Integration

To integrate Microsoft Exchange 2007 - 2010 with the Event Calendar widget, follow the instructions below.

Configure Event Calendar for Microsoft Exchange

1. In the Widget Properties window, click the CONFIGURATION tab.

   
   
   

2. In the Type drop-down menu, select Exchange 2007 - 2010 as your provider type.

   
   
   

3. Fill in the Exchange URL, username and password.

   
   
   

4. Additionally, you can also add a room calendar to retrieve events from.

   
   
   

5. Proceed to set the Time Display, Time Zone, Frequency and Look Ahead fields.

6. Click Save on the top right. You will see a notification when the configuration has been successfully saved.