﻿var m_popupDiv;
var m_fadingDiv;
var m_iFrame;

var m_constPopupDiv = "_div_popupWindow";
var m_constFadingDiv = "_div_popupBackground";
var m_constIFrame = "_ifrm_popupWindow";

var _rulesAdded = false;

function SetPopUpElements(clientId)
{
    m_popupDiv = util_getById(clientId + m_constPopupDiv);
	m_fadingDiv = util_getById(clientId + m_constFadingDiv);
	m_iFrame = util_getById(clientId + m_constIFrame);
}

function Modal_ShowPopUp(clientId)
{
    SetPopUpElements(clientId);
    
	this.m_fadingDiv.style.display = "block";
    this.m_popupDiv.style.display = "block";
    
	// special < IE7 - only processing for windowed elements, like select	
	if (window.XMLHttpRequest == null)
	{
		ReplaceSelectsWithSpans();
		if(!_rulesAdded)
		{
		    //AddStyleRules(clientId);
		}
	}

	// call once to center everything
	CenterModal();
	
	util_addEvent(window,'resize',CenterModal);
	util_addEvent(window,'scroll',CenterModal);
	util_addEvent(m_popupDiv,'resize',CenterModal);
}

function Modal_ClosePopUp(clientId)
{
    SetPopUpElements(clientId);
    
	m_popupDiv.style.display = "none";
	m_fadingDiv.style.display = "none";
	
	// special IE-only processing for windowed elements, like select	
	if (window.XMLHttpRequest == null)
	{
		RemoveSelectSpans();
	}
	
	util_removeEvent(window,'resize',CenterModal);
	util_removeEvent(window,'scroll',CenterModal);
	util_removeEvent(m_popupDiv,'resize',CenterModal);
}

function CenterModal(event)
{
	var scroll = GetScroll();
	var winSize = GetWindowSize();
	
	m_popupDiv.style.left = Math.max((scroll.left + (winSize.width  - m_popupDiv.offsetWidth)  / 2), 0) + 'px';
	m_popupDiv.style.top  = Math.max((scroll.top  + (winSize.height - m_popupDiv.offsetHeight) / 2), 0) + 'px';
}

/* These functions deal with IE's retardedness in not allowing divs to 
 * cover select elements by replacing the select elements with spans. */

function RemoveSelectSpans()
{
	var selects = document.getElementsByTagName('select');
	
	for (var i = 0; i < selects.length; i++)
	{
		var select = selects[i];
		
		if (select.clientWidth == 0 || select.clientHeight == 0 || select.nextSibling == null || select.nextSibling.className != 'selectReplacement')
		{
			continue;
		}
			
		select.parentNode.removeChild(select.nextSibling);
		select.style.display = select.cachedDisplay;
	}
}

function ReplaceSelectsWithSpans()
{
	var selects = document.getElementsByTagName('select');
	
	for (var i = 0; i < selects.length; i++)
	{
		var select = selects[i];
		
		if (select.clientWidth == 0 || select.clientHeight == 0 || 
			select.nextSibling == null || select.nextSibling.className == 'selectReplacement')
		{
			continue;
		}
			
		var span = document.createElement('span');
		
		// this would be "- 3", but for that appears to shift the block that contains the span 
		//   one pixel down; instead we tolerate the span being 1px shorter than the select
		span.style.height = (select.clientHeight - 4) + 'px';
		span.style.width = (select.clientWidth - 6) + 'px';
		span.style.display = 'inline-block';
		span.style.border = '1px solid rgb(200, 210, 230)';
		span.style.padding = '1px 0 0 4px';
		span.style.fontFamily = 'Arial';
		span.style.fontSize = 'smaller';
		span.style.position = 'relative';
		span.style.top = '1px';
		span.className = 'selectReplacement';
		
		span.innerHTML = select.options[select.selectedIndex].innerHTML +  '<img src="custom_drop.gif" alt="drop down" style="position: absolute; right: 1px; top: 1px;" />';
		
		select.cachedDisplay = select.style.display;
		select.style.display = 'none';
		select.parentNode.insertBefore(span, select.nextSibling);
	}
}

/* The following two functions are not used, but have been kept here because 
 *   they might be useful; one must use this method to programmatically add
 *   javascript-valued CSS values (using element.style.div = expresssion(...)
 *   does not work).  These are only useful for IE.
 */

function AddStyleRules(clientId)
{
	if (_rulesAdded)
	{
		return;
	}
	_rulesAdded = true;

	var stylesheet = document.styleSheets[document.styleSheets.length - 1];
	
	if (!document.all)
	{
		InsertCssRule(stylesheet, '#' + clientId + m_constFadingDiv, 'position: fixed; height: 100%; width: 100%; left: 0; top: 0;');		
		InsertCssRule(stylesheet, '#' + clientId + m_constPopupDiv, 'position: fixed; left: 0; top: 0;');		
	}
	else
	{
		InsertCssRule(stylesheet, '#' + clientId + m_constFadingDiv, 
			'position: absolute; ' +
			'left: expression(ignoreMe = document.documentElement.scrollLeft + "px"); ' +
			'top: expression(ignoreMe = document.documentElement.scrollTop + "px");' +
			'width: expression(document.documentElement.clientWidth + "px"); ' +
			'height: expression(document.documentElement.clientHeight + "px");');

		InsertCssRule(stylesheet, '#' + clientId + m_constPopupDiv, 
			'position: absolute; ' +
			'left: expression(ignoreMe = document.documentElement.scrollLeft + "px"); ' +
			'top: expression(ignoreMe = document.documentElement.scrollTop + "px");');

	}
}

function InsertCssRule(stylesheet, selector, rule)
{
	if (stylesheet.addRule)
	{
		stylesheet.addRule(selector, rule, stylesheet.rules.length);
		return stylesheet.rules.length - 1;
	}
	else
	{
		stylesheet.insertRule(selector + ' {' + rule + '}', stylesheet.cssRules.length);
		return stylesheet.cssRules.length - 1;
	}
}



/* utiltiy functions */

function GetWindowSize() 
{
    var myWidth = 0, myHeight = 0;

    if( typeof( window.innerWidth ) == 'number' )
    {
        //Non-IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
    } 
    else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) )
    {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
    } 
    else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) )
    {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
    }
    return { width:myWidth, height:myHeight };
}

function GetScroll() 
{
    var scrOfX = 0, scrOfY = 0;

    if( typeof( window.pageYOffset ) == 'number' )
    {
        //Netscape compliant
        scrOfY = window.pageYOffset;
        scrOfX = window.pageXOffset;
    } 
    else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) 
    {
        //DOM compliant
        scrOfY = document.body.scrollTop;
        scrOfX = document.body.scrollLeft;
    }
    else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) 
    {
        //IE6 standards compliant mode
        scrOfY = document.documentElement.scrollTop;
        scrOfX = document.documentElement.scrollLeft;
    }
    return { left:scrOfX, top:scrOfY };
}

function util_getById(id)
{
	if (typeof(id) != "undefined") 
	{
		if (document.all) 
		{
			return document.all[id];
		}
		return document.getElementById(id);
	}
}

function util_addEvent(obj, type, fn)
{
	if (obj.addEventListener)
	{
		obj.addEventListener(type, fn, false);
	}
	else if (obj.attachEvent)
	{
		obj["e" + type + fn] = fn;
		obj[type + fn] = function() { obj["e" + type + fn](window.event); }
		obj.attachEvent("on" + type, obj[type + fn]);
	}
}

function util_removeEvent(obj, type, fn)
{
	if (obj.removeEventListener)
	{
		obj.removeEventListener(type, fn, false);
	}
	else if (obj.detachEvent)
	{
		obj.detachEvent("on" + type, obj[type + fn]);
		obj[type + fn] = null;
		obj["e" + type + fn] = null;
	}
}