/*
 *   Przyciemniane tlo, ktore wyswietla sie dla modulu rejestracji, przenoszenia do koszyka itp
 */

var Overlay = new Class ({
	Implements: Options,
	options: {
		overlayOpacity: 0.7,
		prod_cont_top: 50,
		height: 500
	},
	
   initialize: function (options) {
   	//pobierz instancje obiektow
   	  this.dark_cover = $('dark_cover');
	  this.loader = $('cart_loader');
	  this.cart = $('bg_cart');
	  this.cart_cover = $('cart_cover');
  	  this.close_button = $('close_cart');
	  this.cart_cont = $('cart_cont');	  
	  
	  //podczas skalowania okna zmieniaj szerokosc przykrywki aby dopasowac ja do okna
	  window.addEvent('resize', function () {
	  	this.dark_cover.setStyle('width', $(window).getScrollSize().x);	
	  }.bind(this))
	  
	 //ukryj wszystkie warstwy
	  this.dark_cover.setStyles({
	  	'opacity' : '0',
		'display' : 'none'
	  })
	  this.cart.setStyles({
	  	'opacity' : '0',
		'display' : 'none'
	  })
	  this.cart_cover.setStyles ({
	  	'opacity': '0',
		'display' : 'none'		
	  })
	  this.close_button.setStyles({
	  	'opacity': '0',
		'display' : 'none'			  	
	  })

	  	
	//ustaw domyslnie jako zamkniete
	  this.closed = true; 
	  
	 //w trakcie zmiany wysokosci bialego kontenera z trescia, musimy aktualizowac wysokosc innych elementow, zwlasza, jesil
	 //wysokosci jest wieksza niz wysokosc strony
	  this.cart_resize = new Fx.Tween (this.cart, {
	  	duration: 450,
		transition: Fx.Transitions.Quad.easeOut,
		link: 'cancel'
	  })
	  this.cart_cont_resize = new Fx.Tween (this.cart_cont, {
	  	duration: 450,
		transition: Fx.Transitions.Quad.easeOut,
		link: 'cancel'
	  })
	  
	  //animacja do wyswietlania warstwy
	  this.overlay_tween = new Fx.Tween (this.dark_cover, {
		   transition: Fx.Transitions.Quad.easeInOut,	
		   duration: 450,	
		   fps: 50,
		   
		   //kiedy sciemnianie zostanie ukonczone
		   onComplete: function(){
		   	
		   	  this.cart.setStyles({
		   		  'top': $(window).getScroll().y + this.options.prod_cont_top,
		   		  'display': 'block'
		   	  })
		   	
		   	  this.prod_tween = new Fx.Tween(this.cart, {
		   		  transition: Fx.Transitions.Quad.easeOut,
		   		  duration: 450,
				  fps: 50,
		   		  onComplete: function() {
		   			  if (!this.closed) {
						 //uruchom funkcje pokazyjaca zawartosc -> trzeba zdefiniowac przy zdarzeniu wywolujacym Overlay
					  	 this.showContent ();
		   			  }
		   		  }.bind(this)
		   	  })
		   	
		   	this.prod_tween.start('opacity', 1);
		   }.bind(this)	   
	  });

	  $$(this.dark_cover,this.close_button).addEvent ('click', function () {
		   this.hide();
   	  }.bind(this))

      this.setOptions (options);

	  //ustaw wysokosc
	  this.cart.setStyle('height', this.options.height);
	  this.next_cart_h = this.options.height;
	  
	  this.cart_cont.setStyle ('height', this.options.height - 20);
	  this.next_cart_cont_h = this.options.height - 20; //padding


	  this.cart_cover.setStyle ('height', this.options.height - 2);

   },	
   
   
   setHeight: function (height) {
	  //ustaw wysokosc
	  this.cart.setStyle('height', height);
	  this.next_cart_h = height;
	  
	  this.cart_cont.setStyle ('height', height - 20);
	  this.next_cart_cont_h = height - 20; //padding


	  this.cart_cover.setStyle ('height', height - 2);   	
   },
   
   showLoader: function () {
   	   this.loader.setStyle('visibility', 'visible');
       this.cart_cover.setStyle('display', 'block');
	   this.cart_cover.fade('show');
   },
   
   hideLoader: function () {
		this.loader.setStyle('visibility', 'hidden');
		this.cart_cover.set('tween', {
			onComplete: function () {
				this.cart_cover.setStyle('display', 'none');	
			}.bind(this)
		}).fade('out');
		
		this.close_button.setStyle('display', 'block');
		this.close_button.fade('in');
   },
   
   show: function () {
	  //ustaw wysokosc
	  this.cart.setStyle('height', this.options.height);
	  this.next_cart_h = this.options.height;
	  
	  this.cart_cont.setStyle ('height', this.options.height - 20);
	  this.next_cart_cont_h = this.options.height - 20; //padding


	  this.cart_cover.setStyle ('height', this.options.height - 2);
	     	
      this.closed = false;
	  
	  this.cart_cont.set('html', '');
	  this.dark_cover.setStyles({
			'top': 0,
			'height': $(window).getScrollSize().y > this.options.cover_h ? $(window).getScrollSize().y : this.options.cover_h,
			'width': $(window).getScrollSize().x,
			'display': 'block'
	   });
	  
	      	
   	  this.overlay_tween.start('opacity', this.options.overlayOpacity);	
   },
   
   hide: function () {
   		this.cancelAllEffect();
		this.cart.setStyles({
		   'opacity': '0',
		   'display' : 'none'			  	
		})	
		this.cart_cover.setStyles({
		   'opacity': '0',
		   'display' : 'none'			  	
		})				
		this.close_button.setStyles({
		   'opacity': '0',
		   'display' : 'none'			  	
		})	
		this.dark_cover.set('tween', {
			transition: Fx.Transitions.Quad.easeOut,
			duration: 400,
			onComplete: function () {
				this.dark_cover.setStyles({
					'opacity': '0',
					'display': 'none'
				})
			}.bind(this)
			
		}).fade('out');

   },
   
	cancelAllEffect: function () {

		if ($defined(this.overlay_tween)) {
			this.overlay_tween.cancel();
		}
		if ($defined(this.prod_tween)) {
			this.prod_tween.cancel();
		}		
	},   
	
	resize: function (value) {
	//	var registration_h = $('registration').getStyle('height').toInt() + value.toInt()
		
		//console.log (this.cart_cont.getStyle('height').toInt() + " " + registration_h)
		//if (value > 0) {
		//	if (this.cart_cont.getStyle('height').toInt() < registration_h) {
				this.next_cart_h = this.next_cart_h + value;
				this.cart_resize.start('height', this.next_cart_h);
				
				//wewnetrzny kontener z paddingiem ustawionynm na 10
				this.next_cart_cont_h = this.next_cart_cont_h + value;
				this.cart_cont_resize.start('height', this.next_cart_cont_h);
		//	}
		//} else {
			
	//		if (this.cart_cont.getStyle('height').toInt() > registration_h) {
	//			this.next_cart_h = this.next_cart_h + value;
	//			
				//wewnetrzny kontener z paddingiem ustawionynm na 10
		//		this.next_cart_cont_h = this.next_cart_cont_h + value;
			//	this.cart_cont_resize.start('height', this.next_cart_cont_h);
		//	}			
		//}
	},
	
	showContent: function () {

	}
})

