Skip to content

Prototype of guided tour mechanism for Olab 3 14



The goal of this tool was to enrich the virtual scenario delivery systems with contextualized help/tutorial system which would make navigation for users easier. The basic idea was to avoid annoying users with wordy manuals and instead offer them clear help entries for each non-trivial UI element to be used at the moment they may need it. This prototype demonstrates how a “guided tour mechanism” can be embedded into the OL virtual scenario delivery system, particularly OpenLabyrinth 3.5

Online demo

An online demo is available at

Technical installation instructions

  1. Create database in MySQL from database.sql, with/without test data in INSERT INTO...
  2. Deploy database backend editor.php and insert your own test data
  3. Add _introjs_hook.php, modify its header for IP filtering (or change loading IntroJS from CDN to local source) and add mysql connection settings:
$filter = new IPFilter( array(
      '.....',   // add to IP adress to filter

if ($filter->check($_SERVER["REMOTE_ADDR"]) === true):

// --- connection to dedicated
$config["db_server"] = "localhost";
$config["db_name"] = "adddbname";
$config["db_user"] = "adddbuser";
$config["db_user_pw"] = "addyourpassword";

4.Modify labyrinth ver.3 source codes

home.php, ../views/labyrinth/skin/*.php -- add:


5.For exact jquery style DOM selecting/matching is important to add more ids or classes into skins --

../views/labyrinth/skin/*.php, for example id="iba_node_title":
<h4 id="iba_node_title"><?php echo Arr::get($templateData, 'node_title'); ?></h4>