FDS Template Designer's Guide

Introduction

Template, by definition, is a document used to create other documents that follow the same pattern. A web template is just a normal HTML file with some embedded variables which are to be substituted with actual data upon rendering. For example, this is a minimal HTML file:

    <html><head></head><body>Hello Joe Smith!</body></html>

A template will make this same file suitable for more than one user, without having to create multiple files:

    <html><head></head><body>Hello #YourName#!</body></html>

When a visitor requests this file, the templating system will substitute the template variable #YourName# with the actual data, which could be 'Joe Smith', or anything else set in the web program or from a backend database. In FDS, all template variables are surrounded by two #'s. The advantages of using templates in your web development are obvious:

It eliminates the need to keep multiple copies of 'basically the same' pages around. It makes easy to update the site. For example, you only have to change one template file to change the contents and looks of all the similar pages at your site.
It seperates the html presentation part from the programming part, and makes possible for programmers and designers to work independently without worrying too much about breaking the other parts of the system.
It encourages a content centered management style, being easily archivable and adaptive for new environments. For example, someday when HTML is no longer the standard for the web, all you have to change is the templates and your bussiness logic stay the same.

The FDS is designed to be a data center to provide commonly used services for faculty, staff and students in multuple departments. Since each user and each department have different working styles and different data requirements, templates are criticial for the system to be able to cope with the diversity.

Template editing - the basics

First we need to differentiate between the different types of templates.

Every page in the FDS uses a template and can be changed if you've got the right permissions. Usually, each user can only change the templates for his or her own pages, while powerusers can edit group templates. Once you have logged in, you'll see some template related links on the left side of the pages which are available to you.

Depending on what level of the FDS you are in (and what permissions you have), you'll have access to some or all of the following types of templates : Global, global group, global class, local, local group and local class (which ones you have access to depends on what level of the FDS you are in). The global templates are what's viewed by everyone in the outside world (i.e outside of Duke) while the local templates are only viewable by people from that group or from the matching IP addresses configured for that group. If you're creating pages for use in your department's web site, you'll most likely be editing the global templates.

If you go to the page of an individual department member you'll see links in the left hand FDS menu for all the different types of templates (see image below).

The global (c) template is used to create a template that applies to all the members of that class (in this case, all the faculty). This is useful for creating a consistant look for all the faculty pages by editing only one template.

The global (g) template is used to create a template that applies to all classes (ie to all faculty, staff and graduate students). This would be used if you wanted the pages for all members of your departement to have the same look. This template will be overridden by any global (c) templates that you've already created.

The global template is used to create a template for the page you are currently viewing only. This will override all other templates so it can be used to create a custom look for individual pages.

Introduction to the template editing window interface

When you click on one of the template links described above, you're taken to the template editing window (see above below). This is where all the magic happens :). The area in the center of window contains the template code. By typing within this window you can make changes to the default template. When you're done, just click the "update" button to apply your changes (or the "reset" button to return to the last saved version of the template).

The "Data" link on the left shows you all the data you have access to by default. For example, here is a sample data structure for a page:

{
  'PageTitle' => 'Joe Smith, Professor',
  'Office' => '1234 Basement Building',

  'Teaching' => [
    {
      'title' => 'NUMBER THEORY 11',
      'time1' => 'TTh 12:40 PM-01:55 PM',
      'room1' => 'Physics 218',
    },
    {
      'title' => 'SET THEORY 12',
      'time1' => 'TTh 12:40 PM-01:55 PM',

      'room1' => 'Physics 218',
    },
    .....

   ],
   .....
}

Where "PageTitle" and "Office" are two simple template varilables with assigned values. "Teaching" is assigned to a list of items inclosed in brackets; it's a loop variable with two or more records. It's important for you to be able to recoginize a loop variable from the data structure.

The "XML" link shows you the same data structure in XML format. It's intended to be used by other web services, but it's also useful for you to examine the data.

The "Tmpl" link displays the current template for the page with some basic syntax coloring.

Template variables and control structures:

Simple variable: #name#

A variable name surrounded by two #s. It can have a scalar value (a scalar value is simply a chunk of information), and it's empty if not defined. Example:

My name is #name# and I work in the #dept# department.

Conditional statements:

   #IF#name#text#IF#               will output "text" if #name# is not empty or not zero (is true).
    #IF#name#text1#ELSE#text2#IF#        will output "text1" if #name# is true (ie it's been defined), otherwise the outout will be "text2"
   #UNLESS#name#text#UNLESS#         will output " text" if #name# is not true (is empty or equals zero).

#IF#dept# I work in the #dept# department #ELSE# I work in no dept #IF#

#UNLESS#name# I can't find my name #UNLESS#

Notice how the conditional statements must have both an opening an closing tag.

Loops:

Loops will step through each element contained within the loop variable.

#LOOP#name#
.............
#LOOP#

Defines: #def#name#value#

or

Includes: #INC::filename#

Includes will pull in an external page such as a header or footer. These can be created as "Extra Pages" which we'll discuss later.

Version Control

The version control feature of the FDS allow you to work on your site and try out new things without them being visible to viewers until they're ready to be published. This way, if you make a change which doesn't work the way you intended, no one but you will see it.

The links to version control are found in the left hand FDS menu (see screenshot below).

version control links

These class and group ("C" and "G") version control templates work the same way as the Global and Local templates mentioned earlier. To create a new version, first select the appropriate version control link for the template you'd like to work on. Next, click the "Create" button to make a new version of your template (see image below).

Version control

Now return to the version contol page and select the new version you just created (Version 1) and click "Submit" (see below).

Version control

The "Selected" version is the template that's editible from the template links. This is where you can test out new changes to the template without it being seen by anyone else. The "Published" version is the one that's currently being published to the outside world.