/* INTERACTIVE HOTSPOT IMAGE
--------------------------------------------------*/

function removeCaption (id) {
			
	/* var nt = new Fx.Tween (id, {duration: 300, wait:true, onComplete:function(){ id.setStyle('display','none');}});
	
	nt.start ('opacity', 0); */
	
	id.setStyle('display','none');
	
};

function showCaption (id) {
	
	var nt = new Fx.Tween (id, {duration: 300, wait:true});
	
	id.setStyles({
		'opacity':'0',
		'display':'block'
	});
	
	nt.start ('opacity', 1);
	
	/* id.setStyle('display','block'); */
	
};

/* WORKBENCH
--------------------------------------------------*/

var workbenchFirstView = true;

var currentHotspot = 0;
var totalHotspots;

// for scrolling
var zoomScroller;
var isZoomed = false;

// for zooming
var viewState;

var workbenchBoxWidth;
var workbenchBoxHeight;

function showCopy (id, isZooming) {
	
	// alert('showing ' + id);
	
	if (id != currentHotspot) {
	
		var cCopy = $('wbcp_' + currentHotspot);
		
		var nCopy = $('wbcp_' + id);
		
		var pc = new Fx.Tween (cCopy, {duration: 300});
		
		var nc = new Fx.Tween (nCopy, {duration: 300});

		if (id > currentHotspot) {
			nCopy.setStyle ('left', 350);
			pc.start ('left', -350);
		} else {
			nCopy.setStyle ('left', -350);
			pc.start ('left', 350);
		};

		nc.start ('left', 0);
		
		if ($('wbhs_' + currentHotspot)) {
		
			$('wbhs_' + currentHotspot).setStyles({
				'opacity':0.6
			});
			
			$('wbzhs_' + currentHotspot).setStyles({
				'opacity':0.6
			});
			
			$('wbhs_' + currentHotspot).removeClass('focused');
			
			$('wbzhs_' + currentHotspot).removeClass('focused');
			
		};
		
		if ($('wbhs_' + id)) {
		
			$('wbhs_' + id).setStyles({
				'opacity':1
			});
			
			$('wbzhs_' + id).setStyles({
				'opacity':1
			});
			
			$('wbhs_' + id).addClass('focused');
			
			$('wbzhs_' + id).addClass('focused');

		};
		
		currentHotspot = Number(id);
		
	};
	
	if (isZoomed) {
		if ($('wbzhs_' + id)) {
			zoomScroller.options.offset = setNewOffset(id);
			zoomScroller.start($('wbzhs_' + id).getStyle('left').toInt(), $('wbzhs_' + id).getStyle('top').toInt());
		};
	};
	
	if (isZooming) {
		isZoomed = true;
	};
	
};

function showNextCopy() {
	showCopy(Number(currentHotspot + 1), false);
};

function showPrevCopy() {
	showCopy(Number(currentHotspot - 1), false);
};

// Dynamically generates new offset for the zoomscroller so highlight is centered, if possible

function setNewOffset(num) {

	var newOffSet = {'x': -((workbenchBoxWidth - $('wbzhs_' + num).getStyle('width').toInt()) / 2), 'y':-((workbenchBoxHeight - $('wbzhs_' + num).getStyle('height').toInt()) / 3)};
	
	if (-(newOffSet.x) > ($('workbenchPhoto').getProperty('width') - ($('wbzhs_' + num).getStyle('left').toInt() + $('wbzhs_' + num).getStyle('width').toInt()))) {
	
		newOffSet.x = 10;
		
	};
	
	if (-(newOffSet.y) > ($('workbenchPhoto').getProperty('height') - ($('wbzhs_' + num).getStyle('top').toInt() + $('wbzhs_' + num).getStyle('height').toInt()))) {
	
		newOffSet.y = 10;
		
	};
	
	return newOffSet;

};

// Zooms in to close-up view on the image

function zoomInWorkbench(num) {
	$('fullHotspots').setStyle('display','none');
					
	zoomScroller.options.offset = setNewOffset(num);
	
	viewState.start({
		'width': $('workbenchPhoto').getProperty('width'),
		'height': $('workbenchPhoto').getProperty('height')
	}).chain(function(){
		zoomScroller.start($('wbzhs_' + num).getStyle('left').toInt(), $('wbzhs_' + num).getStyle('top').toInt()).chain(function(){
			$('zoomHotspots').setStyle('display','block');
		});
	});
	
	$('wbzhs_' + num).setStyle('opacity',1);
	
	$('showFullImage').setStyle('display','block');
		
	showCopy(num, true);
	
};

// Zooms out to show full image

function zoomOutWorkbench() {

	$('zoomHotspots').setStyle('display','none');
			
	zoomScroller.start(0,0).chain(function(){
		viewState.start({
			'width':workbenchBoxWidth,
			'height':workbenchBoxHeight
		}).chain(function(){
			$('fullHotspots').setStyle('display','block');
		});
	});
								
	$('showFullImage').setStyle('display','none');
	
	isZoomed = false;
	
};

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

	if($('imageMap')) {

		$$('#mapRegions a').each(function(link){
			
			link.addEvent('mouseenter', function() {
				
				showCaption($('mc_' + link.id.split('_')[1]));
				
			});
			
			link.addEvent('mouseleave', function() {
				
				removeCaption($('mc_' + link.id.split('_')[1]));
				
			});
			
		});
		
		var p = new Preloader();
			
		$$('#imageMap img').each(function(img){
			p.addEventOnLoad(img.src, function() {
				img.getParent().setStyle('background', 'none');
				img.setStyle('display', 'block');
				img.setStyle('opacity', 0);				
				img.tween('opacity',1);
			});
			p.addToQueue(img.src);
		});
	
	};
	
	if ($('workbench')) {
	
		workbenchBoxWidth = $('workbench').getStyle('width').toInt();
		
		workbenchBoxHeight = $('workbench').getStyle('height').toInt();
		
		// alert ("Workbench: " + workbenchBoxWidth + ", " + workbenchBoxHeight);
		
		var p = new Preloader();
		
		$$('#workbench img').each(function(img){
			p.addEventOnLoad(img.src, function() {
				img.getParent().setStyle('background', 'none');
				img.setStyle('display', 'block');
				img.setStyle('opacity', 0);				
				img.tween('opacity',1);
				$('fullHotspots').setStyle('display','block');
			});
			p.addToQueue(img.src);
		});
	
		totalHotspots = $$('.wbHotspot').length;
	
		zoomScroller = new Fx.Scroll('workbenchZoomCrop', {duration:400, offset:{'x':-10,'y':-10}});
	
		// zoomScroller.toElement('wbhs_0');
		
		viewState = new Fx.Morph('workbenchPhoto', {duration:300});
		
		viewState.set({
			'width': workbenchBoxWidth,
			'height': workbenchBoxHeight
		});
	
		$$('.goNext').each(function(link){
			link.addEvent('click',function(evt){
				e = new Event(evt).stop();
				showNextCopy();
				if (workbenchFirstView) {
					zoomInWorkbench('1');
					workbenchFirstView = false;
				};
			});
		});
		
		$$('.goPrev').each(function(link){
			link.addEvent('click',function(evt){
				e = new Event(evt).stop();
				showPrevCopy();
			});
		});
		
		$$('.inactive').each(function(link){
			link.addEvent('click',function(evt){
				e = new Event(evt).stop();
			});
		});
		
		$$('.wbHotspot').each(function(div){
			div.setStyle('opacity', 0.6);
		});
		
		if ($('wbhs_' + currentHotspot)) {
			$('wbhs_' + currentHotspot).setStyle('opacity', 1);
		};
		
		
		$$('#fullHotspots a').each(function(link){
			link.addEvent('mouseenter',function(evt){
				e = new Event(evt).stop();
				this.getParent().setStyles({
					'opacity':1
				});
			});
			link.addEvent('mouseleave',function(evt){
				e = new Event(evt).stop();
				this.getParent().setStyles({
					'opacity':0.5
				});
				if ($('wbhs_' + currentHotspot)) {
					$('wbhs_' + currentHotspot).setStyle('opacity',1);
				};
			});
			link.addEvent('click',function(evt){
				e = new Event(evt).stop();
				var num = this.getParent().id.split('_')[1]
				if(!isZoomed) {
					if (workbenchFirstView) {
						workbenchFirstView = false;
					};
					zoomInWorkbench(num);
				
				};
			});
		});
		
		$('showFullImage').addEvent('click',function(evt){
			e = new Event(evt).stop();
			zoomOutWorkbench();			
		});
	
	};
	
});