var PC;

window.addEvent('domready', function()
{
	PC = new PhotoCollection();
});

window.addEvent('resize', function()
{
	PC.resize();
});

/**
 * PhotoCollection Class
 *
 * @author Edgar Post
 **/
var PhotoCollection = new Class(
{
	initialize: function()
	{
		this.mask = $('photo-mask');
		this.collection = $('photo-collection');
		
		if(!this.collection)
		{
			return;
		}
		
		this.resize();
		
		this.photos = this.collection.getElements('img');
		
		this.slider = $('slider');
		this.knob = $('slider-knob');
		
		this.mask.fade('hide');
		this.slider.fade('hide');
		this.knob.fade('hide');
				
		var width = 0;
		var loaded = 0;
		var loading_message = null;
		var loading_width = 0;
		var percentage = 0;
		var total;
		
		var self = this;
		
		loadTween = new Fx.Tween('loading-bar');
		this.loadingMessage = $('loading-message');
		
		var imagesArray = [];
		this.photos.each(function(image, i)
		{
			image.store('key', i);
			imagesArray.push(image.src);
			
			//image.addEvent('click', function()
			//{
			//	self.focusPhoto(this);
			//});
		});
		
		var total = imagesArray.length;
		
		var images = new Asset.images(imagesArray,
		{
			onProgress: function(loaded, index)
			{
				loading_message = '';
				loading_width = Math.round(loaded / total * $('loading').getSize().x);

				if(loading_width < 0 || loading_width >= 202)
				{
					loaded = self.photos.length;
					loading_width = $('loading').getSize().x;
				}
				
				self.loadingMessage.set('text', self.photos[loaded].alt);
					
				loadTween.cancel();
				loadTween.start('width', loading_width + 'px');
				
				width += self.photos[loaded].getSize().x + 22;
			},
			onComplete: function()
			{
				loadTween.cancel();
				loadTween.start('width', $('loading').getSize().x);
				
				$('loading-container').fade('out');
				(function() { self.initSlider() }).delay(300);				
			}
		});
	},
	focusPhoto: function(step)
	{
		this.slider.set(step);
	},
	resize: function()
	{		
		var size = $(document.body).getSize().x - 50;
		
		$('wrapper').setStyles(
		{
			'width': 		size + 'px',
			'margin-left':	'-' + ( size / 2 ) + 'px'
		});		

		this.visibleWidth = this.mask.getSize().x;
		this.totalWidth = this.collection.getSize().x;
	},
	initSlider: function()
	{		
		var knobMaxLeft = this.slider.getSize().x - this.knob.getSize().x;		
		var maxScroll = this.totalWidth - this.visibleWidth;

		this.mask.fade('in');
		this.slider.fade('in');
		
		milkbox = new Milkbox({imageOfText:'/'});
		
		if(maxScroll <= 0)
		{
			this.collection.setStyles({'margin': '0 auto'});
			return;
		}
		this.knob.fade('in');
		
		var self = this;
		var durationAnimationStart = 1500;
				
		new Fx.Tween(this.knob, {duration:durationAnimationStart,transition: Fx.Transitions.Quad.easeOut}).start('left', [knobMaxLeft,0]);
		
		this.scrollEffect = new Fx.Scroll(this.mask).set(maxScroll, 0);
		this.scrollEffect = new Fx.Scroll(this.mask,
		{
			duration: 		durationAnimationStart,
			transition: 	Fx.Transitions.Quad.easeOut,
			onComplete: 	function()
			{				
				self.scrollEffect = new Fx.Scroll(self.mask, {duration:300,transition: Fx.Transitions.Sine.easeOut});
				var steps = self.photos.length - 1;
		
				self.slider = new Slider(self.slider, self.knob,
				{
					steps: steps,
					wheel: true
				});		
		
				setInterval(function()
				{
					var scroll = (maxScroll / (self.photos.length - 1)  * self.slider.step).round();
			
					if($chk(self.scrollEffect))
					{
						self.scrollEffect.cancel();
					}
			
					self.scrollEffect.start(scroll, 0);
				}, 100);				
			}
		}).toLeft();
	}
});