// ------------------------------------------
// CLASS   : mcms_img_popup
// descr.  : manages the img-popup function
// author  : Richard Lagerström (+46 739 39 19 10)
// website : http://www.empty.se, http://www.mediatroop.se
// date    : 2007-07-03
// ------------------------------------------
function mcms_img_popup()
{
	// -------------------------------------------
	// properties
	// -------------------------------------------
		/* SETTING: whether to use run time preloading (preload individual images on-demand)
		 * @var string
		*/
		this.run_time_preloading = true;
		
		
		/* whether images has been preloaded already
		 * @var string
		*/
		this.has_preloaded = false;
		
		
		/* picture bank
		 * @var string
		*/
		this.picture_bank = new Array();
		
		/* picture text
		 * @var string
		*/
		this.picture_text = new Array();
		
		
		/* current picture bank index
		 * @var string
		*/
		this.current_index = 0;
		
		
		/* minimum allowed picture width
		 * this prevents user from zooming out to a width smaller than this
		 * @var string
		*/
		this.min_pic_width = 100;
		
		
		/* minimum allowed container width
		 * this prevents container box from getting set to a smaller width
		 * @var string
		*/
		this.min_container_width = 450;
		
		
		/* default picture width
		 * default image width (width image gets by default when bringing a picture to be viewed)
		 * @var string
		*/
		this.default_width = 0;
		
		
		/* container width offset (size of the borders surrounding the image to the left and right)
		 * @var string
		*/
		this.container_width_offset = 20;
		
		
		/* container height offset
		 * @var string
		*/
		this.container_height_offset = 60;
		
		
		/* fade in image
		 * @var string
		*/
		this.fade_in_image = '';
		
		/* fade in image
		 * @var string
		*/
		this.image_popup_div_id = 'mcmsImgPopup';
		
		/* image zoom id
		 * @var string
		*/
		this.imageZoomId = 'pic';
		
		
	// -------------------------------------------
	// methods
	// -------------------------------------------
		/* hidex a given box
		 * @param 
		 * @return void
		*/
		this.get_picture_bank_length = function()
		{
			// get picture bank length (for displaying "Loading picture X of X"
			var preload_length = this.picture_bank.length;//this.run_time_preloading ? 1 : this.picture_bank.length;
			
			// return length
			return preload_length;
		}
		
		/* hidex a given box
		 * @param 
		 * @return void
		*/
		this.popup_hide = function()
		{
			// hide popup box
			if(parent.document.getElementById(this.image_popup_div_id)) parent.document.getElementById(this.image_popup_div_id).style.display = 'none';
			if(parent.document.getElementById(this.image_popup_div_id)) parent.document.getElementById(this.image_popup_div_id).innerHTML = '';
			
			// hide site fader
			if(parent.document.getElementById('lockedLayer')) parent.document.getElementById('lockedLayer').style.display = 'none';
			
			// disable handle image navigation by arrow keys
			parent.document.onkeyup = null;
		}
		
	
		/* displays a popup with contents retreived from given DIV id (innerHTML)
		 * @param 
		 * @return void
		*/
		this.popup = function(image_index, fade_in_image)
		{
			// set obj_image_popup in Zoom object
			amcmsImgZoom.obj_image_popup = this.image_popup_div_id;
			amcmsImgZoom.id = this.imageZoomId;
			
			// set fade in image status
			fade_in_image = (fade_in_image == undefined || fade_in_image == "undefined") ? true : fade_in_image;
			this.fade_in_image = fade_in_image;
			
			// declare some vars
			var image_src = '';
			var image_text = 'Text.';
			
			// move this box to center of the screen
			//parent.document.getElementById(this.image_popup_div_id).style.left = (screen.availWidth/4) + 'px';
			//parent.document.getElementById(this.image_popup_div_id).style.top = ((screen.availHeight/4)-100) + 'px';
			parent.document.getElementById(this.image_popup_div_id).style.left = 205 + 'px';
			parent.document.getElementById(this.image_popup_div_id).style.top = 100 + 'px';
			
			// jump to site top
			window.scroll(10000,0);
			
			// declare index of this picture in bank
			eval(this.image_popup_div_id+".current_index = 0;");
			
			// get image index-, and image source from picture bank
			for(i = 0; i < eval(this.image_popup_div_id+".picture_bank.length"); i++)
			{
				if(i == image_index)
				{
					eval("image_src = "+this.image_popup_div_id+".picture_bank[i];");
					eval("if("+this.image_popup_div_id+".picture_text[i] != undefined && "+this.image_popup_div_id+".picture_text[i] != 'undefined' && "+this.image_popup_div_id+".picture_text[i] != '') image_text = "+this.image_popup_div_id+".picture_text[i];");
					eval(this.image_popup_div_id+".current_index = "+i+";");
					break;
				}
			}
			
			// display popup
			parent.document.getElementById(this.image_popup_div_id).style.display = '';
			
			// set popup content 
			var imgHTML  = '<div id="preloadLoading_individual_'+this.image_popup_div_id+'"></div>';
				imgHTML  += '<div id="preloadLoaded_individual_'+this.image_popup_div_id+'" style="'+(this.has_preloaded ? 'display: block;' : ' display: none;')+'">';
				imgHTML  	+= '<div id="imgContainer" onmouseover="amcmsImgZoom.trigger_scroll_zoom();" onmouseout="amcmsImgZoom.untrigger_scroll_zoom();" style="width: 100%; border: 10px solid white;">';
				//var imgHTML  = '<div id="imgContainer" onmouseover="getIFrameDocument(\'appFrame\');" onmouseout="" style="width: 100%; border: 10px solid white;">';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.previous(); return false;">[previous]</a> | ';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.next(); return false;">[next]</a> ';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.zoom_in(); return false;">[förstora]</a> ';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.zoom_out(); return false;">[förminska]</a> ';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.popup_hide(); return false;">[x]</a><br/>';
				imgHTML 	+= '	<img src="'+image_src+'" id="'+amcmsImgZoom.id+'" title="Tips: Bläddra med piltangenterna och zooma med scrollen!" onclick="'+this.image_popup_div_id+'.next(); return false;" style="width: '+eval(this.image_popup_div_id+".default_width")+'px; padding: 0 0 0 0;" />';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.zoom_original(); return false;">[original]</a> ';
				//imgHTML 	+= '	<a href="" onclick="mcmsImgPopup.zoom_default(); return false;">[default]</a> ';
				imgHTML 	+= '</div>';
				imgHTML 	+= '<div style="border-left: 10px solid white; border-right: 10px solid white; border-bottom: 10px solid white; background-color: white;">';
				imgHTML 	+= '	<table cellspacing="0" cellpadding="0" border="0" width="100%">';
				imgHTML 	+= '		<tr>';
				imgHTML 	+= '			<td colspan="2">';
				imgHTML 	+= '				<strong>'+image_text+'</strong>';
				imgHTML 	+= '			</td>';
				imgHTML 	+= '		</tr>';
				imgHTML 	+= '		<tr>';
				imgHTML 	+= '			<td>';
				//imgHTML 	+= '				Bild '+(image_index+1)+' av '+(this.run_time_preloading ? 13 : eval(this.image_popup_div_id+".picture_bank.length"))+'.';
				imgHTML 	+= '				Bild '+(image_index+1)+' av '+eval(this.image_popup_div_id+".picture_bank.length")+'.';
				imgHTML 	+= '			</td>';
				imgHTML 	+= '			<td align="right">';
				imgHTML 	+= '				<a href="" onclick="'+this.image_popup_div_id+'.popup_hide(); return false;">Stäng [x]</a>';
				imgHTML 	+= '			</td>';
				imgHTML 	+= '		</tr>';
				imgHTML 	+= '	</table>';
				imgHTML 	+= '</div>';
			imgHTML 	+= '</div>';
			parent.document.getElementById(this.image_popup_div_id).innerHTML = imgHTML;
			
			// preload
			if(!this.has_preloaded) 
			{
				setTimeout("var dummy = new ImagePreloader_individual("+this.image_popup_div_id+".picture_bank, onPreload_individual, '"+this.image_popup_div_id+"');", 100);
				this.has_preloaded = true;
			}
			else
			{
				this.individual_image_show();
			}
			
			// handle image navigation by arrow keys
			/*parent.document.onkeyup = mcmsImgPopup.checkKey;

			// adjust image container size
			mcmsImgPopup.adjust_container(fade_in_image);
			
			// fade entire site (set focus on popup)
			if(parent.document.getElementById('lockedLayer'))
			{
				parent.document.getElementById('lockedLayer').style.display = 'block';
				mcmsImgPopup.setFadeHeight();
			}
			
			// set focus here (so that arrows works without user having to focus it)
			parent.window.focus();
			
			// fade in image
			mcmsImgPopup.initImage();*/
		}
		
		
		/* enable gallery after individual image has been preloaded
		 * @param 
		 * @return void
		*/
		this.individual_image_show = function()
		{
			// handle image navigation by arrow keys
			if(this.image_popup_div_id == 'mcmsImgPopup') eval("parent.document.onkeyup = "+this.image_popup_div_id+".checkKey;");
			if(this.image_popup_div_id == 'mcmsImgPopup2') eval("parent.document.onkeyup = "+this.image_popup_div_id+".checkKey2;");

			// adjust image container size
			eval(this.image_popup_div_id+".adjust_container("+this.fade_in_image+");");
			
			// fade entire site (set focus on popup)
			if(parent.document.getElementById('lockedLayer'))
			{
				parent.document.getElementById('lockedLayer').style.display = 'block';
				eval(this.image_popup_div_id+".setFadeHeight();");
			}
			
			// set focus here (so that arrows works without user having to focus it)
			parent.window.focus();
			
			// fade in image
			eval(this.image_popup_div_id+".initImage();");
		}
		
		
		/* refresh picture list
		 * @param 
		 * @return void
		*/
		this.refresh_list = function()
		{
			/*var apa = "";
			for(i = 0; i < mcmsImgPopup.picture_bank.length; i++)
			{
				if(mcmsImgPopup.current_index == i) apa += '[S] ';
				apa += "<a href=\"\" style=\"color: black; text-decoration: none;\" onclick=\"mcmsImgPopup.popup("+i+"); return false;\">"+mcmsImgPopup.picture_bank[i]+"</a>" + "<br>";
			}
			
			document.getElementById('mja').innerHTML = apa;*/
		}
		
			
		/* adjust image container to image size
		 * @param 
		 * @return void
		*/
		this.adjust_container = function(fade_in_image)
		{
			if(parent.document.getElementById(amcmsImgZoom.id) && parseInt(parent.document.getElementById(amcmsImgZoom.id).offsetHeight) < 1)
			{
				setTimeout(this.image_popup_div_id+".adjust_container("+fade_in_image+")", 100);
				return 0;
			}
			 
			// set fade in image status
			fade_in_image = (fade_in_image == undefined || fade_in_image == "undefined") ? true : fade_in_image;
			
			// grab pictures width/height
			var pWidth 	= parent.document.getElementById(amcmsImgZoom.id).offsetWidth;
			var pHeight = parent.document.getElementById(amcmsImgZoom.id).offsetHeight;
			
			// make sure width of the container never goes below "min_container_width" setting
			if(eval("pWidth < "+this.image_popup_div_id+".min_container_width")) eval("pWidth = "+this.image_popup_div_id+".default_width;");
			
			if(1 == 0)
			{
				// no fade
					// set new container width/height
					parent.document.getElementById(this.image_popup_div_id).style.width 	= (pWidth+(eval(this.image_popup_div_id+".container_width_offset"))) + 'px';
					parent.document.getElementById(this.image_popup_div_id).style.height = (pHeight+eval(this.image_popup_div_id+".container_height_offset")) + 'px';
					parent.document.getElementById('imgContainer').style.width 	= (pWidth) + 'px';
					parent.document.getElementById('imgContainer').style.height = (pHeight) + 'px';
			}
			else
			{
				// fade in
					// set new container width/height
						// width is always same
						parent.document.getElementById(this.image_popup_div_id).style.width 	= (pWidth+(eval(this.image_popup_div_id+".container_width_offset"))) + 'px';
						parent.document.getElementById('imgContainer').style.width 	= (pWidth) + 'px';
					fade_in_image = false;
						if(fade_in_image == true)
						{
							// height is faded in
							eval(this.image_popup_div_id+".fadeInImg("+this.image_popup_div_id+", 10, (pHeight+"+this.image_popup_div_id+".container_height_offset));");
							eval(this.image_popup_div_id+".fadeInImg('imgContainer', 0, ("+pHeight+"));");
						}
						else
						{
							parent.document.getElementById(this.image_popup_div_id).style.height 	= (pHeight+eval(this.image_popup_div_id+".container_height_offset")) + 'px';
							parent.document.getElementById('imgContainer').style.height 	= (pHeight) + 'px';
						}
			}
			
			
			// refresh picture list
			eval(this.image_popup_div_id+".refresh_list();");
		}
		
		
		/* set fade-in on image fading
		 * @param 
		 * @return void
		*/
		this.fadeInImg = function(imgId, height, total)
		{
			if(document.getElementById)
			{
				if(height <= total)
				{
					parent.document.getElementById(imgId).style.height = height+'px';
					height = (height+10);
					window.setTimeout(this.image_popup_div_id+".fadeInImg('"+imgId+"',"+height+", "+total+")", 10);
				}
				else
				{
					parent.document.getElementById(imgId).style.height = total+'px';
				}
			}
		}
		
		
		/* go to next picture in picture bank
		 * @param 
		 * @return void
		*/
		this.next = function()
		{
			if(eval(this.image_popup_div_id+".picture_bank["+this.image_popup_div_id+".current_index+1]")) 
			{
				eval(this.image_popup_div_id+".current_index = "+this.image_popup_div_id+".current_index+1;");
				eval(this.image_popup_div_id+".popup("+this.image_popup_div_id+".current_index, false);");
			}
			else
			{
				if(eval(this.image_popup_div_id+".picture_bank[0]"))
				{
					eval(this.image_popup_div_id+".current_index = 0;");
					eval(this.image_popup_div_id+".popup(0, false);");
				}
			}
			
			eval(this.image_popup_div_id+".setFadeHeight();");
		}
		
		
		/* go to previous picture in picture bank
		 * @param 
		 * @return void
		*/
		this.previous = function()
		{
			if(eval(this.image_popup_div_id+".picture_bank["+this.image_popup_div_id+".current_index-1]")) 
			{
				eval(this.image_popup_div_id+".current_index = "+this.image_popup_div_id+".current_index-1;");
				eval(this.image_popup_div_id+".popup("+this.image_popup_div_id+".current_index, false);");
			}
			else
			{
				if(eval(this.image_popup_div_id+".picture_bank[("+this.image_popup_div_id+".picture_bank.length - 1)]"))
				{
					eval(this.image_popup_div_id+".current_index = ("+this.image_popup_div_id+".picture_bank.length - 1);");
					eval(this.image_popup_div_id+".popup("+this.image_popup_div_id+".current_index, false);");
				}
			}
			
			eval(this.image_popup_div_id+".setFadeHeight();");
		}
		
		
		/* sets site faders height
		 * @param 
		 * @return void
		*/
		this.setFadeHeight = function()
		{
			if(parent.document.getElementById('lockedLayer'))
			{
				var header_height = 0;
				
				var height = document.body.offsetHeight > (screen.availHeight-header_height) ? document.body.offsetHeight : (screen.availHeight-header_height);
				height = height > document.body.scrollHeight ? height : document.body.scrollHeight;
				height = height > parent.document.getElementById(this.image_popup_div_id).offsetHeight ? height : (parent.document.getElementById(this.image_popup_div_id).offsetHeight);
				
				var raw_height = height;
				Opera = navigator.userAgent.indexOf("Opera") > -1;
				IE = navigator.userAgent.indexOf("MSIE") > -1;
				
				// remove header height
				height = height - header_height;
				
				//Checks if browser = Opera and sets 3 specific divs to site offsetHeight
				if(Opera)
				{
					// remove just a little bit more to avoid scrolling
					height = height;
					
					if(parent.document.getElementById('lockedLayer')) parent.document.getElementById('lockedLayer').style.height = height+"px";
				}
				//If IE, set 3 specific divs to site offsetHeight minus height of header
				else if(IE)
				{
					// remove just a little bit more to avoid scrolling
					height = height+100;
					
					if(parent.document.getElementById('lockedLayer')) parent.document.getElementById('lockedLayer').style.height = height+"px";
				}
				//If not Opera or IE (hopefully Mozilla), set 3 specific divs to site offsetHeight minus height of header
				else
				{
					// remove just a little bit more to avoid scrolling
					height = height+100;
					
					if(parent.document.getElementById('lockedLayer')) parent.document.getElementById('lockedLayer').style.height = height+"px";
				}
			}
		}
		
		
		/* enable arrow keys to paginate pictures
		 * @param 
		 * @return void
		*/
			this.checkKey = function(e)
			{
				if(e == null)
				{
					// ie
					keycode = parent.event.keyCode;
				}
				else
				{
					// mozilla
					keycode = e.which;
				}
				
				key = String.fromCharCode(keycode).toLowerCase();
	  			
				// check for previous click (left arrow)
				if(keycode == 37 /* || keycode == 38*/)
				{
					mcmsImgPopup.previous();
				}
				
				// check for next click (right arrow)
				if(keycode == 39 /* || keycode == 40*/)
				{
					mcmsImgPopup.next();
				}
			}
			this.checkKey2 = function(e)
			{
				if(e == null)
				{
					// ie
					keycode = parent.event.keyCode;
				}
				else
				{
					// mozilla
					keycode = e.which;
				}
				
				key = String.fromCharCode(keycode).toLowerCase();
	  			
				// check for previous click (left arrow)
				if(keycode == 37 /* || keycode == 38*/)
				{
					mcmsImgPopup2.previous();
				}
				
				// check for next click (right arrow)
				if(keycode == 39 /* || keycode == 40*/)
				{
					mcmsImgPopup2.next();
				}
			}
		
		
		/* set opacity on image fading
		 * @param 
		 * @return void
		*/
		this.setOpacity = function(opacity)
		{
			opacity = (opacity == 100)?99.999:opacity;
			
			// IE/Win
			/*this.image.style.filter = "alpha(opacity:"+opacity+")";
			
			// Safari<1.2, Konqueror
			this.image.style.KHTMLOpacity = opacity/100;
			
			// Older Mozilla and Firefox
			this.image.style.MozOpacity = opacity/100;
			
			// Safari 1.2, newer Firefox and Mozilla, CSS3
			this.image.style.opacity = opacity/100;*/
		}
		
		
		/* set fade-in on image fading
		 * @param 
		 * @return void
		*/
		this.fadeIn = function(opacity)
		{
			if(document.getElementById)
			{
				if(opacity <= 100)
				{
					eval(this.image_popup_div_id+".setOpacity("+opacity+");");
					opacity += 15;
					window.setTimeout(this.image_popup_div_id+".fadeIn("+opacity+")", 100);
				}
			}
		}
		
		
		/* initialize fading, make image completely transparent
		 * @param 
		 * @return void
		*/
		this.imageId = '';
		this.image = '';
		this.initImage = function()
		{
			this.imageId = amcmsImgZoom.id;
			this.image = parent.document.getElementById(this.imageId);
			eval(this.image_popup_div_id+".setOpacity(0);");
			eval(this.image_popup_div_id+".fadeIn(0);");
		}
}


// instantiate image popup object
var mcmsImgPopup = new mcms_img_popup();