Creating New Appointment Types

To create a new type of appointment in Diary Planner you'll need to create a new booking form and article, a new appointment Slot Type Template to define the appointment, set up new appointment configuration End Points, and set up the availability of the appointment in the Slot Book Template calendars.

This article assumes you have set up your Diary Planner installation in the same way as the Example Installation

Create the Booking Form

You don't have to create a new form for every type of appointment, it is possible to use the same form for all of them. If you'd like to create a custom form for booking your new appointment type:

1. In the forms library find the "Diary Planner Blue Print - appointment" form
2. Right-click and choose "Create a form using..."
3. Your form name must begin SBCHAINED - this enables the system to find your form when setting up the Slot Type articles
4. When the form opens click on the Properties tab and change the parent group to one of your own
5. Add any new fields and pages to your form - see the sections at the bottom of this article
6. Save and publish your form

Create the Appointment Article

Every type of appointment needs a corresponding article using the Slot Type Template.

1. Create an article using the Slot Type template in the "Appointment Types" section of your application
2. Set the article heading as the name of your appointment
3. Complete the article extras following the guidance in the Slot Type template article
   • The "gather data" form is the form you created above (or you can use the default one)
   • Set the CTM Template to Default
   • Set the CTM application to Diary Planner Example
   • Set lookaheads enabled to Yes
4. Click submit article

Make a note of the article ID, you will need it when configuring the appointment configuration End Point.

Create the Appointment Configuration End Point

1. In the End Point library find the Diary Planner configuration for the current environment (eg prod, test or dev)
2. Right click on your application group and create a new group named after your appointment
3. Copy the config.example.DiaryPlanner.ExampleApplication.ExampleAppointment.getConfig End Point and on the Properties tab, move it into your new appointment group
4. Open the script tab set the appointmentTypeArticleId to the article ID of your appointment Slot Type article created above
5. Publish your End Point

Setup Appointment Availability

1. Find the calendar (Slot Book Template article) you'd like your new appointment to be booked into
2. On the Extra tab find the "Slot Type and Availability" section and set which days you want the appointment to be available on

Create Public Booking Article

Each type of appointment needs its own booking article. Booking articles use the "Forms Service - Diary Planner Appointment" template. In the article extras of this template, pick the application and appointment type - this is how the booking form looks up the correct configuration for the appointment.

1. Create an article using the Forms Service - Diary Planner Appointment template
2. On the extras tab
   1. Select your application from the drop down
   2. Select your appointment from the drop down
3. Relate your booking form
4. Publish the article

Adding custom fields and pages to your booking form

You are now ready to customise your form to have the exact fields and behaviour that you want. The following field should not be removed or renamed.

These fields can be moved to other pages in the form but your will have to update all references within the form to target the new location.

Adding a field

1. Add the field that you require and set any required validation and handler logic
2. Navigate to the Check Your Answers page and select the field CYA
3. Click on the edit handlebars button on the template property
4. Navigate in the template to the page that has your field
5. Copy an existing section
6. Update to have the label you want
7. Update the {{FIELD "***"}} to reference your new field
8. Select your new entry and press CTRL + C to make it available for pasting
9. Save your changes
10. Click on the Form settings tab in the bottom right hand corner of the Forms Designer
11. Scroll until you see the Custom Read Only Property
12. Click on the edit handlebars button on this property
13. Navigate in the template to the page that has your field
14. Use CTRL + P to paste in the code for displaying your field
15. Save your changes
16. Repeat the above to add any additional fields that you require

Adding a new Page

1. Open your appointment form
2. Add your new page, it must be before the Select Appointment Page
3. Drag on the New Diary Planner Appointment Page snippet
4. Open the Check your answers page
5. Navigate to the Check Your Answers page and select the field CYA
6.  Click on the edit handlebars button on the template property
7. Navigate in the template to the location of where you want your new page's details displayed
8. Add the following section for your new page

<h2></h2>
<table class="icmformdatapagetable">
    <tbody>
        <tr>
            <td colspan="2" class="icmformdatacontainer">YOUR PAGE NAME</td>
        </tr>
    </tbody>
</table>
{{#if this.editButtons.otherButtons}}
    {{SCRIPTBUTTON name="selectAppointment" label="Edit" data="YOURPAGE" onClick="editPage"}}
{{/if}}

9. Replace YOUR PAGE NAME with the display name for your new page
10. Replace  YOURPAGE with the name of the page
11. Save your changes
12. Click on the Form settings tab in the bottom right hand corner of the Forms Designer
13. Scroll until you see the Custom Read Only Property
14. Click on the edit handlebars button on this property
15. Navigate in the template to where you want your page displayed
16. Add the following section

<h2></h2>
<table class="icmformdatapagetable">
    <tbody>
        <tr>
            <td colspan="2" class="icmformdatacontainer">YOUR PAGE NAME</td>
        </tr>
    </tbody>
</table>

17. Replace YOUR PAGE NAME with the display name for your new page
18. Add your fields, following the steps outlined in Adding a field (above)