<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:w="urn:schemas-microsoft-com:office:word" xmlns:m="http://schemas.microsoft.com/office/2004/12/omml" xmlns="http://www.w3.org/TR/REC-html40"><head>
<meta http-equiv="Content-Type" content="text/html; charset=us-ascii">
<meta name="Generator" content="Microsoft Word 14 (filtered medium)">
<!--[if !mso]><style>v\:* {behavior:url(#default#VML);}
o\:* {behavior:url(#default#VML);}
w\:* {behavior:url(#default#VML);}
.shape {behavior:url(#default#VML);}
</style><![endif]--><style><!--
/* Font Definitions */
@font-face
        {font-family:Calibri;
        panose-1:2 15 5 2 2 2 4 3 2 4;}
@font-face
        {font-family:Tahoma;
        panose-1:2 11 6 4 3 5 4 4 2 4;}
/* Style Definitions */
p.MsoNormal, li.MsoNormal, div.MsoNormal
        {margin:0in;
        margin-bottom:.0001pt;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
a:link, span.MsoHyperlink
        {mso-style-priority:99;
        color:blue;
        text-decoration:underline;}
a:visited, span.MsoHyperlinkFollowed
        {mso-style-priority:99;
        color:purple;
        text-decoration:underline;}
p
        {mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
p.MsoAcetate, li.MsoAcetate, div.MsoAcetate
        {mso-style-priority:99;
        mso-style-link:"Balloon Text Char";
        margin:0in;
        margin-bottom:.0001pt;
        font-size:8.0pt;
        font-family:"Tahoma","sans-serif";}
span.BalloonTextChar
        {mso-style-name:"Balloon Text Char";
        mso-style-priority:99;
        mso-style-link:"Balloon Text";
        font-family:"Tahoma","sans-serif";}
p.ecxmsonormal, li.ecxmsonormal, div.ecxmsonormal
        {mso-style-name:ecxmsonormal;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
p.ecxmsoacetate, li.ecxmsoacetate, div.ecxmsoacetate
        {mso-style-name:ecxmsoacetate;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
p.ecxmsochpdefault, li.ecxmsochpdefault, div.ecxmsochpdefault
        {mso-style-name:ecxmsochpdefault;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
p.ecxmsonormal1, li.ecxmsonormal1, div.ecxmsonormal1
        {mso-style-name:ecxmsonormal1;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:12.0pt;
        font-family:"Times New Roman","serif";}
p.ecxmsoacetate1, li.ecxmsoacetate1, div.ecxmsoacetate1
        {mso-style-name:ecxmsoacetate1;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:8.0pt;
        font-family:"Tahoma","sans-serif";}
p.ecxmsochpdefault1, li.ecxmsochpdefault1, div.ecxmsochpdefault1
        {mso-style-name:ecxmsochpdefault1;
        mso-style-priority:99;
        mso-margin-top-alt:auto;
        margin-right:0in;
        mso-margin-bottom-alt:auto;
        margin-left:0in;
        font-size:10.0pt;
        font-family:"Times New Roman","serif";}
span.ecxmsohyperlink
        {mso-style-name:ecxmsohyperlink;}
span.ecxmsohyperlinkfollowed
        {mso-style-name:ecxmsohyperlinkfollowed;}
span.ecxemailstyle18
        {mso-style-name:ecxemailstyle18;}
span.ecxballoontextchar
        {mso-style-name:ecxballoontextchar;}
span.ecxmsohyperlink1
        {mso-style-name:ecxmsohyperlink1;
        color:blue;
        text-decoration:underline;}
span.ecxmsohyperlinkfollowed1
        {mso-style-name:ecxmsohyperlinkfollowed1;
        color:purple;
        text-decoration:underline;}
span.ecxemailstyle181
        {mso-style-name:ecxemailstyle181;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.ecxballoontextchar1
        {mso-style-name:ecxballoontextchar1;
        font-family:"Tahoma","sans-serif";}
span.EmailStyle34
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle35
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle36
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle37
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle38
        {mso-style-type:personal;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
span.EmailStyle39
        {mso-style-type:personal-reply;
        font-family:"Calibri","sans-serif";
        color:#1F497D;}
.MsoChpDefault
        {mso-style-type:export-only;
        font-size:10.0pt;}
@page WordSection1
        {size:8.5in 11.0in;
        margin:1.0in 1.0in 1.0in 1.0in;}
div.WordSection1
        {page:WordSection1;}
--></style><!--[if gte mso 9]><xml>
<o:shapedefaults v:ext="edit" spidmax="1026" />
</xml><![endif]--><!--[if gte mso 9]><xml>
<o:shapelayout v:ext="edit">
<o:idmap v:ext="edit" data="1" />
</o:shapelayout></xml><![endif]-->
</head>
<body lang="EN-US" link="blue" vlink="purple">
<div class="WordSection1">
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Hi,<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">As Julian says, all the presentation can be done in the attached html file. And to address the other items:<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">As Jonathan states Unique IDs are generated for each page as they are generated but these linkIDs remain with the page for its lifetime and can only be changed
 by editing the xml (from what I’ve seen)… They all look like PGxxxxxxx where xxxxxx is numeric<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Then you have the pageID (this is an optional property that can be added to every page). This can be set to any key you wish (should probably avoid spaces etc
 that get mangled in urls… so you can set it as Pg5Sec1<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Then you also have deeplinking already available… any URL play.php?template_id=1 can be changed to use either page/pageID/linkID to deeplink to that page –
 thus play.php?template_id=14&pageID=Pg5Sec1 will go directly to that page…<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">You can also use internal PageLinks to jump to specific pages, so not requiring the whole LO to refresh…<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">The only bit that I see that might be ‘difficult’ is the database connection. At present there is no way to do something when a page is left, so when a section
 ends you cannot trigger some code to do something else… the actual communication to the db is probably trivial via a custom php page but it needs triggering to know when to write data back…<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">I plan to rewrite the HTML5 engine into more of an OO model and Tom has requested some events to support SCORM and possibly TinCan later but I can see that
 you might also need some custom events to be fired at the end of a sections…<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">So for example you have a section called Section1 and page_end events are fired when each page is left. You could listen for a page_end event and pass the IDs/page
 number into the event handler and from there make a decision as to whether it was a section, subsection etc…<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">I’m happy to work those events also into the rewrite (although it won’t be until Christmas period) and that should pretty much allow you to do what you want….<o:p></o:p></span></p>
<div>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Regards,<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">John Smith<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Learning Technologist<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">School of Health & Life Sciences<o:p></o:p></span></p>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Glasgow Caledonian University<o:p></o:p></span></p>
</div>
<p class="MsoNormal"><span style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<div>
<div style="border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0in 0in 0in">
<p class="MsoNormal"><b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif"">From:</span></b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif""> xerte-bounces@lists.nottingham.ac.uk [mailto:xerte-bounces@lists.nottingham.ac.uk]
<b>On Behalf Of </b>Julian Tenney<br>
<b>Sent:</b> Thursday, November 07, 2013 10:36 AM<br>
<b>To:</b> Xerte discussion list<br>
<b>Subject:</b> [Xerte] Re: xerte XOT HTML5 - graphical menu, connector pages<o:p></o:p></span></p>
</div>
</div>
<p class="MsoNormal"><o:p> </o:p></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Well, when you load up the html page, you have all the HTML / javascript / css you need to do that. You have a problem that is going to need some
 programming to resolve, one way or another,<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<div>
<div style="border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0in 0in 0in">
<p class="MsoNormal"><b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif"">From:</span></b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif"">
<a href="mailto:xerte-bounces@lists.nottingham.ac.uk">xerte-bounces@lists.nottingham.ac.uk</a> [<a href="mailto:xerte-bounces@lists.nottingham.ac.uk">mailto:xerte-bounces@lists.nottingham.ac.uk</a>]
<b>On Behalf Of </b>KnowledgeWare<br>
<b>Sent:</b> 07 November 2013 02:33<br>
<b>To:</b> 'Xerte discussion list'<br>
<b>Subject:</b> [Xerte] Re: xerte XOT HTML5 - graphical menu, connector pages<o:p></o:p></span></p>
</div>
</div>
<p class="MsoNormal"><span lang="EN-GB"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">If possible I’d like to get to a parts/modules menu as below (in blue). This is xerte desktop with a flash menu inserted (thanks Julian/Dave).
 John by dbase reading I mean the ability to read/write/update a proprietary (non scorm, my own) database. For example, the parts and modules in the blue menu below are loaded from the database. At the end of a module I want to update the database, when all
 modules in a part done update the part in the database, etc.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA"><img border="0" width="353" height="273" id="Picture_x0020_1" src="cid:image001.jpg@01CEDBAA.B1F74A60"></span><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">The menu below (black) is in Authorware, it’s just a ‘parts’ module and the sections are linear. It’s workable and probably much easier to do in
 XOT than parts/modules. For this I need to ‘insert’ the menu, read the ‘parts’ from the database when the LO starts, turn on checkmarks if the student has completed the part, then jump to the first page for each part when clicked, page through linear, and
 at the last page in the part update the database and return to this menu.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA"><img border="0" width="351" height="263" id="Picture_x0020_2" src="cid:image002.jpg@01CEDBAA.B1F74A60"></span><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">In the blue menu I coded the xerte icons with a specific ID which then gets parsed to build the menu/parts. For example the page ID for part 1
 is ‘p1id’, and for the modules inside it is ‘p1m1id’, ‘p1m2id’ etc. It would be very useful if XOT had a way to uniquely code each icon but I don’t think it does, or as Jonathan stated it does but it may change at runtime:<o:p></o:p></span></p>
<p class="MsoNormal"><i><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></i></p>
<p class="MsoNormal"><i><span lang="EN-CA">“If I remember correctly XOT assigns a unique identifier to each page automatically.<o:p></o:p></span></i></p>
<p class="MsoNormal" style="margin-bottom:12.0pt"><i><span lang="EN-CA">You can use this by using the pagelink feature available in all text boxes. However I think the assigned identifier changes each time you run the project. What is constant is the page name
 this maps to which is what is displayed in the pagelink control.”<o:p></o:p></span></i></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">If a client builds a course they’d need some simple method of identifying a page that wouldn’t change, that would always remain the same in order
 that the menu works. The page name wouldn’t be good and it may be changed.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">There’s another reason I’d like a unique page identifier – I’m wondering if I could send a student an email with a link with his login/password
 and a set of pages somewhere in the piece to navigate to. For instance, on login it would go to the part 3 summary pages, page through them, do the part 3 quiz, then go to an exit screen.
<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">That’s really what I’d like to try to accomplish, some type of a menu like above that my clients are used to, and if possible a way to jump into
 a piece and navigate through a specific set of pages.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><br>
Are these things doable in HTML5 XOT? As many of you know I’m not in the same league with many of you as a programmer so please bear that in mind if replying, things like JSON etc. are beyond me at this point. If there is a way to do this however I will work
 toward it.<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Thanks<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">RonM2<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<div>
<div style="border:none;border-top:solid #B5C4DF 1.0pt;padding:3.0pt 0in 0in 0in">
<p class="MsoNormal"><b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif"">From:</span></b><span style="font-size:10.0pt;font-family:"Tahoma","sans-serif"">
<a href="mailto:xerte-bounces@lists.nottingham.ac.uk">xerte-bounces@lists.nottingham.ac.uk</a> [<a href="mailto:xerte-bounces@lists.nottingham.ac.uk">mailto:xerte-bounces@lists.nottingham.ac.uk</a>]
<b>On Behalf Of </b>Julian Tenney<br>
<b>Sent:</b> Wednesday, November 06, 2013 1:49 AM<br>
<b>To:</b> Xerte discussion list<br>
<b>Subject:</b> [Xerte] Re: xerte XOT HTML5 - graphical menu, connector pages<o:p></o:p></span></p>
</div>
</div>
<p class="MsoNormal"><span lang="EN-CA"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">You do it using media -> flash movie, and set an init object, then load an .html file instead of a swf (the init object is what trips the code
 to display this rather than the swf, so you need to sety one, even if just a dummy – it also allows you to pass json into the html page for you to use in the content):<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D">Then you get your custom content loaded up:<o:p></o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-GB" style="font-size:11.0pt;font-family:"Calibri","sans-serif";color:#1F497D"><o:p> </o:p></span></p>
<p class="MsoNormal"><span lang="EN-CA" style="font-family:"Calibri","sans-serif""><o:p> </o:p></span></p>
</div>
<br>
<font face="Arial" color="Gray" size="2">Glasgow Caledonian University is a registered Scottish charity, number SC021474<br>
<br>
Winner: Times Higher Education’s Widening Participation Initiative of the Year 2009 and Herald Society’s Education Initiative of the Year 2009.<br>
http://www.gcu.ac.uk/newsevents/news/bycategory/theuniversity/1/name,6219,en.html<br>
<br>
Winner: Times Higher Education’s Outstanding Support for Early Career Researchers of the Year 2010, GCU as a lead with Universities Scotland partners.<br>
http://www.gcu.ac.uk/newsevents/news/bycategory/theuniversity/1/name,15691,en.html<br>
</font>
</body>
</html>