Thinking Cap |
Company |
Products |
Services |
Partners |
Clients |
Support |
Studio LCMS |
Campus LMS
 | |
Create Once, Deliver Anywhere and Anyhow
When you author in Thinking Cap® Author, you author to the semantic structure of your subject matter not to a single delivery modality. This allows you to deliver the same content in Web, Print and to Mobile Devices without reauthoring!
It is the flexibility of XML that allows for content to be delivered to any platform or format. Thinking Cap Author allows you to create your own Content Structures and comes with a Content Structure and Default Delivery Templates to get you started. To Learn more about the built in templates that come with Thinking Cap® Author click here.Whether it is Web, Print or Mobile, there is no longer a need to change the source document - just select or create a new Delivery Template for the format or platform desired, then publish.
What does this mean for Instructional Designers?
It means you can control consistency across the instructional design model you create.
What does this mean for Authors?
It means you don't have to worry about instructional design because the system will not let you break the rules established by the Instructional Designer. It means you don't have to worry about look and feel because the templates take care of how things look, feel and function not you. And finally it means you can now author to complicated learning tools build in DHTML, JavaScript and Flash without learning those tools. This means you not only author text but you also author the tools of learning.
What does this mean for Project Managers?
This means you can budget for each delivery modality instead of every page. It means you can separate the authoring process from the development process and manage them independently.
What does this mean for Developers?
When you create a Drag and Drop or a Multiple Select question or a Click and Reveal or even a complicated Scenario then you have created it for the whole project. It means these elements are banked in the Delivery Template and will self assemble with the appropriate content added by Subject Matter Experts. In short, it means never having to build the same thing twice.
This is an important point. In fact this turns Learning Production on its head so let's dive into this deeper. Here is a detailed example of how you would go about building a Multiple Select Question.
The Schema
Question element consists of the following elements:
- questionText - type string
- instruction - type string
- answer - unbound
- answerText - type string
- feedback - type string
The XSL
Most of this XSL is for semantics, to keep this example to the point we will be focusing on the key areas that make the question work. First we need to match the question element.
<template match="sc:question[@type='mastery']" />
Next we will create a variable for the element position this will be used to distinguish the question from other questions that may be in the same document.
<variable name="position" select="position()" /> <table cellpadding="2" cellspacing="0" border="0"> <tr> <td colspan="2">
Now we will match the questionText element. This element is of type paragraphType in the default schema.
<apply-templates select="sc:questionText" /> </td> </tr> <tr> <td colspan="2"> <i>
Next match the instruction element. <value-of select="sc:instruction" /> </i> </td> </tr> <tr> <td align="left"> <table cellpadding="0" cellspacing="0" border="0">
Now this is where we create the form that will be submitted to our JavaScript, checkAnswer() is the function. We will be passing the form to the script.
<form name="practicequestion_{$position}" id="practicequestion_{$position}" onsubmit="checkAnswer(this)">
The next step is to write a checkbox for each answer element, its value will come from its value of the correct attribute.
<for-each select="sc:answer" />
<tr>
<td valign="top">
<p>( <value-of select="position()" />)</p>
</td>
<td valign="top" align="left" width="10px">
<input type="checkbox" id="select_{position()}_{$position}" value="{@correct}" name="select_{$position}"/>
</td>
<td align="left" valign="top" width="290px">
<p>
Now match the answerText.
<value-of select="sc:answerText" />
</p>
</td>
</tr>
<for-each />
<tr>
<td id="submitbutton_{position()}" colspan="3" height="20" valign="bottom" align="right">
Create submit button.
<input type="image" src="images/questions/submit.jpg" value="submit" style="cursor:hand">
</td>
</tr>
</form>
</table>
</td>
<td>
The final step for the XSL is to create layers for the individual feedback pop ups. This will call a feedback template that will write individual span tags using the position of the answer for their id.
<for-each select="sc:answer">
<call-template name="feedback">
<with-param name="position" select="$position" />
</call-template>
</for-each>
</td>
</tr>
</table>
<template />
The JavaScript
The checkAnswer function is basically a fairly simple form validation. The form is passed in, we cycle through it's elements to see what has been checked. If their value is true then the question essentially has been answered correctly.
function checkAnswer(form,type,button) {
First let's set up a flag for the feedback pop-up. visFB will always be false the first time the question has been answered.
if(visFB != false){visFB.style.display = 'none';}
Next we loop through the form and look at the values of the checkboxes. f
for(var x=0; x<form.length; x++){
Now if the the checkbox is checked and it's value is true we set up a variable for the correct feedback layer called fb. We show the layer and set visFB to the value of fb. This will allows to hide the current pop up if the submit button is clicked again while the pop up is open.
if(form.elements[x].checked == true){
if(form.elements[x].value == "true"){
var fb = eval(form.elements[x].id + "_fb");
x=form.length+1;
visFB = fb;
fb.style.display='block';
}else{
If the checked box has a value other then true we will show the incorrect feedback.
var fb = eval(form.elements[x].id + "_fb");
x=form.length+1;
visFB = fb;
fb.style.display='block';
}
}
}
We will also want to check if we made it through the form with out hitting a selected checkbox to prompt the user to select an option.
if(x==form.length)
{
alert("You must select an option before you can submit your response!");
}
Last but not least we don't want the form to submit so we have the event pass back a false value.
event.returnValue = false; }
In short this is a fairly simple exercise and leaves lots of room to be embellished upon. The concept is simple and if understood could lead to some very creative results.
