XML-Coursebuilder, V. 1.0 | SYS-CON AUSTRALIA

XML-Coursebuilder, V. 1.0

Mar. 28, 2003 12:00 AM

As a corporate trainer of Internet technologies, I've often run into situations where a company will look at a set of courses within a curriculum and say, "I want Section 2 of that course, followed by Section 4 from this other course, and then we've got a real-world project we would like you to review with the class at the conclusion of the course."

It could take hours to cut and paste material from the various courses and build a presentation based upon those requests. After nights of drudgery and muttering under my breath, I decided to develop a simple client-side XML application that could handle all the work for me.

Project Overview
XML-Coursebuilder uses XML and XSLT to format modules of course material into a comprehensive presentation. The stylesheets build a table of contents, consecutively named screen displays, summary screens, and a full navigation system on the fly, in the browser. The course material is modularized so that individual sections of a course can be included in the final output by using a simple call to an XML module.

My company has an XML curriculum of courses that includes:

Introduction to XML
XSLT: Transforming and Formatting XML
XML Application Development: 7 Projects
VoiceXML: 10 Projects to Voice Enable Your Website

I can build a four-day presentation with XML-Coursebuilder by selecting various modules from the courses, creating the presentation in the time it takes to type calls to the various selected modules. Content, navigation, table of contents, and summaries are all included in the final output. The course is displayed on the fly, in a browser, with no external compilation. Because most of my clients use a corporate intranet, I can assume the training machines are set up with MSIE 6+, which has a built-in XML/XSLT processor.

Taking this a step farther, I have used XML-Coursebuilder to include multiple author content within a presentation. A group of instructors can modularize all of their courseware and store it in a central location for access by the application, and each of their modules can be used as a section in the new presentation. Since the presentations are built on the fly from original sources, all courseware has the most current material available. I have used this concept to build technology overview courses by pulling in just the introductory modules from the courses the client was interested in.

File Structure
The XML-Coursebuilder files have been modularized so that changes to formatting are isolated from the content. Each XML file holds one complete section of data in a course. A section can contain an unlimited number of pages and a course can contain an unlimited number of sections.

Each XML file places a call to an XSL stylesheet that outputs HTML formatting. The generated HTML pages include calls to an external JavaScript file for creating the navigation system and an external CSS file for setting the properties of the HTML pages (see Figure 1). All of the formatting files are located in a single "coursebuilder" directory, allowing multiple presentations to access the same XML-Coursebuilder files (see Figure 2). This makes it simple to apply global changes to the layout of your courseware, presenting a consistent look across all of your presentations.

File Manifest
Following is a high-level overview of each of the core files within the XML-Coursebuilder system. You can download the complete set of files for experimenting at www.TechTrainingWorkshop.com/coursebuilder as well as at www.sys-con.com/xml/sourcec.cfm.

clientSidePagination.xsl
The clientSidePagination.xsl file contains XSLT templates for transforming the content from the XML files. It starts with a root-level Master Page template that creates an HTML wrapper for each individual page (see Listing 1). Next, a "navigation" template (see Listing 2) generates a navigation system at the bottom of each HTML page, displaying "Back" and "Next" buttons, along with linked page numbers to every page within the section (see Figure 3). (For detailed discussion of using JavaScript and XSLT to build dynamic navigation systems, see www.bayes.co.uk/xml.) The format of each page is handled with the "page" template and the file ends with an alphabetical listing of each of the templates that will handle elements from the XML input (see download files).

clientSideToc.xsl
The clientSideToc.xsl file pulls in the names of the XML files that are used to build each section. The code shown in Listing 3 creates a link to each XML file used in the presentation.

clientSideSummary.xsl
This file does basically the same as the table of contents, formatting it so that all pages, not just section titles, can be listed as part of the summary.

clientSidePagination.js
The JavaScript navigation system used by each of the output HTML pages is stored in clientSidePagination.js. Complete documentation for creating this type of navigation can be found at www.bayes.co.uk/xml.

clientSidePagination.css
For a consistent look and feel across all presentation materials, clientSidePagination.css is used. Each of the dynamically generated HTML pages places a call to this file. Any HTML formatting of output should be done here.

Data Description (*.xml)
I created a simple element set based upon what I use during most of my presentations. The root element is called <course>, which holds <topic> elements for each of the sections to be displayed. Each <topic> contains a <title> for the chapter and then multiple <page> elements. Pages are broken down into <talkingPoints> that consist of a <heading> plus <outline> tags holding <item> elements (see Listing 4). Links, images, and paragraphs can be inserted with various other tags.

Final Output (*.html)
The final HTML output is shown in Figure 4. The table of contents in the background is used to open up a new window when a section is chosen. When the section is completed, the window is closed, taking the user back to the table of contents. The final output includes a table of contents, a set of HTML pages for each of the sections, a summary for each of the sections, and a final summary for the complete course.

Putting the Pieces Together
A sample course is included with the download for this article. The processing files are stored in the "coursebuilder" directory, while the sample course is stored in the documentation directory. In order to build the course dynamically, you must have MSIE 6+ installed on your machine or some other client-side process to display the output in your browser. Open toc.xml in the browser to view the HTML pages.

To build your own presentation, create a new directory and save a copy of toc.xml into that directory. Rename the XML files to point to the XML files that you'll create. You can use one of the XML files in the documentation directory as a template for building your own application. Add as many XML modules to your presentation as you'd like.

Conclusion
The system shown here is a simple one that has powerful implications. Isolating the data into separate modules for easy access and reuse can work wonders for presentation building. I had a client who called to describe what she thought was a unique request for courseware to present to her company. Using XML-Coursebuilder, I was able to construct and ship her a prototype presentation within ten minutes.

My favorite idea is to compensate authors for their work on a per-module basis instead of having to write a complete course from scratch. Taking that a step farther, a group of authors could use RSS to make summaries available from their sites. Anyone needing a specific module type could generate a list of summaries and select those that are most appropriate. This would allow experts in all fields to generate modules and make them available to courseware developers.

Picture a large, distributed repository of modules with the most current information available from the people who are working in the trenches. I would access a module by Jeni Tennison or Michael Kay without hesitation, or use an XML-ized version of Dave Pawson's FAQs for a starting point of tricks and traps with XSLT. However, unheralded but well-deserving course authors could also get exposure by participating in the construction of the repository.

If you would like to participate in the continued development of this set of XSLT files and general development of the XML-Coursebuilder concept, e-mail to coursebuilder@techtrainingworkshop.com.

Resources

Download project files: www.TechTrainingWorkshop.com/coursebuilder

Kay, Michael. (2000). XSLT Programmer's Reference, 2nd Edition. Wrox Press.

RSS: http://backend.userland.com/rss

XSLT/Javascript Navigation: www.bayes.co.uk/xml

XSLT Mailing List: www.mulberrytech.com/xsl/xsl-list