var SelectedRegionElement;
var SelectedAreaElement;

function ChangeArea(Area, Page)
{
    var myRegionElements = document.getElementById('RegionsContainer').childNodes;
    var myNewSelectedAreaElement = document.getElementById('AreaItem_' + Area)
    var PagerCounter;
    
    if (SelectedAreaElement != null)
    {
        SelectedAreaElement.className = "";
    }
    
    if  (myNewSelectedAreaElement)
    {
        myNewSelectedAreaElement.className = 'SelectedBLItem';
        SelectedAreaElement = myNewSelectedAreaElement;
    }

    for (var n = 0; n < myRegionElements.length; n++)
    {
        //Element is selected Area or Paging then display
        if (myRegionElements[n].tagName == "DIV")
        {
            if (myRegionElements[n].id == ('RegionList_' + Area + Page) || 
                myRegionElements[n].id == ('RegionPaging_' + Area))
            {
                myRegionElements[n].style.display = 'block'
                
                //Ensure correct Pager item is highlighted
                if (myRegionElements[n].id == ('RegionPaging_' + Area))
                {                
                    PagerCounter = 0;
                
                    for (var i = 0; i < myRegionElements[n].childNodes.length; i++)
                    {
                        if (myRegionElements[n].childNodes[i].tagName == "A")
                        {
                            if (PagerCounter == Page)
                            {
                                myRegionElements[n].childNodes[i].className = 'SelectedPager';
                            }
                            else
                            {
                                myRegionElements[n].childNodes[i].className = 'PagerItem';
                            }
                            
                            PagerCounter += 1;
                        }                        
                    }
                }
            }
            else //else hide element
            {
                myRegionElements[n].style.display = 'none';
            }
        }
    }
}

function ChangeAreaListPage(Page)
{
    var myAreaElements = document.getElementById('AreaContainer').childNodes;
    var PagerCounter;
    
    for (var n = 0; n < myAreaElements.length; n++)
    {
        if (myAreaElements[n].tagName == "UL" || myAreaElements[n].tagName == "DIV")
        {
            if (myAreaElements[n].id == ('AreaList' + Page) || myAreaElements[n].id == 'AreaListPaging')
            {                
                myAreaElements[n].style.display = 'block';
                
                //Ensure correct Pager item is highlighted
                if (myAreaElements[n].id == 'AreaListPaging')
                {                
                    PagerCounter = 0;
                    
                    for (var i = 0; i < myAreaElements[n].childNodes.length; i++)
                    { 
                        if (myAreaElements[n].childNodes[i].tagName == "A")
                        {
                            if (PagerCounter == Page)
                            {
                                myAreaElements[n].childNodes[i].className = 'SelectedPager';
                            }
                            else
                            {
                                myAreaElements[n].childNodes[i].className = 'PagerItem';
                            }
                            
                            PagerCounter += 1;
                        }
                    }
                }
            }
            else
            {
                myAreaElements[n].style.display = 'none';
            }
        }
    }
}

function SelectRegion(RegionId)
{
    var myElements = document.getElementById('RegionsContainer').childNodes;
    
    //Finds the hidden field and sets it value to the selected RegionId
    for (var n = 0; n < myElements.length; n++)
    {
        if (myElements[n].tagName == "INPUT")
        {
            myElements[n].value = RegionId;
        }
    }
    
    if (SelectedRegionElement != null)
    {
        SelectedRegionElement.className = "";
    }
    
    var myNewSelectedElement = document.getElementById('RegionItem_' + RegionId)
    
    if (myNewSelectedElement)
    {
        myNewSelectedElement.className = 'SelectedBLItem';
        SelectedRegionElement = myNewSelectedElement;
    }   
}

function ResetAreaRegion()
{
    var myRegionElements = document.getElementById('RegionsContainer').childNodes;
    var blnRegionSelected = false;
    
    for (var n = 0; n < myRegionElements.length; n++)
    {
        if (myRegionElements[n].tagName == "INPUT")
        {  
            if (myRegionElements[n].value != "")
            {     
                blnRegionSelected = true;
            }
        }
        else if (myRegionElements[n].tagName == "DIV" && blnRegionSelected == true)
        {       
            var myRegionItemElements = myRegionElements[n].childNodes;

            myRegionElements[n].display = 'none';

            for (var i = 0; i < myRegionItemElements.length; i++)
            {
                if (myRegionItemElements[i].tagName == "LI")
                {
                    myRegionItemElements[i].className = "";
                }
            }
        }
    }
    
    if (blnRegionSelected == true)
    {
        HideFlashMap();
    }
}

function StepBack()
{
    var myStep1Div = document.getElementById('Step1Info');
    
    if (myStep1Div)
    {
        ShowFlashMap();
    }
    else
    {
        HideFlashMap();
    }
}

function ShowFlashMap()
{
    setTimeout("doShowFlashMap()",1500); 
}

function doShowFlashMap()
{
    var myFlashMap = document.getElementById('flashMap');
    
    myFlashMap.style.display = 'block'
}

function HideFlashMap()
{
    var myFlashMap = document.getElementById('flashMap');
    
    myFlashMap.style.display = 'none'
}

function FlipFlashMap()
{
    var myFlashMap = document.getElementById('flashMap');
    
    if (myFlashMap.style.display == 'block')
    {
        myFlashMap.style.display = 'none';
    }
    else
    {
        myFlashMap.style.display = 'block';
    }
}