/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

(function($){
	var defaults = {
		canvasColor        : "black",
		canvasOpacity      : 0.5,
		canvasZIndex       : 100,
		lightboxColor      : "white",
		lightboxPadding    : 1,
		lightboxZIndex     : 200,
		fadeInTime         : 0,
		fadeOutTime        : 0,
		closeOnCanvasClick : true,
		closeOnEscape      : true,
		allowScrollbars    : "vertical",
		offsetTop          : 22,
		offsetLeft         : 22,
		onShowCallback     : null,
		onCloseCallback    : null,
		maxWidth           : null,
		minWidth           : null,
		indicator          : Config.images.ajaxLoaderDialog
	};

	$.fn.modaldialog = function(_action_options, _options) {
		// Anzahl der gematchten Elemente auf 1 reduzieren... wir koennen
		// nur EINEN modalen Dialog zur selben Zeit erzeugen!
		var obj = this.get(0);
		var action = "show";

		if(obj == document) obj = null;

		if(_action_options) {
			if(typeof _action_options == "string") {
				action = _action_options;
			} else if(typeof _action_options == "object") {
				_options = _action_options;
			}
		}

		var options = $.extend(true, defaults, _options);

		if(obj != null) {
			options = getOptions(obj, typeof _options == "object" ? _options : null);
		}

		// Basiskomponenten erzeugen
		createCanvas(options);
		createLightbox(options);

		if(obj != null) {
			// Objekt ggf in die Lightbox einfuegen
			appendToLightbox(obj, options);
		
			// Lightbox und Canvas an das aktuelle Objekt und die Optionen anpassen
			updateCanvas(options);
			updateLightbox(options);
		}

		if(action == "show") {
			show(options);
		} else if(action == "close") {
			close(options);
		} else {
			load(action, options);
		}

		return this;
	}

	function getOptions(obj, extended) {
		var options = {};
		var modified = false;

		if($.data(obj, "options")) {
			options = $.data(obj, "options");
		} else {
			options = $.extend(true, options, defaults);
			modified = true;
		}

		if(typeof extended == "object") {
			options = $.extend(true, options, extended);
			modified = true;
		}

		if(modified) {
			$.data(obj, "options", options);
		}

		return options;
	}

	function createCanvas(options) {
		if($('#canvas').length == 0) {
			var $canvas = $('<div id="canvas">');

			$canvas.append(
				$('<img border="0" id="ajax-indicator" style="display:none; position:absolute" src="' + options.indicator + '">')
			);

			$canvas.appendTo('body');

			$canvas.css({
				position        : "absolute",
				top             : 0,
				left            : 0,
				opacity         : 0
			});

			$canvas.click(function() {
				close('canvas');
			});

			$canvas.hide();

			$(window).keydown(function(e) {
				// Firefox, IE etc.?
				if(e.keyCode == 27) {
					close("escape");
				}
			});
		}
	}

	function updateCanvas(options) {
		$("#canvas").css({
			backgroundColor : options.canvasColor,
			width           : $(window).width(),
			height          : $(document.body).height(),
			zIndex          : options.canvasZIndex
		});

		$('#ajax-indicator').css({
			top  : ($(document.body).height() - $('#ajax-indicator').height()) / 2,
			left : ($(window).width() - $('#ajax-indicator').width()) / 2
		})

		if(options.allowScrollbars != "both") {
			if(options.allowScrollbars == "vertical") {
				$("body").css({
					overflowX : "hidden",
					overflowY : "auto"
				});
			} else if(options.allowScrollbars == "horizontal") {
				$("body").css({
					overflowX : "auto",
					overflowY : "hidden"
				});
			} else if(options.allowScrollbars == "none") {
				$("body").css("overflow", "hidden");
			}
		} else {
			$("body").css("overflow", "auto");
		}
	}

	function createLightbox() {
		if($('#box_lightbox').length == 0) {
			var $lightbox = $(
				'<div class="box_lightbox lightbox_compare" id="box_lightbox">' +
					'<div class="lightbox_close">' +
						'<img src="' + Config.images.lightboxCloseButton + '" alt="Close" title="Close" id="closebutton_lightbox"/>' +
					'</div>' +
					'<div class="rounded_lt"></div>' +
					'<div class="rounded_lb"></div>' +
					'<div class="rounded_rt"></div>' +
					'<div class="rounded_rb"></div>' +
					'<div class="box_lightbox_shadow_tl"></div>' +
					'<div class="box_lightbox_shadow_tr"></div>' +
					'<div class="box_lightbox_shadow_t"></div>' +
					'<div class="box_lightbox_shadow_l">' +
						'<div class="box_lightbox_shadow_r">' +
							'<div id="content_lightbox"></div>' +
						'</div>' +
					'</div>' +
					'<div class="box_lightbox_shadow_bl"></div>' +
					'<div class="box_lightbox_shadow_br"></div>' +
					'<div class="box_lightbox_shadow_b"></div>' +
					'<div class="box_lightbox_shadow_ie"></div>' +
				'</div>'
			);
	
			$(document.body).append($lightbox);
			
			$lightbox.css("position" , "absolute").hide();
			$("#closebutton_lightbox").click(function() {
				close('button');
			});
			$("#closebutton_content_lightbox").click(function() {
				close('button');
			});
		}
	}

	function load(url, options) {
		updateCanvas(options);
		showCanvas(options);

		// Indikator einbinden
		$('#ajax-indicator').show();

		var imageExt = url.match(/[^\.]+\.(jpg|gif|png)([^a-z0-9\.]+.*)?$/);

		if(imageExt) {
			var img = new Image();
			$(img).attr("src", url + ($.browser.msie ? "?_=" + (new Date()).getTime() : "")).load(function() {
				$('#content_lightbox').children().remove();
				/*
				 * <div style="padding:15px; position:relative; width:500px;">
				 */
				$("#content_lightbox").append(
					$('<div style="position:relative"><img src="' + img.src + '" border="0" width="' + img.width + '" height="' + img.height + '"/></div>')
				);
				$.data($("#content_lightbox").get(0), "originalParent", null);
				updateLightbox(options);
				showLightbox(options);
				$('#ajax-indicator').hide();
			});
		} else {
			$.get(url, null, function(data) {
				$('#content_lightbox').children().remove();
				$("#content_lightbox").append($(data));
				$.data($("#content_lightbox").get(0), "originalParent", null);
				updateLightbox(options);
				showLightbox(options);
				$('#ajax-indicator').hide();
			}, "html");
		}
	}

	function appendToLightbox(obj) {
		if($.data($("#content_lightbox").get(0), "originalParent") != obj.parentNode) {
			$.data($("#content_lightbox").get(0), "originalParent", obj.parentNode);
		}

		$("#content_lightbox").append(obj);
		$(obj).show();
	}

	function updateLightbox(options) {
		var $lightbox = $('#box_lightbox');
		var $contentPane = $('#content_lightbox');
		var $firstChild = $contentPane.children().eq(0);

		$firstChild.addClass("box_lightbox_inner_single");

		if(options.maxWidth != null && $firstChild.outerWidth() > options.maxWidth) {
			$firstChild.css("width", options.maxWidth);
		}

		if(options.maxHeight != null && $firstChild.outerHeight() > options.maxHeight) {
			$firstChild.css("height", options.maxHeight);
		}

		var top = ($(window).height() - $lightbox.outerHeight()) / 2;
		var left = ($(window).width() - $lightbox.outerWidth()) / 2;
		var scrollTop = $(window).scrollTop();
		var scrollLeft = $(window).scrollLeft();

		$lightbox.css({
			top  : top  > options.offsetTop  ? top + scrollTop : options.offsetTop + scrollTop,
			left : left > options.offsetLeft ? left + scrollLeft : options.offsetLeft + scrollLeft
		});

		$lightbox.css("zIndex", options.lightboxZIndex);

		$contentPane.css({
			backgroundColor : options.lightboxColor,
			margin          : 0,
			padding         : options.lightboxPadding
		});
	}

	function showCanvas(options, callback) {
		$('#canvas').css("opacity", 0).show().fadeTo(
			options.fadeInTime, options.canvasOpacity, 
			typeof callback == "function" ? callback : null
		);
	}

	function showLightbox(options) {
		$('#box_lightbox').show();
		$('#canvas').css("height", $(document).height());

		if(typeof options.onShowCallback == "function") {
			options.onShowCallback.call();
		}
	}
	
	function show(options) {
		showCanvas(options, function() {
			showLightbox(options);
		});
	}

	function close(origin) {
		var obj = $('#content_lightbox').children().get(0);
		var options = getOptions(obj);

		if(origin == 'canvas' && !options.closeOnCanvasClick) {
			return;
		}

		if(origin == 'escape') {
			if(!options.closeOnEscape || $('#box_lightbox:visible').length == 0) {
				return;
			}
		}

		$('#box_lightbox').hide();

		var originalParent = $.data($("#content_lightbox").get(0), "originalParent");

		if(originalParent) {
			$(obj).hide().appendTo($.data($("#content_lightbox").get(0), "originalParent"));
		} else {
			$('#content_lightbox').children().remove();
		}
		

		if(typeof options.onCloseCallback == "function") {
			options.onCloseCallback.apply(null, null);
		}

		$('#canvas').fadeTo(options.fadeOutTime, 0, function() {
			$('#canvas').hide();
			$("body").css("overflow", "auto");
		});
	}	
	$.fn.modaldialog.indicator = new Image();
})(jQuery)