-
Notifications
You must be signed in to change notification settings - Fork 1
Loading content
The base format for Stepwise content is Stepwise XML. However, there are a variety of convenient ways to get content into Stepwise apart from authoring Stepwise XML directly.
Content creators will rarely want to author natively in Stepwise XML, so Stepwise includes a plain text parser. To load a text file and convert each line into a separate step, use the "textfile" data type and pass "newline" as the delimiter:
$("#output").stepwise({source: "myscript.txt", dataType: "textfile", delimiter: "newline"});
You can also load a string directly (this is Stepwise's default input method, which uses spaces as delimiters between steps):
$("#output").stepwise("Hello world");
If the default space-delimited string is too limiting a format, you can pass in an array of strings to be parsed as separate steps.
$("#output").stepwise(["Hello there", "wonderful world"]);
A more robust option is the Google Sheets parser, which converts a specially formatted Sheets document into Stepwise XML. This is the fastest way to author sophisticated Stepwise content.
First, make sure you've made the Sheets module available to the page:
<script type="text/javascript" src="js/utils/Sheets.js"></script>
Your document must also be made public in Google Sheets using File > Publish to the Web. You can pass in either the document's URL (it's actual URL copied from the browser's location bar, not the URL shown when you Publish to the Web) or its id.
$.fn.stepwise.getXMLFromSheet(sheetURLOrId, function(xml) {
$("#output").stepwise({source: xml, dataType: 'xml'});
});
Of course, you can always load a Stepwise XML file directly by specifying the path to the file along with the "xmlfile" data type:
$("#output").stepwise({source: "myscript.xml", dataType: "xmlfile"});
You can also pass a Stepwise XML document directly into the plugin by using the "xml" data type:
$("#output").stepwise({source: xmlDoc, dataType: "xml"});
When a string is passed into the plugin, Stepwise will parse it as a space-delimited series of steps. Passing a object instead allows the instance to be configured using the following options:
Option | Description |
---|---|
source | Required. Either a URL to an XML or text file, an XML document, or a string (be sure to specify the dataType option accordingly). |
dataType | Sets the type of content the plugin expects: array , string , textfile , xml , or xmlfile . Defaults to string . |
clickInput | If true , Stepwise will listen for mouse clicks on the input element. Defaults to true . |
delimiter | Set the delimiter to be used when splitting string input into steps. Defaults to a single space. Use "newline" to split the string line by line. |
inputElement | Selector for the element to which click and tap handlers will be attached for input. If left unspecified, the element to which the instance is attached will be used. |
keyInput | If true , Stepwise will listen to keypresses for input. Defaults to true . |
keyCodesToIgnore | An array of key codes that will be ignored when listening for keyboard input. |
onLoad | A function that will be called once the content specified in source has been loaded. The current Stepwise instance will be passed in as the sole parameter. |
onStep | A function that will be called every time a step is executed, with the event and the Step object as parameters. |
outputToElement | If true, visible output will automatically be directed to the DOM element the plugin was instantiated with. Defaults to true . |
tapInput | If true , Stepwise will listen for taps on the input element. Defaults to true . |