I came up with a ("quick and dirty") way to auto-hide or show the navigation controls for Browse Sequences, depending on whether or not the user is viewing a topic which is part of a Browse Sequence.
Ideally, I think it would be great to have an "out of the box" way via an option on the WebHelp Toolbar tab of the project Skin (or possibly the Styles tab, where properties of toolbar items are set) which would allow us to specify showing/hiding of the controls based on some condition. In this case, of course, the condition would be whether or not the current topic belongs to a Browse Sequence. Sounds like an Enhancement Request in the making...
For now, let me tell you how I came to think about hiding/showing the navigation controls, and more importantly, how I accomplished it!
When setting up the WebHelp Toolbar for my project skin, I added the following toolbar buttons from left-to-right, as listed below:
- PreviousTopic
CurrentTopicIndex
NexTopic
I also have the normal "Back" and "Forward" navigation buttons on the Toolbar, which rely on the browser's history to take the user back or forward through pages they've visited, whether or not they happen to belong to a Browse Sequence.
I noticed that the "Page n of nn" text (CurrentTopicIndex) disappears automatically when the user moves to a topic which is NOT part of a Browse Sequence. Nice! But, I also thought it would eliminate some confusion for the user if the "Previous Topic" and "Next Topic" buttons disappeared along with it. After all, when on a non-Browse Sequence topic, why would I want two sets of navigation buttons showing up on my Toolbar?
So, I did a little investigation and found that this behavior happens when the <span> element which holds the "Page n of nn" text in the output gets its "display" attribute set to "none" via a line of code in the "MadCapAll.js" file (source file located at "C:\Program Files\MadCap Software\MadCap Flare V<YourVersionHere>\Flare.app\Resources\WebHelp\Content\SkinSupport\").
I simply made the following change within the "MadCapAll.js" file to dictate that the <span> element's parent element (<td>) and its siblings (the <td> elements holding the "Previous Topic" and "Next Topic" buttons, respectively) also get their "display" attribute set to "none" when the current topic is not part of a Browse Sequence.
First, I commented-out the "span.style.display="none";" line and append what's shown below. This takes care of hiding all the <td> elements when a non-Browse Sequence topic is loaded:
Code: Select all
// span.style.display="none";
span.parentNode.style.display="none";
span.parentNode.nextSibling.style.display="none";
span.parentNode.previousSibling.style.display="none";
Code: Select all
// span.style.display="";
span.parentNode.style.display="";
span.parentNode.nextSibling.style.display="";
span.parentNode.previousSibling.style.display="";
As I mentioned, this is pretty "brute force", but it gets the job done. I hope this can be of use to someone else out there!