document.onmousemove = checkOpen;

var rolledOut        = false;
var dropPos	     = null;
var length = 140;
var height = 75;



function checkOpen(ev)
{
	if(!rolledOut)
		return;

	ev = ev || window.event;
	var mousePos = mouseCoords(ev);

	if(!((mousePos.x > dropPos.x) && (mousePos.x < (dropPos.x + length)) && (mousePos.y > dropPos.y) && (mousePos.y < (dropPos.y + height))))
	{
		rolledOut = false;
		rollUp();

	}
}

function mouseCoords(ev)
{
        if(ev.pageX || ev.pageY){
                return {x:ev.pageX, y:ev.pageY};
        }
        return {
                x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
                y:ev.clientY + document.body.scrollTop  - document.body.clientTop
        };
}

function getPosition(e)
{
        var left = 0;
        var top = 0;

        if (e.offsetParent)
        {
                left = e.offsetLeft;
                top = e.offsetTop;
                while(e = e.offsetParent)
                {
                        left += e.offsetLeft;
                        top  += e.offsetTop;
                }
        }
        return {x:left, y:top};
}



function roll_over(img_name, img_src)
{
	document.getElementById(img_name).src = img_src;
}


function changeMain(img_name, img_src, number)
{	
	document.getElementById(img_name).src = img_src;
	changeLetters(number);
}

function dropDown()
{
	document.getElementById('dd1').style.visibility = 'visible';
	document.getElementById('dd2').style.visibility = 'visible';
	document.getElementById('id5a').style.visibility = 'visible';
        document.getElementById('id5b').style.visibility = 'visible';


	dropPos = getPosition(document.getElementById('id5'));
	rollDown();


}

function rollDown()
{
	rolledOut = true;

	var cura = parseInt(document.getElementById('id5a').style.top);
	var curb = parseInt(document.getElementById('id5b').style.top);  

	var curaLim = 40;
	var curbLim = 64;
	var step    = 2;

	if ((cura >= curaLim) && (curb >= curbLim))
		return;
	
	if (cura < curaLim)
	{
		var newCura = (cura + step) + 'px';
		document.getElementById('id5a').style.top = newCura;
	}
	if (curb < curbLim)
	{
		var newCurb = (curb + step) + 'px';
                document.getElementById('id5b').style.top = newCurb;
	}

	setTimeout(rollDown, 30);
}

function rollUp()
{
	//rolledOut = false;

        var cura = parseInt(document.getElementById('id5a').style.top);
        var curb = parseInt(document.getElementById('id5b').style.top);

        var curLim = 15;
	var step   = 2;

        if ((cura <= curLim) && (curb <= curLim))
	{
		dropDownOut();
		rolledOut = false;
                return;
	}

        if (cura > curLim)
        {
                var newCura = (cura - step) + 'px';
                document.getElementById('id5a').style.top = newCura;
        }
        if (curb > curLim)
        {
                var newCurb = (curb - step) + 'px';
                document.getElementById('id5b').style.top = newCurb;
        }

        setTimeout(rollUp, 30);
}


function dropDownOut()
{
        document.getElementById('dd1').style.visibility = 'hidden';
	document.getElementById('dd2').style.visibility = 'hidden';
  	document.getElementById('id5a').style.visibility = 'hidden';
        document.getElementById('id5b').style.visibility = 'hidden';
}