/*
 * CFO User Interface Animation Library
 *
 */
var CFO = {};
CFO.Version = '1.0';
CFO.CompatibleWithPrototype = '1.6';

if (Prototype.Version.indexOf(CFO.CompatibleWithPrototype) !== 0 && console && console.warn)
  console.warn("This version of CFO javascript library is tested with Prototype " + CFO.CompatibleWithPrototype + 
                  " it may not work as expected with this version (" + Prototype.Version + ")");


CFO.Config = {};

CFO.Config.countries = {};
CFO.Config.countries.openLabel = "show countries";
CFO.Config.countries.closeLabel = "hide countries";

CFO.Config.languages = {};
CFO.Config.languages.openLabel = "more languages";
CFO.Config.languages.closeLabel = "less languages";


CFO.countrySelector = Class.create();
CFO.countrySelector.prototype = {
	
	/**
	 * Constructor
	 * @param {Element} Element to use as wrapper for the country Selector
	 */
	initialize: function(element){
		this.element = $(element);
		this.animationAllowed = true;
		
		Event.observe(this.element, 'click', this.clickHandler.bindAsEventListener(this));
	},
	/**
	 * handles the event if something on the map is clicked
	 * @param {Event} event
	 */
	clickHandler: function(event){
		
		$$('.folded').each(function(el){
			el.hide();
			el.removeClassName('folded');
		});
		
		var link = event.findElement('a') || null;
		
		if(link == null){
			return;
		}
		
		if (this.animationAllowed) {
			var queryHash = link.readAttribute('href').toQueryParams();
			this.setActivelink(link.down('img'));
			this.hideDetails();
			this.showDetails(queryHash.map);
		}
		
		
		//the link does nothing itself
		event.preventDefault();
		event.stopPropagation();
	},
	/**
	 * set the clicked link to active
	 * @param {Element} image
	 */
	setActivelink: function(image){
		this.animationAllowed = false;
		this.element.childElements().each(function(el){
			el.down('img').src = el.down('img').src.replace('_active','_normal');
		})
		
		image.src = image.src.replace('_hover','_active');
		image.src = image.src.replace('_normal','_active');
	},
	/**
	 * show the details of a country
	 * @param {String} country
	 */
	showDetails: function(country){
		new Effect.BlindDown($$('.map-europe-list .'+country)[0], {
			duration:0.3,
				queue:{
					scope: 'details',
					position: 'end'
				},
				afterFinish: function(){
					this.animationAllowed = true;
				}.bind(this)
		});
	},
	/**
	 * hide the current visible detail lists
	 */
	hideDetails: function(){
		$$('.map-europe-list')[0].childElements().each(function(e){
			if(e.visible()){
				new Effect.BlindUp(e, {
					duration:0.3,
						queue:{
							scope: 'details',
							position: 'end'
						}
				});
			}
		});
	}
}


CFO.Accordion = Class.create();
CFO.Accordion.prototype = {
	/**
	 * Constructor
	 * @param {Element} list to use as accordion
	 */
	initialize: function(element, type){
		this.element = $(element);	
		Event.observe(this.element, 'click', this.clickHandler.bindAsEventListener(this));
				
		this.openLabel = CFO.Config[type].openLabel;
		this.closeLabel = CFO.Config[type].closeLabel;
				
		this.element.childElements().each(function(e){
			if(e.down('ul')){
				e.down('ul').insert({'before': '<a href="#" class="more country-toggle">'+this.openLabel+'</a>'});
				e.down('ul').hide();
			}
			
		}.bind(this));

	},
	/**
	 * Open the ul next to the clicked link
	 * @param {Object} event
	 */
	clickHandler: function(event){
		var link = event.findElement('.more') || event.findElement('.less');
		
		if(link.hasClassName('more')){
			this.closeList();
			link.update(this.closeLabel);
			this.activeList = link.next('ul');
			link.writeAttribute({'class': 'less country-toggle'});
			this.openList();
		}else if(link.hasClassName('less')){
			link.update(this.openLabel);
			link.writeAttribute({'class': 'more country-toggle'});
			this.closeList();
		}
		
		//the link does nothing itself
		link.blur();
		event.preventDefault();
		event.stopPropagation();	
	},
	/**
	 * Open the active list
	 */
	openList: function(){
		new Effect.BlindDown(this.activeList,{
			duration: 0.3,
				queue:{
					scope: 'accordion',
					position: 'end'
				}
		});
	},
	/**
	 * close the active list
	 */
	closeList: function(){	
		if(this.activeList){
			new Effect.BlindUp(this.activeList,{
				duration: 0.3,
				queue:{
					scope: 'accordion',
					position: 'end'
				}
			});
		}
		this.activeList = null;
	}
}
