/*
 * 
 * 
 */
var Projects = new Class({
	Implements: [Options],  
	options: {},
	initialize: function (overlays, options) {
		
		this.overlays = overlays;
		
		this.setOptions(options);
		
		this.container = $('projects');
		this.outerContainer = $('projects-container');
			
		if (!this.container || !this.outerContainer) {
			return false;
		}
		
		this.form = $('projects-sort');
		
		if (!this.form) {
			return false;
		}
		
		this.inputs = this.form.getElements("input[type=checkbox], input[type=radio]");
		
		this.scanInputs();
		this.scanMore();
		
		this.outerContainer.set('tween', {duration: 250});
				
		this.inputs.each(function(input, i) {
			input.addEvent('click', function(event) {
				this.clickInput(input);
			}.bind(this));
		}, this);
	},
	clickInput: function (input) {
		this.scanInputs();
		this.submitForm();
	},
	scanInputs: function() {
		this.inputs.each(function(input, i) {
			var label = input.getParent('label');
			if (input.checked) {
				label.addClass('selected');
			} else {
				label.removeClass('selected');
			}
		}, this);		
	},
	submitForm: function() {
		// send the form
		var myHTMLRequest = new Request.HTML({
			url: this.form.action,
			update: this.container,
			onSuccess: this.showContainer.bind(this)
		}).get(this.form);
		
		this.fadeContainer();
	},
	showContainer: function() {
		this.outerContainer.tween('opacity', 1);		
		this.scanMore();
		if (this.overlays) {
			this.overlays.update();
		}
	},
	fadeContainer: function() {
		this.outerContainer.setStyle('opacity', 0.4);
	},
	
	scanMore: function() {
		var more_btn = this.container.getElement('.more-projects');
		if (!more_btn) return;
		
		more_btn.addEvent('click', function(event) {
			event.preventDefault();			
			this.requestMore(more_btn.href);
			more_btn.dispose();
		}.bind(this));
	},
	requestMore: function(href) {
		// send the form
		var myHTMLRequest = new Request.HTML({
			url: href,
			append: this.container,
			onSuccess: this.showContainer.bind(this)
		}).get(this.form);
		
		//this.fadeContainer();
	}
	
});


var ProjectOverlays = new Class({
	Implements: [Options],  
	options: {},
	initialize: function (options) {
		this.scan();
	},
	update: function() {
		this.scan();		
	},
	scan: function() {
		var items = $$('.project');
		if (!items) return;
		items.each(function(item) {			
			if (item.retrieve('overlay_init') == true) {
				return;
			}			
			var overlay = item.getElement('.project-over');
			overlay.setStyles({
				opacity: 0,
				display: 'block'
			})
			overlay.set('tween', {'duration': 200});
			item.addEvent('mouseover', function() {
				overlay.tween('opacity', 1);	
			});
			item.addEvent('mouseout', function() {
				overlay.tween('opacity', 0);
			});			
			item.store('overlay_init', true);			
		});		
	}	
});

window.addEvent('domready', function() {
	var overlays = new ProjectOverlays();
	var our_work = new Projects(overlays);
		
	if ($('work-sidebar')) {
		var colHeight = $('work-sidebar').getSize().y;
		$('projects-container').setStyle('min-height', colHeight);
	}
});