/*
Script: PBBSideBar.js
	Contains <PBBSideBar>

Author:
	Pokemon_JOJO, <http://www.mibhouse.org/pokemon_jojo>

License:
	MIT-style license.

*/

/*
Class: PBBSideBar
	Create a SideBar.

Arguments:
	options - see Options below

Options:
	position - position of the SideBar
	transition - type of SideBar transition when showing and hiding (slide or appear)
	display - integer, Show the SideBar at start (with a transition). defaults to 0.
	
	style - stylesheets of the SideBar (width, color, background-color, opacity)

	showDuration - duration of the SideBar transition when showing (defaults to 500 ms)
	showEffect - transitions, to be used when showing
	hideDuration - Duration of the SideBar transition when hidding (defaults to 500 ms)
	hideEffect - transitions, to be used when hidding
	onShowStart - a function to fire when SideBar start to showing
	onHideStart - a function to fire when SideBar start to hidding
	onShowComplete - a function to fire when SideBar done showing
	onHideComplete - a function to fire when SideBar done hidding
*/

var PBBSideBar = new Class({

	getOptions: function(){
		return {
			position : 'right',
			transition : 'slide',
			display: 0,
			styles: {
				'width': '250',
				'color': 'white',
				'background-color': 'black',
				'opacity': 0.8
			},
			showDuration: 500,
			showEffect: Fx.Transitions.linear,
			hideDuration: 500,
			hideEffect: Fx.Transitions.linear,
			onShowStart : Class.empty,
			onShowComplete : Class.empty,
			onHideStart : Class.empty,
			onHideComplete : Class.empty
		};
	},

	initialize: function(options){
		this.setOptions(this.getOptions(), options);
			
		// CrÃ©ation de la SideBar
		this.SideBar = new Element('div').addClass('PBBSideBar').setStyles({
			'opacity': '0',
			'top': '0',
			'width': '0',
			'background-color': this.options.styles['background-color'],
			'color': this.options.styles['color'],
			'height': window.getScrollHeight() + 'px',
			'overflow-x': 'hidden',
			'display': 'none'
		}).injectInside('izbornik');
		var htmls = '<div id="addWebBoxes"><h1>Dodaj blok</h1><ul><li><a href="#">Blok 1</a></li><li><a href="#">Blok 2</a></li><li><a href="#">Blok 3</a></li><li><a href="#">Blok 4</a></li><div class="clear"></div></ul></div>';
		this.SideBar.setHTML(htmls);

		// Position de la SideBar (droite ou gauche)
		if(this.options.position != 'left') this.options.position = 'right';
		this.SideBar.setStyle(this.options.position, '0');
		
		// Initialise la SideBar avant la transition demandÃ©e
		if(this.options.transition == 'appear') {
			this.options.transitionStyle = 'opacity';
			this.SideBar.setStyle('width', this.options.styles['width'].toInt() + 'px');
		}
		else {
			this.options.transitionStyle = 'width';
			this.SideBar.setStyle('opacity', this.options.styles['opacity']);
		}
		
		// Inject une DIV PBBInSideBar pour ne pas Ã©craser le contenu lors d'un slide
		this.InSideBar = new Element('div').addClass('PBBInSideBar').setStyle('width', this.options.styles['width'].toInt() + 'px').injectInside(this.SideBar);
		
		// Si le navigateur est redimentionnÃ©, nouvelle hauteur de la SideBar
		window.addEvent('resize', function() {
			this.SideBar.setStyle('height', window.getScrollHeight() + 'px');
		}.bind(this));
		
		if(this.options.display != 0) {this.options.display = 0; this.display();}
		//if (this.options.initialize) this.options.initialize.call(this);
	},
	
	/*
	Property: display
		Show or hide SideBar
		
	Argument:
		option - integer, 1 to Show SideBar and 0 to Hide SideBar (with a transition).
	*/

	display: function(option){
		$('webBoxContainer').setStyle('width','80%');
		this.SideBar.setStyle('display', 'block');
		
		// Stop la transition en action si elle existe	
		if(this.Transition)
			this.Transition.stop();				

		// Show SideBar	
		if(this.options.display == 0 && option != 0 || option == 1) {
			this.options.display = 1;
			this.fireEvent('onShowStart', [this.SideBar]);

			// Nouvelle transition		
			this.Transition = this.SideBar.effect(
				this.options.transitionStyle, 
				{
					duration: this.options.hideDuration,
					transition: this.options.showEffect,
					onComplete: function() { this.fireEvent('onShowComplete', [this.SideBar]); }.bind(this)
				}
			).start(this.options.styles[this.options.transitionStyle]);
		}
		// Hide SideBar
		else {
			
			
			this.options.display = 0;
			this.fireEvent('onHideStart', [this.SideBar]);
			var dur = 80.04;
			// Nouvelle transition		
			this.Transition = this.SideBar.effect(
				this.options.transitionStyle, 
				{
					duration: this.options.hideDuration,
					transition: this.options.hideEffect,
					onComplete: function() { 
						this.fireEvent('onHideComplete', [this.SideBar]); 
						this.SideBar.setStyle('display', 'none'); 
						$('webBoxContainer').setStyle('width','100%');
					}.bind(this)
				}
			).start(0);
			
		}			
	},

	/*
	Property: addPlugin
		Add plugin to SideBar
		
	Argument:
		option ...
	*/
		
	loadWidget: function(url){
	
	alert($A(document.getElementsByTagName("script")).findAll( function(s) {
      return (s.src && s.src.match(/scriptaculous\.js(\?.*)?$/))
    }));
		//var path = s.src.replace(/pbbsidebar.v.1.00\.js(\?.*)?$/,'');	
	//alert(path);
		if(url && !$('widget-' + url)) {
			new Ajax(url, {
				method: 'get',
				evalScripts: true,
				onComplete: function(responseHTML) {
						
						this.NewWidget = new Element('div').addClass('PBBWidget').injectInside(this.InSideBar).setHTML(responseHTML);
						this.NewWidget.setProperty('id', 'widget-' + url);
				}.bind(this)
			}).request();
		}
	}
});

PBBSideBar.implement(new Events);
PBBSideBar.implement(new Options);