var prevHTML = '<a title="Ankstesnis" id="com_p_left" class="left"><span>Ankstesnis</span></a>';
var nextHTML = '<a title="Kitas" id="com_p_right" class="right"><span>Kitas</span></a>';

var totalPages = 0;
var currentPage = 0;

function getComments(page)
{
    var vkey = $('#vkey').val();
    $('#loadingComments').css('display','block');
    $.getJSON('/Videos/getComments/'+vkey+'/'+page,{}, function(json){
      $('#loadingComments').css('display','none');
      totalPages = json.totalPages;
      currentPage = json.currentPage;
      var comments = json.comments;
      if (totalPages == 0)
      {
        $('#commentsContainer').html('');
      } else {
        $('#commentsH1').css('display','block');
        if (totalPages > 1)
        {

        $('#pagination').css('display','block');
        $('#pagination').html('');
        $('#pagination').append(prevHTML);
        if (currentPage != 0)
        {
          $('#com_p_left').attr('rel',currentPage);
          $('#com_p_left').click(function(){
            getComments(this.rel);
          });
        } else {
          $('#com_p_left').css('cursor','default');
        };
        var startP = currentPage - 2;
        var endP = currentPage + 2;
        if (startP < 0)
          {
            startP = 0;
            endP = startP + 5;
          }
        if (endP > totalPages - 1)
          {
            endP = totalPages - 1;
            startP = endP - 5;
            if (startP < 0) startP = 0;
          };
        if (currentPage - startP >= 2 && startP != 0)
        {

          var page = document.createElement('a');
          page.innerHTML = 1;
          page.rel = (0);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination').get(0).appendChild(page);

          var page = document.createElement('a');
          page.innerHTML = '...';
          page.rel = (currentPage - startP - 2);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination').get(0).appendChild(page);
        };

        for (i=startP;i<endP+1;i++)
        {
          var page = document.createElement('a');
          page.innerHTML = (i+1);
          if (i == currentPage) page.className = 'active';
          page.rel = (i+1);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination').get(0).appendChild(page);
        };


        if (currentPage + 3 < totalPages)
        {

          var page = document.createElement('a');
          page.innerHTML = '...';
          page.rel = (currentPage + 3);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination').get(0).appendChild(page);



          var page = document.createElement('a');
          page.innerHTML = totalPages;
          page.rel = (totalPages);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination').get(0).appendChild(page);
        };

          $('#pagination').append(nextHTML);
          if (currentPage < totalPages)
          {
            $('#com_p_right').attr('rel',currentPage + 2);
            $('#com_p_right').click(function(){
              getComments(this.rel);
            });
          } else {
            $('#com_p_right').css('cursor','default');
          };
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          
          

        $('#pagination2').css('display','block');
        $('#pagination2').html('');
        $('#pagination2').append(prevHTML);
        if (currentPage != 0)
        {
          $('#com_p_left').attr('rel',currentPage);
          $('#com_p_left').click(function(){
            getComments(this.rel);
          });
        } else {
          $('#com_p_left').css('cursor','default');
        };
        var startP = currentPage - 2;
        var endP = currentPage + 2;
        if (startP < 0)
          {
            startP = 0;
            endP = startP + 5;
          }
        if (endP > totalPages - 1)
          {
            endP = totalPages - 1;
            startP = endP - 5;
            if (startP < 0) startP = 0;
          };
        if (currentPage - startP >= 2 && startP != 0)
        {

          var page = document.createElement('a');
          page.innerHTML = 1;
          page.rel = (0);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination2').get(0).appendChild(page);

          var page = document.createElement('a');
          page.innerHTML = '...';
          page.rel = (currentPage - startP - 2);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination2').get(0).appendChild(page);
        };

        for (i=startP;i<endP+1;i++)
        {
          var page = document.createElement('a');
          page.innerHTML = (i+1);
          if (i == currentPage) page.className = 'active';
          page.rel = (i+1);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination2').get(0).appendChild(page);
        };


        if (currentPage + 3 < totalPages)
        {

          var page = document.createElement('a');
          page.innerHTML = '...';
          page.rel = (currentPage + 3);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination2').get(0).appendChild(page);



          var page = document.createElement('a');
          page.innerHTML = totalPages;
          page.rel = (totalPages);
          page.onclick = function () {
            getComments(this.rel);
          };
          $('#pagination2').get(0).appendChild(page);
        };

          $('#pagination2').append(nextHTML);
          if (currentPage < totalPages)
          {
            $('#com_p_right').attr('rel',currentPage + 2);
            $('#com_p_right').click(function(){
              getComments(this.rel);
            });
          } else {
            $('#com_p_right').css('cursor','default');
          };
        
        
        
        
        };

        $('#commentsContainer').html('')
        for (i=0;i<comments.length;i++)
        {
            var div = document.createElement('div');
            var img = document.createElement('img');
            var comment = comments[i];
            img.width = 80;
            img.height = 80;
            img.alt = comment.path;
            img.title = comment.username;
            if (comment.avatar!='0')
            {
            img.src = '/Uploads/Users/'+comment.dir + comment.path + '_m.jpg?'+comment.avatar;
            } else {
            img.src = '/pimg/Site/defaultAvatar.gif';
            };
            img.className = 'commentAvatar';
            var a = document.createElement('a');
            a.href = '/bendruomene/profilis/'+comment.path;
            a.appendChild(img)
            div.appendChild(a);
            div.className = 'comment';
            var dateDiv = document.createElement('div');
            dateDiv.className = 'date';
            dateDiv.innerHTML = comment.date;
            div.appendChild(dateDiv);
            
            var commenter = document.createElement('a');
            commenter.className = 'commenter';
            commenter.href = '/bendruomene/profilis/'+comment.path
            commenter.innerHTML = comment.username;
            div.appendChild(commenter);
            
            var commentDiv = document.createElement('div');
            commentDiv.className = 'message';
            commentDiv.innerHTML = comment.comment;
            div.appendChild(commentDiv);
          $('#commentsContainer').get(0).appendChild(div);
        }
      };
    });
}

$(document).ready(function(){
  getComments(0)
});
