/*
 *
 * camp sample
 *
 * Customized for SINAP April Fool 2010
 *
 */

CAMP = {
	paginationRange : 2
}

jQuery(function($){
  //YouTube (requered youtube_info.js)
  $('.mod_movie .rating').addClass('r'+youtube_info.rating);
  $('.mod_movie .count').append('<span class="youtube_count">' + youtube_info.view_count+ '</span>');
 
  //comment 
  var limit = 5;
  var pui, pui2;
  var cv = commentView({
    limit: limit, //1ページの表示件数
    onload: function(json){
      if (!pui) {
        pui = paginationUI({
          limit: limit,
          count: json.count,
          onPageLinkClick: function(pageNum, callback){
            callback = (typeof callback === 'function') ? callback : function(){};
            cv.refresh((pageNum - 1) * limit, callback);
            pui2.refresh(pageNum);
          }
        });
        pui2 = paginationUI({
          limit: limit,
          parentSelector: '#comment_pagination2',
          count: json.count,
          onPageLinkClick: function(pageNum, callback){
            callback = (typeof callback === 'function') ? callback : function(){};
            cv.refresh((pageNum - 1) * limit, callback);
            pui.refresh(pageNum);
          }
        });
        pui.refresh(1);
        pui2.refresh(1);
      }
    }
  });
  cv.refresh(0);

  /**
   * コメントの取得
   */
  function commentView(options) {
    var o = {};
    var defaultConf = {
      limit: 5, //1ページの表示件数
      parentSelector: '#comment_view',
      onload: function(){}
    };
    var conf = (options) ? $.extend(defaultConf, options) : defaultConf;
    var createView = function(comments) {
        var commentTable = $('<table cellspacing="0">');
        $.each(comments, function(i){
          var body = (this.url) ? '<a href="' + this.url +'">' + this.body + '</a>' : this.body;
         commentTable.append('<tr><td class="name">'+ this.authorName +'<br /><img src="' + staticWebPath + '/camp/img/cmt_' + this.type + '.png" alt="' + this.type + '" class="icon" /></td><td>' + body + '</td></tr>');
        });
        return commentTable;
    }
    var oldCommentTable;
    
    o.refresh = function(offset, callback){
      var parent = $(conf.parentSelector);
      var loader = $('<div class="loading"></div>');
      parent.append(loader);
      loader.hide().fadeIn(500);

      callback = (typeof callback === 'function') ? callback : function(){};
      //console.log('cv.refresh:'+offset);
      var uri = 'http://aprilfool.sinap.jp/cgi-bin/mt/mt-comments.cgi';
      //uri = 'mock.json'; //for debug
      $.ajax({
        type: "GET",
        url: uri,
        data: '__mode=comment_listing&direction=descend&entry_id=11&limit='+conf.limit+'&offset='+offset,
        dataType: "json",
        success: function(json){
          var commentTable = createView(json.comments);
          //console.log(commentTable);
          if (oldCommentTable) oldCommentTable.remove();
          parent.prepend(commentTable);
          oldCommentTable = commentTable;
          conf.onload(json);
          callback();
          loader.remove();
        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
          if (console) console.log(textStatus);
        }
      })
//      $.getJSON(uri, function(json) {
//        console.log('aaaaaaaaaaaaaaaa');
//        var commentTable = createView(json.comments);
//        console.log(commentTable);
//        if (oldCommentTable) oldCommentTable.remove();
//        $('.mod_comment').prepend(commentTable);
//        oldCommentTable = commentTable;
//      });
    }
    return o;
  }

  /**
   * ページネーションのUI
   */
  function paginationUI(options){
    var o = {};
    var defaultConf = {
      limit: 5, //1ページの表示件数
      count: 0, //全アイテムの件数
      parentSelector: '#comment_pagination',
      onPageLinkClick: function(pageNum){}
    };
    var conf = (options) ? $.extend(defaultConf, options) : defaultConf;
    var page = Math.ceil(conf.count / conf.limit);
    var pui;
    var enabled = true;

    /**
     * 特定のページへのリンクをクリック
     */
    var onLinkClick = function(e){
      e.preventDefault();
      if (enabled) {
        var pageNum = Number($(this).attr('href'));
        conf.onPageLinkClick(pageNum, function(){
          enabled = true;
        });
        o.refresh(pageNum);
        o.currentPage = pageNum;
        enabled = false;
      }
    }
    /**
     * インターフェイスの見た目を作成
     */
    var createView = function(PageNum){
      var result;
      if (page <= 1) {
        result = null;
      } else {
        result = $('<div class="pagination"><ul></ul></div>');
        var ul = result.find('ul');
        if (page <= 10) {
          for (var i=1, li; i<=page; i++){
            li = (i === PageNum) ? '<li><span class="current">' + i + '</span></li>'
                                 : '<li><a href="' + i + '">' + i + '</a></li>';
            ul.append(li);
          }
        } else {
          var range = CAMP.paginationRange;//20100401

          var firstLink = (PageNum > 1 + range);
          var lastLink = (PageNum < page - range);
          var backLink = (1 !== PageNum);
          var nextLink = (page !== PageNum);
          if (!firstLink) {
            startNum = 1;
          } else if (!lastLink){
            startNum = page - (range * 2);
          } else {
            startNum = PageNum - range;
          }
          if (backLink) {
            result.append('<p class="back"><a href="' + (PageNum - 1) + '" class="uppercase">Back</a></p>');//20100401
          } else {
            result.append('<p class="back"><span class="uppercase">Back</span></p>');//20100401
          }
          if (firstLink) {
            ul.append('<li><a href="' + 1 + '">' + 1 + '</a></li>');
            if (startNum !== 2) ul.append('<li><span class="ellipsis">...</span></li>');
          }
          for (var i=startNum, li; i<=startNum + (range * 2); i++){
            li = (i === PageNum) ? '<li><span class="current">' + i + '</span></li>'
                                 : '<li><a href="' + i + '">' + i + '</a></li>';
            ul.append(li);
          }
          if (lastLink) {
            if (startNum !== page - (range * 2) - 1) ul.append('<li><span class="ellipsis">...</span></li>');//20100401
            ul.append('<li><a href="' + page + '">' + page + '</a></li>');
          }
          if (nextLink) {
            result.append('<p class="next"><a href="' + (PageNum + 1) + '" class="uppercase">Next</a></p>');//20100401
          } else {
            result.append('<p class="next"><span class="uppercase">Next</span></p>');
          }
        }
        result.find('a').click(onLinkClick);
      }
      return result;
    }
    /**
     * 見た目更新
     */
    o.refresh = function(PageNum){
      //console.log('refresh:'+PageNum);
      if (pui) pui.remove();
      pui = createView(PageNum);
      $(conf.parentSelector).append(pui);
      //console.log($(conf.parentSelector))
      return pui;
    };
    return o;
  }
    
  tab();
  function tab(options) {
    var c = $.extend({
      tabNavSelector:'#tab-nav ul',//20100401
      activeTabClass:'active'
    }, options);
    $(c.tabNavSelector).each(function(){
      var tabNavList = $(this).find('a[href^=#], area[href^=#]');
      var tabBodyList;
      tabNavList.each(function(){
        this.hrefdata = new Uri(this.getAttribute('href'));
        var selecter = '#'+this.hrefdata.fragment;
        if (tabBodyList) {
          tabBodyList = tabBodyList.add(selecter);
        } else {
          tabBodyList = $(selecter);
        }
        $(this).unbind('click');
        $(this).click(function(){
          tabNavList.removeClass(c.activeTabClass);
          $(this).addClass(c.activeTabClass);
          tabBodyList.hide();
          $(selecter).show();
          return false;
        });
      });
      tabBodyList.hide()
      tabNavList.filter(':first').trigger('click');
    });
  }
  function Uri(path){
    var self = this;
    this.originalPath = path;
    this.absolutePath = (function(){
      var e = document.createElement('span');
      e.innerHTML = '<a href="' + path + '" />';
      return e.firstChild.href;
    })();
    var fields = {'schema' : 2, 'username' : 5, 'password' : 6, 'host' : 7, 'path' : 9, 'query' : 10, 'fragment' : 11};
    var r = /^((\w+):)?(\/\/)?((\w+):?(\w+)?@)?([^\/\?:]+):?(\d+)?(\/?[^\?#]+)?\??([^#]+)?#?(\w*)/.exec(this.absolutePath);
    for (var field in fields) {
      this[field] = r[fields[field]];
    }
    this.querys = {};
    if(this.query){
      $.each(self.query.split('&'), function(){
        var a = this.split('=');
        if (a.length == 2) self.querys[a[0]] = a[1];
      });
    }
  }
});