Tech Team Twitter Feed

Tuesday, May 8, 2012

Lectora: Creating Dynamic Navigation for Back Buttons

Goal
A student can navigate to a page from multiple other pages, including from the Table of Contents (TOC). Create a solution of actions, which is easy to implement and re-use,  for the back button to send the student either to the page they came from or if navigation was from the TOC then define a specific page for the back button to navigate to.
Directions from the Instructional Designer (ISD) to the programmer come in the form of a detailed storyboard. A flow chart identifies each topic’s flow within a lesson.
The flow chart segment below (figure 1) shows page L22T01075 can be navigated to directly from three pages: L22T01060, L22T01065, and L22T01070.  Since this course has a TOC, L22T01075 can also be navigated to from any other page using the TOC.
Figure 1
Our storyboard captures the logic to be used for the back button (table 1).
Button
Go to Actions
Back
L22T01060, L22T01065, or L22T01070, or (if coming from the TOC) L22T01055

Table 1

A naming convention identifies each page and element on that page.  LxxTyyzzz where “L” and “T” stand for Lesson and Topic respectively and the xx,yy, and zzz values identify the lesson, topic and page numbers.  For ease of rework and possible additional pages being required during the review cycle, page numbers are incremented by a value of five.  L22T01075 then is Lesson 22, Topic 01, page 075.
Listing of actions, action groups, user defined variables and system variables used (table 2).

Action name
Action Group Name
User Defined Variable
System Variable
setL22T01075_visited
Back button actions
theReferrerPage
CurrentPageName
set sendBackToPage var

sendBackToPage

set theReffererPage var








Table 2
Overview of Steps
1)      Collect, identify and store, in a variable the page you are coming from
2)      Set back button onClick to “Back Button actions” action group.
3)      Evaluate the variable and set actions accordingly.
Step 1
A) Set variable “theReferrerPage” with a delay of two seconds to the value VAR(CurrentPageName).  This resets this variable to the name of the page you are currently at. The delay ensures Step 1B happens first and the page you came from is set before being overwritten.  While this action must happen on each page it should not be a global action.  The reason for this is the delay.  The delay is ONLY needed in this scenario when you need to set the sendBackToPage variable.

Figure 2
No conditions set in this action.
B) Create action “set theReferrerPage”.  Set  variable “sendBackToPage” to the variable “theReferrerPage”.  Note that this variable is set on every content page upon “Showing” that page.  The variable “sendBackToPage” now holds the name of the page you come from. This is shown in figure 3.


 Figure 3
No conditions set in this action.
The value of the variables once these two actions have completed if the user navigated to L22T01075 from L22T01060 is as follows:
sendBackToPage = L22T01060
theReferrerPage = L22T01075

The Back Button “on Click” action should be set to run the action group ‘back button actions” as shown in figure 4.
 Figure 4
The action group “back button actions” should have four unique actions to handle the four different actions associated with this specific scenario.
The four actions for this scenario are shown in table 3.

If coming from
Then go back to
L22T01060
L22T01060
L22T01065
L22T01065
L22T01070
L22T01070
TOC

Ie not coming from L22T01060, L22T01065, or L22T01070
L22T01055

Table 3
Figure 5
If coming from the TOC (I.e. not coming from L22T01060, L22T01065, or L22T01070)
Action: Go To
Target: Chapter, Section, or Page
Name: L22T01055
Condition
Perform action ONLY if the following is true (Checked)
Any of the Following (selected)   Set up the three conditions as shown in table 4.


Variable
Relationship
Value
sendBackToPage
Not Equal To
L22T01060
sendBackToPage
Not Equal To
L22T01065
sendBackToPage
Not Equal To
L22T01070

Table 4

Figure 6


Condition
Figure 7

Each of the specific pages do the following for L22T01060, L22T01065, and L2201070 changing the Name and condition value as appropriate
Figure 8


Condition
Figure 9

Why not the JavaScript history: back() method? The logic of identifying one specific page to navigate to in the scenario when coming from the TOC negates using this.