
;(function(factory) {
  if (typeof define === "function" && define.amd) {
    define(factory);
  } else {
    window.paging = factory();
  }
}(function() {

  var paging = function(ele, o) {

    var self = document.querySelector(ele);
    var options = {
      total: 1,
      pagesize: 10,
      current: 1,
      showitem: 5, // if 6, it will show 7 items.
      debug: false,
      onselect: function() {}
    };

    // Extend
    for (var key in o) options[key] = o[key];

    (typeof options.total === "string") && (options.total = parseInt(options.total));
    (typeof options.current === "string") && (options.current = parseInt(options.current));


    var buildPaging = function() {
      var
        totalPage = Math.ceil(options.total / options.pagesize),
        halfitem  = Math.floor(options.showitem / 2),
        startPage = (options.current - halfitem) > 1 ? (options.current - halfitem) : 1,
        endPage   = (options.current + halfitem) > totalPage ? totalPage : (options.current + halfitem),
        html      = "",
        pre       = (options.current - 1) > 1 ? (options.current - 1) : 1,
        next      = (options.current + 1) > totalPage ? totalPage : (options.current + 1);


      if (startPage === 1) {
        totalPage > (startPage + options.showitem) ? (endPage = startPage + options.showitem - 1) : (endPage = totalPage);
      }

      if (endPage === totalPage) {
        (totalPage - options.showitem) <= 0 ? (startPage = 1) : (startPage = totalPage - options.showitem + 1);
      }

      html += "<ul>"
      html += "<li class='first-child' data-num='1'>&lt;&lt;</li><li data-num='" + pre + "'>&lt;</li>";
      for (var i = startPage; i <= endPage; i = i + 1) {
        if (i === options.current)
          html += "<li class='active' data-num='" + i + "'>" + i + "</li>";
        else
          html += "<li data-num='" + i + "'>" + i + "</li>";
      }
      html += "<li data-num='" + next + "'>&gt;</li><li class='last-child' data-num='" + totalPage + "'>&gt;&gt;</li>";
      html += "</ul>";

      // Replace html.
      self.innerHTML = html;

      // Disabled some element if its equal current pagenum.
      var lis = self.querySelectorAll('li');
      for (var i = 0, max = lis.length; i < max; i++) {
        if (+lis[i].getAttribute('data-num') === options.current) {
          lis[i].classList.add('disabled');
        }
      }
    }


    // Bind click for each li element.
    self.addEventListener('click', function(e) {

      var num = +e.target.getAttribute('data-num')
      if (num !== options.current)
        options.onselect(num);

    })

    // Init paging
    buildPaging();

    return {
      select: function(n) {
        options.current = n;
        buildPaging();
      },
      reBuild: function(total, cur) {
        options.total = total;
        options.current = cur;
        buildPaging();
      }
    }
  }

  return paging;
}));

@@ -1516,24 +1516,61 @@
 );%0A      %7D%0A%0A
+      if (startPage %3C= endPage) %7B%0A%0A  
       html +
@@ -1578,16 +1578,18 @@
  %22%3Cul%3E%22%0A
+  
       ht
@@ -1682,32 +1682,34 @@
 t;%3C/li%3E%22;%0A      
+ 
+ 
 for (var i = sta
@@ -1747,24 +1747,26 @@
 ) %7B%0A        
+  
 if (i === op
@@ -1782,32 +1782,34 @@
 rent)%0A          
+ 
+ 
 html += %22%3Cli cla
@@ -1866,16 +1866,18 @@
         
+  
 else%0A   
@@ -1875,32 +1875,34 @@
  else%0A          
+ 
+ 
 html += %22%3Cli dat
@@ -1938,26 +1938,30 @@
 li%3E%22;%0A      
-%7D%0A
+  %7D%0A  
       html +
@@ -2070,24 +2070,26 @@
 li%3E%22;%0A      
+  
 html += %22%3C/u
@@ -2094,16 +2094,25 @@
 /ul%3E%22;%0A%0A
+      %7D%0A%0A
       //

fix bug