/*
	brands.js
		code for the jquery filtered brand picker
*/


jQuery.fn.brand_picker = function(options) {
	var formname = $(this).attr('id');
	var name = 'picker-'+$(this).attr('id');
	var canvas_name = name+'-ctl';
	
	var filter_helptext = $('<p/>').addClass('help-text').text('Search the brands:').css({'display':'none'});
	var filter_default_text = "Search the brands:";
	var filter_alt_text = "Click to remove.";

	var create_checked_button = function (from) {
		var remove_checked_brand = function () {
			$('#'+$(this).attr('target')).attr('checked',false);
			$(this).hide('fast', function () { $(this).remove(); } );	
		};
		var el = $('<div></div>')
				.attr('id'	,'remove-'+$(from).attr('name'))
				.attr('target'	,$(from).attr('name'))
				.css({cursor:'pointer'});
		var innerel = $(from).clone()
				.attr('id'	,'remove-input-'+$(from).attr('name'))
				.css({
					'display':'none'
				})
				.attr('target'	,$(from).attr('name'));
				/*.click(remove_checked_brand);*/
		var labelel = $('<p/>')
				.attr('for', $(from).attr('name'))
				.css({ 
					cursor:'pointer',
					margin:'0',
					padding:'0'
				})
				.text($(from).next().text());

		filter_helptext.show();
		filter_helptext.text(filter_default_text);


		el.click(function(event) {
			if($('.remove-brand').length == 1) {
				filter_helptext.hide();
			}
			this.fn = remove_checked_brand;
			this.fn();
		});

		el.hover(function() {
			filter_helptext.text(filter_alt_text);
			$(this).addClass('hoveredfilter');
		}, function() {
			filter_helptext.text(filter_default_text);
			$(this).removeClass('hoveredfilter');
		});
		el.append(innerel).append(labelel);
		el.addClass('remove-brand');
		el.css({
			paddingLeft:'25px',
			paddingTop:'3px'
			});

		el.css({'display':'none'});
		return el;
	};

	var add_li_behavior = function () {
		var item = null;
		var brand_change = function () { 
			if($(this).attr('checked') == true) {
				var el =create_checked_button(this); 
				$('#'+formname).prepend(el);
				el.show('fast');
				var n = ('#'+name+'-ctl .brand-filter');
				if($('#'+formname+' div.remove-brand').length == $(n).length) {
					$('#check-all-brands').click().change();
				}
				
			} else {
				$('#remove-'+$(this).attr('name')).remove();
				if($('.remove-brand').length == 0) {
					filter_helptext.hide();
				}
			}
		};

		item = $(this).children('input');
		if(item) {
			if(item.attr('type') == 'checkbox') {
				item.click(brand_change);	
			}
		}
	};

	/*
		initially put all lis into the new picker div, and for every checked input, put an entry into the form for it
	*/
	var arrange_lis = function () {
		var item = $(this).children('input');
		if(item) {
			if(item.attr('type') == 'checkbox') {
				if(item.attr('checked') == true) {
					var el = create_checked_button(item);
					el.css({'display':'block'});
					$('#'+formname).prepend(el);
				}
			}
		}
	};

	/*
		this actually does all the initial arrangement and assigning of methods
	*/
	$('#'+canvas_name).find('li').each(add_li_behavior).each(arrange_lis);
	$('#'+canvas_name).show();
	$('#'+formname).append($('li.hidden'));

	$('#'+formname).before(filter_helptext);


	var brand_change = function() {
		var check_all_brands = function () {
			$('form#brand-filter .remove-brand').remove();
			$('#picker-brand-filter-ctl .brand-filter').attr('checked',false);
			$('#picker-brand-filter-ctl').slideUp('fast');
			$('#title').html('Shop All Brands');
			filter_helptext.hide();
		};
		var check_no_brands = function () {
			$('#picker-brand-filter-ctl').slideDown('fast');
			$('#title').html('Shop By Brand');
		};
		if($(this).attr('checked') == true) {
			check_all_brands();
			$(this).attr('checked', true);
		} else {
			check_no_brands();
		}
	};
	var catch_ie = function(event) {
		$(this).change();
	};

	var check_brands = $('#check-all-brands').change(brand_change).click(catch_ie).change();
	$('#'+canvas_name).before(check_brands.parent());

};