SS.Views.Category = Backbone.View.extend({
	// Binded events
	events: {
		"click": "select"
	},
	
	// Intialize model binds and create "more" tab on init
	initialize: function(spec) {
		// Bind
		_.bindAll(this, "render", "unselect", "silenceEvent");
	},
	
	// Render function
	render: function() {              
		return this;
	},
	
	select: function(e) {
		var 
			id,
			val;
		
		// Leave this commented out code
		if ( e )
			e.preventDefault();
		
		this.el.removeClass("unselected")
				.addClass("selected");
		this.model.set({selected: true});
		
		if ( EcommerceObj.getEcommerceObj().styles.categoryType.toLowerCase() === "dropdown" ) {
			id = this.model.get("id");
			val = $("#categoryDropdown_" + id).val();
			
			// We don't want change event to fire an AJAX call just by selecting
			// an option. Selection and ajax calls should be seperate. 
			$("#categoryDropdown").bind("change", this.silenceEvent);
			$("#categoryDropdown").val(val)
				.change();
			$("#categoryDropdown").unbind("change");
		}
		
	},
	
	unselect: function () {
		this.el.removeClass("selected")
		.addClass("unselected");
	},
	
	
	silenceEvent: function(e) {
		if ( e ) {
			e.stopPropagation();
		}
	}
	
});
