/* Case study images */

var ECDCaseStudy = Class.create({

	/**** Images ****/
	effectHandle: undefined,
	heroOut: undefined,
	heroIn: undefined,
	busy: false,
	
	show_image: function(ev) {
		var id, oldID, offset;
		
		if (this.busy) return false;
		
		this.busy = true;
		if (this.effectHandle)
			this.effectHandle.cancel();
			
		thumb = Event.findElement(ev,'div.thumb');
		id = Number(thumb.id.replace('casestudy_thumb',''));
		this.heroIn = $('casestudy_hero'+id);
		
		if (!this.heroIn || this.heroIn==this.heroOut) {this.busy = false; return false;}
		
		this.heroIn.setStyle({zIndex:5,opacity:0});
		if (this.heroOut)
			this.heroOut.setStyle({zIndex:0});
		
		// deactivate other thumbs
		$$('.case_study .thumbs .thumb.active').invoke('removeClassName','active');
		thumb.addClassName('active');
		
		this.effectHandle = new Effect.Appear(this.heroIn,{from:0,to:1,duration:0.5,afterFinish:this.hero_done.bind(this)});
		
		this.busy = false;
		return true;
	},
	
	hero_done: function () { 
		if (this.heroOut && this.heroOut!=this.heroIn)
			this.heroOut.hide();
		delete this.effectHandle;
		this.heroOut = this.heroIn;
		delete this.heroIn;
	},
	
	/**** List scroll buttons *****/
	
	casesListScrollUp: function (ev) { this.casesListScroll(true); },
	casesListScrollDown: function (ev) { this.casesListScroll(false); }, 	
	
	casesListScroll: function (up) {
		var delta = 100, absDelta = (up)?-delta:delta;
		
		if (this.scrollEffect) this.scrollEffect.cancel();
		this.scrollEffect = new Effect.Scroll(this.casesList,{y:absDelta});
		
		if (this.casesList.scrollTop+absDelta > 0)
			this.casesList.scrollButtonUp.show();
		else
			this.casesList.scrollButtonUp.hide();
		
		if (this.casesList.scrollTop + absDelta < this.casesListBase)
			this.casesList.scrollButtonDown.show();
		else
			this.casesList.scrollButtonDown.hide();
		
	},
	
	initialize: function () {
		var maxHeight, lastItem, thumbs;
		$$('.case_study .thumbs .thumb').invoke('observe','click',this.show_image.bind(this));
		thumbs = $$('.case_study .thumbs .thumb')
		
		if (thumbs && thumbs.first())
			thumbs.first().addClassName('active');
		
		this.heroOut = $$('.hero').first();
		
		this.casesList = $$('.cases_list ul.cases').first();
		if (this.casesList) {
			maxHeight = this.casesList.getStyle('maxHeight');
			this.casesList.style.maxHeight = 'none';
			if (this.casesList.getHeight()>330) {
				this.casesList.setStyle({height:'320px',overflow:'hidden'});
				
				this.casesList.insert({before:this.casesList.scrollButtonUp = new Element('div',{'class':'scrollButton up'})
												.hide().observe('click',this.casesListScrollUp.bind(this))});
				this.casesList.insert({before:this.casesList.scrollButtonDown = new Element('div',{'class':'scrollButton down'})
												.observe('click',this.casesListScrollDown.bind(this))});
					
				var lastItem = this.casesList.select('li').last();
				this.casesListBase = lastItem.offsetTop-this.casesList.getHeight()-lastItem.getHeight();
			} else {
				this.casesList.setStyle({maxHeight:maxHeight});				
			}
		}
	}
});

document.observe('dom:loaded',function () { 
	window.ECDCaseStudy = new ECDCaseStudy(); 
});