window.addEvent('domready', function(){

	if($defined($('img_z'))){
	
		adj_w_0 = $('img_z').getStyle('width').toInt() ;
		adj_h_0 = $('img_z').getStyle('height').toInt() ;
		vp = $('contain');
		var myPan = new Drag.Move('img_z',{
		'container':vp
		//style: false
			
		});	
		
		var mySlide = new Slider($('sld_area'), $('sld_knob'), {
			steps: 100,
			offset:-34,
			onChange: function(step){
			
				inc = (step/75 + 1);
	
				adj_w = adj_w_0 * inc;
				adj_h = adj_h_0 * inc;
			
				//Original image size 
				img_h_0 = adj_h_0;
				img_w_0 = adj_w_0;
				img_top = ((-adj_h + adj_h_0)/2);
				img_left = ((-adj_w + adj_w_0)/2);
				
				//Constraint metrics
				con_h_0 = img_w_0;
				con_v_0 = img_h_0;
	
//				if(navigator.appName != 'Microsoft Internet Explorer'){
					con_h = -(adj_w-con_h_0);
					con_v = -(adj_h-con_v_0 );
					con_mid_h = 0;
					con_mid_v = 0;
/*				} else {
					con_h = -(adj_w-con_h_0);
					con_v = -(adj_h-con_v_0);
					con_mid_h =	(adj_w-con_h_0);
					con_mid_v = (adj_h-con_v_0);
				}
*/
				
			$('img_z').setStyle('width', adj_w);
			$('img_z').setStyle('height', adj_h);
			$('img_z').setStyle('top', img_top);
			$('img_z').setStyle('left', img_left);

			var myPan = new Drag.Move('img_z',{
					limit: {x: [(con_h), (con_mid_h)], y: [(con_v), (con_mid_v)]}
				});	
			
				}
			}).set(0);
	
		$('img_z').addEvent('dblclick',function(){
			Slimbox.open($('img_src').innerHTML);
		});
		
		$('sld_msg').set('html','Double-click to view full image.');
		
	}

});


/*This function is used in enabling a drop-down/flyout menu for IE6
 *It is needed because IE6 and below do not support :hover css functionality
 *for elements other than <a>.  Therefor all li:hover css rules must also have a 
 *corresponding class designated to them. 
 *In this script that class is ".over".
 *
 *The script uses the document.all property, which is only available in IE to assign the 
 *mouse events to <li> elements.  
 *Finally the function takes as a parameter a dom element, this should be the parent of the 
 *navigation bar, either the ul tag or the div container.
 */

window.addEvent('domready', function(){

	//allow function to only add mouse events if browser is IE
	if (document.all&&document.getElementById) {
		//get navigation menu parent
		navRoot = document.getElementById("header-ul");
		//get all list items
		if(navRoot != null) {
			liList = navRoot.getElementsByTagName("li");
			//add onmounseover and onmouseout events to each <li>
			//that change the class of the element top .over
			for (i=0; i<liList.length; i++) {
				node = liList[i];
				if (node.nodeName=="LI") {
					node.onmouseover=function() {
						this.className+=" over";
					}
					node.onmouseout=function() {
						this.className=this.className.replace(" over", "");
					}
				}
			}
		}
		
		navRoot = document.getElementById("leftNavUl");
		//get all list items
		if(navRoot != null) {
			liList = navRoot.getElementsByTagName("li");
			//add onmounseover and onmouseout events to each <li>
			//that change the class of the element top .over
			for (i=0; i<liList.length; i++) {
				node = liList[i];
				if (node.nodeName=="LI") {
					node.onmouseover=function() {
					    this.className+=" over";
					}
					node.onmouseout=function() {
						this.className=this.className.replace(" over", "");
					}
				}
			}
		}
	}
});