document.observe("dom:loaded", function() {
	if($('search-filters') != null) { // On search filters page
	
		$$('#search-filters .filter').invoke('hide');
	
		$('search-filters').hideFilters=function() {
			$$('#search-filters .filter').each(function(filter) {
				if(!filter.hasClassName('active')) {
					new Effect.BlindUp(filter, {duration:0.5});
				}
			});
		};
		
		$$('#search-filters label').each(function(label) {
			label.observe('click', function(e) {
				
				var wrapper = $(this.parentNode);
				var filter = wrapper.getElementsBySelector('.filter')[0];
				
				if(filter.hasClassName('active')) {
					filter.removeClassName('active');
					new Effect.BlindUp(filter, {duration:0.5});
				} else {
					$$('#search-filters .active').invoke('removeClassName', 'active');
					filter.addClassName('active');
					
					$('search-filters').hideFilters();
					new Effect.BlindDown(filter, {duration:0.5});
				}
			}.bindAsEventListener(label));
		});
		
		// Update selected counts
		$$('#search-filters .filter select').each(function(select) {
			select.observe('change', function() {
				var opts = this.getElementsBySelector('option');
				var c = 0;
				for(var i=0; i < opts.length; i++) {
					if(opts[i].selected) c++;
				}
				
				$('counter-'+this.id).value = c + ' selected';
			}.bindAsEventListener(select));
		});
		
		// If we have a color grid update its count
		if($('color-grid') != null) {
			$$('#color-grid a').each(function(cell) {
				cell.observe('click', function(e) {
					Event.stop(e);
					
					if(this.hasClassName('active')) {
						this.removeClassName('active');
						$(this.parentNode).removeClassName('on');
						$$('form#search-filters input.selectedColours').each(function(h) {
							if($F(h) == this.rel) {
								h.remove();
							}
						}.bind(this));
					} else {
						this.addClassName('active');
						$(this.parentNode).addClassName('on');
						var h = document.createElement("input");
						h=$(h);
						
						h.type='hidden';
						h.value=this.rel;
						h.name='fabricColor[]';
						h.addClassName('selectedColours');
						
						$('search-filters').appendChild(h);
					}
					
					// Count active
					$('counter-colours').value = $$('#color-grid a.active').length + ' selected';
					
				}.bindAsEventListener(cell));
			});
		}
	}
	
	if ($('homepage-image-wrapper')) {
		var list = $('homepage-image-wrapper').firstDescendant();
		var count = list.childElements().length;
		var i = 1;
		new PeriodicalExecuter(function () {
			var newPos = 0;
			if (i==count) {
				i = 1;
			} else {
				newPos = parseInt(list.getStyle('left'))-950;
				i++;
			}
			new Effect.Move(list, {x:newPos, y:0, mode:'absolute', duration:2});
		}, 8);
	}
});