if (document.getElementById && document.getElementsByTagName) {
if (window.addEventListener) window.addEventListener('load', initAnims, false);
else if (window.attachEvent) window.attachEvent('onload', initAnims);
}

$(document).ready(function() {
    $('#tabvanilla > ul').tabs({
        select: function(event, ui) {
            $('div.downloadDot').css({ "background-image": "url(dot.png)" });
            $('div.processingDot').css({ "background-image": "url(dot.png)" });
            $('div.meDot').css({ "background-image": "url(dot.png)" });

            switch (ui.index) {
                case 0:
                    $('div.downloadDot').css({ "background-image": "url(dot_fill.png)" });
                    break;
                case 1:
                    $('div.processingDot').css({ "background-image": "url(dot_fill.png)" });
                    break;
                case 2:
                    $('div.meDot').css({ "background-image": "url(dot_fill.png)" });
                    break;
                default:
                    break;
            }
        }
    });

    $('div.downloadDot').css({ "background-image": "url(dot_fill.png)" });
    $('span.hiddenResume').hide();
    $('#showsugar').click(function() {
        $('span.hiddenResume').toggle(500);
    });
});
	
//initial (starting) position (the second value will be declared as percentage, using the pUnit variable.
//Unit used for positions
//current (starting) frame
//max frame.
//width, height change (delta position) for each frame
//milisecond intervals the animation will be played.
		
function initAnims() {
    //	Init background frame based animation	    
	classChange(document.getElementById('processing'),'scriptactive','noscript')
	var animElements = document.getElementById('processing').getElementsByTagName('a');
	for(var i=0; i<animElements.length; i++) 
	{
		animElements[i].bgAnim = { iPos:[0,0], pUnit:['%','px'], cFrame:0, mFrame:10, dPos:[0,-30], mSec:25 }
		animElements[i].onmouseover = backPosAnimF;
		animElements[i].onmouseout = backPosAnimR;
    }
    
	classChange(document.getElementById('download'),'scriptactive','noscript')
	var animElements = document.getElementById('download').getElementsByTagName('a');
	for(var i=0; i<animElements.length; i++) 
	{
		animElements[i].bgAnim = { iPos:[0,0], pUnit:['%','px'], cFrame:0, mFrame:10, dPos:[0,-30], mSec:25 }
		animElements[i].onmouseover = backPosAnimF;
		animElements[i].onmouseout = backPosAnimR;
    }    
    
	classChange(document.getElementById('me'),'scriptactive','noscript')
	var animElements = document.getElementById('me').getElementsByTagName('a');
	for(var i=0; i<animElements.length; i++) 
	{
		animElements[i].bgAnim = { iPos:[0,0], pUnit:['%','px'], cFrame:0, mFrame:10, dPos:[0,-30], mSec:25 }
		animElements[i].onmouseover = backPosAnimF;
		animElements[i].onmouseout = backPosAnimR;
    } 
        		
	function backPosAnimF() {
		doBackPosAnim(this, this.bgAnim, 0, 7);
	}
	
	function backPosAnimR() {
		doBackPosAnim(this, this.bgAnim, this.bgAnim.cFrame, this.bgAnim.mFrame);
	}
}

function doBackPosAnim( elem, vrH, startFrm, endFrm ) 
{
	if (vrH.intID) window.clearInterval(vrH.intID);
	var actStep = 0, steps = Math.abs(endFrm - startFrm)+1;
	vrH.intID = window.setInterval(
		function() {
			vrH.cFrame = easeInOut(startFrm,endFrm,steps,actStep,1);
			vrH.cPos = [
				vrH.iPos[0]+vrH.cFrame*vrH.dPos[0], 
				vrH.iPos[1]+vrH.cFrame*vrH.dPos[1] 
 				];
			elem.style.backgroundPosition = vrH.cPos[0]+vrH.pUnit[0]+' '+vrH.cPos[1]+vrH.pUnit[1];
			actStep++;
			if (actStep > steps) window.clearInterval(vrH.intID);
		}
		,vrH.mSec)
}

function easeInOut( minValue, maxValue, totalSteps, actualStep, power ) 
{
	totalSteps = Math.max(totalSteps, 1)
	var delta = maxValue - minValue;
	var stepp = minValue+(Math.pow(((1 / totalSteps)*actualStep),power)*delta);
	return Math.ceil(stepp)
}

function classChange( elem, addClass, remClass ) 
{
	if (!elem.className) elem.className = '';
	var clsnm = elem.className;
	if (addClass && !clsnm.match(RegExp("\\b"+addClass+"\\b"))) clsnm = clsnm.replace(/(\S$)/,'$1 ')+addClass;
	if (remClass) clsnm = clsnm.replace(RegExp("(\\s*\\b"+remClass+"\\b(\\s*))*","g"),'$2');
	elem.className=clsnm;
}