var Gulu = Gulu || {};


Gulu.VoteCollection = Backbone.Collection.extend({
    model: Gulu.VoteModel
});


Gulu.VoteView = Backbone.View.extend({
    tagName: 'span',
    events: {
        'click input': 'voteit'
    },
    initialize: function() {
        _.bindAll(this, 'render', 'voteit');
    },
    
    render: function() {
        var compiled = _.template($("#vote_btn_tmp").html());
        var context = {vote: this.model};
        $(this.el).html(compiled(context));
        return this;
    },
    voteit : function(){
        var btn = $(this.el).find('input');
        var object_id = this.model.get('object_id');
        var like_btn = btn.parents('.ui_like_unlike_button').find('.like');
        var unlike_btn = btn.parents('.ui_like_unlike_button').find('.unlike');
        var active = btn.hasClass('on');
        var like = btn.hasClass('like');
        var unlike = btn.hasClass('unlike');
        
        if (active){
            vote_type = 'clear';            
        }
        else{
            if (like){
                vote_type = 'up';
            }
            else{
                vote_type = 'down';
            }
        }
        var url = '/voting/ajax/'+btn.attr('model')+'/'+object_id+'/'+vote_type+'/';
        $.ajax({
           type: "POST",
           dataType: "json",
           url: url,
           success: function(data) {
               $('#score_'+object_id).html(data.score);
               if(vote_type=='clear'){
                   like_btn.removeClass('on');
                   unlike_btn.removeClass('on');                   
               }else if(vote_type=='up'){
                   like_btn.addClass('on');
                   unlike_btn.removeClass('on');
               }else{
                   like_btn.removeClass('on');
                   unlike_btn.addClass('on');
               }    
           },
           error: function(xhr){
               //alertTxt(xhr);
               console.log(xhr);
           }
           
        });
    }
});

Gulu.VoteContenerView = Backbone.View.extend({
    el: '.ui_like_unlike_button',
    initialize: function() {
        _.bindAll(this, 'render');
    },
    render: function() {
        var $self = $(this.el);
        _(this.collection.models).each(function(item){
            var voteView = new Gulu.VoteView({model: item});
            $self.append(voteView.render().el);
        });
        return this;
    }
});