// thirdnav v0.9
//
// Copyright (c) 2011 elementare teilchen GbmbH
// Author: Peter Wimmer | http://www.elementare-teilchen.de
// 
// thirdnav is free software
//

// by me adapted from accordion 2.0

var thirdnav = Class.create();
thirdnav.prototype = {

	duration        : null,
	container       : null,
	navtext         : null,
	navlinks        : null,
	navimage        : null,
	textHeight      : 0,
	linksHeight     : 0,
	animating       : false,
	stopanimation   : false,
	finished		: false,
	effects         : [],

	initialize: function(container, options) {
		if (!container) {
			throw( container + " doesn't exist!");
			return false;
		}
		
		this.container = $(container);
		
		this.options = Object.extend({
			resizeSpeed : 6,
			classNames  : {
				text  : 'navigation_text',
				links : 'navigation_links',
				image : 'navigation_image'
			}
		}, options || {});

		this.duration = ((11-this.options.resizeSpeed)*0.15);

		var el = this.container.firstChild;
		while (el) {
			if (el.hasClassName(this.options.classNames.text)) {
				this.navtext = el;
			}
			if (el.hasClassName(this.options.classNames.links)) {
				this.navlinks = el;
			}
			if (el.hasClassName(this.options.classNames.image)) {
				this.navimage = el;
			}
			el = el.nextSibling;
	    }

		if (this.navtext && this.navlinks) {
			this.navtext.scaleHeight  = this.navtext.getHeight(); 
			this.navlinks.scaleHeight = this.navlinks.getHeight(); 
			
			var maxHeight = Math.max(this.navtext.scaleHeight, this.navlinks.scaleHeight);
			if (this.navimage) {
				//alert(this.navimage.getHeight() + ' ' + maxHeight);
				maxHeight = Math.max(this.navimage.getHeight(), maxHeight);
			}
			this.container.setStyle({height: maxHeight+'px'});
			//alert(this.container.getHeight());
			
			this.navlinks.setStyle({display: 'none', height: '0px'});
			
		    container.observe("mouseenter",	function(){ this.activate(); }.bind(this));
		    container.observe("mouseleave",	function(){ this.deactivate(); }.bind(this));
		}
	},

	activate: function() {
		this.effects.each(function(e) {e.cancel()});
		this.effects = [];

		if (this.animating) {
			this.stopanimation = true;
			this.navlinks.setStyle({display: 'block', height: 'auto'});
			this.navtext.setStyle({display: 'block', height: '0px'});
		}
		else {
			this.navtext.setStyle({display: 'block', height: 'auto'});
			this.navlinks.setStyle({display: 'block', height: '0px'});
			this._handleAnimation(this.navlinks, this.navtext);			
		}

		//navtext.hide();
		//navlinks.setStyle(linksoptions);
	},

	deactivate: function() {
		this.effects.each(function(e) {e.cancel()});
		this.effects = [];

		if (this.animating) {
			this.stopanimation = true;
			this.navtext.setStyle({display: 'block', height: 'auto'});
			this.navlinks.setStyle({display: 'block', height: '0px'});
		}
		else {
			this.navlinks.setStyle({display: 'block', height: 'auto'});
			this.navtext.setStyle({display: 'block', height: '0px'});		
			this._handleAnimation(this.navtext, this.navlinks);			
		}

		//navlinks.hide();
		//navtext.show();
	},
	
	//
	// do the actual animation 
	//
	
	_handleAnimation : function(toActivate, toDeactivate) {

		if (this.stopanimation && this.animating) {
			return false;
		}

		var options = {
			sync: true,
			scaleFrom: 0,
			scaleContent: false,
			//transition: Effect.Transitions.sinoidal,
			transition: Effect.Transitions.linear,
			scaleMode: { 
				originalHeight: toActivate.scaleHeight,
			},
			scaleX: false,
			scaleY: true,
			afterFinish: function() {
				if (!this.stopanimation) {
					toActivate.setStyle({
						display: 'block',
						height:  'auto'
					})
				}
			}.bind(this)
		};

		this.effects.push(
			new Effect.Scale(toActivate, 100, options)
		);

		options = {
			sync: true,
			scaleContent: false,
			//transition: Effect.Transitions.sinoidal,
			transition: Effect.Transitions.linear,
			scaleX: false,
			scaleY: true,
			afterFinish: function() {
				if (!this.stopanimation) {
					toDeactivate.setStyle({
						display: 'none',
						height:  '0px'
					})
				}
			}.bind(this)
		};
		
		this.effects.push(
			new Effect.Scale(toDeactivate, 0, options)
		);				

		this.container.addClassName('animating');

		new Effect.Parallel(this.effects, {
			duration: this.duration, 
			queue: {
				position : 'end', 
				scope    : 'thirdnavAnimation'
			},

			beforeStart: function() {
				this.animating = true;
			}.bind(this),
			
			afterFinish: function() {
				this.animating = false;
				this.stopanimation = false;
				this.container.removeClassName('animating');
				//alert('finished');
			}.bind(this)
		});
	}
}