﻿/***************************************************************************************************
	Small library for works with modal windows
	by YS, 13.12.2007

CSS:
	.bgFader{position: absolute; background: black; top: 0; left: 0; width: 100%; z-index: 99998; opacity: 0.5; // filter: alpha(opacity=50);}
	.modalWindow{position: absolute; border: 2px solid black; background: white; color: black; padding: 0px; overflow: auto; z-index: 99999;}

Use this class:
	var oMsgForm = new ModalWindow('msgForm');
	if(!oMsgForm.err){
		oMsgForm.setContent('ffffuel');
		oMsgForm.show();
	}
***************************************************************************************************/
//modalAbstract.prototype = new Object();

function ModalAbstract(){

	ModalAbstract.prototype.add = function(){}
	ModalAbstract.prototype.paint = function(){}
	ModalAbstract.prototype.close = function(){}
	ModalAbstract.prototype.destroy = function(){}
	ModalAbstract.prototype.fadeIn = function(){}
	ModalAbstract.prototype.fadeOut = function(){}
	ModalAbstract.prototype.addEvents = function(){}

	ModalAbstract.prototype.setContent = function(){}
	
	ModalAbstract.prototype.setMinOpacity = function(){}

	ModalAbstract.prototype.setFullScreen = function(){
		this.w = '100%';
		this.h = '100%';
		this.top = 0;
		this.left = 0;
	}
	
	ModalAbstract.prototype.getVisibleArea = function(){
		var windowWidth, windowHeight;
		if(window.innerWidth)// Safari, Opera, FF
			windowWidth = window.innerWidth;
		else if(document.documentElement && document.documentElement.clientWidth)// IE
			windowWidth = document.documentElement.clientWidth;
		else if(document.body)
			windowWidth = document.body.offsetWidth;
		
		if(window.innerHeight)
			windowHeight = window.innerHeight;
		else if(document.documentElement && document.documentElement.clientHeight)
			windowHeight = document.documentElement.clientHeight;
		else if(document.body)
			windowHeight = document.body.clientHeight;
		return {"width":windowWidth, "height":windowHeight};
	}

	ModalAbstract.prototype.getPageScroll = function(){
		/* scrollLeft: The distance between the horizontal scrollbar 
			with the left edge of the frame.
			scrollTop:  The distance between the vertical scrollbar
			with the top edge of the frame. 

			Get the scroll value from different browsers.
			Determine the browser type first. 
			And then get the value from the particular property.*/
		var scrollLeft, scrollTop;

		if(window.pageXOffset)
			scrollLeft = window.pageXOffset 
		else if(document.documentElement && document.documentElement.scrollLeft)
			scrollLeft = document.documentElement.scrollLeft; 
		else if(document.body)
			scrollLeft = document.body.scrollLeft; 
		
		if(window.pageYOffset)
			scrollTop = window.pageYOffset 
		else if(document.documentElement && document.documentElement.scrollTop)
			scrollTop = document.documentElement.scrollTop; 
		else if(document.body)
			scrollTop = document.body.scrollTop; 
		
		return {"left":scrollLeft, "top":scrollTop};
	}

	ModalAbstract.prototype.getDocumentArea = function(){
		var width, height;
		width = document.documentElement.clientWidth; // FF, Safari, IE
		if(width < document.body.scrollWidth) // Opera
			width = document.body.scrollWidth;
		height = document.documentElement.clientHeight; // FF, Safari, IE
		if(height < document.body.scrollHeight) // Opera
			height = document.body.scrollHeight;
		//document.getElementById('debug').innerHTML += '<br />'+'getDocumentArea.width='+width+' getDocumentArea.height='+height;
		return {'width':width, 'height':height}
	}

	// add event (multybrowsing)
	ModalAbstract.prototype.addEvent = function(obj, handler, event){
		if(window.addEventListener) // Mozilla, Netscape, Firefox
			obj.addEventListener(event, handler, false);
		else {// IE
			var ev = (event.indexOf('on') == -1?'on':'') + event;
			obj.attachEvent((ev?ev:event), handler);
		}
	}

	this.browser = (window.addEventListener?'normal':'ie');
	this.browser_name = navigator.appName.toLowerCase();
	this.content = '';
	this.minOpacity = 0;
	this.maxOpacity = 80;
	if(this.browser_name == 'opera'){
		this.stepOpacity = 80;
		this.fadeInterval = 1;// ms
	} else {
		this.stepOpacity = 20;
		this.fadeInterval = 10;// ms
	}
}

/***************************************************************************************************/
ModalFader.prototype = new ModalAbstract();
function ModalFader(id, w, h, left, top){

	// addOnClickClose - [true|false]
	ModalFader.prototype.add = function(addOnClickClose){
		if(addOnClickClose == undefined)
			this.addOnClickClose = true;
		else
			this.addOnClickClose = addOnClickClose;
		if(document.getElementById(this.id))// проверко на присутствие фейдера
			throw('Error. "modalFader" is still present.')
		if(this.browser == 'ie'){// предотвращаем дерганье в IE при прокрутке (http://www.artlebedev.ru/tools/technogrette/html/fixed_in_msie/)
			var oBody = document.body;//добавил var
			if(!oBody.style.backgroundImage){
				oBody.style.background = 'url(/i/px.gif) no-repeat';
				oBody.style.backgroundAttachment = 'fixed';
			}
		}
		var oModalFader = document.body.insertBefore(document.createElement('div'), document.body.firstChild);
		this.oModalFader = oModalFader;
		this.oModalFader.id = this.id;
		this.oModalFader.className = 'bgFader';
		//this.oModalFader.setAttribute('max_opacity', this.maxOpacity);
		//this.oModalFader.setAttribute('step_opacity', this.stepOpacity);
		if(this.browser == 'normal')// фиксим, если не IE
			this.oModalFader.style.position = 'fixed';
		window.oModalFader = this;
		this.paint();

		// запускаем fadeIn
		this.fadeInIntervalId = window.setInterval(function(){
			this.oModalFader.fadeIn();
		}, this.fadeInterval);
	}

	ModalFader.prototype.setMinOpacity = function(){
		if(this.browser == 'ie')
			this.oModalFader.style.filter = 'alpha(opacity='+this.minOpacity+")";
		else
			this.oModalFader.style.opacity = this.minOpacity / 100;
	}

	ModalFader.prototype.addEvents = function(){
		if(this.addOnClickClose){
			this.oModalFader.title = 'Click to close';
			this.addEvent(this.oModalFader, function(){
				window.oModalFader.close();
			}, 'click');
		}
		
		this.addEvent(window, function(){
			this.oModalFader.paint();
		}, 'resize');
		if(this.browser == 'ie')
			this.addEvent(window, function(){
				this.oModalFader.paint();
			}, 'scroll');
	}

	ModalFader.prototype.paint = function(){
		this.oModalFader.style.top = (this.browser == 'normal'?this.top:eval(document.body.scrollTop))+"px";//эмуляция position: fixed в IE (thx Андрюхе Шитову ;-)
		this.oModalFader.style.left = this.left+'px';
		this.oModalFader.style.width = this.w+(isNaN(Number(this.w))?'':'px');
		this.oModalFader.style.height = this.h+(isNaN(Number(this.h))?'':'px');
	}

	ModalFader.prototype.close = function(){
		// запускаем fadeOut
		this.fadeOutIntervalId = window.setInterval(function(){
			this.oModalFader.fadeOut();
		}, this.fadeInterval);
		// begin заодно убъем ModalWindow, если он есть
		if(window.oModalWindow){
			window.oModalWindow.fadeOutIntervalId = window.setInterval(function(){
				this.oModalWindow.fadeOut();
			}, window.oModalWindow.fadeInterval);
		}
		// end заодно убъем ModalWindow, если он есть
	}

	ModalFader.prototype.destroy = function(){
		document.body.removeChild(this.oModalFader);
	}

	ModalFader.prototype.fadeIn = function(){
		var opacity = (this.browser == 'ie'?this.oModalFader.filters.alpha.opacity:Number(this.oModalFader.style.opacity) * 100);
		if(isNaN(opacity)) opacity = 0;
		if(opacity >= this.maxOpacity){
			window.clearInterval(this.fadeInIntervalId);
			this.addEvents();
		} else {
			if(this.browser == 'ie')
				this.oModalFader.style.filter = 'alpha(opacity='+(opacity + this.stepOpacity)+")";
			else
				this.oModalFader.style.opacity = (opacity + this.stepOpacity) / 100;
		}
	}

	ModalFader.prototype.fadeOut = function(){
		var opacity = (this.browser == 'ie'?this.oModalFader.filters.alpha.opacity:Number(this.oModalFader.style.opacity) * 100);
		//if(isNaN(opacity)) opacity = 0;
		if(opacity <= this.minOpacity){
			window.clearInterval(this.fadeOutIntervalId);
			this.destroy();
		} else {
			if(this.browser == 'ie')
				this.oModalFader.style.filter = 'alpha(opacity='+(opacity - this.stepOpacity)+")";
			else
				this.oModalFader.style.opacity = (opacity - this.stepOpacity) / 100;
		}
	}

	this.id = (id?id:'modalFader');
	this.w = (w !== undefined?w:'100%');
	this.h = (h !== undefined?h:'100%');
	this.top = (top !== undefined?top:0);
	this.left = (left !== undefined?left:0);
}

/***************************************************************************************************/
ModalWindow2.prototype = new ModalAbstract();
function ModalWindow2(id, w, h, left, top){

	// addOnClickClose - [true|false]
	ModalWindow2.prototype.add = function(addOnClickClose){
		if(addOnClickClose == undefined)
			this.addOnClickClose = true;
		else
			this.addOnClickClose = addOnClickClose;
		if(document.getElementById(this.id))// проверко на присутствие фейдера
			throw('Error. "modalWindow" is still present.')
		var oModalWindow = document.body.insertBefore(document.createElement('div'), document.body.firstChild);
		this.oModalWindow = oModalWindow;
		this.oModalWindow.id = this.id;
		this.oModalWindow.className = 'modalWindow2';
		/*if(this.browser == 'normal')// фиксим, если не IE
			this.oModalWindow.style.position = 'fixed';*/
		window.oModalWindow = this;
		this.oModalWindow.innerHTML = this.content;
		this.setMinOpacity();
		this.paint();

		// запускаем fadeIn
		this.fadeInIntervalId = window.setInterval(function(){
			this.oModalWindow.fadeIn();
		}, this.fadeInterval);
	}

	ModalWindow2.prototype.addEvents = function(){
		if(this.addOnClickClose){
			this.oModalWindow.title = 'Click to close';
			this.addEvent(this.oModalWindow, function(){
				window.oModalWindow.close();
			}, 'click');
		}
		
		this.addEvent(window, function(){
			this.oModalWindow.paint();
		}, 'resize');
		/*this.addEvent(window, function(){
			this.oModalWindow.paint();
		}, 'scroll');*/
	}

	ModalWindow2.prototype.paint = function(){
		this.calcPosition();
		this.oModalWindow.style.left = this.left+'px';
		this.oModalWindow.style.top = this.top+'px';
		//this.oModalWindow.style.top = (this.browser == 'normal'?(this.getPageScroll().top+this.top):eval(document.body.scrollTop+this.top))+'px';//эмуляция position: fixed в IE (thx Андрюхе Шитову ;-)
		this.oModalWindow.style.width = this.w+(isNaN(Number(this.w))?'':'px');;
		this.oModalWindow.style.height = this.h+(isNaN(Number(this.h))?'':'px');;
	}

	ModalWindow2.prototype.calcPosition = function(){
		var visibleArea = this.getVisibleArea();
		var documentArea = this.getDocumentArea();
		var pageScroll = this.getPageScroll();
		this.w = (w !== undefined?w:Math.ceil(visibleArea.width - (visibleArea.width * 20 / 100)));
		//this.h = (h !== undefined?h:Math.ceil(visibleArea.height - (visibleArea.height * 20 / 100)));
		this.h = (h !== undefined?h:documentArea.height);
		this.left = (left !== undefined?left:Math.ceil((visibleArea.width - this.w)/2));
		this.top = (top !== undefined?top:(this.h == documentArea.height?pageScroll.top:Math.ceil((visibleArea.height - this.h)/2)));
		// исправим косяк с пустым пространством внизу, если страница скролена
		if(this.top == pageScroll.top) this.h = this.h - pageScroll.top;
	}

	ModalWindow2.prototype.close = function(){
		// запускаем fadeOut
		this.fadeOutIntervalId = window.setInterval(function(){
			this.oModalWindow.fadeOut();
		}, this.fadeInterval);
		// begin заодно убъем ModalFader, если он есть
		if(window.oModalFader){
			window.oModalFader.fadeOutIntervalId = window.setInterval(function(){
				this.oModalFader.fadeOut();
			}, window.oModalFader.fadeInterval);
		}
		// end заодно убъем ModalFader, если он есть
	}

	ModalWindow2.prototype.destroy = function(){
		document.body.removeChild(this.oModalWindow);
	}

	ModalWindow2.prototype.fadeIn = function(){
		var opacity = (this.browser == 'ie'?this.oModalWindow.filters.alpha.opacity:Number(this.oModalWindow.style.opacity) * 100);
		if(isNaN(opacity)) opacity = 0;
		if(opacity >= this.maxOpacity){
			window.clearInterval(this.fadeInIntervalId);
			this.addEvents()
		} else {
			if(this.browser == 'ie')
				this.oModalWindow.style.filter = 'alpha(opacity='+(opacity + this.stepOpacity)+")";
			else
				this.oModalWindow.style.opacity = (opacity + this.stepOpacity) / 100;
		}
	}

	ModalWindow2.prototype.fadeOut = function(){
		var opacity = (this.browser == 'ie'?this.oModalWindow.filters.alpha.opacity:Number(this.oModalWindow.style.opacity) * 100);
		//if(isNaN(opacity)) opacity = 0;
		if(opacity <= this.minOpacity){
			window.clearInterval(this.fadeOutIntervalId);
			this.destroy();
		} else {
			if(this.browser == 'ie')
				this.oModalWindow.style.filter = 'alpha(opacity='+(opacity - this.stepOpacity)+")";
			else
				this.oModalWindow.style.opacity = (opacity - this.stepOpacity) / 100;
		}
	}

	ModalWindow2.prototype.setContent = function(content){
		this.content = content;
	}

	this.id = (id?id:'modalWindow');// id - для совместимости с старым кодом, да и мало ли, мож понадобится ;)
	this.maxOpacity = 100;
}

/***************************************************************************************************/
ModalWindow.prototype = new ModalAbstract();
function ModalWindow(id, w, h, left, top){
	
	ModalWindow.prototype.calcPositon = function(){
		var tmp;
		tmp = this.getPageScroll();
		this.scrollLeft = tmp.left;
		this.scrollTop = tmp.top;

		tmp = this.getVisibleArea();
		this.windowWidth = tmp.width;
		this.windowHeight = tmp.height;

		this.documentHeight = document.documentElement.clientHeight; // FF, Safari, IE
		if(this.documentHeight < document.body.scrollHeight) // Opera
			this.documentHeight = document.body.scrollHeight;
		
		this.left = (this.left != undefined?this.left:this.windowWidth/2 - this.w/2);
		this.top = (this.top != undefined?this.top:this.windowHeight/2 - this.h/2) + this.scrollTop;
	}

	ModalWindow.prototype.setContent = function(cnt){
		this.cnt = cnt;
	}

	ModalWindow.prototype.getCustomModalObject = function(){
		return this.oCustomModal;
	}

	ModalWindow.prototype.getModalObject = function(){
		return this.oModalWindow;
	}

	ModalWindow.prototype.getFaderObject = function(){
		return this.oBgFader;
	}

	ModalWindow.prototype.addClose = function(o){
		this.addEvent(o, this.close, 'click');
	}

	ModalWindow.prototype.showFader = function(){
		var oBgFader = document.body.insertBefore(document.createElement('div'), document.body.firstChild);
		this.oBgFader = oBgFader;
		this.oBgFader.id = 'bgFader_'+this.id;
		this.oBgFader.className = 'bgFader';
		//this.oBgFader.style.border = '1px solid red';
		this.oBgFader.style.top = '0';
		this.oBgFader.style.height = this.documentHeight + 'px';
		this.addClose(this.oBgFader);// click out of window - closest modal window
	}

	ModalWindow.prototype.showModal = function(){
		// begin create modal window
		this.oModalWindow = document.body.insertBefore(document.createElement('div'), document.body.firstChild);
		this.oModalWindow.id = 'modalWindow_'+this.id;
		this.oModalWindow.className = 'modalWindow';
		this.oModalWindow.style.width = this.w + 'px';
		this.oModalWindow.style.height = this.h + 'px';
		this.positioning();
		this.oModalWindow.innerHTML = this.cnt;
		// end create modal window
	}

	ModalWindow.prototype.addCustomModal = function(o){
		this.oCustomModal = document.body.insertBefore(o, document.body.firstChild);
		return this.oCustomModal;
	}

	// show modal window
	ModalWindow.prototype.show = function(){
		this.showFader();
		this.showModal();
	}

	// set position for modal window
	ModalWindow.prototype.positioning = function(){
		this.oModalWindow.style.left = this.left + 'px';
		this.oModalWindow.style.top = this.top + 'px';
	}

	// close modal window
	ModalWindow.prototype.close = function(){
		document.body.removeChild(document.body.firstChild.nextSibling);
		document.body.removeChild(document.body.firstChild);
	}

	// constructor *****************************************************

	this.w = (w != undefined?w:'1000');
	this.h = (h != undefined?h:'200');
	this.left = left;
	this.top = top;
	this.calcPositon();
	this.err = false;
	if(document.getElementById('modalWindow'+id) !== null)
		this.err = true;
	this.id = id;

}

function submitItWin(action,width,height,param){
	var img = document.createElement("img");
	var oDiv = document.getElementById('div_'+param);
	var oDivCn = oDiv.childNodes;
	var onclick_tmp = oDiv.onclick;	
	oDiv.onclick = "";
	oDiv.style.position = "relative";
	oDiv.style.color = "#a6a39E";
	var h = oDiv.offsetHeight;
	var w = oDiv.offsetWidth;
	var t = oDiv.offsetTop;
	var l = oDiv.offsetLeft;
	var oInDiv = document.createElement("div");
	var oInImg = document.createElement("img");
	oInDiv.style.position = "absolute";
	oInDiv.style.top = t;
	oInDiv.style.left = l;
	oInDiv.style.height = h;
	oInDiv.style.width = w;
	oInDiv.width = w;
	oInDiv.height = h;
	oInImg.width = 16;
	oInImg.height = 16;
	oInImg.style.position = "absolute";
	oInImg.style.top = ((h/2)-8);
	oInImg.style.left = 50;
	oInImg.src = "/i/ff_wait.gif";
	oDiv.appendChild(oInDiv);
	oInDiv.appendChild(oInImg);	
	var request = new httpRequest();
	var func = function(){
		var sss = request.responseText;
		oMsgForm = new ModalWindow('msgForm', width,height);//600*646
		if(!oMsgForm.err){
			oMsgForm.setContent(sss);
			oMsgForm.show();
			oDiv.onclick = onclick_tmp;
			oDiv.style.color = "";
			oDiv.removeChild(oInDiv);
		}
	}	
	makeRequest(request, func, action, 'GET', 'param='+param);	//get_rep.php
}

