//
// where "some_blank_image.gif" is a blank navigation button.
//
// Then, to load the actual nav bar, add the following to the tag:
//
// onload="initialize_menu()" onresize="initialize_menu()"
//
// You're set! Just configure the items below and you are on your way.
//
// If you would like to have a way to make the navigation menu to collapse to its default
// state, call the "collapse_menu()" javascript function as the result of the event which you wish
// to have trigger this. The recommended use is to place a transparent spacer graphics around
// the navigation bar and using an onmouseover event to trigger the menu collapse. By referencing
// each of these spacers as shown in the example below, the menu will collapse whenever the mouse cursor
// leaves the menu area:
//
// 
//
// If the mouse is moved too quickly across the image the collapse won't be triggered. By making the spacers
// as thick as the design can possibly allow the amount of time the mouse will be over the image increases,
// reducing this problem.
//===========================================================================================
// Begin Configurable Area
//===========================================================================================
// image_offset
// ------------
// Starting from '1', count the number of IMG tags in your HTML code // until you reach the first image in this navigational set. Set this
// to be the number you reach when you count this first nav graphic.
// If the first graphic on the page is part of your nav set, make this 1.
//
// nav_image_count
// ---------------
// Set this to the total number of images that are displayed in your navigation at any one time,
// including any spacers or other embedded non-linking images.
//
// Set these both to 0 if you use the auto_calibrate method explained below.
//
image_offset = 0;
nav_image_count = 0;
// -- OR --
//
// Set "auto_calibrate to 1 to have the previous two values be automatically determined for you.
// This is HIGHLY recommended. The IMG tag of the first navigational image must contain 'name="firstnav"'
// and the IMG tag of the last navigational image must contain 'name="lastnav"' for this
// feature to work. To disable, set to 0.
auto_calibrate = 1;
// Set the following to '1' if you would like the navigation menu on subpages to automatically pop
// open to the correct menu configuration based upon the page you are on. This is useful if you would
// like to use this same code on every page instead of configuring a customized copy for each page.
// Set to 0 to disable this feature.
autodetect_default_state = 1;
// By setting the following to '1' you can override default menu settings by passing menu
// configuration information in the QUERY portion of the URL. This will allow two parameters to
// be passed:
// nav_state - the name of a menu state to load
// clicked_nav - the name of a graphic to highlight
//
// Example: "/subpage.html?nav_state=products&clicked_nav=shoes" will load up with the submenu named
// "products" open and the image named "shoes" highlighted.
allow_url_override = 0;
// If most or all of the nav links will be targeting a different frame or window,
// set this to the javascript identifier for that frame or window. (Example: "top.content"
// for a frame name "content". You can also specify individual targets for specific
// navigational elements later.
default_target = "";
// Optionally this to a URL to redirect to if the browser is way too old to run this. (Will not
// work on browser too old to support JavaScript, of course.)
// [MOSTLY DEPRECATED - There are very few browsers this navigation will not work on that even
// have JavaScript support in the first place.]
fallback_url = "";
// Set the following to the number of milliseconds that the mouse cursor should rest over a
// nav image before a dropdown submenu appears. Using a delay can help the navigation to appear
// less 'jumpy' as the mouse passes over it, making the navigation easier to use. A delay of
// 1000 milliseconds is recommended. Set to 0 for no delay at all.
dropdown_delay = 750;
// Don't touch these at all...
nav_image = new Array();
nav_state = new Array();
// Set this to the nickname of a nav image that should be highlighted by default. (Optional)
default_clicked_image = "";
//===================================================================================================================
// Nav Item/Image Definition Section
//===================================================================================================================
// Now, for each navigational graphic that will be used (excluding "rollover" variations), including any spacers
// or any other non-linking images embedded within the navigation bar, assign a unique one-word nickname and then
// initialize a navigational item for each one below. For example, if you have a nav image named "products.gif",
// add the following line to initialize a navigational item nicknamed "products" that refers to this image:
// nav_image.products = new nav_item("products.gif";
// --- Begin Nav Item/Image Definitions ---
// --- End Nav Item/Image Definitions ---
// A navigational element named "default_image" is mandatory. This should be a blank navigational image. In nearly
// every case there will be at least one navigational bar layout with fewer links in it than the layout with the most
// links in it, this "default_image" will automatically fill in the gap at the bottom of the nav bar in these cases.
// Specify the URL of this image inside the quotation marks below. (This image is not provided by default, you will
// need to create one that fits the design of your page and indicate the name and locaiton below.)
nav_image.default_image = new nav_item(siteBase + "nav/images/nav_blank.gif");
nav_image.default_image.rollover_image_url = "";
// Following the above format and the example above, add similar lines below to initialize a nickname for each
// navigational element you have and listed them in the space below. The nicknames you choose here for each image
// will be the name you use to reference these images elsewhere in this setup.
//
// You can define additional parameters for each or any of the nav images you initialized above. Most of these
// are optional. The parameters currently supported are:
//
// link_url - The URL to redirect to if the image is clicked on.
//
// link_target - The target window or frame that should redirect to "link_url". The default is
// whatever you defined as "default_target" earlier.
//
// rollover_image_url - The path or URL to a version of this image to load if the mouse passes over this image.
//
// rollover_text - Text to display in the browser's status bar when the mouse moves over this image. If left
// blank, the default is to display the value of "link_url".
//
// linked_rollover - Allows you to effectively chain together two or more images, combining them into a single
// large image. Specify the nickname of another image whose "rollover_image_url" should
// be triggered if this one is.
//
// clicked_image_url - Lets you specify a third variation of the graphic that is displayed when you follow the
// link to "link_url". This parameter is also required if "default_clicked_image" is
// set to the nickname of this particular nav image.
//
// state - MANDATORY. This is the nickname of the navigational layout state (nav_state)
// that should be loaded when the mouse passes over this image. If you leave
// this blank (state = "";), then the nav menu will not change at all when this image is moused
// over, no matter what state the menu is currently in.
//
//
// The following example will show how to set parameters for the image nicknamed "products". This example will include
// an example of every parameter available. You only need to define the parameters that you are actually using, however.
//
// Example:
//
// nav_image.products.link_url = "products-1.html";
// nav_image.products.link_target = "top.content_frame";
// nav_image.products.rollover_image_url = "products2.gif";
// nav_image.products.rollover_text = "Our Products";
// nav_image.products.linked_rollover = "moreproducts";
// nav_image.products.clicked__image_url = "products3.gif";
// nav_image.products.state = "product_state";
//
//
// Now, following the format of the example above, add similar lines below to define additional parameters for
// whatever nav images will need them.
// --- Begin Nav Item/Image Definitions & Parameters ---
// --- End Nav Item/Image Definitions & Parameters ---
//===========================================================================================
//===================================================================================================================
// Nav State Definition Section (Navigational Layouts)
//===================================================================================================================
// Each allowed combination of images (or layout) in the navigation bar is a "state". For each state, come up with
// a unique one-word nickname. There must be one nav_state must be named "default_state", this is the state that is
// loaded in situations where no state has been specified. Usually, but not always, this should be configured as the
// layout that is present when the page first loads.
//
// For each state, you will list, on order, the nicknames (assigned above) for each of the navigational images that
// should be displayed when the navigation bar is in this state. Your longest lists should have as many nicknames
// listed as the value you assigned for "nav_image_count" earlier. (If this is not the case then it's possible that
// the value you assigned to "nav_image_count" is incorrect.) For your lists that are shorter, you do not need to pad
// them out with references to your default spacer image, this will happen automatically. In the example below,
// a nav_state nicknamed "products" is being created:
//
// nav_state.products = new nav_order("products","moreproducts","sub1","sub2","services","about","home);
//
// One nav_state named "default_state" is required. Define its members here...
// Set this to the nickname of the navigational state that should load first (unless overridden
// by other means.)
current_state = "default_state";
nav_state.default_state = new nav_order();
// Now, following the format of the example above, add similar lines below to define additional nav_states for
// whatever navigational layouts you need.
//
// --- Begin Nav State Definitions ---
// ---- End Nav State Definitions ----
//===========================================================================================
//===========================================================================================
//
// NO CUSTOMIZABLE FEATURES BELOW THIS POINT.
//
//===========================================================================================
//===========================================================================================
end_image = (image_offset + nav_image_count) - 1;
clicked_nav = default_clicked_image;
default_nav_state = current_state;
initialized = 0;
var goodbrowser = 0;
var button_down = "";
browserName = navigator.appName.substring(0,8);
browserVer = parseFloat(navigator.appVersion);
if ((browserName == "Netscape" && 4 <= browserVer)||
(browserName == "Microsof" && 4 <= parseInt(navigator.appVersion))){
goodbrowser = 1;
}
function preloadMain(){
if (!goodbrowser) {
location.href=fallback_url;
}
else{
// Pre-load images
for (i in nav_image){
tmp = "";
if (nav_image[i].image_url != ""){
tmp = nav_image[i].image_url;
nav_image[i].image_url_src = new Image();
nav_image[i].image_url_src.src = tmp;
}
}
}
}
function preloadRoll(){
if (!goodbrowser) {
location.href=fallback_url;
}
else{
// Pre-load images
for (i in nav_image){
tmp = "";
if (nav_image[i].rollover_image_url != ""){
tmp = nav_image[i].rollover_image_url;
nav_image[i].rollover_image_url_src = new Image();
nav_image[i].rollover_image_url_src.src = tmp;
}
}
}
}
function nav_item(my_url){
this.image_url = my_url;
}
function nav_order(){
var x = 1;
for (var i=0; i < arguments.length; i++){
this[x] = arguments[i];
x++;
}
}
function load_image(imagenum,triggername){
var image_index = (imagenum + image_offset) - 2;
var tmp_image_name = nav_state[current_state][imagenum];
if ((tmp_image_name == "")||(!tmp_image_name)){
var tmp_image_name = "default_image";
}
if (clicked_nav == tmp_image_name){
if ((nav_image[tmp_image_name].clicked_image_url)&&(nav_image[tmp_image_name].clicked_image_url != "")){
var tmp_image_src = nav_image[tmp_image_name].clicked_image_url;
}
else{
var tmp_image_src = nav_image[tmp_image_name].image_url_src.src;
}
}
else if ((triggername)&&(triggername == tmp_image_name)){
if ((nav_image[tmp_image_name].rollover_image_url)&&(nav_image[tmp_image_name].rollover_image_url != "")){
var tmp_image_src = nav_image[tmp_image_name].rollover_image_url_src.src;
}
else{
var tmp_image_src = nav_image[tmp_image_name].image_url_src.src;
}
}
else{
var tmp_image_src = nav_image[tmp_image_name].image_url_src.src;
}
document.images[image_index].src = tmp_image_src;
}
function update_nav(imagenum){
tmpX = imagenum;
if ((initialized == 1)&&(image_offset > 0)&&(nav_image_count > 0)){
var image_index = (imagenum + image_offset) - 2;
var tmp_image_name = nav_state[current_state][imagenum];
if (!tmp_image_name){
var tmp_image_name = "default_image";
}
var tmp_state_name = nav_image[tmp_image_name].state;
if ((tmp_state_name != current_state)&&(tmp_state_name != "")&&(tmp_state_name)){
var tmp_rollover = nav_image[tmp_image_name].rollover_image_url;
if ((tmp_rollover)&&(tmp_rollover != "")){
tmp_rollover_src = nav_image[tmp_image_name].rollover_image_url_src.src;
if ((tmp_rollover_src)&&(tmp_rollover_src != "")){
document.images[image_index].src = tmp_rollover_src;
}
}
var tmp_link_url = nav_image[tmp_image_name].link_url;
var tmp_rollover_text = nav_image[tmp_image_name].rollover_text;
if ((tmp_rollover_text)&&(tmp_rollover_text != "")){
window.status = tmp_rollover_text;
}
else if ((tmp_link_url)&&(tmp_link_url != "")){
window.status = tmp_link_url;
}
else{
window.status = "";
}
var tmp_linked_to = nav_image[tmp_image_name].linked_rollover;
if ((tmp_linked_to)&&(tmp_linked_to != "")){
for (var i = 1; i <= nav_image_count; i++) {
var tmp_image_name2 = nav_state[current_state][i];
if (!tmp_image_name2){
var tmp_image_name2 = "default_image";
}
if (tmp_image_name2 == tmp_linked_to){
var tmp_rollover = nav_image[tmp_image_name2].rollover_image_url;
if ((tmp_rollover)&&(tmp_rollover != "")){
var image_index = (i + image_offset) - 2;
var tmp_rollover_src = nav_image[tmp_image_name2].rollover_image_url_src.src;
if ((tmp_rollover_src)&&(tmp_rollover_src != "")){
document.images[image_index].src = tmp_rollover_src;
}
}
}
}
}
setTimeout("real_update_nav(tmpX)",dropdown_delay);
}
else{
real_update_nav(tmpX);
}
}
}
function real_update_nav(imagenum){
if ((initialized == 1)&&(image_offset > 0)&&(nav_image_count > 0)){
collapse_toggler = 1;
var image_index = (imagenum + image_offset) - 2;
var tmp_image_name = nav_state[current_state][imagenum];
if (!tmp_image_name){
var tmp_image_name = "default_image";
}
var tmp_state_name = nav_image[tmp_image_name].state;
if ((tmp_state_name != current_state)&&(tmp_state_name != "")&&(tmp_state_name)){
current_state = tmp_state_name;
var tmp_clicked = clicked_nav;
clicked_nav = "";
for (var i = 1; i <= nav_image_count; i++) {
load_image(i,tmp_image_name);
}
clicked_nav = tmp_clicked;
}
else{
var tmp_rollover = nav_image[tmp_image_name].rollover_image_url;
if ((tmp_rollover)&&(tmp_rollover != "")){
tmp_rollover_src = nav_image[tmp_image_name].rollover_image_url_src.src;
if ((tmp_rollover_src)&&(tmp_rollover_src != "")){
document.images[image_index].src = tmp_rollover_src;
}
}
}
var tmp_link_url = nav_image[tmp_image_name].link_url;
var tmp_rollover_text = nav_image[tmp_image_name].rollover_text;
if ((tmp_rollover_text)&&(tmp_rollover_text != "")){
window.status = tmp_rollover_text;
}
else if ((tmp_link_url)&&(tmp_link_url != "")){
window.status = tmp_link_url;
}
else{
window.status = "";
}
var tmp_linked_to = nav_image[tmp_image_name].linked_rollover;
if ((tmp_linked_to)&&(tmp_linked_to != "")){
for (var i = 1; i <= nav_image_count; i++) {
var tmp_image_name2 = nav_state[current_state][i];
if (!tmp_image_name2){
var tmp_image_name2 = "default_image";
}
if (tmp_image_name2 == tmp_linked_to){
var tmp_rollover = nav_image[tmp_image_name2].rollover_image_url;
if ((tmp_rollover)&&(tmp_rollover != "")){
var image_index = (i + image_offset) - 2;
var tmp_rollover_src = nav_image[tmp_image_name2].rollover_image_url_src.src;
if ((tmp_rollover_src)&&(tmp_rollover_src != "")){
document.images[image_index].src = tmp_rollover_src;
}
}
}
}
}
}
}
function restore_nav(imagenum){
if ((initialized == 1)&&(image_offset > 0)&&(nav_image_count > 0)){
var image_index = (imagenum + image_offset) - 2;
window.status = "";
var tmp_image_name = nav_state[current_state][imagenum];
if (!tmp_image_name){
var tmp_image_name = "default_image";
}
var tmp_image_url = nav_image[tmp_image_name].image_url;
if ((tmp_image_url)&&(tmp_image_url != "")){
var tmp_image_src = nav_image[tmp_image_name].image_url_src.src;
if (tmp_image_src != ""){
document.images[image_index].src = tmp_image_src;
}
}
var tmp_linked_to = nav_image[tmp_image_name].linked_rollover;
if ((tmp_linked_to)&&(tmp_linked_to != "")){
for (var i = 1; i <= nav_image_count; i++) {
var tmp_image_name2 = nav_state[current_state][i];
if (!tmp_image_name2){
var tmp_image_name2 = "default_image";
}
if (tmp_image_name2 == tmp_linked_to){
var tmp_rollover = nav_image[tmp_image_name2].image_url;
if ((tmp_rollover)&&(tmp_rollover != "")){
var image_index = (i + image_offset) - 2;
var tmp_rollover_src = nav_image[tmp_image_name2].image_url_src.src;
if ((tmp_rollover_src)&&(tmp_rollover_src != "")){
document.images[image_index].src = tmp_rollover_src;
}
}
}
}
}
var tmp_clicked = clicked_nav;
clicked_nav = "";
for (var i = 1; i <= nav_image_count; i++) {
load_image(i);
}
clicked_nav = tmp_clicked;
}
}
function nav_click(imagenum){
var image_index = (imagenum + image_offset) - 2;
var tmp_image_name = nav_state[current_state][imagenum];
if (!tmp_image_name){
var tmp_image_name = "default_image";
}
else{
clicked_nav = tmp_image_name;
}
var tmp_link_url = nav_image[tmp_image_name].link_url;
var tmp_link_target = nav_image[tmp_image_name].link_target;
var tmptarget = "";
if ((tmp_link_target)&&(tmp_link_target != "")){
var tmptarget = tmp_link_target + ".location.href";
}
else if (default_target != ""){
var tmptarget = default_target + ".location.href";
}
else{
var tmptarget = "location.href";
}
var eval_str = tmptarget + " = '" + tmp_link_url + "';";
var tmp_clickover = nav_image[tmp_image_name].clicked_image_url;
if ((tmp_clickover)&&(tmp_clickover != "")){
var tmp_clickover_src = nav_image[tmp_image_name].clicked_image_url;
if (tmp_clickover_src != ""){
document.images[image_index].src = tmp_clickover_src;
}
}
for (var i = 1; i <= nav_image_count; i++) {
load_image(i);
}
if ((tmp_link_url)&&(tmp_link_url != "")){
eval(eval_str);
}
}
collapse_toggler = 0;
function collapse_menu(){
if ((initialized == 1)&&(image_offset > 0)&&(nav_image_count > 0)){
window.status = "";
if (collapse_toggler == 1){
current_state = default_nav_state;
initialize_menu();
collapse_toggler = 0;
}
}
}
function force_collapse_menu(){
current_state = default_nav_state;
initialize_menu();
}
function check_url_string(){
search_string = location.search;
search_string = search_string.substring(1,search_string.length);
var_pairs = search_string.split('&');
for (var i = 0; i < var_pairs.length; i++){
var_info = var_pairs[i].split('=');
if (var_info[0] == "nav_state"){
if ((var_info[1])&&(var_info[1] != "")){
current_state = var_info[1];
default_nav_state = current_state;
}
}
if (var_info[0] == "clicked_nav"){
if ((var_info[1])&&(var_info[1] != "")){
clicked_nav = var_info[1];
}
}
}
}
function initialize_menu(){
preloadMain();
initialized = 0;
current_state = "default_state";
default_nav_state = "default_state";
clicked_nav = default_clicked_image;
if (auto_calibrate == 1){
if ((document.images["firstnav"].src)&&(document.images["lastnav"].src)){
var z = 0;
last_was_a_nav = 0;
for (i= 0; i