$(document).ready(function(){
    $('#profile_comments').delegate('.pagination a', 'click', function(e){
        var pagination_page = $(this).attr('title');
        var profile = $('#profile_nickname span').text();
        my_element = $(this);

        $.ajax({
            url: '/profile/' + profile + '/comments_list/page/' + pagination_page,
            dataType: "json",
            success: function(msg){
                $('#profile_comments ul li').remove();
                $.each(msg.comments, function(){

                    var li = get_li_with_comment(this);
                    $('#profile_comments ul').append(li);
                });

                $('.pagination_wrapper').remove();
                $('ul.comments').after(msg.pagination);
            }
        });

        e.preventDefault();
        return false;
    });

    $('#profil_add_comment').live('submit', function() {

        var comment_text = $('#comment_text').val();
        if($.trim(comment_text).length < 1) {
            alert('Komentarz nie może być pusty');
            return false;
        }

        $.ajax({
            url: $(this).attr('action'),
            data: $(this).serialize(),
            dataType: "json",
            beforeSend: function() {
                $('#button_submit').attr('disabled', true);
                $('<img/>').attr({'src' : '/img/load.gif', 'class' : 'ajax_loader'}).css({'float' : 'right', 'margin-top' : '7px' }).insertBefore('#button_submit');
            },
            success: function(msg)
            {
                var li = get_li_with_comment(msg.comment);
                var handler = $('#profile_comments')
                var list = handler.find('ul');

                if(!list.length)
                {
                    $('.no_comments').hide();
                    $('<ul/>').addClass('comments').appendTo(handler);
                    list = handler.find('ul');
                }
                
                list.prepend(li);
                $('#comment_text').val('');
                $('#button_submit').removeAttr('disabled');
                $('.ajax_loader').remove();
            }
       });

        return false;
    });

    function get_li_with_comment(comment_data)
    {
        // AVATAR
        var avatar_img = $('<img/>').attr('src', comment_data.profile_img).attr('class', 'image thumb');
        var avatar_link = $('<a/>').attr('href', comment_data.profile_url).html(avatar_img);

        // GALERIA ICON
        var gallery_img = $('<img/>').attr('src','/img/ico_gallery.gif');
        var gallery = $('<a/>').attr('title','Galeria').attr('href','/profile/'+comment_data.user_name+'/gallery').html(gallery_img);

        // PM ICON
        var pm_img = $('<img/>').attr('src', '/img/ico_mail_arrow.png');
        var pm = $('<a/>').attr('title','Napisz wiadomość').attr('href','/mailbox/write/'+comment_data.user_name).html(pm_img);

        // FRIENDS ICON
        var friends = $('<a/>');
        friends.attr('class', 'iconed friends').attr('title', 'Znajomi').attr('href', '/profile/'+comment_data.user_name+'/friends').html(comment_data.user_friends);

        // IKONKI USERA
        var comment_author_options = $('<div/>').addClass('comment_author_options').html(gallery);
        pm.appendTo(comment_author_options);
        friends.appendTo(comment_author_options);

        // AUTOR
        var comment_author_link = $('<a/>').attr('href','/profile/'+comment_data.user_name).text(comment_data.user_name);
        var comment_author = $('<div/>').attr('class','comment_author').html(comment_author_link);

        // COMMENT DATE
        var comment_date = $('<div/>').attr('class','comment_date').text(comment_data.comment_date);

        // REMOVE COMMENT
        var delete_link = $('<a/>').attr({'class' : 'iconed delete_mini delete', 'title' : 'Usuń', 'href' : '/profile/' + profile_user_name + '/comment_delete/' + comment_data.comment_id }).text('Usuń');
        var delete_div = $('<div/>').attr('class','comment_options').html(delete_link);

        // BOOBLE
        var booble_template = $.template('<div class="comment_content"><div class="bubble"><div class="bubble_hl"><div class="bubble_hr"><div class="bubble_h"></div></div></div>' +
            '<div class="bubble_c"><div class="bubble_ci">${comment}</div></div>' +
            '<div class="bubble_bl"><div class="bubble_br"><div class="bubble_b"></div></div></div></div></div>');

        // CALY COMMENT
        var li = $('<li/>').html(avatar_link).append(comment_author_options).append(comment_author).append(comment_date).append(delete_div).append(booble_template, {comment: comment_data.comment_text});

        return li;
    }

});