|
|
iLabs - CREATING CONTENT |
To create your lab, you need to create a number of HTML and XML files and place them in a directory structure on a publically available web server. Any web server will do, but the user will have to specify the base location of your directory structure. You will need to know how to create HTML and XML files, but this is only necessary if you want to create your own content. If you are just interested in using iLabs, this section is not for you.
Create a root folder for all iLab-related files. That folder is the base folder for all relative references in the following description. It should match the “base location” in the Settings of the iLabs app.
Default: http://www.mathcs.org/iLab/
Create the main HTML file in the main iLabs folder. That file could include a reference to an image, such as iLabLogo.jpg, and any explanatory text you wish, in proper HTML format. You also need to create the main XML data file describing the iLab courses, also located in the base folder. Note that while the base location can be changed via the appropriate setting of the app, the name of the main index HTML and XML files can not.
Default: iLabs.html and iLabs.xml
The main file iLabs.xml has a simple structure. It lists all courses, including an ID, a name, a description, a main index HTML file and a main index XML file for each course. For example:
<ilab version="1.0">
<courses>
<course>
<id>sample101</id>
<name>SAMPLE 101</name>
<description>Sample Course in Chemistry<description>
<url>sample101/index.html</url>
<xml>sample101/index.xml</xml>
</course>
… more course entries as necessary …
</courses>
</ilab>
Each specified directory needs to exist and contain the file index.html, describing the course, and the file index.xml, describing the labs available for that course.
Note: The course ID must be unique, i.e. no two course IDs should be the same, and it should consist of letters and digits only, no spaces. The app will use the course ID as part of a file name for local data files, so the course id should make for a valid file name. For each course directory, the file index.html can be any valid HTML file describing the course.
The index.xml describing the labs file looks as follows:
<ilab version="1.0">
<labs>
<lab>
<id>lab1</id>
<name>Sample Chem Lab 1</name>
<description>Some brief description</description>
<url>sample101/lab1/index.html</url>
<xml>sample101/lab1/index.xml</xml>
<email>sample_user@sample.host</email>
<instructor>Sample F. Name</instructor>
</lab>
… more lab descriptions as necessary …
</labs>
</ilab>
Note: The lab ID should be unique for the labs in this course, and it should consist of letters and digits only. It will be used by the app to create a local file name, starting with “courseID.labID”, so the lab ID (and course ID) entries should make for valid file names. The instructor email and full name will be used by the app to send copies of lab reports to. The email address should therefore be a valid one.
For each lab, the index.html file is a valid HTML file, describing the particular lab as an overview. Each index.xml file, finally, describes an individual lab. Each lab consists of multiple ‘tasks’, which could be of type url, video, audio, picture (photo), text, or a quiz. Tasks are grouped into four categories: safety, prelab, report, and resources, and each task could be ‘required’ or not. Each task also has a ‘name’ (or title) and ‘data’ field, and quiz questions have an additional ‘options’ field as well. Here is a sample task list:
<ilab version="1.0">
<task>
<category>safety</category>
<type>url</type>
<name>Overview of Sample 101 Lab 1</name>
<data>sample101/lab1/index.html</data>
</task>
<task>
<category>safety</category>
<type>url</type>
<name>Read this First</name>
<data>sample101/lab1/readme.html</data>
<required>true</required>
</task>
<task>
<category>safety</category>
<type>video</type>
<name>Lab Safety Video</name>
<data>http://www.youtube.com/watch?v=hv9imJzZWrY</data>
<required>true</required>
</task>
<task>
<category>safety</category>
<type>audio</type>
<name>"The Elements" by Tom Lehrer</name>
<data>http://www.jesuitnola.org/upload/clark/images/elements.mp3</data>
</task>
<task>
<category>prelab</category>
<type>url</type>
<name>Prelab Information</name>
<data>sample101/lab1/prelab.html</data>
</task>
<task>
<category>prelab</category>
<type>quiz</type>
<name>What is Java?</name>
<data>This is an example quiz question with multiple right answers: What
is Java?</data>
<options>124|A cup of coffee|A programming langage|A continent|An
island</options>
</task>
<task>
<category>prelab</category>
<type>quiz</type>
<name>Who created this iLab application?</name>
<data>This is an example quiz question with only one right answer: Who
programmed this app?</data>
<options>3|John Doe|Jane Student|Bert Wachsmuth|Tarzan</options>
<required>true</required>
</task>
<task>
<category>resource</category>
<type>url</type>
<name>List of Terms</name>
<data>sample101/lab1/term-list.html</data>
</task>
<task>
<category>resource</category>
<type>url</type>
<name>More information</name>
<data>http://en.wikipedia.org/wiki/Chemistry</data>
</task>
<task>
<category>report</category>
<type>url</type>
<name>Report Information</name>
<data>This section contains your actual report data. There can be any
number of entries. Each entry has a name, shown in the list on the left, and
some data that is editable. You can edit an existing entry by long-tapping the
name of the entry in the list. To add a new entry, tap the "add text" icon on
the top. To delete an existing entry, select the appropriate item from the menu.
Note that you can also insert pictures by tapping the "add photo" icon, which
you can then edit to specify an appropriate name. With each entry, your report
is automatically saved. When you are satisfied with your report, including any
photos you want to take, you can submit your report to yourself (with a copy to
the instructor) by clicking the "submit" icon. After you successfully submitted
your report (which you can edit further), you might want to delete your report
from your tab.
<p>
Try it now: edit the first entry by long-tapping, then add
a new entry as well as a picture (but remember that you first need to visit all
required info and quizzes).
<p>
And don't forget to submit your report, with a copy to the
(sample) instructor.
</data>
</task>
<task>
<category>report</category>
<name>Amount of chemical 1</name>
<type>txt</type>
<data></data>
</task>
<task>
<category>report</category>
<name>Temperature of Solution used</name>
<type>txt</type>
<data></data>
</task>
</ilab>
Most of these tasks should be straight-forward. Note that categories do not neceesaily be in proper order, but within a category task will be listed in the order they appear. The quiz task, however, needs some more explanation.
The quiz task has a category, name, and type as usual. The data portion indicates the quiz question. Then there is an additional entry for options, which indicates the possible answers of the multiple choice question. That options tag has the form:
<options>number_list|answer 1|answer 2|...|answer n</options>
where number_list is a list of single-digit numbers starting at 1 that specifies
which of the following answers will be considered correct, while the rest
indicates the possible answers of the multiple-choice question. For example:
<task>
<category>prelab</category>
<type>quiz</type>
<name>What is Java?</name>
<data>This is an example quiz question with multiple right answers: What
is Java?</data>
<options>124|A cup of coffee|A programming langage|A continent|An
island</options>
</task>
<task>
<category>prelab</category>
<type>quiz</type>
<name>Who created this iLab application?</name>
<data>This is an example quiz question with only one right answer: Who
programmed this app?</data>
<options>3|John Doe|Jane Student|Bert Wachsmuth|Tarzan</options>
<required>true</required>
</task>
Using Formating Tags in Report Tasks
The data entry of a task of type text and url (if used inside a report) can contain standard HTML formatting tags, but you can not use angular brackets. Instead use < for < and > for >. For example:
<task>
<category>resource</category>
<type>url</type>
<name>More <b>information</b></name>
<data>http://en.wikipedia.org/wiki/Chemistry</data>
</task>
Here the word "information" will be shown in bold because of the <b> and </b> HTML tags. Recall that a url type in the report category will be displayed as (formatted, non-editable) text inside the report.
Bert G. Wachsmuth (c) 2011