// Set dimensions for overlay div.
function initViewer() {
	
	resizeOverlay();
	window.onresize = resizeOverlay;
	
	resizeOverlayIE();
	window.onresize = resizeOverlayIE;
}

// Alters overlay size and asset position on window resize.
function resizeOverlay() {
	arrayPageSize = getPageSize();
	objOverlay = document.getElementById('overlay');
	objOverlay.style.width = '100%';
	objOverlay.style.height = arrayPageSize[1] + 'px';
	positionAsset();
}

function resizeOverlayIE() {
	arrayPageSize = getPageSize();
	objOverlay = document.getElementById('overlayie');
	objOverlayie.style.width = '100%';
	objOverlay.style.height = arrayPageSize[1] + 'px';
	positionAsset();
}

// Positions the asset div.
function positionAsset() {
	arrayPageSize = getPageSize();
	arrayPageScroll = getPageScroll();

	objAsset = document.getElementById('asset');
	assetWidth = objAsset.style.width;
	assetWidth = assetWidth.substring(0, assetWidth.lastIndexOf('p'));
	
	assetTop = arrayPageScroll[1];
	assetLeft = (arrayPageSize[0] - assetWidth) / 2;
	
	objAsset.style.top = (assetTop < 0) ? '0px' : assetTop + 'px';
	objAsset.style.left = (assetLeft < 0) ? '0px' : assetLeft + 'px';
}

// Determine which type of asset to load and display in an appropriate manner.
function loadAsset(asset_id, asset, type, swfwidth, swfheight, title, description, loop, annotation, switchswf, level, level_id) {
	
	//get the vars from the js php file

	//var attrbArray = xhttpRequest.open("GET" , "/scripts/getmult.js.php" + id + "" , true ); 
	
	/*var asset = attrbArray['asset'];
	var type = attrbArray['type'];
	var swfwidth = attrbArray['swfwidth'];
	var swfheight = attrbArray['swfheight'];
	var title = attrbArray['title'];
	var description = attrbArray['description'];
	var loop = attrbArray['loop'];
	var annotation = attrbArray['annotation'];
	var switchswf = attrbArray['switchswf'];*/
	
	objHandleTitle=document.getElementById('handle_title');
	objHandleTitle.innerHTML=title;
	
	objOverlay = document.getElementById('overlay');
	objOverlay.style.display = 'block';
	
	objOverlayIE = document.getElementById('overlayie');
	objOverlayIE.style.display = 'block';
	
	resizeOverlay();
	
	toggleTextSelection(0);
	
	assetName = asset.substring(0, asset.lastIndexOf('.'));
	
	objAsset = document.getElementById('asset');
	
	// VIDEO
	if (type == 'video' && annotation == '') {
		if (swfwidth < 300) {
			swfwidthCorrected = 300;
		}
		else {
			swfwidthCorrected = swfwidth;
		}
		
		objAsset.style.width =  swfwidthCorrected + 'px';
		objAsset.style.height = parseInt(swfheight) + 45 + 'px';
		positionAsset();
		
		flvHolderDiv = elem('div', {'id': 'flvHolder'}, '', '');
		objAsset.appendChild(flvHolderDiv);
		
		var FO = { movie:"/swf/dynamic-flvplayer.swf?asset_id="+asset_id+"&level="+level+"&level_id="+level_id+"&flvname=" + assetName + "&flvtitle=" + title + "&flvwidth=" + swfwidth + "&flvheight=" + swfheight, width:"" + swfwidthCorrected + "", height:"" + (parseInt(swfheight) + 25) + "", majorversion:"6", build:"40", wmode:"transparent", scale:"noscale" };
		UFO.create(FO, "flvHolder");
	}
	// VIDEO WITH ANNOTATIONS
	else if (type == 'video' && annotation != '') {
		objAsset.style.width = '704px';
		objAsset.style.height = '333px';
		positionAsset();
		
		img = elem('img', {'id': 'flvHolderAnnotation', 'alt': title + ' annotation', 'src': '/get_multimedia_asset.php?n=' + annotation+'&level='+level+'&level_id='+level_id+'&asset_id='+asset_id}, '', '');
		objAsset.appendChild(img);
		
		flvHolderDiv = elem('div', {'id': 'flvHolder'}, '', '');
		objAsset.appendChild(flvHolderDiv);
		
		var FO = { movie:"/swf/flvplayer.swf?asset_id="+asset_id+"&level="+level+"&level_id="+level_id+"&flvname=" + assetName + "&flvtitle=" + title + (loop == 'y' ? "&flvloop=1" : "&flvloop=1"), width:"352", height:"313", majorversion:"6", build:"40", wmode:"transparent" };
		UFO.create(FO, "flvHolder");
	}
	// ANIMATION
	else if (type == 'animation' && switchswf == 'n') {
		if (swfwidth > 0) objAsset.style.width = swfwidth + 'px';
		if (swfheight > 0) objAsset.style.height = parseInt(swfheight) + 20 + 'px';
		positionAsset();
		
		swfHolderDiv = elem('div', {'id': 'swfHolder'}, '', '');
		objAsset.appendChild(swfHolderDiv);
		
		var FO = { movie:"/get_multimedia_asset.php?asset_id="+asset_id+"&level="+level+"&level_id="+level_id+"&n=" + assetName + ".swf", width:"" + swfwidth + "", height:"" + swfheight + "", majorversion:"6", build:"40", wmode:"transparent" };
		UFO.create(FO, "swfHolder");
	}
	// ANIMATION WITH SWITCH STATE
	else if (type == 'animation' && switchswf == 'y') {
		objAsset.style.width = '400px';
		objAsset.style.height = '460px';
		positionAsset();
		
		swfHolderDiv = elem('div', {'id': 'swfHolder'}, '', '');
		objAsset.appendChild(swfHolderDiv);
		
		var FO = { movie:"/swf/swfplayer.swf?asset_id="+asset_id+"&level="+level+"&level_id="+level_id+"&swfname=" + assetName + "&swfdescription=" + description + "&swfwidth=" + swfwidth + "&swfheight=" + swfheight, width:"400", height:"440", majorversion:"6", build:"40", wmode:"transparent" };
		UFO.create(FO, "swfHolder");
	}
	// IMAGE
	else if (type == 'image' && annotation == '') {
		if (swfwidth > 0) objAsset.style.width = parseInt(swfwidth) + 'px';
		if (swfheight > 0) objAsset.style.height = parseInt(swfheight) + 26 + 'px';
		positionAsset();
		
		img = elem('img', {'id': 'imgHolder', 'alt': title, 'src': '/get_multimedia_asset.php?asset_id='+asset_id+'&level='+level+'&level_id='+level_id+'&n=' + assetName + '.jpg'}, '', '');
		objAsset.appendChild(img);
	}
	// IMAGE WITH ANNOTATIONS
	else if (type == 'image' && annotation != '') {
		if (swfwidth > 0) objAsset.style.width = parseInt(swfwidth) + 'px';
		if (swfheight > 0) objAsset.style.height = parseInt(swfheight) + 60 + 'px';
		positionAsset();
		
		img1 = elem('img', {'id': 'imgHolder', 'alt': title, 'src': '/get_multimedia_asset.php?asset_id='+asset_id+'&level='+level+'&level_id='+level_id+'&n=' + assetName + '.jpg'}, {'position': 'absolute', 'zIndex': '2', 'top': '0', 'left': '0'}, '');
		objAsset.appendChild(img1);
		
		img2 = elem('img', {'id': 'imgHolderAnnotation', 'alt': title + ' annotation', 'src': '/get_multimedia_asset.php?asset_id='+asset_id+'&level='+level+'&level_id='+level_id+'&n=' + annotation}, {'position': 'absolute', 'zIndex': '1', 'top': '0', 'left': '0'}, '');
		objAsset.appendChild(img2);
		
		toggle = elem('a', {'id': 'toggle', 'href': '#'}, '', 'Toggle annotations');
		toggle.onclick = function() {
			img = document.getElementById('imgHolder');
			imgAnnotation = document.getElementById('imgHolderAnnotation');
			
			// Opera, IE, etcetera.
			if (img.currentStyle) {
				if (img.currentStyle['zIndex'] == 2) {
					img.style.zIndex = 1;
					imgAnnotation.style.zIndex = 2;
				}
				else {
					img.style.zIndex = 2;
					imgAnnotation.style.zIndex = 1;
				}
			}
			// Mozilla, Firefox.
			else if (window.getComputedStyle) {
				if (window.getComputedStyle(img, null).zIndex == 2) {
					img.style.zIndex = 1;
					imgAnnotation.style.zIndex = 2;
				}
				else {
					img.style.zIndex = 2;
					imgAnnotation.style.zIndex = 1;
				}
			}
			return false;
		}
		objAsset.appendChild(toggle);
	}
}

// Remove multimedia asset.
function unloadAsset() {
	deleteNode('asset');
	objOverlay = document.getElementById('overlay');
	objOverlay.style.display = 'none';
	objOverlayIE = document.getElementById('overlayie');
	objOverlayIE.style.display = 'none';
	toggleTextSelection(1);
}



// Toggles between text being selectable and unselectable.
function toggleTextSelection(state) {
	var Unselectable = {
		enable : function(e) {
			var e = e ? e : window.event;

			if (e.button != 1) {
				if (e.target) {
					var targer = e.target;
				}
				else if (e.srcElement) {
					var targer = e.srcElement;
				}

				var targetTag = targer.tagName.toLowerCase();
				if ((targetTag != 'input') && (targetTag != 'textarea')) {
					return false;
				}
			}
		},
		disable : function () {
			return true;
		}
	}
	
	if (state) {
		if (typeof(document.onselectstart) != 'undefined') {
			document.onselectstart = Unselectable.disable;
		}
		else {
			document.onmousedown = Unselectable.disable;
			document.onmouseup = Unselectable.enable;
		}
	}
	else {
		if (typeof(document.onselectstart) != 'undefined') {
			document.onselectstart = Unselectable.enable;
		}
		else {
			document.onmousedown = Unselectable.enable;
			document.onmouseup = Unselectable.disable;
		}
	}
}

// Returns an element.
function elem(name, attrs, style, text) {
	var e = document.createElement(name);
	if (attrs) {
		for (key in attrs) {
			if (key == 'class') {
				e.className = attrs[key];
			} else if (key == 'id') {
				e.id = attrs[key];
			} else {
				e.setAttribute(key, attrs[key]);
			}
		}
	}
	if (style) {
		for (key in style) {
			e.style[key] = style[key];
		}
	}
	if (text) {
		e.appendChild(document.createTextNode(text));
	}
	return e;
}

// Remove an element's child nodes.
function deleteNode(element) {
	var label = document.getElementById(element);	
	while (label.hasChildNodes()) {
		if (label.lastChild.id == 'handle') {
			break;
		}
		label.removeChild(label.lastChild);
	}
}

// Add an onload function while preserving any already set.
function addLoadEvent(func) {	
	var oldonload = window.onload;
	if (typeof window.onload != 'function') {
		window.onload = func;
	}
	else {
		window.onload = function() {
			oldonload();
			func();
		}
	}
}

// Drag functionality.
var Drag = {
	obj : null,

	init : function(o, oRoot, minX, maxX, minY, maxY, bSwapHorzRef, bSwapVertRef, fXMapper, fYMapper) {
		o.onmousedown = Drag.start;

		o.hmode = bSwapHorzRef ? false : true ;
		o.vmode = bSwapVertRef ? false : true ;

		o.root = oRoot && oRoot != null ? oRoot : o ;

		if (o.hmode && isNaN(parseInt(o.root.style.left ))) o.root.style.left = '0px';
		if (o.vmode && isNaN(parseInt(o.root.style.top ))) o.root.style.top = '0px';
		if (!o.hmode && isNaN(parseInt(o.root.style.right ))) o.root.style.right = '0px';
		if (!o.vmode && isNaN(parseInt(o.root.style.bottom))) o.root.style.bottom = '0px';

		o.minX = typeof minX != 'undefined' ? minX : null;
		o.minY = typeof minY != 'undefined' ? minY : null;
		o.maxX = typeof maxX != 'undefined' ? maxX : null;
		o.maxY = typeof maxY != 'undefined' ? maxY : null;

		o.xMapper = fXMapper ? fXMapper : null;
		o.yMapper = fYMapper ? fYMapper : null;

		o.root.onDragStart = new Function();
		o.root.onDragEnd = new Function();
		o.root.onDrag = new Function();
	},

	start : function(e) {
		var o = Drag.obj = this;
		e = Drag.fixE(e);
		var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		o.root.onDragStart(x, y);

		o.lastMouseX = e.clientX;
		o.lastMouseY = e.clientY;

		if (o.hmode) {
			if (o.minX != null) o.minMouseX = e.clientX - x + o.minX;
			if (o.maxX != null) o.maxMouseX = o.minMouseX + o.maxX - o.minX;
		} else {
			if (o.minX != null) o.maxMouseX = -o.minX + e.clientX + x;
			if (o.maxX != null) o.minMouseX = -o.maxX + e.clientX + x;
		}

		if (o.vmode) {
			if (o.minY != null) o.minMouseY = e.clientY - y + o.minY;
			if (o.maxY != null) o.maxMouseY = o.minMouseY + o.maxY - o.minY;
		} else {
			if (o.minY != null) o.maxMouseY = -o.minY + e.clientY + y;
			if (o.maxY != null) o.minMouseY = -o.maxY + e.clientY + y;
		}

		document.onmousemove = Drag.drag;
		document.onmouseup = Drag.end;

		return false;
	},

	drag : function(e) {
		e = Drag.fixE(e);
		var o = Drag.obj;

		var ey = e.clientY;
		var ex = e.clientX;
		var y = parseInt(o.vmode ? o.root.style.top : o.root.style.bottom);
		var x = parseInt(o.hmode ? o.root.style.left : o.root.style.right );
		var nx, ny;

		if (o.minX != null) ex = o.hmode ? Math.max(ex, o.minMouseX) : Math.min(ex, o.maxMouseX);
		if (o.maxX != null) ex = o.hmode ? Math.min(ex, o.maxMouseX) : Math.max(ex, o.minMouseX);
		if (o.minY != null) ey = o.vmode ? Math.max(ey, o.minMouseY) : Math.min(ey, o.maxMouseY);
		if (o.maxY != null) ey = o.vmode ? Math.min(ey, o.maxMouseY) : Math.max(ey, o.minMouseY);

		nx = x + ((ex - o.lastMouseX) * (o.hmode ? 1 : -1));
		ny = y + ((ey - o.lastMouseY) * (o.vmode ? 1 : -1));

		if (o.xMapper) nx = o.xMapper(y)
		else if (o.yMapper) ny = o.yMapper(x)

		Drag.obj.root.style[o.hmode ? 'left' : 'right'] = nx + "px";
		Drag.obj.root.style[o.vmode ? 'top' : 'bottom'] = ny + "px";
		Drag.obj.lastMouseX = ex;
		Drag.obj.lastMouseY = ey;

		Drag.obj.root.onDrag(nx, ny);
		return false;
	},

	end : function() {
		document.onmousemove = null;
		document.onmouseup = null;
		Drag.obj.root.onDragEnd( parseInt(Drag.obj.root.style[Drag.obj.hmode ? "left" : "right"]), 
		parseInt(Drag.obj.root.style[Drag.obj.vmode ? "top" : "bottom"]));
		Drag.obj = null;
	},

	fixE : function(e) {
		if (typeof e == 'undefined') e = window.event;
		if (typeof e.layerX == 'undefined') e.layerX = e.offsetX;
		if (typeof e.layerY == 'undefined') e.layerY = e.offsetY;
		return e;
	}
};

// Returns an array containing page scroll info.
function getPageScroll() {
	var yScroll;
	
	if (self.pageYOffset) {
		yScroll = self.pageYOffset;
	}
	else if (document.documentElement && document.documentElement.scrollTop) {
		yScroll = document.documentElement.scrollTop;
	}
	else if (document.body) {
		yScroll = document.body.scrollTop;
	}
	
	arrayPageScroll = new Array('', yScroll) 
	return arrayPageScroll;
}

// Returns an array containing page size info.
function getPageSize() {
	var xScroll, yScroll;
	
	if (window.innerHeight && window.scrollMaxY) {	
		xScroll = document.body.scrollWidth;
		yScroll = window.innerHeight + window.scrollMaxY;
	}
	else if (document.body.scrollHeight > document.body.offsetHeight) {
		xScroll = document.body.scrollWidth;
		yScroll = document.body.scrollHeight;
	}
	else {
		xScroll = document.body.offsetWidth;
		yScroll = document.body.offsetHeight;
	}
	
	var windowWidth, windowHeight;
	
	if (self.innerHeight) {
		windowWidth = self.innerWidth;
		windowHeight = self.innerHeight;
	}
	else if (document.documentElement && document.documentElement.clientHeight) {
		windowWidth = document.documentElement.clientWidth;
		windowHeight = document.documentElement.clientHeight;
	}
	else if (document.body) {
		windowWidth = document.body.clientWidth;
		windowHeight = document.body.clientHeight;
	}
	
	if (yScroll < windowHeight) {
		pageHeight = windowHeight;
	}
	else { 
		pageHeight = yScroll;
	}
	
	if (xScroll < windowWidth) {
		pageWidth = windowWidth;
	}
	else {
		pageWidth = xScroll;
	}
	
	arrayPageSize = new Array(pageWidth, pageHeight, windowWidth, windowHeight) 
	return arrayPageSize;
}