Breadcrumb navigation in Livelink 9

Customisation Title	Breadcrumb navigation in Livelink 9
Purpose of Customisation	Use Breadcrumb Trail style navigation in Livelink 9 rather than the standard Dropdown menu.
Author	Greg Griffiths
Date of Customisation	16 May 2003
Covers Livelink	Livelink 9
Livelink Modules	Webnode
Affected Templates	\webnode\html\locationpopup.html \webwfp\html\locationpopup.html
Customisation Format	HTML
Download Here	Download as a ZIP file

I was at LiveLinkUp in Paris recently and saw a few demos of Livelink 10. One of the major changes in the new release is the revised User Interface including a Breadcrumb trail navigation menu rather than the dropdown style we currently have. I decided to see if i could get it to work in Livelink 9, and sure enough it was possible.

The dropdown list itself is in the locationpopup.html file, all that was needed was to remove the HTML select control, amend the file so that each element was created as a link and add a spacer between the elements. This worked fine for nearly all items, but some Object Types - e.g. Form Templates - have code in some of their screens that interacts with the dropdown list - mainly to remove the currently element from it - so I readded the HTML select control as a hidden element to stop the page breaking.

;if displayIcon
    `%LwebNode.IMG( nodeRec )`
;end
<SELECT NAME="locationSel" ONCHANGE="SelLoc( this.form, this.options[ this.selectedIndex ].value )">
// add in a HTML Form Select Control to ensure that any functions that are looking for the control find it,
// but its hidden from the user display using CSS
<SELECT NAME="locationSel" style="display:none"></SELECT>
;for element in location
    ;if IsDefined( element )
        <OPTION VALUE="`%Lelement.url`"`( element in location == Length( location ) ) ? " SELECTED" : ""`>`element.name`
    ;else
        <OPTION VALUE=""> --------------------
    ;end
    // check that we have a URL, this is to solve the issue of some elements such as a Form Template that don't provide a URL
    // and have code on their forms to remove themselves from this list.
    ;if (Length(element.url)>0)
        // put a link in for each element and add a <space>|<space> delimiter if not the last item.
        <a href="`%Lelement.url`">`element.name`</a>`%L( element in location == Length( location ) ) ? "" : " | "`
    ;end
;end
</SELECT>

For some reason, the Workflow Painter module has its own copy of this file, which is slightly different from the main one. Thus, if we wish to use the breadcrumb system throughout our Livelink interface we will need to amend that template as well.

<TD NOWRAP ALIGN="LEFT">
    <SELECT NAME="locationSel" ONCHANGE="WFSelLoc( this.form, this.options[ this.selectedIndex ].value )">
        ;for element in location
            ;if IsDefined( element )
                <OPTION VALUE="`%Lelement.url`"`( element in location == Length( location ) ) ? " SELECTED" : ""`>`element.name`
            ;else
                <OPTION VALUE=""> --------------------
            ;end
            // check that we have a URL, this is to solve the issue of some elements such as a Form Template that don't provide a URL
            // and have code on their forms to remove themselves from this list.
            ;if (Length(element.url)>0)
                    // put a link in for each element and add a <space>|<space> delimiter if not the last item.
                <a href="`%Lelement.url`">`element.name`</a>`%L( element in location == Length( location ) ) ? "" : " | "`
            ;end
        ;end
    </SELECT>

In the download file, there is a readme file showing which file goes where as both files have the same filename, please make sure that you place the right file in the right place.