Skip to main content
  • Subscribe by RSS
  • Ex Libris Knowledge Center

    Feature Focus – My Calendar

    campusM + cmLibrary Logo wh bkg sm1.png

    With React Native, we have taken the opportunity to completely redesign the calendar function within campusM, given that this is the most used feature across our customers. Taking design cues from what students are used to, we have created a calendar experience that intuitively presents schedule information across multiple calendar feeds in one place.

    Calendar Interface

    The calendar interface shows the end-user's scheduled activities for a selected day. The label of each activity includes information about the activity, the feed to which it belongs, and its start and end times. Selecting an activity opens the Activity Details page.

    Scheduled activities appear in the calendar color-coded to indicate the feed to which they belong, such as a course timetable or an event product integrations. Events from event feeds are included in the calendar only if the end-user either registered for them or tagged them as favorites. Events tagged as favorites are marked with a Heart icon (Heart icon.). Favorites for which the end-user did not register appear in the calendar with a lighter background color than events for which they did register.

    End-users can easily open the calendar from any location in the app by selecting the Calendar button (Calendar Icon sm.png) in the menu bar at the bottom of the screen.

    By default, the Calendar button appears in the menu bar for all customers who have active timetables and/or event product integrations. Customers who do not have any active timetables, but do have event product integrations, or who do not have any event product integrations nor any CAL endpoints, can have the Calendar button removed if they wish. To do so, open a support ticket, and request that the Show events from other sources in calendar feature flag be disabled (in App Settings > Feature statuses).

    The following image illustrates many of the calendar interface's features:

    Calendar page in week view, showing a day that is not the current day, with a course, a registered event, and an unregistered favorite event scheduled in it.

    Calendar Page (Day View)
    1. Last Refresh Date & Time – The date and time at which the timetable data was last updated on the device. Tap this message to update the timetable data (see Refreshing the Calendar, below).
    2. Go to Today Button – Select this button to display the calendar for the current day.
    3. View Button – Select this button to switch from Day view to Agenda view (see Day and Agenda Views, below). 
    4. Date Display and Selection Region – Shows the currently selected date, either within its week or within its month, depending on the selected view (see #8 below). Select a different date to view its calendar. If the desired date is not currently displayed, drag the date area down/up for the previous/next week (of the selected month) or right/left to display the previous/next month. When the first week of the month is visible, drag down on it to refresh the timetable data (see Refreshing the Calendar, below).
    5. Date of Displayed Calendar – If a date other than the current date is selected, the blue highlight indicates the currently selected date. 
    6. Current Date – The black highlight indicates the current date.
    7. Calendar Selector – Customers can deploy multiple calendar feeds to populate end-users' calendar. Each feed is provided with a configurable name and a color. The end-user can view all calendars in a blended view or filter to individual calendar views by selecting the calender name. To view only future events from event product integrations, the end-user can select Upcoming events. Note that days with activities in a currently displayed calendar feed have color-coded dots for each type of activity scheduled on that day.
    8. View Selector – In week view, drag the selector down to open the month view; in month view, drag the selector up to switch to week view.
    9. Calendar Event – An event summary is shown in the calendar view. The color identifies the calendar feed containing the event. A Heart icon (Heart icon.) indicates that the event was selected by the end-user as a favorite. Selecting an event opens the event's Details screen.
    10. Favorite Event – Unregistered events that were tagged as favorites by the end-user appear in the calendar with a lighter background.

    Day and Agenda Views

    End users can choose from two calendar views:

    • Day view – The schedule for the day is displayed as a grid in which each row represents an hour, and the height of each activity indicates its duration. Times for which no activities are scheduled appear in this view as blank rows. Activities that have start times but no specified end times occupy one hour in the calendar display.  Long-pressing the activity opens its full label in the Details Drawer at the bottom of the screen (see Day View – Additional Features, below).
    • Agenda view – The schedule for the day is displayed as a list of activities, presented as equal-sized rectangles, each of which represents a single activity, regardless of its duration. Times for which no activities are scheduled do not appear in this view.

    Calendar in Day View.

    Calendar in Day View

    Calendar in Agenda View.

    Calendar in Agenda View
    To switch between calendar views:
    • To switch from Day view to Agenda view, select Switch from Day View to Agenda View button..
    • To switch from Agenda view to Day view, select Switch from Agenda view to Day View button.

    Day View – Additional Features 

    Certain additional calendar-display features are available in Day view, as show in the following illustration:

    Calendar in Day view with an Activity selected and the Details Drawer of the activity open.

    Current Time Marker and Details Drawer in the Calendar
    1. Highlighted Activity – Long-pressing an activity highlights it and opens the Details Drawer (#3) at the bottom of the screen.
    2. Current Time Marker – When the schedule for the current date is displayed, a marker provides a visual indication of the current time.
    3. Details Drawer – When an activity is highlighted, displays its full label.

    Refreshing the Calendar

    End-users can employ any of the following methods in order to update the schedules of activities in their calendars:

    1. Tap the Updated... line at the top of the calendar
    2. When the first week of the month is visible in the calendar area (above the schedule of the selected day; in Week or Month view) drag down from the row of that week in the calendar area.
    3. Drag in the schedule area:
      • In Day view – When 12:00 AM is visible at the top of the timeline, drag down from the 12:00 AM row.
      • In Agenda view – When the first activity of the day is visible, drag down from it.

    Locations of Calendar Refresh Options.

    Calendar Refresh Options 

    Activity Details Page

    Selecting an activity in the calendar opens the Activity Details page of the activity. Exactly how this page looks varies depending on the type of feed and the configuration of the activity. The following are examples of an Activity Details page for a scheduled class and an Activity Details page for a scheduled event from an event PI.

    Activity Details page for a class, including information about the course and location, a map, and useful links.

    Activity Details Page of a Class
    1. Course name
    2. Lecturer name
    3. Link to lecturer email
    4. Link to open the campusM Position page of the event
    5. Map showing the location of the event; select the map to open the device's map app and show the location of the event on it
    6. Link to online event

    Activity Details page of an Event, including a picture and information about the event.

    Activity Details Page of an Event
    1. Event Name
    2. Tags indicating if the end-user is registered for the event and if they marked the event as a favorite (the latter not shown)
    3. Tag indicating the tag of the event 

    Day View Tile

    The Day View tile shows end-users their next activity of the day, taking the information from the new calendar, so that it includes information from timetables and other event PI feeds. Events for which the end-user registered appear in the Day View tile, but unregistered events that were tagged as favorites do not. Selecting the tile opens the calendar with the activity displayed.

    • If you add a Day View tile to your app, and the app already has a Timetable tile, it is recommended to remove the Timetable tile, because it essentially serves the same purpose as the Day View tile.
    • Although the Day View tile can be added to the Web app, it is not recommended to do so at this time, because the Web-app does not yet support the React Native calendar, so activities may appear in the Day View tile that do not appear in the calendar.

    Day View Tile Showing an Upcoming Activity

    When the end-user has at least one remaining activity scheduled for the day, information about the next upcoming activity appears in the tile with a solid-color background. The color of the background can be configured in the tile's settings, so it can match your institution's standard color-scheme. 
    Day View Tile with a solid-color background, showing the end-user's next upcoming activity of the day.
    Day View Tile When There Is an Upcoming Activity

    Day View Tile When No Activities Are Upcoming

    When the end-user has no remaining activities scheduled for the day, the tile appears with a standard background image and message. Several versions of the background image, employing different color-schemes to better match the institution's standard color-scheme, are available for selection in the tile's configuration. A default message – “You have no more activities today!” – is defined, but this message can be changed, as required. 

    Day View Tile with no activities and the default background image.

    Day View Tile with No Activities and the Background Image in Its Default Colors

    Day View Tile with no activities and the light-grey version of the background image.

    Day View Tile with No Activities and the Light-Grey Version of the Background Image

    Adding and Configuring a Day View Tile

    You can add a Day View tile from the App Manager, in the App Builder. In the Create New Menu Option dialog box, in the first field, select Smart Tile, and in the second field, select Day View. In the third field, enter a title for the tile. For additional information about working with the App Builder, see Creating Services.

    Creating a Day View Tile.

    Creating a Day View Tile

    Default values are defined for all of the tile's settings. If you want to customize any of the settings, you can do so in the Tile Config section, as follows:

    • Background Color – The background color of the tile when information about an upcoming event is displayed in it
    • Add Image Color Theme – The color-scheme of the background image that appears in the tile when there are no upcoming events
    • Greeting – The greeting that appears at the top of the tile
    • Main Message – The message that appears when information about an upcoming event is displayed in the tile
    • No Activities Message – The message that appears when no additional activities are scheduled for the current day
    • Event Subheading – A message that appears in the tile when the next activity is an event for which the end-user registered; the message is displayed above the name of the event. (For timetable events, the calendar name is displayed in this location.) 

    To include the user's name in a message, insert this code: {{username}}.

    Customizing the Day View Tile in the App Builder.

    Customizing the Day View Tile
    • Was this article helpful?