Directory Demo

The STC website will automatically process any divs with class "directory". Each div must contain a paragraph of the Department Name or Username. Fetch multiple items with "Department A|Department B" or "userA|userB".

Department Setup:

The default output is a set of boxes, using "lastFirst" name format, sorted alphabetically.

<div class="directory">
    <p>Communication &amp; Creative Services</p>
</div>

Profile Setup:

A profile just needs the username (without @southtexascollege.edu).

<div class="directory profile">
    <p>username</p>
</div>

Options

Several options are available by adding classes or attributes:

• directory: required class to trigger automatic processing
• table: output a table instead of boxes
• portrait load portrait images (not applicable to table output)
• display: show "display" name format (does not affect sort order)
• profile: fetch profile username(s) instead of department(s)
• stack: output a stack of full-width profile boxes (only applies to profiles)
• meeting: include link to Calendly schedule
• data-title="..." override Title (not valid with "userA|userB")
• data-prefix="..." insert a prefix /label before the Name (not valid with "userA|userB")
• data-postfix="..." insert a suffix/label after the Name (not valid with "userA|userB")
• data-callback="..." callback function to run after the HTML is generated

Custom Callbacks

The processing function can optionally call a custom callback function to run after the HTML is generated. Just add a data-callback attribute with the name of the callback function:

<div class="directory" data-callback="myCallback">
    <p>Communication &amp; Creative Services</p>
</div>

...

function myCallback(element){
    $("table", element).addClass("primary"); //add class to table
}

Samples

Information Services & Planning (default)

Information Services & Planning (.table)

Library: Multiple Depts

Profile, Portrait, Display name

Profile, Portrait, Display name, Stack

Profile, Portrait, Meeting

Profile, Portrait, Meeting, Stack

Table, Profile, Meeting