/*  image and position  on questions 
 * 	
 * 	.googleMaps Options: flag: 1 - show Map Controls
 *  					 zoom: 10 - Zoom in Map 
 * */
var loadingImage = 'http://www.hiogi.de/img/loading.gif';
var uploadPath = 'http://www.hiogi.de/upload/hiogi_de/photo_questions/';
// var uploadPath = 'http://hiogi.local/upload/hiogi_de/photo_questions/';
function showQuestionImage(element, questionDetailsPage) {

	var url = $(element).attr('href');
	var imgName = url.substr(url.lastIndexOf('/') + 1, url.length);
	var imgLink = uploadPath + imgName;

	if (questionDetailsPage) {
		$(element).append('<img class="loading" style="width:15px;height:15px;" alt="loading" src="' + loadingImage + '" />');
		var target = $(element).parent();
		var div = $("#questimg").parent();
		var w = $("#questimg").width();
		if (w > 470)
			w = 470;
		$("#questimg").css( {
			"width" : w + "px"
		});
		if ($(".Iclose").html() == "Bild schließen"	|| $(".Iclose").html() == "close picture") {
			$(div).slideUp(	'slow',	function() {
						$(target).removeClass('questionDetailsQuestionImage')
								.removeClass('groesser').css( {
									'border-bottom' : '0px'
								});
						if ($(".Iclose").html() == "close picture")
							$(".Iclose").html('open picture');
						else
							$(".Iclose").html('Bild öffnen');
						$("img.loading").remove();
						$(div).show();
			});
		} else {
			$(div).hide();
			$(target).addClass('groesser').css( {
				'border-bottom' : '1px solid #b1b1b0'
			});
			$(div).slideDown('slow', function() {
				if ($(".Iclose").html() == "open picture")
					$(".Iclose").html('close picture');
				else
					$(".Iclose").html('Bild schließen');
				$("img.loading").remove();
			});
		}
		return false;
	} else {
		$(element).parent().css( {
			'background-color' : '#ececec'
		});
		var offset = $(element).offset();
		var wLeft = offset.left - $(element).width();
		var wTop = offset.top;

		$('body').append('<img class="loading" style="position:absolute;z-index:334;left:'+ wLeft + 'px;top:' + wTop + 'px;width:15px;height:15px;" alt="loading" src="'+ loadingImage + '" />');
		$('body').append('<div id="shortQuestionImage" style="width:1px;position:absolute;z-index:233;left:-9999px;top:'+ wTop	+ 'px"><img id="questimg" style="max-width:470px;" onload="showQuestImage('	+ offset.left + ');"  alt="Bild zur Frage" src="'+ imgLink + '" /></div>');
	}
	return false;
}

$("a.photoquestion").click(function(event) {
	event.preventDefault();
	return false;
});
$("a.positionquestion").click(function(event) {
	event.preventDefault();
	return false;
});

function showQuestImage(left) {

	var top = $(window).scrollTop();
	var h = $(window).height();
	var elTop = $("#shortQuestionImage").offset().top;
	var w = $("#shortQuestionImage #questimg").width();
	var imgH = $("#shortQuestionImage #questimg").height();

	var wTop = elTop;
	if (top > elTop) {
		wTop = elTop + (top - elTop);
	} else {
		var y = h - (elTop - top);
		if (y < imgH) {
			wTop = elTop - (imgH - y) - 10;
		}
	}

	$("#shortQuestionImage").css("top", wTop);
	if (w > 470) {
		w = 470;
		$("#shortQuestionImage, #questimg").css( {
			'width' : w + "px"
		});
	} else
		w = $("#shortQuestionImage #questimg").width();

	var imgLeft = left - w - 18;
	$("#shortQuestionImage").slideUp('fast', function() {
		$('#shortQuestionImage').css( {
			'left' : imgLeft + 'px',
			'width' : w + 'px'
		});
		$('#shortQuestionImage').slideDown('slow', function() {
			$("img.loading").remove();
		});
	});

	return false;

}
function removeQuestionImage(element) {
	$("img.loading").remove();
	$('#shortQuestionImage').remove();
	$(element).parent().css({'background-color' : '#fff'});
	return false;
}

function showGoogleMapLocation(element, questionDetailsPage) {

	var url = $(element).attr('href');
	var points = url.substr(url.lastIndexOf('/') + 1, url.length);
	var point = points.split(',');

	if (questionDetailsPage) {
		$(element).append('<img class="loading" style="width:15px;height:15px;" alt="loading" src="' + loadingImage + '" />');
		var target = $(element).parent();
		var div = $("#map").parent();
		if ($(".Gclose").html() == "GoogleMap schließen" || $(".Gclose").html() == "close GoogleMap") {
			$(div).slideUp('slow', function() {
				$(target).removeClass('groesser').css({'border-bottom' : '0px'});
				$('img.loading').remove();
				if ($(".Gclose").html() == "close GoogleMap")
					$(".Gclose").html('open GoogleMap');
				else
					$(".Gclose").html('GoogleMap öffnen');
				$('img.loading').remove();
			});
		} else {

			$('#map').googleMaps( {
				latitude : point[0],
				longitude : point[1],
				flag : 1,
				sizeW : 470
			});
			$(div).hide();
			$(target).addClass('groesser').css({'border-bottom' : '1px solid #b1b1b0'});
			$(div).slideDown('slow', function() {
				if ($(".Gclose").html() == "open GoogleMap")
					$(".Gclose").html('close GoogleMap');
				else
					$(".Gclose").html('GoogleMap schließen');
				$('img.loading').remove();
			});
		}
		return false;
	} else {
		$(element).parent().css({'background-color' : '#ececec'});
		var offset = $(element).offset();
		wLeft = offset.left - $(element).width() - 470;

		var top = $(window).scrollTop();
		var h = $(window).height();
		var elTop = $(element).offset().top;
		var imgH = 400;

		var wTop = elTop;
		if (top > elTop) {
			wTop = elTop + (top - elTop);
		} else {
			var y = h - (elTop - top);
			if (y < imgH) {
				wTop = elTop - (imgH - y) - 50;
			}
		}

		$('body').append('<img class="loading" style="position:absolute;left:'+ (wLeft + 235)	+ 'px;top:'+ (wTop - 5)+ 'px;width:15px;height:15px;z-index:334" alt="loading" src="'+ loadingImage + '" />');
		$('body').append('<div id="shortGoogleMapLocation" style="background-color:#fff;position:absolute;z-index:333;left:'	+ wLeft	+ 'px;top:' + wTop + 'px"><h2 class="space10">Position des Fragers</h2><div id="map" style="display:none;width: 480px; height: 400px"></div></div>');
		$('#shortGoogleMapLocation #map').googleMaps( {
			latitude : point[0],
			longitude : point[1],
			flag : 0,
			sizeW : 470,
			sizeH : 380,
			zoom : 12
		}).slideDown('slow', function() {
			$("img.loading").remove();
		});
	}
	return false;
}
function removeGoogleMapLocation(element) {
	$("img.loading").remove();
	$('#shortGoogleMapLocation').remove();
	$(element).parent().css({'background-color' : '#fff'});
	return false;
}