(function($){
	
    $.ColorBlock = function(el, options){
        var base = this;
        
        base.$el = $(el);
        base.el = el; 
        
        base.$el.data("ColorBlock", base);
        
        base.init = function(){
            base.options = $.extend({},$.ColorBlock.defaultOptions, options);

			base.$el.click(function(){ base.nextColor(); });
			base.setColor(0);
        }
        
		base.setColor = function(new_color_index){
			if( new_color_index != base.current_color_index ){
				base.current_color_index = new_color_index;
				base.$el.css({backgroundColor: base.options.colors[base.current_color_index]});
				base.$el.trigger('color_changed');
			}
		}

		base.nextColor = function(){
			var new_color_index = base.current_color_index + 1;
			if ( new_color_index > ( base.options.colors.length - 1 ) )
				new_color_index = 0;
			base.setColor( new_color_index );
		}

		base.getColor = function(){
			return base.options.colors[base.current_color_index];
		}

        
        base.init();
    }

	
    $.ColorBlock.defaultOptions = {
       colors: ["red","blue","green","yellow"] 
    }
	

    $.fn.colorBlock = function(options){
        return this.each(function(){
            (new $.ColorBlock(this, options));
        });
    }

	
    $.fn.getColorBlock = function(){
        return this.data("ColorBlock");
    }
	
})(jQuery);
