Goal

Use Countdown ShortPoint to show how many days left for the upcoming event in SharePoint calendar.

Use Case

  • We have created calendar list called: Maintenance Schedule
  • This list contains the schedule for upcoming maintenance events.
  • We want to show how many days left for the upcoming maintenance event
Let's Start
Step 1: 
Prepare the Calendar List
  1. Create new calendar app in your site
  2. Create the following three columns


Column 1 

Name: Day

Type: Calculated (calculation based on other columns)

Formula: =DAY([Start Time])

Start Time is the event start time column


blob1477338607641.png


Column 2

Name: Month

Type: Calculated (calculation based on other columns)

Formula: =Month([Start Time])


blob1477338607611.png


Column 3

Name: Year

Type: Calculated (calculation based on other columns)

Formula: =CONCATENATE(YEAR([Start Time]))


blob1477338607629.png


Step 2: 

Create the new view

We need to create new view that will show one upcoming maintenance event
  1. Create new view
  2. Start from an existing view -  All Event
  3. Give the new view a name: Upcoming Maintenance Event
  4. Check the box next to the newly created columns: Day, Month and Year
  5. Sorting: sort by Start Time
  6. Filter: Start Time is greater than or equal to [Today]
  7. Item Limit: Set the value to be (1)
  8. Mobile: Set the value to be (1)

blob1477338775834.png


blob1477338775845.png

Step 3: 

Add new events for testing

Add two upcoming events and one old even


blob1477338832997.png


blob1477338832982.png


Step 4: 

Add Countdown ShortPoint

It's time to see the work in action


  1. Edit any page
  2. Add Countdown ShortPoint
  3. Open Connect tab
  4. Connect to the new calendar list
  5. Choose the newly created view
  6. Open settings tab
  7. Map Countdown Day with Day Column
  8. Map Countdown Month with Month Column
  9. Map Countdown Year with Year Column





blob1477338700529.png


Results:
Countdown ShortPoint will be displayed and it will show how many days left for the upcoming maintenance schedule.

blob1477338899663.gif

How about we show at the top of the calendar a dynamic text that will display the upcoming maintenance event Title?

At the top of countdown shortpoint, insert new ShortPoint and select Templates
Connect the Templates to the same calendar and view

blob1477339452953.png


In the Templates Item, add the Event Title with any text you like

blob1477339461487.png


Insert to the page

blob1477339475215.png



New Results:

blob1477339487540.png