/*
	mooslides-1.0.js by Jean-Nicolas Jolivet (http://www.silverscripting.com)
	Licenced under the MIT license: http://www.opensource.org/licenses/mit-license.php

	Sections ripped out and simplified by Matt

*/
var mooslides = new Class({
	Implements: Options,
	options: {
		customToolbar: false,
		transitionEffect: Fx.Transitions.Expo.easeOut,
		animationDelay: 500,
		animationDuration: 500,
		autoStart: false,
		buttonClass: 'toolbar-button'
	},


	initialize: function(codeView, treeView, banner, outterdiv, buttonContainer, options) {

		this.setOptions(options);
		this.outterdiv = $(outterdiv);

		this.banner = $(banner);
		this.bannerOrig = this.banner.getStyle('height').toInt();
		
		this.treeView = $(treeView);
		this.codeView = $(codeView);

		this.treeView.setStyle('display','none');
		this.codeView.setStyle('display','none');
		
		this.loadedTreeView = false;
		
		this.innerdiv = new Element('div', {
			id: 'innerdiv'
		});

		this.panels = this.outterdiv.getChildren().filter(".panels");
		this.buildToolbar(buttonContainer);

		this.panels.setStyles({
			float: 'left'
		});
		this.size = this.panels[0].getSize();
		this.totalWidth = this.size.x * this.panels.length;
		this.outterdiv.setStyle('width', this.size.x);
		this.innerdiv.setStyle('width', this.totalWidth);
		this.panels.dispose();
		this.panels.inject(this.innerdiv);
		this.innerdiv.inject(this.outterdiv);
		this.outterdiv.setStyle('overflow', 'hidden');

		// set the panel's alt to it's id...
		var cnt = 0;
		this.panels.each(function(aPanel) {
			aPanel.set('alt', cnt + "");
			cnt = cnt + 1;
			aPanel.addEvent('click', this.panelClicked.bind(this));
		}.bind(this));

		this.activePanelId = 0; 
		this.currentFx = 0;
		this.slideTo(0);

		if(this.options.autoStart) {
			this.loopStart();
		}
		
	},
	
	customFade: function(e, start, end, duration, delay)
    {
		// only fade if we have to
		if ($(e).getStyle('opacity').toInt() != end)
		{
			fadeFunction = new Fx.Tween($(e), {
				property: 'opacity',
				duration: duration, 
				transition: Fx.Transitions.Quart.easeInOut
			});
			fadeFunction.start.pass([start, end], fadeFunction).delay(delay);
		}
    },
	
	panelClicked: function() {
		this.outterdiv.fireEvent('panelClick', this.activePanelId);
	},
	

	buildToolbar: function(buttonContainer) {
		var newToolbarDiv = new Element('div', {});
		var count = 0;
		this.buttons = [];
		this.panels.each(function(aPanel) {
                        this.navButtons = $(buttonContainer).getChildren();
			this.navButtons[count].addEvent('click', function(page) {
                           this.slideTo(page);
			}.bind(this, count));

			count++;

		}.bind(this));
	},

	slideTo: function(panelId) {
                if (this.currentFx)
                   this.currentFx.cancel();
		panelId = (panelId < 0) ? 0 : panelId;
		panelId = (panelId > this.panels.length - 1) ? this.panels.length - 1 : panelId;
		var toX = (panelId ) * this.size.x;
		this.currentFx = new Fx.Scroll(this.outterdiv, {duration: this.options.animationDuration, transition: this.options.transitionEffect}).start(toX, 0);
		this.outterdiv.tween('height', [this.outterdiv.getStyle('height').toInt(), this.panels[panelId].getStyle('height').toInt() + 50]);
                this.changed(panelId);
	},
	
	slideNext: function() {
		nextPanel =	(this.activePanelId == this.panels.length -1) ? this.activePanelId : this.activePanelId  + 1;
		this.slideTo(nextPanel);

	},


	slidePrevious: function() {
		prevPanel = (this.activePanelId == 0) ? this.activePanelId : this.activePanelId  - 1;
		this.slideTo(prevPanel);
	},

	slideFirst: function() {
		this.slideTo(0);
	},
	
	slideLast: function() {
		this.slideTo(this.panels.length - 1);
	},
	
	loopStart:function () {
		this.timer = this.loopNext.periodical(this.options.animationDelay, this);
	},

	loopStop: function() {
		$clear(this.timer);
	},

	loopNext: function() {
		if(this.activePanelId == this.panels.length -1) {
			this.currentFx = new Fx.Scroll(this.outterdiv, {duration: 200, transition: this.options.transitionEffect}).start(0, 0);
		//	this.outterdiv.tween('height', [this.outterdiv.getStyle('height').toInt(), this.panels[panelId + 1].getStyle('height').toInt()]);
                        this.changed(0);
		}
		else {
			this.slideNext();
		}
	},

	warpTo: function(panelId) {
		panelId = (panelId < 0) ? 0 : panelId;
		panelId = (panelId > this.panels.length - 1) ? this.panels.length - 1 : panelId;
		var toX = (panelId ) * this.size.x;
		this.currentFx = new Fx.Scroll(this.outterdiv).set(toX, 0);
		this.changed(panelId);
	},

	changed: function(newPanel) {
		
		/* more custom code for the "programming" page */
		// if panels have changed
		if (newPanel != this.activePanelId)
		{
			this.activePanelId = newPanel;
			this.outterdiv.fireEvent('changed', newPanel);	        
			
			// programming panel
			if (newPanel == 3)
			{
			   this.banner.tween('height', [this.banner.getStyle('height').toInt(), 0]);
			   // this.ProgrammingFx.slideIn();
			   this.treeView.tween('left', [-100, 20]);
			   this.treeView.setStyle('display','');
			   this.codeView.setStyle('display','');
			   this.customFade(this.codeView, 0, 1, 400, 0);
			   this.customFade('name', 1, 0, 400, 0);
			   
			   if (!this.loadedTreeView)        
			   {
				  this.loadedTreeView = true;
				  var req = new Request.HTML({
						  url:'tree.pl',
						  async: true,
						  onSuccess: function(responseTree, responseElements, responseHTML, responseJavaScript) {
									 $('tmptree').set('html', responseHTML);
									 tree.adopt('tmptree');
						  },
						  onFailure: function() {
									 $('treeView').set('text', 'Could not load the code from the server. Please notify author');
						  }
				  }).send();
			   }  
			   
			} else {
			   this.banner.tween('height', [this.banner.getStyle('height').toInt(), this.bannerOrig]);
			   this.treeView.tween('left', [20, -100]);
			   this.treeView.setStyle('display','none');
			   this.customFade(this.codeView, 1, 0, 400, 0);
			   this.customFade('name', 0, 1, 400, 0);
			}
		}
	}
});