Wednesday, March 30, 2005

Prototyping

Spent two more days working on the prototype for FM. Mostly cosmetic and fixes, but a few JS functionality fixes and additions as well.

One problem was that on documents that use the show/hide JS functionality a link from an external page to a page anchor would not work correctly. The reason was that the page was being loaded and the anchor location noted and jumped to prior to the implementation of the show/hide functionality. So the browser scrolls to the location of the anchor before the show/hide sections are hidden. Once the show/hide sections are hidden the document length changes and the anchor will change position. However, the browser itself has finished navigation and so the anchor will move beyond the top of the screen.

I overcame the problem by using the findYPos function from PPK's QuirksMode Web site to locate the anchor after the page has finished initializing and then using the window object's scroll function to put it into view.

One other modification deserves mention if for no other reason that the functionality could prove useful in the future. I needed a method of having a show/hide section be shown if a user visits the page via a URL that has an anchor pointing to the section. I had neglected to make the show/hide code more modular and so would have had to rewrite it in order to accommodate this fact. Rather than spend the time doing that I found a method of simulating a user click on the link associated with the section in question. Now when the page loads initially the script execute the following code, which simulated the link click:
if (sh_bw.ie) {
objTags[i].click();
}
if (sh_bw.dom && !sh_bw.ie) {
var e = document.createEvent('MouseEvents');
e.initMouseEvent('click',true,true,document.defaultView,1,0,0,0,0,false,false,false,false,0,null);
objTags[i].dispatchEvent(e);
}
objTags is a document.getElementsByTagName('a'). The first part of the code is the IE specific code to perform the click (Does it also support the standard code? I don't know.). The second part is the DOM method supported by Gecko which I found via Google Groups (thanks Mike W.).