var passedWidth = 0;


function setWidth(width){
    passedWidth = width-8;
    toggleEffect();
}

var startWidth;
var effectDone = false;

var moInnerDiv = null;
var moOuterDiv = null;

function toggleEffect() {
    if(!moInnerDiv && !moOuterDiv){
        moInnerDiv = document.getElementById("hiInner");
        moOuterDiv = document.getElementById("hiOut");
    }

    fnHideHiDivs();
    if ( !effectDone ) {
        startEffect();
        effectDone = true;
    }
    else {
        resetEffect();
        effectDone = false;
    }
}

function startEffect() {
    var attributes = { width: { to: passedWidth } };
    var anim = new YAHOO.util.Anim('complexSearchContainer', attributes, .5);
    anim.onComplete.subscribe(function() {
        fnToggleInner();
    });
    anim.animate();
}

function resetEffect() {
    var attributes = { width: { to: passedWidth }};
    var anim = new YAHOO.util.Anim('complexSearchContainer', attributes, .5);
    anim.onComplete.subscribe(function() {
        fnToggleOuter();
    });
    anim.animate();

}

function fnHideHiDivs(){
    moOuterDiv.style.display = 'none';
    moInnerDiv.style.display = 'none';
}

function fnToggleInner(){
    moInnerDiv.style.display = 'inline';
}

function fnToggleOuter(){
    moOuterDiv.style.display = 'inline';
}