<HTML dir=ltr><HEAD><TITLE>Making a page counter in Xerte 1.8</TITLE>
<META http-equiv=Content-Type content="text/html; charset=unicode">
<META content="MSHTML 6.00.6000.16544" name=GENERATOR></HEAD>
<BODY>
<DIV id=idOWAReplyText88977 dir=ltr>
<DIV dir=ltr><FONT face=Arial color=#000000 size=2>You can do xmlNode.index() which will return the index of the node. Whilst your about it check out the other xmlNode prototype extensions, which are all useful for this sort of thing, in the help file:</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>node.getChildByName(name);</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2>node.getChildByID(id);</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2>node.findParentByName(name); // recursive - will keep looking up from icon until it finds the matching parent</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>also, in any script that is a descendent of any page, you can do iconID.getPageIndex() to find out which page index you re in, even if you are several levels down in that page (note that this is an icon method, not an xmlNode method).</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>You need these because if you rely on code like:</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>icon.parentNode.childNodes[3].duplicate(n); and then add another icon at the top of the page, this code breaks.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>Also you need it because if you have a script, a graphic and an interaction, you can duplicate the graphic as many times as you need in the script, but what is the index of the interaction after the duplication? It might well be icon.parentNode.lastChild - but it might not, and it won't be if you add icons to the page below the interaction later. I have some examples where some quite complex logic gets built this way, and found out the hard way why I needed those functions.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>As you're discovering, you can do great things like this. Especially if you attach an xml file to the templateData property of either a top level page, or the LO icon, i.e. property: templateData, value: FileLocation + 'myData.xml', then:</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>if you've done that to the LO icon itself, check the templateData variable in your script. It's the result of an xmlToObject method. It means you can have an xml file like</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2><data></FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2> <page></FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2> <text><![CDATA[here is text for the page]]></text></FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2> </page></FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2><data></FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>and address it in yor script like</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>templateData.data[0].page[0].text; </FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>The xml is turned into an object, consisteing of arrays, that are much easier to work with in your script. Similarly, you can iconID.sendAndLoad() to get a similar object back from a server.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>If you've done it on a top level page, then pageID.templateData does the same thing.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>Now you have a convenient way of building your peices dynamically, and you have a convenient way of getting xml data into yur piece in a format that's easy to work with.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>Check out the dynamic templates doc on the site for a deliberately simple example.</FONT></DIV>
<DIV dir=ltr><FONT face=Arial size=2></FONT> </DIV>
<DIV dir=ltr><FONT face=Arial size=2>Julian</FONT></DIV></DIV>
<DIV dir=ltr><BR>
<HR tabIndex=-1>
<FONT face=Tahoma size=2><B>From:</B> xerte-bounces@lists.nottingham.ac.uk on behalf of Paul Swanson<BR><B>Sent:</B> Tue 30/10/2007 19:01<BR><B>To:</B> Xerte discussion list<BR><B>Subject:</B> RE: [Xerte] Making a page counter in Xerte 1.8 - Solved<BR></FONT><BR></DIV>
<DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>Thanks for the tip on using the XML nodes. I no longer need the Time Limit interaction. I would like to make my script more generic, so that I don't need to refer to any specific icon ids, but I haven't found the right property or method to determine the index position of the current node. Is there an analog to childIndex() [which is an AS3 method for XMLNode] that I can use?</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>I currently use this to print "Slide x of y":</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana size=2>slideCounter.setText('Slide ' + (prereqs.currentPage + 1) + ' of ' + (icon.parentNode.parentNode.childNodes.length - 1));</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>-- note that <EM>prereqs</EM> is the id of my framework icon.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>and I would like to make something like this:</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana size=2>slideCounter.setText('Slide ' + (icon.parentNode.parentNode.childIndex() + 1) + ' of ' + (icon.parentNode.parentNode.childNodes.length - 1));</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>Thanks,</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=676495018-30102007><FONT face=Verdana color=#0000ff size=2>Paul</FONT></SPAN></DIV><BR>
<BLOCKQUOTE dir=ltr style="PADDING-LEFT: 5px; MARGIN-LEFT: 5px; BORDER-LEFT: #0000ff 2px solid; MARGIN-RIGHT: 0px">
<DIV class=OutlookMessageHeader lang=en-us dir=ltr align=left>
<HR tabIndex=-1>
<FONT face=Tahoma size=2><B>From:</B> xerte-bounces@lists.nottingham.ac.uk [mailto:xerte-bounces@lists.nottingham.ac.uk] <B>On Behalf Of </B>Tenney Julian<BR><B>Sent:</B> Tuesday, October 30, 2007 1:52 AM<BR><B>To:</B> Xerte discussion list<BR><B>Subject:</B> RE: [Xerte] Making a page counter in Xerte 1.8 - Solved<BR></FONT><BR></DIV>
<DIV></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Paul,</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>You're really getting into the innards of things here. The reason is this. The .rlo is a hierarchical xml file. The engine parses it, by looping through each node, then all of it's children, and so on, and then on to the next node. As it encounters each node it says 'what have I got here? Oh, a node that defines a Graphic icon - better add a graphic to the screen. What's next?"</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>So, when you execute code in page one, page two doesn't exist yet.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Each icon can be thought of as two things: the xmlNode in the rlo file, and the resulting MovieClip on the stage. Each MovieClip keeps a reference to it's corresponding XML node, in the .XMLElement property. This can be useful sometimes.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Also, note that the XML file is fully loaded before it is parsed. So whilst rootIcon.pages.length will be 1 in the first page (because the parser hasn't added the other pages yet), icon.parentNode.childNodes.length WILL contain the right number of children for the framework. Alternatively rootIcon.XMLElement.childNodes.length will do the same thing. Sometimes it is more convenient to use the XML to figure things out than the MovieClips. You always have all of the XML. You don't always have all of the MovieClips (items inside an interaction response for example).</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>This brings us to an important point for the more hardcore Xerte developer. Because the XML hasn't finished parsing, you can manipulate it at runtime before it is parsed to create dynamic pieces on the fly. Try a script before a text icon that sets it's attributes:</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>icon.nextSibling.attributes.x = 100; //when the parser parses the next icon, it will create the movieclip with _x = 100;</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>A real world appliaction of this might be something like a dynamic layout:</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>if (align == 'left'){</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2> icon.nextSibling.attributes.x = 20;</FONT></SPAN></FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>} else {</FONT></SPAN></DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2> icon.nextSibling.attributes.x = 400;</FONT></SPAN>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>}</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Of course, you could position the MovieClips with a script after them as well. There are some things that are much more convenient to do on the XML though, for instance adding dragItems to a target area response. You might not know ahead of time how many items to add, or what their IDs are.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>So, you have a script above a graphic above an interaction with a target area on it. You can create as many graphics as you need:</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>icon.nextSibling.duplicate(numOfItems - 1);//because you already have the first one. Do something similar to set the url attribute to load different images</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>//now set their IDs and build a string for drag items</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>dragItemsStr = "";</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>for (i = 0; i < numOfItems; i++){</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2> icon.parentNode.childNodes[i+i].attributes.id = 'item' + i;</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2> dragItemsStr += "item" + i + ",snap,0~";</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>}</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>//now set the dragItems attribute of the target area's xml node before it is parsed</FONT></SPAN></DIV>
<DIV dir=ltr align=left><FONT face=Verdana><FONT size=2><FONT color=#0000ff><SPAN class=689493108-30102007>icon.parentNode.lastChild.firstChild.attributes.dragItems = dragItemsStr;</SPAN></FONT></FONT></FONT></DIV>
<DIV dir=ltr align=left><FONT face=Verdana><FONT size=2><FONT color=#0000ff><SPAN class=689493108-30102007></SPAN><SPAN class=689493108-30102007></SPAN><SPAN class=689493108-30102007></SPAN></FONT></FONT></FONT> </DIV>
<DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>This technique opens up VERY powerful possibilities, akin to creating Authorware icons at runtime, particuarly when loading a seperate XML file to drive a template.</FONT></SPAN></DIV>
<DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Have fun,</FONT></SPAN></DIV>
<DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV><SPAN class=689493108-30102007><FONT face=Verdana color=#0000ff size=2>Julian</FONT></SPAN></DIV>
<DIV dir=ltr align=left><BR></DIV>
<BLOCKQUOTE dir=ltr style="MARGIN-RIGHT: 0px">
<DIV class=OutlookMessageHeader lang=en-us dir=ltr align=left>
<HR tabIndex=-1>
<FONT face=Tahoma size=2><B>From:</B> xerte-bounces@lists.nottingham.ac.uk [mailto:xerte-bounces@lists.nottingham.ac.uk] <B>On Behalf Of </B>Paul Swanson<BR><B>Sent:</B> 29 October 2007 21:21<BR><B>To:</B> Xerte discussion list<BR><B>Subject:</B> RE: [Xerte] Making a page counter in Xerte 1.8 - Solved<BR></FONT><BR></DIV>
<DIV></DIV>
<DIV dir=ltr align=left><SPAN class=718261921-29102007><FONT face=Arial color=#0000ff size=2>Correction: it is a Time Limit interaction, not Tries Limit. (But you probably already guessed that...)</FONT></SPAN></DIV><BR>
<BLOCKQUOTE dir=ltr style="PADDING-LEFT: 5px; MARGIN-LEFT: 5px; BORDER-LEFT: #0000ff 2px solid; MARGIN-RIGHT: 0px">
<DIV class=OutlookMessageHeader lang=en-us dir=ltr align=left>
<HR tabIndex=-1>
<FONT face=Tahoma size=2><B>From:</B> xerte-bounces@lists.nottingham.ac.uk [mailto:xerte-bounces@lists.nottingham.ac.uk] <B>On Behalf Of </B>Paul Swanson<BR><B>Sent:</B> Monday, October 29, 2007 2:10 PM<BR><B>To:</B> Xerte discussion list<BR><B>Subject:</B> RE: [Xerte] Making a page counter in Xerte 1.8 - Solved<BR></FONT><BR></DIV>
<DIV></DIV>
<DIV dir=ltr align=left><SPAN class=741500721-29102007><FONT face=Arial color=#0000ff size=2>It seems to be a timing issue. I added a 0.1 second Tries Limit interaction before the script that prints the counter on the first page, and it correctly prints the number of pages in the framework.</FONT></SPAN></DIV>
<DIV dir=ltr align=left><SPAN class=741500721-29102007><FONT face=Arial color=#0000ff size=2></FONT></SPAN> </DIV>
<DIV dir=ltr align=left><SPAN class=741500721-29102007><FONT face=Arial color=#0000ff size=2>- Paul</FONT></SPAN></DIV><BR>
<BLOCKQUOTE dir=ltr style="PADDING-LEFT: 5px; MARGIN-LEFT: 5px; BORDER-LEFT: #0000ff 2px solid; MARGIN-RIGHT: 0px">
<DIV class=OutlookMessageHeader lang=en-us dir=ltr align=left>
<HR tabIndex=-1>
<FONT face=Tahoma size=2><B>From:</B> xerte-bounces@lists.nottingham.ac.uk [mailto:xerte-bounces@lists.nottingham.ac.uk] <B>On Behalf Of </B>Paul Swanson<BR><B>Sent:</B> Monday, October 29, 2007 1:48 PM<BR><B>To:</B> xerte@lists.nottingham.ac.uk<BR><B>Subject:</B> [Xerte] Making a page counter in Xerte 1.8<BR></FONT><BR></DIV>
<DIV></DIV>
<P><FONT face=Arial size=2>I've been working on creating a page counter within a Framework, and when you get to the first page of the framework, the total number of pages isn't calculating correctly.</FONT></P>
<P><FONT face=Arial size=2>I have an empty text icon with an ID of 'slideCounter' that is in the Entry Frame of the framework. The framework ID is dbInst. I am placing the following code in a script icon on each page (not in the Entry Frame):</FONT></P>
<P><FONT face="Lucida Console" size=2>slideCounter.setText('Slide ' + (dbInst.currentPage + 1) + ' of ' + dbInst.pages.length);</FONT> </P>
<P><FONT face=Arial size=2>On the first page of the framework, this prints 'Slide 1 of 1'. Moving to the second page, it correctly prints 'Slide 2 of 20' and returning to the previous page, it prints 'Slide 1 of 20' -- so it isn't giving the correct value for the length of the pages array on the first pass, but correctly does so after that. And if that wasn't strange enough, if I use Ctrl+F5 to open Page 1, it displays the correct values, but if I navigate to this framework from the page prior to it (or use Ctrl+F5 with the Framework icon selected), it displays the incorrect value.</FONT></P>
<P><FONT face=Arial size=2>Is there a better way to do this?</FONT> </P>
<P><FONT face="Courier New" color=#808080 size=2>_____________________________</FONT> </P>
<P><FONT face="Courier New" color=#808080 size=2> Paul Swanson</FONT> <BR><FONT face="Courier New" color=#808080 size=2> Harland Financial Solutions</FONT> <BR><FONT face="Courier New" color=#808080 size=2>_____________________________</FONT> </P></BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE></BLOCKQUOTE></DIV></BODY></HTML>