(function($){
    $.fn.articlize = function(options) {
        var defaults = {
            art: '.article', // class for the entire article
            art_title: '.article-title', // class for the title
            art_exc: '.article-excerpt', // class of excerpt
            art_cont: '.article-content', // class of content
            size_small: '225px', // size of excerpt
            size_big: '400px', // size after expand
            color_over: 'gray', // title hover color
            color_out: 'white' // title hover color
        };
        var options = $.extend(defaults, options);
        return this.each(function() {
            var article = $(this);
            article.css('height', options.size_small);
            var content = $(this).find(options.art_cont);
            var excerpt = $(this).find(options.art_exc) ;
            var title = $(this).find(options.art_title);
            content.hide(); //Hide content
            excerpt.append("<span class='show-article' style='float: right'>more...&nbsp;</span>");
            title.append("<span class='title-tag' style='float: right'><strong>++</strong></span>");
            var tag = $(this).find('.title-tag');
            var more = $(this).find('.show-article');
            title.css('cursor','pointer').hover(function (){
                $(this).css('color','gray')
                },function (){
                $(this).css('color','white')
                });
            content.append("<span class='hide-article' style='float:right; cursor:pointer;'>done..</span>");
            var done = $(this).find('.hide-article');
            more.css('cursor','pointer');
            done.css('cursor', 'pointer');
            title.bind('click', function(){
                art_toggle();
                });
            more.bind('click', function(){
                art_toggle();
            });
            done.bind('click', function(){
                art_toggle();            
            });
            
            function art_toggle(){
                content.toggle(800);
                if (article.css('height') == options.size_big) {
                    article.css('height', options.size_small);
                } else {
                    article.css('height', options.size_big);
                };
                more.toggle(800);
                if (tag.text() == '++') {
                    tag.text('--');
                } else {
                    tag.text('++');
                };
            };

        });
    };
})(jQuery);
