/************************************************************************ 

Author: Eric Simmons

Contact: info AT jswitch DOT com

Website: http://www.jswitch.com

Script featured and available at Dynamic Drive: http://www.dynamicdrive.com

Version: 2.1 05/2006       

Browser Target: Mozilla 6+/FireFox Netscape 6+, IE 5.0+

Type: XP Style Menus ver 2.1



DISCLAIMER:

THIS SOFTWARE IS PROVIDED "AS IS" AND WITHOUT

ANY EXPRESS OR IMPLIED WARRANTIES, JSWITCH.COM

IS NOT RESPONSIBLE FOR ANY ADVERSE AFFECTS TO

YOUR COMPUTER OR SYSTEMS RUNNING THIS SCRIPT.



LICENSE:

YOU ARE GRANTED THE RIGHT TO USE THE SCRIPT

PERSONALLY OR COMMERCIALLY. THE AUTHOR, WEBSITE LINKS 

AND LICENSE INFORMATION IN THE HEADER OF THIS SCRIPT

MUST NOT BE MODIFIED OR REMOVED. IF PORTIONS OF THE 

CODE ARE TRANSFERED TO ANOTHER SCRIT THE AUTHORS NAME

AND CONTACT INFORMATION MUST BE STATED IN THE NEW SCRIPT

BY THE PORTIONS CODE THAT HAVE BEEN TRANSFERED.





v2.2

-fixed cookie bug



v2.1

-Mouse events states for title bar

-object index bug fixes

-redesigned to look like XP :)



v 2.0

-W3C HTML 4.01 Transitional compliant

-Support for initially open menu

-New fading capability

-Cookie menu persistence

-Redesigned code





Notes:



If you want a menu to be open initially set the style display to

"inline" in the subMenu class div like this...

<div class="subMenu" style="display:inline;">





The fading effect can be disabled by setting the 

doFading var to false. I have only tested this feature on 

ie 6, Netscape 1.7, firefox 1 & 1.5



If the user has cookies enabled the script will bake a cookie ;) on

the browser to track the state of the menus. This is good news for those

of you who don't use frames, you can now have persistent menu states



Make sure you put the java script include tag after all the menus otherwise

it will not be able find and initialize them. If you have questions, or comments

about the XpStyle Menu v2 send me an email.



And lastly a plug for myself, If you need some professional help with technical

web development please drop me an email, I do contracts for a competitive price. :)







v 1.0

XP style sliding Menu Bar



***********************************************************************/





var menuObjArray = new Array();

menuObjArray[0] = new Array();

menuObjArray[1] = new Array();

menuObjArray[2] = new Array();

menuObjArray[3] = new Array();

menuObjArray[4] = new Array();

menuObjArray[5] = new Array();

menuObjArray[6] = new Array();

menuObjArray[7] = new Array();





var timerSlide = 1;

var numMenuItem = 0;

var slideDelay = 1;

var divHeight = 21; 

var moveSlidePix = 7;

var isLocked = null;

var doFading = false;	//	Para que no falle en el IE





InitAll();



function InitAll()

{

	var divs = document.getElementsByTagName("DIV");

	menuStateAry = GetUserCookie("xpMenuCookv2").split(",");



	aryNum = 0;

	for(dn=0; dn < divs.length;dn++)

	{

		if(String(divs.item(dn).className).substring(0,7) == "topItem")

		{	

			mainMenuDiv = divs.item(dn).parentNode;

			menuContainerDiv= mainMenuDiv.getElementsByTagName("DIV").item(1);

			itemContainerDiv= menuContainerDiv.getElementsByTagName("DIV").item(0);

			

			

			try //to apply cookies settings

			{

				if(menuStateAry != 0)

					itemContainerDiv.style.height = parseInt(menuStateAry[aryNum]) + "px";

				

				if(!doFading)

				{

					

					if (menuContainerDiv.filters)

						menuContainerDiv.filters.alpha.opacity = 100;

					else

						menuContainerDiv.opacity = 1;

				}

					

				if(menuStateAry != 0 )

				{

					if( parseInt(menuStateAry[aryNum]) == 0)

						itemContainerDiv.style.display = 'none';

					else

						itemContainerDiv.style.display = 'inline';

				}

			}

			catch(e)

			{

				e= null; //cookie may not exist yet

			}



			Init(divs.item(dn));

			aryNum++;



		}

	}	

}



function Init(objDiv)

{

    

    if (isLocked)

        return;



    var mainMenuDiv, subMenuDiv, menuContainerDiv, itemContainerDiv,styleRules;



	

	for(r=0;r < document.styleSheets.length; r++)

	{	

		if( -1 != String(document.styleSheets[r].href).indexOf("sddm.css") )	

			break;

	}

	if(!document.styleSheets[r].rules)

		styleRules = document.styleSheets[r].cssRules;

	else

		styleRules = document.styleSheets[r].rules;

		

    numMenuItem = 0;

    mainMenuDiv = objDiv.parentNode;

    subMenuDiv =  mainMenuDiv.getElementsByTagName("DIV").item(0);

    



    menuContainerDiv= mainMenuDiv.getElementsByTagName("DIV").item(1);

    itemContainerDiv= menuContainerDiv.getElementsByTagName("DIV").item(0);

    



    aLen = menuObjArray[0].length;

    for (i=0 ;i < aLen ; i++)

    {

        if (menuObjArray[0][i] == menuContainerDiv)

        {

            break;

        }

    }

    

    if (i == aLen)

    {

        menuObjArray[0][i]  = menuContainerDiv;

        menuObjArray[1][i] = itemContainerDiv;

        menuObjArray[7][i] = subMenuDiv;

        menuObjArray[7][i].onmouseover = ChangeStyle;

        menuObjArray[7][i].onmouseout = ChangeStyle;

        subMenuDiv.onclick = SetSlide;



        

		lastmenuNum = -1;

        for (b=0;b<itemContainerDiv.childNodes.length;b++)

        {

            if (itemContainerDiv.childNodes.item(b).tagName == "DIV")

            { 

                numMenuItem ++;

                itemContainerDiv.childNodes.item(b).onmouseover= ChangeStyle;

                itemContainerDiv.childNodes.item(b).onmouseout= ChangeStyle;

                lastmenuNum = b;

            }

        }  

        

        

		for(r=0;r < styleRules.length; r++)

		{

			tmpStr1 = String(styleRules[r].selectorText);

			tmpStr2 = String("." + itemContainerDiv.childNodes.item(lastmenuNum).className);

			if(tmpStr1 == tmpStr2)

			{

				if(NaN != parseInt(styleRules[r].style.height))

				{

					divHeight = parseInt(styleRules[r].style.height) + 2;

					break;

				}

				

			}

		}

				

        menuObjArray[2][i] = numMenuItem;

        menuObjArray[3][i] = mainMenuDiv;



        if (itemContainerDiv.style.display == "inline")

        {

            menuObjArray[4][i] = numMenuItem * divHeight;

            menuObjArray[0][i].style.height = numMenuItem * divHeight + "px";

            menuObjArray[6][i] = true;

			

            if(doFading)

			{

				if (menuObjArray[0][i].filters)

					menuObjArray[0][i].filters.alpha.opacity = 100;

				else

					menuObjArray[0][i].style.opacity = 1;

			}

            

            

        } else

        {

			menuObjArray[7][i].className = menuObjArray[7][i].className + "Close";

            menuObjArray[4][i] = 0;

            menuObjArray[0][i].style.height = 0 + "px";

            menuObjArray[6][i] = false;

            if(doFading)

			{

				if (menuObjArray[0][i].filters)

					menuObjArray[0][i].filters.alpha.opacity = 0;

				else

					menuObjArray[0][i].style.opacity = .0;

			}

        }



    }//end if



    mainMenuDiv = null;

    subMenuDiv =  null;

    menuContainerDiv= null;

    itemContainerDiv= null;

    

}



function SetSlide()

{   

    if (isLocked)

        return;

    else

        isLocked = this.parentNode;          

    for (i=0 ;i < menuObjArray[0].length; i++)

    {

        if (menuObjArray[3][i] == this.parentNode)

        {

            if (menuObjArray[5][i] == null)

                menuObjArray[5][i] = setInterval("RunSlide(" + i + ")", slideDelay);

            break;

        }

    }



}







function UpdateUserCookie(aryIndex)

{

    date = new Date();

    date.setTime(date.getTime() + (1000 * 60 * 60 * 24 * 30)); 

    document.cookie = "xpMenuCookv2" + "=" + escape(menuObjArray[4].toString()) + "; expires=" + date.toGMTString();  

   

}



function GetUserCookie(crumbName)

{

    colCookie = document.cookie.split("; ");

    

    for (a=0; a < colCookie.length; a++)

    {

        colCrumb = colCookie[a].split("=");                    

        if(colCrumb[0] == crumbName)

            return unescape(colCrumb[1]);

    }



    return "";



}





function RunSlide(objIndex)  

{



    if (menuObjArray[6][objIndex])

    {

		if(doFading)

		{

			if(menuObjArray[0][objIndex].filters)

				menuObjArray[0][objIndex].filters.alpha.opacity -= 100/ ( ( (menuObjArray[2][objIndex] * divHeight) / moveSlidePix) +1);

			else

				menuObjArray[0][objIndex].style.opacity -= .9/(((menuObjArray[2][objIndex] * divHeight) / moveSlidePix)+1);

		}

        menuObjArray[1][objIndex].style.display = 'none';

        menuObjArray[4][objIndex] -=  moveSlidePix;

        if (menuObjArray[4][objIndex] > 0)

            menuObjArray[0][objIndex].style.height = menuObjArray[4][objIndex] + "px";

        else

        {

            if(doFading)

			{

				if(menuObjArray[0][objIndex].filters)

					menuObjArray[0][objIndex].filters.alpha.opacity = 0;

				else

					menuObjArray[0][objIndex].style.opacity = 0;

			}

		

		

			cName = String(menuObjArray[7][objIndex].className);

			//alert(cName);



			if (cName.substring(cName.length - 4, cName.length) == "Item")

			{

				menuObjArray[7][objIndex].className = menuObjArray[7][objIndex].className+"Close";

			}

			

			if (cName.substring(cName.length - 4, cName.length) == "Over")

			{

				menuObjArray[7][objIndex].className = cName.substring(0,cName.length - 4);

				menuObjArray[7][objIndex].className = menuObjArray[7][objIndex].className+"CloseOver";

			}

			

			if (cName.substring(cName.length - 5, cName.length) == "Close")

			{

				menuObjArray[7][objIndex].className = cName.substring(0,cName.length - 5);

				menuObjArray[7][objIndex].className = menuObjArray[7][objIndex].className+"CloseOver";

			}

			

			//cName = String(menuObjArray[7][objIndex].className);

			//alert(cName);

			

			

            menuObjArray[4][objIndex] = 0;

            menuObjArray[0][objIndex].style.height = 0 + "px";

            clearInterval(menuObjArray[5][objIndex]);

            menuObjArray[5][objIndex] = null;

            menuObjArray[6][objIndex] = false;

            isLocked = null;

            UpdateUserCookie(objIndex);

            return 0;

        }

        

        return 0;

        

    }



    if (!menuObjArray[6][objIndex])

    {

		if(doFading)

		{

			if(menuObjArray[0][objIndex].filters)

				menuObjArray[0][objIndex].filters.alpha.opacity += 100/ ( ( (menuObjArray[2][objIndex] * divHeight) / moveSlidePix) +1);

			else

			{

				opcVal = parseFloat(menuObjArray[0][objIndex].style.opacity);

				opcVal += .9/((menuObjArray[2][objIndex] * divHeight) / moveSlidePix);

				menuObjArray[0][objIndex].style.opacity = opcVal;

			}

		}

        menuObjArray[4][objIndex] +=  moveSlidePix;

        if (menuObjArray[4][objIndex] < (menuObjArray[2][objIndex] * divHeight))

            menuObjArray[0][objIndex].style.height = menuObjArray[4][objIndex] + "px";

        else

        {

			

			

			if(doFading)

			{

				if(menuObjArray[0][objIndex].filters)

					menuObjArray[0][objIndex].filters.alpha.opacity = 100;

				else

					menuObjArray[0][objIndex].style.opacity = 1;

			}

			strClassName = String(menuObjArray[7][objIndex].className);

			menuObjArray[4][objIndex] = (menuObjArray[2][objIndex] * divHeight);

			menuObjArray[0][objIndex].style.height = (menuObjArray[2][objIndex] * divHeight)+ "px";			     

            menuObjArray[1][objIndex].style.display = 'inline';

            clearInterval(menuObjArray[5][objIndex]);

            menuObjArray[5][objIndex] = null;

            menuObjArray[6][objIndex] = true;

            

            

            cName = String(menuObjArray[7][objIndex].className);

			//alert(cName);

			if (cName.substring(cName.length - 4, cName.length) == "Over")

			{

				menuObjArray[7][objIndex].className = cName.substring(0,cName.length - 9);

				menuObjArray[7][objIndex].className = menuObjArray[7][objIndex].className+"Over";

			}

			

			if (cName.substring(cName.length - 5, cName.length) == "Close")

			{

				menuObjArray[7][i].className = cName.substring(0,cName.length - 5);

			}

			

			//cName = String(menuObjArray[7][objIndex].className);

			//alert(cName);

			



            isLocked = null;

             UpdateUserCookie(objIndex);

            return 0;

        }       

        return 0;

        

    }





}



function ChangeStyle()

{

    className = String(this.className);

   

    if (className.substring(className.length - 4, className.length) == "Over")

        this.className = className.substring(0,className.length - 4);

    else

        this.className = this.className + "Over";

   //  alert(this.className);

}

