under construction
Introduction
This guide describes how to create Tutorials for the Integrated Genome Browser.
Directory structure
The tutorials should be contained in a single directory, with a properties file
tutorials.properties listing the available tutorials
File format
The tutorials are text files written in json http://www.json.org
The tutorial consists of an array of steps that the user will take.
each step can contain the following fields (only the text field is required):
- text - the text to display in the tutorial status bar
- highlight - the widget to highlight during the step, use thewidget id
- timeout - the amount of time in seconds that this step is displayed before it continues onto the next step
- waitFor - the name of an action or menu item that the user is supposed to do. The tutorial will stay on this step until the user performs the action or clicks the menu item.
- execute - an action that the tutorial will perform; this is an object containing the following fields (only name is required):
name - the name of the action to perform
amount - a numeric value to pass to the action - subTutorial - an inner tutorial that can be "triggered" by an action to start
- trigger - an action that is a "trigger" to start a sub tutorial
sample tutorial
| Code Block | ||||
|---|---|---|---|---|
| ||||
[
{
"text": "Welcome to the IGB tutorial. Click Next to get started.",
"highlight": "TutorialNavigator_next"
},
{
"text": "This is the main view of data and annotations.",
"highlight": "SeqMapView",
"timeout": 3
},
{
"text": "This is the zoom slider. Watch as we zoom out.",
"highlight": "SeqMapView_xzoomer",
"timeout": 3
},
{
"text": "We are zooming out 20%",
"execute": { "name": "TweeningZoomAction", "amount": -0.2 }
},
{
"text": "This panel is for loading and manipulating data.",
"highlight": "IGBTabPanel_GeneralLoadViewGUI",
"execute": { "name": "select_GeneralLoadViewGUI_action" },
"timeout": 3
},
{
"trigger": "select_SearchView_action",
"subTutorial" :
[
{
"text": "Use this tab for searching for your favorite gene.",
"highlight": "IGBTabPanel_SearchView",
"timeout": 3
},
{
"text": "At the top is the search box, try entering a gene like 'ADAR'.",
"highlight": "SearchView_searchTF",
"waitFor": "SearchAction"
}
]
},
{
"text": "Explore some of the other tabs and click Next when finished."
}
]
|