/**
 * @author konrads
 * 
 * ThriXXXOverDiv 2.0
 * **Overlays**
 * 
 * Requires jQuery 1.4.x , jQuery UI 1.8.x (draggables)
 */


/* insert basic CSS-File */
/*
var headID = document.getElementsByTagName("head")[0];         
var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = root+'js/overDiv/overdiv2.css';
cssNode.media = 'screen';
headID.appendChild(cssNode);
*/
function createCSSNode(file){
	
	var headID = document.getElementsByTagName("head")[0];         
	var cssNode = document.createElement('link');
	cssNode.type = 'text/css';
	cssNode.rel = 'stylesheet';
	cssNode.href = root+'js/overDiv/'+file;
	cssNode.media = 'screen';
	headID.appendChild(cssNode);
}

/*
if(document.body){

	
	$(document.body).prepend('		<div id="mainDiv" style="" onclick=""></div>');
	}else{
		//$(document.documentElement).prepend('<div id="dimmer" style="display: none;" onclick="overDiv.close();"></div>');
		$(document.documentElement).prepend('		<div id="mainDiv" style="display:none;" onclick=""></div>');
}
*/

var mainDiv = '';
var loading = '';
var overdiv = '';
var odCount = 0;
var dimmer = '';
var dimming = true;
var dimmingOpac = 0.5;
var draggable = true;
var themeCSS = 'theme01.css';
var killSwitch = false;
var PIE_support = true; // *Path: js/PIE/PIE.htc
var debug = false;

//mainDiv.append('<div id="loading" style=""></div>');
//mainDiv.append('<div id="overdiv" style=""></div>');


//overdiv.append('<div class="od_close" onclick="overDiv.close();" ></div>');
//overdiv.append('<div class="od_head" >header</div>');
//overdiv.append('<div class="od_body" >body</div>');
//overdiv.append('<div class="od_foot" >footer</div>');

/* head + foot section 

var ODheight = overdiv.innerHeight();
var od_body_H = ODheight - 60;
alert(od_body_H);
$('.od_head').css('height', '10%');
$('.od_foot').css('height', '10%');
$('.od_body').css('height', '80%');

*/

var overDiv = new Object();

//overDiv.element = overdiv;

if(debug) console.log(overDiv);

// methods

overDiv.init = function(){
	
	this.options = {
			body: '',
			header: '',
			type: 'html',
			width: 400,
			height: ($(window).height()-80),
			contentID: '',
			position: 'center',
			flvFile: '',
			flvPreview: ''
			};
	
}

var evt;

overDiv.create = function(elem, options){
	
	
	writeHTML(odCount);
	
	odCount++;
	
	var caller = elem;
	
	if(elem) this.caller = elem;
	
	if(options.type) 	this.options.type 		= options.type;
	if(options.header) 	this.options.header 	= options.header;
	if(options.body) 	this.options.body 		= options.body;
	if(options.width) 	this.options.width 		= options.width;
	if(options.height) 	this.options.height 	= options.height;
	if(options.contentID) 	this.options.contentID 	= options.contentID;
	if(options.position) 	this.options.position 	= options.position;
	if(options.flvPreview) 	this.options.flvPreview 	= options.flvPreview;
	if(options.flvFile) 	this.options.flvFile 	= options.flvFile;
	if(options.src) 		this.options.src 		= options.src;
	
	//console.log("header: "+this.options.header);
	if(debug) console.log('oWidth: ' + options.width);
	if(draggable) overdiv.draggable({handle: '.od_head', cursor: 'move',
		start: function(event, ui){
			switchOD(this);
		}
	});
	
	overDiv.loading();
	
	if(this.options.type == 'html') this.createHTML(caller);
	if(this.options.type == 'img') 	this.createIMG(caller);
	if(this.options.type == 'iframe') 	this.createFRAME(caller);
	if(this.options.type == 'ajax') 	this.createAJAX(caller);
	if(this.options.type == 'flash') 	this.createFLASH(caller);
	
	
	
	//setPos();
	//mainDiv.show();
	//if(dimming) dimmer.fadeTo(1600, 0.5);
//	console.info(this.element.children('.od_body').html());
//	console.info(options);
	if(debug) 	console.log("caller: "+ this.caller);
	overDiv.init();
	return false;
}

overDiv.showIt = function(){
	
	if(debug) console.log("show");
	if(debug) console.log(overdiv);
	loading.hide();
	
	setPos(overdiv);
	overdiv.fadeIn();
	
	if(dimming) dimmer.fadeTo(1600, 0.5);
	
	//overdiv.css('display', 'block');
	
}

overDiv.close = function(el){
	
	
	$(el).parent('.overdivs').remove();
	loading.remove();
	
	if($('.overdivs').length <= 0){
		mainDiv.hide();
		overdiv.hide();
		dimmer.hide();
	}
	
}

overDiv.loading = function(){
	mainDiv.show();
	overdiv.hide();
	if(dimming) dimmer.fadeTo(1600, 0.5);
	$('#loading').show();
	setPos(loading);
	$('#loading').click(function(){overDiv.kill();})
}


overDiv.kill = function(){
	killSwitch = true;
	
	if(mainDiv) mainDiv.remove();
	if(dimmer)dimmer.remove();
	
	 mainDiv = '';
	 loading = '';
	 overdiv = '';
	 odCount = 0;
	 dimmer = '';
	overDiv.init();
	
}

overDiv.createHTML = function(){
	
	console.log(this.element);
	this.element.children('.od_body').html('');
	
	if(this.options.body && this.options.body != '') this.element.children('.od_body').html(this.options.body);
	else if(this.options.contentID && this.options.contentID != ''){
	var content = $(this.options.contentID).html();
		this.element.children('.od_body').html(content);
	}else this.element.children('.od_body').html("missing content");
	
	if(!this.options.header || this.options.header == '') this.element.children('.od_head').hide();
	else {
		this.element.children('.od_head').show();
		this.element.children('.od_head').html(this.options.header);
	}
	
	overDiv.setSize(this.options.width, 'auto');
	
	overDiv.showIt();
}

overDiv.createFLASH = function(){
	
	
	this.element.children('.od_body').html('');
	
	if(this.options.body && this.options.body != ''){
	
	
		this.element.children('.od_body').html("<div id='flashCont'></div>");
		
		
		
         
		if(debug) console.log("flash: "+ this.options.flvFile);
         if(this.options.flvFile && this.options.flvFile != ''){
        //	 resetVars();
     	
         var flashvars = {
        		 fpFileURL: this.options.flvFile,
        		 fpPreviewImageURL: this.options.flvPreview
         }
		 var swfobj    = this.options.body;
         swfobject.embedSWF(swfobj, "flashCont", this.options.width, this.options.height, "8", "", flashvars );
         
         }else{
        	 var swfobj    = this.options.body;
             swfobject.embedSWF(swfobj, "flashCont", this.options.width, this.options.height, "8", "");
         }
		
		
	}
	else if(this.options.contentID && this.options.contentID != ''){
	var content = $(this.options.contentID).children('object');
	content.clone().appendTo(this.element.children('.od_body'));
	//	this.element.children('.od_body').html(content);
	}else this.element.children('.od_body').html("missing content");
	
	if(!this.options.header || this.options.header == '') this.element.children('.od_head').hide();
	else {
		this.element.children('.od_head').show();
		this.element.children('.od_head').html(this.options.header);
	}
	
	overDiv.setSize(this.options.width, this.options.height);
	
	overDiv.showIt();
}

overDiv.createAJAX = function(){
	
	if(this.options.src) var source = this.options.src;
	else var source = this.caller.href;
	
	overDiv.setSize(this.options.width, 'auto');
	if(debug) console.log('AJAX WIDTH: '+this.options.width);
	
	$.get(source , function(data){
		
		if(!killSwitch){
			
		overDiv.element.children('.od_body').html(data);
		overDiv.showIt();
		}else killSwitch = false;
	} );
	
	
	if(!this.options.header || this.options.header == '') this.element.children('.od_head').hide();
	else {
		this.element.children('.od_head').show();
		this.element.children('.od_head').html(this.options.header);
	}
	
	//else this.element.children('.od_body').html("missing content");
	
	
	
	
}



overDiv.createIMG = function(){
	killSwitch = false;
	
	
	if(this.caller){
		if(debug) console.log(this.caller.src);
		overDiv.loading();
		if(this.caller.href) var imgLNK = this.caller.href;
		else if(this.caller.src) var imgLNK = this.caller.src;
		else  overDiv.kill();
		
		imgN = $("<img>");
		
		imgN.hide();
		imgN.bind("load", function(){
			//overDiv.createIMG();
			if(debug) console.log('loading finished');
			if(!killSwitch  ){
			imgN.show();
			var imgDim = getImageDim(imgN);
			if(overDiv.options.height > imgDim[1]) overDiv.setSize(imgDim[0],imgDim[1]);
			else overDiv.setSize('auto', overDiv.options.height);
			 overDiv.showIt();
			 if(debug) console.log("autosize: "+overDiv.options.width );
			}
			else killSwitch = false;
			if(debug) console.log("W: "+imgN.width());
			

		});
		
		this.element.children('.od_body').html('');
		this.element.children('.od_body').append(imgN);
		imgN.attr("src", imgLNK);
		
		imgN.css('max-width', '100%');
		imgN.css('max-height', '100%');
		imgN.css('margin', 'auto');
	}
	
	if(!this.options.header || this.options.header == '') this.element.children('.od_head').hide();
	else {
		this.element.children('.od_head').show();
		this.element.children('.od_head').html(this.options.header);
	}
	
	
}

overDiv.createFRAME = function(){
	
	this.element.children('.od_body').html('');
	
	var iFrame = $("<iFrame>");
	iFrame.attr('src', this.caller.href);
	iFrame.attr('width', this.options.width);
	iFrame.attr('height', this.options.height);
	iFrame.css('border', '0 none');
	this.element.children('.od_body').append(iFrame);
	
	overDiv.setSize(this.options.width, this.options.height);
	
	if(debug) console.log('opt: '+ this.options.width);
	
	if(!this.options.header || this.options.header == '') this.element.children('.od_head').hide();
	else {
		this.element.children('.od_head').show();
		this.element.children('.od_head').html(this.options.header);
	}
	iFrame.bind("load", function(){
	overDiv.showIt();
	});
}





//global functions

function setPos(el){
	
	if(debug) console.log("position: "+overDiv.options.position);

	
	if(overDiv.options.position == 'center'){
	var wHeight = $(window).height();
	var wWidth = $(window).width();
	
	var odHeight = getHeight(el);
	var odWidth = getWidth(el);
	
	if(odHeight < wHeight){
		var verticalSet = (wHeight/2)-(odHeight/2);
	}else{
		var verticalSet = 30;
	}
	
	var horizontalSet = (wWidth/2)-(odWidth/2);
	
		el.css('top', verticalSet);
		el.css('left', horizontalSet);
	}else {
		
	el.css('top', evt.pageY);
	el.css('left', evt.pageX);
	
	}
	
	if(debug) console.log(wHeight +'x'+ wWidth +' odH: '+verticalSet+' odW: '+horizontalSet);
	
	
	
}


overDiv.setSize = function(_w, _h){
	
	if(debug) console.log('bodypd: '+$('.od_body').css('padding-left'));
	
	
	var odWidthPad = parseInt($('.od_body').css('padding-left'))+parseInt($('.od_body').css('padding-right'));
	var odHeightPad = parseInt($('.od_body').css('padding-top'))+parseInt($('.od_body').css('padding-bottom'));
	
	if(!this.options.header || this.options.header == ''){
		var headSize = 0;
		var odWidthPadH = 0;
		var odHeightPadH = 0;
	}else{
		var headSize = 25;
		var odWidthPadH = parseInt($('.od_head').css('padding-left'))+parseInt($('.od_head').css('padding-right'));
		var odHeightPadH = parseInt($('.od_head').css('padding-top'))+parseInt($('.od_head').css('padding-bottom'));
	
	}
	overdiv.width(_w + odWidthPad);
	if(typeof(_h) != 'number'){} //alert('string height');//overdiv.height(_h);
	
	else{} //overdiv.height(_h+headSize+odHeightPad+odHeightPadH); //alert('num height: ' + (_h+headSize+odHeightPad+odHeightPadH));
	
	$('.od_body').width(_w);
	$('.od_body').height(_h);
	
}

function getHeight(el){
		
	if(mainDiv.css('display') === 'none'){
	mainDiv.css({
				visibility: 'hidden' ,
				display: 'block' ,
				position: 'absolute '
				});
	
	
	var odHeight = el.innerHeight();
	
	mainDiv.css({
		visibility: 'inherit' ,
		display: 'none' ,
		position: 'absolute '
		});
	}else{
		var odHeight = el.innerHeight();
	}

	return(odHeight);
}

function getWidth(el){
	
	if(mainDiv.css('display') === 'none'){
	overdiv.css({
				visibility: 'hidden' ,
				display: 'block' ,
				position: 'absolute '
				});
	
	
	var odWidth = el.innerWidth();
	
	mainDiv.css({
		visibility: 'inherit' ,
		display: 'none' ,
		position: 'absolute '
		});
	}else{
		var odWidth = el.innerWidth();
	}

	if(debug) console.log("getW: "+odWidth);
	
	return(odWidth);
}


function getImageDim(img){
	
	
	if(debug) console.log("displays: "+ overdiv.css("display")+ '...' + img.css("display") +'...'+mainDiv.css("display") );
	
	if(overdiv.css("display") === 'none'){
		if(debug) console.log("displays: "+ overdiv.css("display")+ '...' + img.css("display") +'...'+mainDiv.css("display") );
		overdiv.css({
			visibility: 'hidden' ,
			display: 'block' 
			
			});
		var imgWidth = img.width();
		var imgHeight = img.height();
		
		overdiv.css({
			visibility: 'inherit' ,
			display: 'none' 
			
			});
		if(debug) console.log("displays: "+ overdiv.css("display")+ '...' + img.css("display") +'...'+mainDiv.css("display") );
	}else {
		var imgWidth = img.width();
		var imgHeight = img.height();
	}
	if(debug) console.log("displays: "+ overdiv.css("display")+ '...' + img.css("display") +'...'+mainDiv.css("display") );
	if(debug) console.log(imgWidth + "XxX" + imgHeight);
	
	return [imgWidth, imgHeight];
}

function writeHTML(i){
	
	if(document.body){

		
		
		if (!dimmer || dimmer == ''){
			$(document.body).prepend('		<div id="mainDiv" class="od_mainDiv " style="" ></div>');
			$("#mainDiv").prepend('<div id="dimmer" style="" onclick="overDiv.kill();"></div>');
			
		}else{
			//dimmer.after('		<div id="mainDiv" class="od_mainDiv " style="" ></div>');
		}

	}else{
			//$(document.documentElement).prepend('<div id="dimmer" style="display: none;" onclick="overDiv.close();"></div>');
			$(document.documentElement).prepend('		<div id="mainDiv_'+i+'" style="display:none;" onclick=""></div>');
	}
	
	overDivID = '#overdiv_'+i;
	
	
	mainDiv = $('#mainDiv');
	if(debug) console.log(mainDiv);
	
	dimmer = $('#dimmer');
	//dimmer = mainDiv.children('#dimmer');

	mainDiv.append('<div id="loading" class="css3" style=""></div>');
	mainDiv.append('<div id="overdiv_'+i+'" style="" class="overdivs active createActive css3" onclick="switchOD(this);"></div>');
	//loading = $('#loading');
	loading = mainDiv.children('#loading');
	//overdiv = $('#overdiv');
	overdiv = mainDiv.children(overDivID);
	
	overdiv.append('<div class="od_close" onclick="overDiv.close(this);" ></div>');
	overdiv.append('<div class="od_head css3" >header</div>');
	overdiv.append('<div class="od_body css3" >body</div>');
	
	overDiv.element = overdiv;
	
	if(PIE_support == true){
		$(".css3").each(function(e){
			$(this).addClass("css3PIE");
		});
	}
}



function switchOD(el){
	$('.overdivs').each(function(i){
		if(debug) console.log("switch");
		if($(this).hasClass('createActive')){
			$(this).removeClass('createActive'); 
			
			$(this).prev("css3-container").css('z-index', 100000);
		}
		else {
	$(this).removeClass('active');
	$(this).prev("css3-container").css('z-index', 99999);
	$(this).addClass('inactive');
		}
	});
	if(debug) console.log("switch: "+el);
	$(el).addClass('active');
	$(el).removeClass('inactive');
	$(el).prev("css3-container").css('z-index', 100000);
}

//set standards an intialize

overDiv.init();

$(document).ready(function(){
	
	createCSSNode('overdiv2.css');
	createCSSNode(themeCSS);
	
	$(document).keydown(function(e){
		if(e.keyCode === 27) overDiv.kill();
	});
	
	
	
});

$(document).mousemove(function(e){
	
	evt = e;
	if(!evt) evt = window.event;
	
});