/** Alfi 
 *	
 *	Developped for Alfi
 *	@author : Michel-Ange K. partikule, 2010
 *
 */


var Alfi = new Class({

	Implements: Options,

	options: {
		baseUrl: ''
	},

	/**
	 * Alfi's charts shared options
	 *
	 */
	chartOptions: 
	{
		chart: {
			backgroundColor: {
				linearGradient: [0, 0, 0, 400],
				stops: [
					[0, '#fff'],
					[1, '#eae8e7']
				]
			},
			borderRadius: 15,
			height:300,
			margin:[50,50,80,80]
		},
		title: {
			style: {
				color:'#7f7f7f',
				font: '1.1em Tahoma, Geneva, Verdana',
				position:'absolute',
				bottom: '10px',
				left: '15px'
			}
		},
		legend: { enabled: false },
		credits: { enabled: false },
		xAxis: {
			lineColor: '#c6c6c6',
			labels: {
				rotation: -45,
				align: 'right',
				style: {
					color:'#565656'
				},
				y: 10,
				x: 10
			}
		},
		yAxis: {
			min: 0,
			endOnTick: false,
			title: {
				style: { color:'#7f7f7f'}
			},
			labels: {
				style: {
					color:'#C4234E'
				}
			},
			gridLineColor: '#c6c6c6',
			minorTickColor: '#E0E0E0',
			minorTickInterval: 1,
			tickInterval: 2,
			showFirstLabel: false,
			tickColor: '#df5'
		},
		colors: ['#8eb154','#bfcc55','#c29d50','#d8c656','#815e29'],
		plotOptions: {
			pie: {
				borderWidth: 3,
				align: 'left',
				size:'95%',
				dataLabels: {
					enabled: true,
					formatter: function() {
						if (this.y > 5) return this.y + ' %';
					},
					color: '#fff',
					style: {
						font: '1.3em Tahoma, Geneva, Verdana'
					}
				}
			}
		}
	},


	initialize: function(options)
	{
//		var IE6 = (navigator.userAgent.toLowerCase().indexOf('msie 6') != -1)  && (navigator.userAgent.toLowerCase().indexOf('msie 7') == -1);  

		this.setOptions(options);

		if (Browser.Engine.name=='trident' && Browser.Engine.version==4)
		{
			this.initIE6Menu();
		}
		else
		{
			this.initMenu();
		}
	},

	
	initMenu: function()
	{
		$$('#nav li').each(function(el)
		{
			var s = el.getComputedSize();

			var shad = new Element('div', {'class':'shadow'});

			var ms = parseInt(s.totalWidth/2);
			
			var left = new Element('div', {'class':'left'}).setStyle('width', ms).inject(shad);
			var right = new Element('div', {'class':'right'}).setStyle('width', ms).inject(shad);
			
			shad.inject(el).hide();
			
			el.getElement('a').addEvents(
			{
				'mouseover': function(){
					shad.show();
				},
				'mouseout': function(){
					shad.hide();
				}
			});
		});

	},
	

	initIE6Menu: function()
	{
		menu_width = 0;
		
		$li = $$('ul#nav li').setStyle('width', 'auto');
		
		for (i=0; i<$li.length; i++)
		{
			$item = $li[i];
			$links = $item.getElements('a');

			padding = $links[0].getComputedSize()['padding-left'];
			$links.setStyles({
				'white-space' : 'nowrap',
				'display' : 'inline-block'
			});
			for (j=0; j<$links.length; j++)
			{
				menu_width = $links[j].getSize().x;
			}
			$links.setStyle('width', (menu_width + 2 * padding) + 'px');
		}
	},


	
	initBlocs: function(blocs)
	{
		blocs.each(function(b)
		{
			var bloc = $(b.id_bloc);
			
			bloc.store('slideshow', new Slideshow.KenBurns(b.id_slide, b.data, {captions: false, controller: false, 'loader': true, height: b.height, width: b.width, duration:1000, delay:2000, thumbnails: false, pan:50, zoom:[50,50], paused:true}));

			bloc.store('link', b.link);
			
			bloc.addEvents({
				'mouseenter' : function(e){
					e.stopPropagation();
					this.retrieve('slideshow').pause(0);
					this.getElements('p').toggleClass('hover');
					this.getElements('li span').toggleClass('hover');
				},
				'mouseleave' : function(e){
					e.stopPropagation();
					this.retrieve('slideshow').pause(1);
					this.getElements('p').toggleClass('hover');
					this.getElements('li span').toggleClass('hover');
				},
				'click' : function(){
					window.location.href = this.retrieve('link');
				}
			});
		});		
	},
	
	
	initOl: function(ol) 
	{
		$$(ol).each(function(ol)
		{
			var lis = ol.getElements('li');
			
			lis.each(function(li, idx)
			{
				var txt = li.get('text');
				li.empty();
				new Element('span').set('text', txt).inject(li, 'top');
				new Element('div').addClass('num').set('html', idx+1).inject(li,'top');
			});
		});
		
	},
	
	
	/**
	 * Team pictures slideshows
	 *
	 */
	initSideSlides: function(slides)
	{
		slides.each(function(s)
		{
			var paused = 0;
			var count = 0;
			
			for(var prop in s.data) { count++; }

			if (count < 2 ) paused = 1;
		
			new Slideshow(s.id_slide, s.data, {captions: true, controller: true, 'loader': true, height: 132, width: 188, duration:1200, delay:3500, paused: paused, thumbnails: false, zoom:[50,50]});
		});
		
		// IE 6 fix
		/*
		if (Browser.Engine.trident)
		{
			var el = $('main-picture<ion:id_article />').getElement('.slideshow-controller');
			
			fixPNG(el);
		}
		*/
		
		
	},
	
	/**
	 * Creates a highChart chart from a HTML table
	 *
	 * @param	String		Chart type. Can be line, spline, area, areaspline, column, bar, pie and scatter
	 * @param	HTMLTable	Table Object
	 *
	 */
	tableToChart: function(type, table)
	{
		// Data array
		var series = new Array();

		// Do it...
		table.hide();

		// Chart title
		var title = '';
		if (table.getElement('caption'))
			title = table.getElement('caption').get('text');
		
		// x Categories
		var columnTitles = table.getElements('thead tr th').get('text');
		
		// If rowTitles > 0 -> series:categories, else yAxis:title
		var rowTitles = table.getElements('tbody tr th').get('text');
		var yTitle = rowTitles[0];
		
		var container = new Element('div').inject(table, 'after');
		
		var options = null;
		
		// Create the chart regarding the type
		switch(type)
		{
			// Columns
			case 'column' :
			
				// Data
				table.getElements('tbody tr').each(function(row)
				{
					var serie = {
						name: row.getElement('th').get('text'),
						data: (row.getElements('td').get('text')).map(function(item, index){return parseFloat(item)})
					};
					series.push(serie);
				});
				
				// Chart options
				var options = $merge(this.chartOptions,
				{
					chart: {
						renderTo: container,
						defaultSeriesType: 'column'
					},
					title: { 
						text: title
					},
					xAxis: {
						categories: columnTitles
					},
					yAxis: {
						title: {
							text: yTitle
						}
					},
					tooltip: {
						formatter: function() {	return '<b>'+ this.x + '</b> : '+ this.y + ' M€'; }
					},
					plotOptions: {	
						series: {
							borderWidth: 0,
							color: {
								linearGradient: [0, 0, 0, 500], 
								stops: [[0, 'rgba(136, 196, 37,1)'],[1, 'rgba(27,103,107,.5)']]
							}
						}
					},
			        series: series
				});
				
				break;


			// Pie Chart
			case 'pie' :
			
				// Data
				table.getElements('tbody tr').each(function(row)
				{
					v = parseFloat(row.getElement('td').get('text'));
				
					series.push([row.getElement('th').get('text'), v]);
				});

				// Chart options
				var options = $merge(this.chartOptions,
				{
					chart: {
						renderTo: container,
						defaultSeriesType: 'pie',
						margin: [50, 160, 40, 10],
						height: 300
					},
					title: {
						text: title
					},
					tooltip: {
						formatter: function() {	return '<b>'+ this.point.name + '</b> : '+ this.y + ' %'; }
					},
					legend: {
						enabled: true,
						layout: 'vertical',
						style: {
							left: 'auto',
							bottom: '40px',
							right: '30px',
							top: 'auto',
							background: 'none',
							width: '150px'
						}
					},
//					colors: ['#8eb154','#bfcc55','#c29d50','#d8c656','#815e29'],
			        series: [{
						type: 'pie',
						name: 'Alfi data',
						data: series
					}]
				});

				break;


			// Line Chart
			case 'line' :
			
				// Data
				table.getElements('tbody tr').each(function(row)
				{
					var serie = {
						name: row.getElement('th').get('text'),
						data: (row.getElements('td').get('text')).map(function(item, index){return parseFloat(item)})
					};
					series.push(serie);
				});
				
				// Chart options
				var options = $merge(this.chartOptions,
				{
					chart: {
						renderTo: container,
						defaultSeriesType: 'line'
					},
					title: { 
						text: title
					},
					xAxis: {
						categories: columnTitles
					},
					yAxis: {
						endOnTick: true,
						title: {
							text: yTitle
						}
					},
					tooltip: {
						enabled: false
					},
					plotOptions: {
						line: {
							allowPointSelect: false,
							dataLabels: {
								enabled: true,
								x: -8,
								y: -5
							}
						}
					},
			        series: series
				});
				
				break;				
		}
		
		if (options != null)
		{
			chart = new Highcharts.Chart(options);
		}
	}
});