/***********************************************************************
                          imageMap_hotspot.js
************************************************************************
Do not change this file unless it should change for all users.

This file defines functions that deal with either hotspots or imagemaps

************************************************************************/

Content.prototype.handleArea = function(area,mapNr,areaNr){
	var areaString = "";
	var areaID = mapNr+"_"+areaNr;
	var originalAreaShape = $(area).attr("shape");
	var areaShape;
	var originalAreaCoords = $(area).attr("coords");
	var areaCoords;
	var areaHref;
	
	if(originalAreaShape == "x_y"){
		areaShape = "circle";
		areaCoords = originalAreaCoords + ",15";
	} else {
		areaShape = originalAreaShape;
		areaCoords = originalAreaCoords;
	}

	var fcid = "child_"+mapNr+"_"+areaNr; 
	
	var isDialog = false;
	
	//Figure out the type of area (link or textbox)
	var typeinfo = $(area).find(":first");
	if($(typeinfo).is("a")){
	//If the first child is <a> then it is a link
		//Check if it is a dialog box
		if($(typeinfo).hasClass("dialog_link")){
			isDialog = true;
		}
	
	/*if($(typeinfo).is("a")){
		var aType = $(typeinfo).attr("type");
		areaHref = $(typeinfo).attr("href");
		if(aType == "inlink"){
			//Open a dialog box
			
			var id = $(area).find("a:first").attr('href');//.substring(areaHref.indexOf("#")+1);
			if(id.indexOf("#") != -1){
				id = id.substring(areaHref.indexOf("#")+1);
			}
			var newareaHref = 'showDialogBox(\"'+id+'\");';
			if(originalAreaShape == "x_y"){
				areaString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' onclick='"+newareaHref+"' type='hotspot'><div class='at_hotspot' id='hotspot_"+areaID+"'><a href='javascript:void(0); class='hotspotlink' onclick="+newareaHref+"'><img src='images/circles.png'></a></div>";
			} else{
				areaString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' href='javascript:void(0);' onclick='"+newareaHref+"'>";
			}

		} else {
			if(originalAreaShape == "x_y"){
				areaString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' onclick='"+areaHref+"' type='hotspot'><div class='at_hotspot' id='hotspot_"+areaID+"'><a href='javascript:void(0); class='hotspotlink' onclick="+areaHref+"' target='_blank'><img class='hotspot_circle' src='images/circles.png'></a></div>";
			} else{
				newMapString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' href='"+areaHref+"' target='_blank'>";
			}
			//Open a web link in a new window
		}
	}*/
	//Otherwise just create areas to click
	}
	
	
		//Need to escape these to prevent problems.
		areaHref = 'showImagemap(\"'+fcid+'\");';
		
		if(originalAreaShape == "x_y"){
			var coords = areaCoords.split(',');
			//No longer needed since we now force authors to calculate stuff from the top left corner of the hotspot image.
			//var xCoord = coords[0] - 15;
			//var yCoord = coords[1] - 5;
			var xCoord = coords[0];
			var yCoord = coords[1];
			areaString += "<area class='hotspot_dot' shape='"+areaShape+"' coords='"+areaCoords+"'";
			if(isDialog){
				var id = $(area).find("a:first").attr('href');
				var newareaHref = 'showDialogBox(\"'+id+'\");';
				areaString += "onclick='"+newareaHref+"' type='hotspot'><a href='javascript:void(0);' class='hotspotlink' onclick='"+newareaHref+"'><div class='at_hotspot' style='position: absolute; left:"+xCoord+"px ; top:"+yCoord+"px ;' id='hotspot_"+areaID+"'></div></a></area>";
			} else {
				areaString += "onclick='"+areaHref+"' type='hotspot'><a href='javascript:void(0);' class='hotspotlink' onclick='"+areaHref+"'><div class='at_hotspot' style='position: absolute; left:"+xCoord+"px ; top:"+yCoord+"px ;' id='hotspot_"+areaID+"'></div></a></area>";
			}
				
		} else{
			if(isDialog){
				var id = $(area).find("a:first").attr('href');
				var newareaHref = 'showDialogBox(\"'+id+'\");';
				areaString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' href='javascript:void(0);' onclick='"+newareaHref+"'>";
			} else {
				areaString += "<area shape='"+areaShape+"' coords='"+areaCoords+"' href='javascript:void(0);' onclick='"+areaHref+"'>";
			}
		}
		
	//Set the area id
	$(area).attr('id',fcid);
	$(area).hide();
	
	return areaString;
}


Content.prototype.createImagemap = function(){
	var c = this;
	var mapList = $(".map");
	if(!($(mapList).length)){
		//No maps found? Give up!
		return;
	}
	
	//There might be more than one imageMap on a page, do this for each one
	$(mapList).each(function(i_map,v_map){
		var mapName = $(this).attr("name");
		var mapType = $(this).attr("type");
		var mapImage = $(this).find("img:first");

		$(mapImage).attr("usemap","#"+mapName);
		
		var newMapString = "<map name='"+mapName+"' id='"+mapName+"' class='lcObject lcObject_map'>";
		
		//Check each area. Arbortext won't put out areas with the area tag, instead they come out with area class.
		var areaList = $(this).find(".area");
		$(areaList).each(function(i_area,v_area){
			var areaString = c.handleArea(this,i_map,i_area);
			
			newMapString += areaString;
		});
		
		newMapString += "</map>";
		$(newMapString).appendTo($(".imagemap_figure"));
	});
	$(".imagemap_figure").prependTo($("#imageHolder"));
	
	c.resizeImagemaps();
}

//Resizes the image map based on the image size.
Content.prototype.resizeImagemaps = function(){
	var imagemapList = $(".imagemap_figure");
	$(imagemapList).each(function(i_image,v_image){
		var imageMap = $(this);
		var mapList = $(imageMap).find("map");
		if(!($(mapList).length)){
			//No maps found? Give up!
			return;
		}
		$(mapList).each(function(i_map,v_map){
			var currentMap = this;
			
			//Create a temp image that we can use to calculate the original image size even in IE8
			var i = new Image();
			i.src = $(imageMap).find("img:first").attr('src');
			//Don't do anything until the image is loaded, so that we can get the original size
			i.onload = function() {
				//Get the original image width
				var originalWidth = i.width;
				
				//Get new image size
				var currentWidth = $(imageMap).find("img:first").width();
				
				//Figure out the ratio
				var imageRatio = currentWidth/originalWidth;
				
				//Go through all the areas and multiply the coordinates by the ratio
				var areaList = $(currentMap).find("area");
				$(areaList).each(function(i_area,v_area){
					var coordsString = $(this).attr('coords');
					var coordsString2 = "";
					var coordArray = coordsString.split(',');
					for(var i=0;i < coordArray.length;i++) {
						//Make sure the number is converted to an int
						var coordNumber = parseInt(coordArray[i], 10);
						//multiply it by the ratio to get the new coordinates
						coordArray[i] = Math.floor(coordNumber*imageRatio);
						//Create a pretty string that we can use to set the new coordinates on the area
						if(!coordsString2.length){
							coordsString2 = String(coordArray[i]);
						}else{
							coordsString2 += ","+ String(coordArray[i]);
						}
					}
					
					//Set the new coords string
					$(this).attr('coords', coordsString2);
				});
				
				//Go through all the hotspots and move them too.
				var hotspotList = $(currentMap).find(".at_hotspot");
				$(hotspotList).each(function(i_hs,v_hs){
					var hs_left_old = parseInt($(this).css('left'),10);
					var hs_top_old = parseInt($(this).css('top'),10);
					
					var hs_left_new = Math.floor(hs_left_old*imageRatio);
					var hs_top_new = Math.floor(hs_top_old*imageRatio);
										
					//Set the new coords string
					$(this).css('left', hs_left_new);
					$(this).css('top', hs_top_new);
				});
			}
			
		});
	});
}

function closeImageMaps(){
	hideElements($(".area"));
}

/* Visa bilder mha imagemaps */
function showImagemap(id){
	if($(".textdim").length > 0){
		return false;
	}
	hideElements($(".area"));
	showElements($("#"+id));
}