//  --navbar.js--
//  Copyright 2002  Niels Jäckel | www.racoonia.de | www.hifiwissen.de
//  niels.j@gmx.de
//
//
//  the sourcecode is compatible with: internet explorer 5 / 6 , netscape 4 / 6 , opera 5 / 6
//
//
//  This document is divided in the following parts:
//
//  1. variables
//  2. objects
//  3. methods
//  4. more functions
//
//
//
//    VARIABLES
//    ~~~~~~~~~
//
//  these variables are important for displaying the navigation-bar for each browser perfectly
//
//     ver... version of browser
//     dom... does the browser support the DOM (Document Object Model) ?
//     ie...  is it the internet explorer?
//     ns4... is it the netscape communicator 4.75?
//     ns6... is it the netscape communicator 6?
//     op...  is it opera


var ver = navigator.appVersion.charAt(0);
var dom = (document.getElementById) ? true : false;
var ie = (document.all) ? true : false;
var ns4 = (navigator.appName.indexOf('Netscape') != -1 && ver == '4') ? true : false;
var ns6 = (navigator.appName.indexOf('Netscape') != -1 && ver == '5') ? true : false;
var op = (window.opera) ? true : false;

//
//
//    OBJECTS
//    ~~~~~~~
//

function navbar(a, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, z)
{
if (navigator.appName=="Microsoft Internet Explorer")
{
this.left = a;
this.top = b+11;
this.height = c;
this.width = d;
this.background = e;
this.leftimage = f;
this.leftimagewidth = g;
this.rightimage = h;
this.rightimagewidth = i;
this.menuwidth = j;
this.menubackground = k;
this.menuitemheight = l;
this.menuitembackground = m;
this.menuactiveitembackground = n;
this.menubottomheight = o;
this.menubottombackground = p;
this.css = q;
this.spacerimage = z;

this.source = '';

this.menus = new Array();

this.addmenu = navbaraddmenu;
this.create = navbarcreate;
this.show = navbarshow;

}
else
{this.left = a;
this.top = b+4;
this.height = c;
this.width = d;
this.background = e;
this.leftimage = f;
this.leftimagewidth = g;
this.rightimage = h;
this.rightimagewidth = i;
this.menuwidth = j;
this.menubackground = k;
this.menuitemheight = l;
this.menuitembackground = m;
this.menuactiveitembackground = n;
this.menubottomheight = o;
this.menubottombackground = p;
this.css = q;
this.spacerimage = z;

this.source = '';

this.menus = new Array();

this.addmenu = navbaraddmenu;
this.create = navbarcreate;
this.show = navbarshow;

}
}


function menu(a, b, c, d)
{
this.title = a;
this.href = b;
this.target = c;
this.itemcss = d;

this.items = new Array();

this.additem = navbarmenuadditem;
}

function item(a, b, c)
{
this.title = a;
this.href = b;
this.target = c;
}

//
//
//    METHODS
//    ~~~~~~~
//
//

function navbaraddmenu(a, b, c, d)   // add a new menu to the navigation bar
{
this.menus[this.menus.length] = new menu(a, b, c, d);
}

function navbarmenuadditem(a, b, c)  // add a new item to a menu in the navigation bar
{
this.items[this.items.length] = new item(a, b, c);
}

function navbarcreate()                // create the source-code of the navigation-bar.
{
var intermenu = Math.round((((this.width - this.leftimagewidth - this.rightimagewidth) / this.menus.length) - this.menuwidth) / 2);
var lastintermenu = Math.round(this.width - this.leftimagewidth - this.rightimagewidth - (this.menus.length * this.menuwidth) - (this.menus.length * intermenu * 2));
var source = '';

for (var t = 0; t < this.menus.length; t++)
    {

    if (this.menus[t].items.length == 0) { continue; }

    source += '<div id="div' + t + '" style="position:absolute; top:' + this.top + '; left:' + (this.left + this.leftimagewidth + (intermenu * (1+(2*t))) + (this.menuwidth * t)) + '; width:' + this.menuwidth + '; height:' + (this.height + (this.menuitemheight * this.menus[t].items.length) + this.menubottomheight) + '; visibility:hidden;" onMouseover="show(\'div' + t + '\')" onMouseout="unshow(\'div' + t + '\')">';
    source += '<layer onMouseover="show(\'div' + t + '\')" onMouseout="unshow(\'div' + t + '\')">';
    source += '<table width=' + this.menuwidth + ' height=' + (this.height + (this.menuitemheight * this.menus[t].items.length) + this.menubottomheight) + ' cellpadding=0 cellspacing=0 border=0>';
    source += '<tr><td width=' + this.menuwidth + ' height=' + this.height + ' background="' + this.activemenubackground + '"><img src="' + this.spacerimage + '" width=1 height=1></td></tr>';

    for (var n = 0; n < this.menus[t].items.length; n++)
        {
        source += '<tr><td align=right valign=middle width=' + this.menuwidth + ' height=' + this.menuitemheight + ' background="' + this.menuitembackground + '" onmouseover="change_background(this, \'' + this.menuactiveitembackground + '\')" onmouseout="change_background(this, \'' + this.menuitembackground + '\')" onClick="parent.' + this.menus[t].items[n].target + '.location.href=\'' + this.menus[t].items[n].href + '\';">';
        source += '<a href="' + this.menus[t].items[n].href + '" target="' + this.menus[t].items[n].target + '"><span style="' + this.menus[t].itemcss + '">' + this.menus[t].items[n].title + '</span></a>';
        source += '</td></tr>';
        }

    source += '<tr><td width=' + this.menuwidth + ' height=' + this.menubottomheight + ' background="' + this.menubottombackground + '"><img src="' + this.spacerimage + '" width=1 height=1></td></tr>';
    source += '</table></layer></div>';
    }



    source += '<div style="position:absolute; top:' + this.top + '; left:' + this.left + '; width:' + this.width + ';">';
    source += '<table width=' + this.width + ' height=' + this.height + ' border=0 cellpadding=0 cellspacing=0>';
    source += '<tr><td width=' + this.leftimagewidth + ' background="' + this.leftimage + '"><img src="' + this.spacerimage + '" width=1 height=1></td>';

for (var t = 0; t < this.menus.length; t++)
    {
    source += '<td width=' + intermenu + ' background="' + this.background + '"><img src="' + this.spacerimage + '" width=1 height=1></td>';
    source += '<td width=' + this.menuwidth + ' background="' + this.menubackground + '" align=right';

    if (this.menus[t].items.length > 0) { source += ' onMouseover="show(\'div' + t + '\')" onMouseout="unshow(\'div' + t + '\')">'; }
                                   else { source += '>'; }


    source += '<a href="' + this.menus[t].href + '" target="' + this.menus[t].target + '"';

    if (this.menus[t].items.length > 0) { source += ' onMouseover="show(\'div' + t + '\')" onMouseout="unshow(\'div' + t + '\')">'; }
                                   else { source += '>'; }

    source += '<span style="' + this.css + '">' + this.menus[t].title + '</span></a>';
    source += '</td><td width=' + intermenu + ' background="' + this.background + '"><img src="' + this.spacerimage + '" width=1 height=1></td>';
    }

    source += '<td width=' + lastintermenu + ' background="' + this.background + '"><img src="' + this.spacerimage + '" width=1 height=1></td>';
    source += '<td width=' + this.rightimagewidth + ' background="' + this.rightimage + '"><img src="' + this.spacerimage + '" width=1 height=1></td></tr>';
    source += '</table>';

    source += '</div>';

    this.source = source;
}

function navbarshow()        // return the source-code to display it on the screen
{
return this.source;
}

//
//
//    MORE FUNCTIONS
//    ~~~~~~~~~~~~~~
//
//


function show(element)       // show a specified div-shape
{
if (ie && !dom) { document.all[element].style.visibility = 'visible'; }
if (ns4 && !dom) { document[element].visibility = 'show'; }
if (ns6 || op || dom || (ver != '6' && !ns4)) { document.getElementById(element).style.visibility = 'visible'; }
if (op && ver == '6') { document.all[element].style.visibility = 'visible'; }
}

function unshow(element)     // hide a specified div-shape
{
if (ie && !dom) { document.all[element].style.visibility = 'hidden'; }
if (ns4 && !dom) { document[element].visibility = 'hide'; }
if (ns6 || op || dom || (ver != '6' && !ns4)) { document.getElementById(element).style.visibility = 'hidden'; }
if (op && ver == '6') { document.all[element].style.visibility = 'hidden'; }
}

function change_background(element, src)  // change the wallpaper of a cell in a table
{
if (!ns4) { element.style.backgroundImage = 'url(' + src + ')'; }
}  // the netscape communicator doesn't have any posible functions to do that.