// The prefix used to identify state divs.
var stateDivPrefix = "state_";

// The name of the usMap div.
var usMapDiv = "usMap";

// The name of the hidden form field that will contain a comma-delmited 
// list of the selected states.
var selectedStatesField = "selectedStates";


/**
 * Object used to store position data for a state div.
 */
function DivPosition( left, top)
{
    this.left = left;
    this.top = top;
    return this;
}


// List of state DivPositions. Position is specified as ( x, y ).
var statePos = new Array( 52 );

statePos[ 'CA' ] = new DivPosition( 28, 111 );
statePos[ 'ME' ] = new DivPosition( 552, 2 );
statePos[ 'NH' ] = new DivPosition( 545, 39 );
statePos[ 'VT' ] = new DivPosition( 529, 43 );
statePos[ 'MA' ] = new DivPosition( 540, 72 );
statePos[ 'RI' ] = new DivPosition( 556, 82 );
statePos[ 'CT' ] = new DivPosition( 540, 85 );
statePos[ 'NY' ] = new DivPosition( 479, 51 );
statePos[ 'NJ' ] = new DivPosition( 527, 101 );
statePos[ 'DE' ] = new DivPosition( 526, 125 );
statePos[ 'MD' ] = new DivPosition( 491, 129 );
statePos[ 'PA' ] = new DivPosition( 473, 95 );
statePos[ 'WV' ] = new DivPosition( 463, 138 );
statePos[ 'VA' ] = new DivPosition( 460, 138 );
statePos[ 'NC' ] = new DivPosition( 450, 168 );
statePos[ 'SC' ] = new DivPosition( 467, 203 );
statePos[ 'FL' ] = new DivPosition( 425, 262 );
statePos[ 'GA' ] = new DivPosition( 440, 210 );
statePos[ 'AL' ] = new DivPosition( 411, 216 );
statePos[ 'MS' ] = new DivPosition( 378, 220 );
statePos[ 'TN' ] = new DivPosition( 390, 185 );
statePos[ 'KY' ] = new DivPosition( 397, 158 );
statePos[ 'OH' ] = new DivPosition( 432, 111 );
statePos[ 'IN' ] = new DivPosition( 405, 121 );
statePos[ 'MI' ] = new DivPosition( 408, 66 );
statePos[ 'IL' ] = new DivPosition( 367, 119 );
statePos[ 'WI' ] = new DivPosition( 344, 61 );
statePos[ 'LA' ] = new DivPosition( 348, 252 );
statePos[ 'AR' ] = new DivPosition( 338, 200 );
statePos[ 'MO' ] = new DivPosition( 324, 148 );
statePos[ 'IA' ] = new DivPosition( 311, 105 );
statePos[ 'MN' ] = new DivPosition( 300, 34 );
statePos[ 'TX' ] = new DivPosition( 204, 210 );
statePos[ 'OK' ] = new DivPosition( 247, 203 );
statePos[ 'KS' ] = new DivPosition( 257, 160 );
statePos[ 'NE' ] = new DivPosition( 236, 121 );
statePos[ 'SD' ] = new DivPosition( 237, 79 );
statePos[ 'ND' ] = new DivPosition( 237, 37 );
statePos[ 'CO' ] = new DivPosition( 183, 147 );
statePos[ 'NM' ] = new DivPosition( 175, 202 );
statePos[ 'AZ' ] = new DivPosition( 111, 197 );
statePos[ 'UT' ] = new DivPosition( 127, 131 );
statePos[ 'WY' ] = new DivPosition( 166, 91 );
statePos[ 'MT' ] = new DivPosition( 128, 29 );
statePos[ 'HI' ] = new DivPosition( 119, 292 );
statePos[ 'ID' ] = new DivPosition( 108, 30 );
statePos[ 'AK' ] = new DivPosition( 17, 268 );
statePos[ 'NV' ] = new DivPosition( 72, 121 );
statePos[ 'OR' ] = new DivPosition( 35, 55 );
statePos[ 'WA' ] = new DivPosition( 50, 21 );

var statesInitialized = false;


/**
 * Initializes the DHTML state selection script.
 */
//function initStates()
//{
//    statesInitialized = true;
//    
//    // Un-comment the following line to show all states
//    // when the page is loaded.
//   //selectAllStates( true );
//}


/**
 * Toggles whether or not the specified state is selected.
 * @param stateName Name of the state.
 */
function initStates()
	{
		statesInitialized = true;
	    
		// Un-comment the following line to show all states
		// when the page is loaded.
		//selectAllStates( true );
	    
	} 
function toggleSelectedState( stateName )
{
    if ( !statesInitialized )
    {
        return;
    }
 
    var divName = getDivName( stateName );
       
    if ( isStateSelected( divName ) )
    {
        setStateVisible( divName, false );
        setStateShowDisabled( divName, true );
        setStateSelected( divName, false );
    }
    else
    {
    	lnk = 'RepArea.aspx?State=' +stateName;
		window.location = lnk;  
        setStateSelected( divName, false );
    }
}


/**
 * Shows the specified state.
 * @param stateName Name of the state.
 */
function showState( stateName )
{
    if ( !statesInitialized )
    {
        return;
    }
    
    var divName = getDivName( stateName );
    
    if ( isStateShowDisabled( divName ) )
    {
        return;
    }
    
    var position = statePos[ stateName ];
    
    var mapX = getXCoordinate( usMapDiv );
    var mapY = getYCoordinate( usMapDiv );
    
    moveStateTo( divName, mapX + position.left, mapY + position.top );
    setStateVisible( divName, true );
}


/**
 * Returns the name of the div tag that contains the specified
 * state.
 * @param stateName Name of the state.
 */
function getDivName( stateName )
{
    return stateDivPrefix + stateName;
}


/**
 * Selects all of the states.
 * @selectAll Boolean flag indication whether or not all states
 * should be selected.
 */
function selectAllStates( selectAll )
{
    if ( selectAll )
    {
        for ( state in statePos )
        {
            showState( state );
            setStateSelected( getDivName( state ), true );
        }
    }  
    else
    {
        hideAllStates( true );
    }
} 
 

/**
 * Clears the specified state's showDisabled flag.
 * @param stateName Name of the state.
 */
function clearShowDisabled( name )
{
    setStateShowDisabled( getDivName( name ), false );
}


/**
 * Returns a comma delimited list of all selected states.
 * @theForm The html form that the "Search" button submits.
 */
function getSelectedStates( theForm )
{
    var selectedStates = "";
    var divName = null;
    
    for ( state in statePos )
    {
        divName = getDivName( state );
        if ( isStateSelected( divName ) )
        {
            selectedStates += state;
            selectedStates += ",";
        }
    }
    
    // If states have been selected, remove the last comma from the list. 
    // There is no way to know when we reach the last selected state while
    // iterating through the statePos Array so we have to do this here.
    if ( selectedStates.length > 0 )
    {
        selectedStates = selectedStates.substring( 0, selectedStates.length - 1 );
    }
    
    theForm.elements[ selectedStatesField ].value = selectedStates; 
    
    // Un-comment the following line to see what states have been selected.
    // alert( theForm.elements[ selectedStatesField ].value );
}


//
// Browser abstraction methods.
//


/**
 * Hides all non-selected states.
 */
function hideAllStates()
{
    hideAllStates( false );
}

function hideAllStates( clearSelected )
{
    if ( !statesInitialized )
    {
        return;
    }
    
    // DOM browsers.
    if ( document.getElementById )
    {
        var stateDiv = null;
        
        // Change the visibility of each State's Div.
        for ( state in statePos ) 
        {
            stateDiv = document.getElementById( getDivName( state ) );
           
            if( clearSelected || !isStateSelected( stateDiv.id ) )
            {
                stateDiv.style.visibility = "hidden";
                setStateSelected( stateDiv.id, false );
            } 
        }
    }   
    
    // Netscape 4.x.
    else if ( document.layers )
    {  
        var layer = null;
        
        for ( var i = 0 ; i < document.layers.length ; i++ )
        {
            layer = document.layers[ i ];
            if ( layer.name.indexOf( stateDivPrefix ) == 0 && 
                 ( clearSelected || !isStateSelected( layer.name ) ) )
            {
                layer.visibility = "hide";
                setStateSelected( layer.name, false );
            }   
        }
    }
    
    // IE.
    else
    {
        var divs = document.all.tags( "DIV" );
        for ( var i = 0 ; i < divs.length ; i++ )
        {
            if ( divs[ i ].id.indexOf( stateDivPrefix ) == 0 &&
                 ( clearSelected || !isStateSelected( divs[ i ].id ) ) )
            {
                divs[ i ].style.visibility = "hidden";
                setStateSelected( divs[ i ].id, false );
            }
        }
    }
}


/**
 * Sets the specified state div's visibility.
 * @param name Name of the state div.
 * @param visible Flag indicating the desired visibility. (true|false)
 */
function setStateVisible( name, visible )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        document.getElementById( name ).style.visibility = ( visible ? "visible" : "hidden" );
    }
    
    // Netscape.
    else if ( document.layers )
    {
        document.layers[ name ].visibility = ( visible ? "show" : "hide" );
    }
    
    // IE.
    else if ( document.all )
    {
         document.all[ name ].style.visibility = ( visible ? "visible" : "hidden" );
    }
}


/**
 * Returns true if the specified state div is visible.
 * @param name Name of the state div.
 */
function isStateVisible( name )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        document.getElementById( name ).style.visibility == "visible";
    }
    
    // Netscape.
    else if ( document.layers )
    {
        return document.layers[ name ].visibility == "show";
    }
    
    // IE.
    else if ( document.all )
    {
        return document.all[ name ].style.visibility == "visible";
    }
}


/**
 * Sets the specified state div's selected flag.
 * @param name Name of the state div.
 * @param visible Flag indicating if the state is selected. (true|false)
 */
function setStateSelected( name, selected )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        document.getElementById( name ).stateSelected = selected;
    }
    
    // Netscape.
    else if ( document.layers )
    {
        document.layers[ name ].stateSelected = selected;
    }
    
    // IE.
    else if ( document.all )
    {
         document.all[ name ].stateSelected = selected;
    }
}


/**
 * Returns true if the specified state div is already selected.
 * @param name Name of the state div.
 */
function isStateSelected( name )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        return document.getElementById( name ).stateSelected;
    }
    
    // Netscape.
    else if ( document.layers )
    {
        return document.layers[ name ].stateSelected;;
    }
    
    // IE.
    else if ( document.all )
    {
        return document.all[ name ].stateSelected;
    }
}


/**
 * Sets the specified state div's showDisabled flag.
 * @param name Name of the state div.
 * @param visible Flag indicating if the state's show function should 
 * be disabled. (true|false)
 */
function setStateShowDisabled( name, disabled )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        document.getElementById( name ).showDisabled = disabled
    }
    
    // Netscape.
    else if ( document.layers )
    {
        document.layers[ name ].showDisabled = disabled;
    }
    
    // IE.
    else if ( document.all )
    {
         document.all[ name ].showDisabled = disabled;
    }
}


/**
 * Returns true if the specified state div's showDisabled flag is set..
 * @param name Name of the state div.
 */
function isStateShowDisabled( name )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        return document.getElementById( name ).showDisabled;
    }
    
    // Netscape.
    else if ( document.layers )
    {
        return document.layers[ name ].showDisabled;;
    }
    
    // IE.
    else if ( document.all )
    {
        return document.all[ name ].showDisabled;
    }
}


/**
 * Moves the specified state div to the specified position.
 * @param name Name of the state div.
 * @param xpos Destination x-coordinate.
 * @param ypos Destination y-coordinate.
 */
function moveStateTo( name, xPos, yPos ) 
{
    // DOM browsers.
    if ( document.getElementById )
    {    
        document.getElementById( name ).style.left = xPos;
        document.getElementById( name ).style.top = yPos;
    }
    
    // Netscape.
    else if ( document.layers ) 
    {
        document.layers[ name ].moveTo( xPos, yPos );
    } 
    
    // IE.
    else if ( document.all ) 
    {
        document.all[ name ].style.left = xPos;
        document.all[ name ].style.top = yPos;
    }
}


/**
 * Returns the x-coordinate of the top-left corner of the specified div.
 * @param name Name of the state div.
 */
function getXCoordinate( name )
{   
    // DOM browsers.
    if ( document.getElementById )
    {
        return document.getElementById( name ).offsetLeft;
    }
    
    // Netscape.
    else if ( document.layers ) 
    {
        return document.layers[ name ].pageX;
    } 
    
    // IE 5.5.
    else if ( document.all ) 
    {
        return getRealX( document.all[ name ] );
    }
}


/**
 * Returns the y-coordinate of the top-left corner of the specified div.
 * @param name Name of the state div.
 */
function getYCoordinate( name )
{
    // DOM browsers.
    if ( document.getElementById )
    {
        return document.getElementById( name ).offsetTop;
    }
    
    // Netscape.
    else if ( document.layers ) 
    {
        return document.layers[ name ].pageY;
    } 
    
    // IE 5.5.
    else if ( document.all ) 
    {
        return getRealY( document.all[ name ] );
    }
}


/**
 * Returns the "real X" coordinate for IE 5.5.
 * @param stateDiv The state div.
 */
function getRealX( stateDiv ) 
{
	var xPos = eval( stateDiv ).offsetLeft;
	var tempEl = eval( stateDiv ).offsetParent;
  	while ( tempEl != null ) 
    {
  		xPos += tempEl.offsetLeft;
  		tempEl = tempEl.offsetParent;
  	}
	return xPos;
}

/**
 * Returns the "real Y" coordinate for IE 5.5.
 * @param stateDiv The state div.
 */
function getRealY( stateDiv ) 
{
	var yPos = eval( stateDiv ).offsetTop;
	var tempEl = eval( stateDiv ).offsetParent;
	while ( tempEl != null ) 
    {
  		yPos += tempEl.offsetTop;
  		tempEl = tempEl.offsetParent;
  	}
	return yPos;
}