////////////////////////////////////////////////////////////////////////////
//
//  Script: Project Paging
//  Version: 3.2
//  Author: Craig Nelson / Classic Labs
//
//  Features: 
//    1. basic paging
//    2. template html
//    3. ability to include truncation filter within html
//       template tags. ex: {projectTitle-t,25} (-t 'flag', 25 'length')
//       This was added so project title truncating can still be done and
//       complete project titles can be show in title tags for better
//       title descriptions on hover. Note: with this method liquid should
//       no longer truncate project titles. Make sure to remove any  
//       truncate filters where applicable in liquid output.
//

  var Ascribe = Ascribe || {};
  
  Ascribe.Paging = function (config) {
    // scope adjustment
    var that = this;
    
    // data
    this.projects = config.projects;
    
    // general configs
    this.pagesOutput = '';
    this.limit = config.projectsPerPage || 12; // number of results to display per page
    
    // ids
    this.pagesOutputID = config.pagesOutputID || 'pages-container';
    this.projectsOutputID = config.projectsOutputID || 'projects-container';
    
    // html
    this.htmlOpeningTag = config.htmlOpeningTag || '<ul id="projects" class="portfolio">';
    this.htmlTemplate = config.htmlTemplate || 
    '<li>' +
      '<a href="{projectPath}" title="View {projectTitle} Project"><img src="{projectThumbnailPath}" alt="" /></a>' +
      '<h3>{projectTitle}</h3>' +
    '</li>';
    this.htmlClosingTag = config.htmlClosingTag || '</ul><!-- #projects -->';
    
    // methods
    this.projectPaging = function (page) {
      var projectsOutput = '';
      var total = this.projects.length;
      var limit = this.limit; // number of results to display per page
      var page = page || 1;
      var pages = Math.ceil(total / limit);
      var offset = (page * limit - limit);
      var set = limit + offset;
      if (set > total) {
        set = total; // so the last iteration of our forloop will be set correctly
      }

      // check value of pagesOutput so we only write the pages list once
      // check if total > limit so we only show paging if there is more than one page
      if (this.pagesOutput == '' && total > limit) {
        this.pagesOutput = '<h5>Pages &#187;</h5>';
        this.pagesOutput += '<ul id="pages">';
        for (var i=1; i<pages + 1; i++) {
          this.pagesOutput += '<li><a href="#">' + [i] + '</a></li>';
        }
        this.pagesOutput += '</ul><!-- #pages -->';
        $(this.pagesOutputID).style.display = 'block';
        $(this.pagesOutputID).update(this.pagesOutput);

        // setup events for pages list
        var elements = $$('#pages li a');
        for (var x=0; x<elements.length; x++) {
          if ([x] == 0) {
            elements[x].className = 'active'; // set first page to active when script is first run
          }
          Event.observe(elements[x], 'click', function (event) {
            for (var y=0; y<elements.length; y++) {
              elements[y].className = '';
            }
            this.className = 'active';
            this.blur();
            that.projectPaging(this.innerHTML);
            event.preventDefault();
          });
        }
      }
      this.projectsOutput = this.projectsHTMLOutput(offset, set, this.projects);
      $(this.projectsOutputID).update(this.projectsOutput);
    }; // projectPaging()
    
    this.projectsHTMLOutput = function (offset, set, aProjects) {
      output = this.htmlOpeningTag;
      for (var i=offset; i<set; i++) {
        output += this.htmlTemplate.supplant(aProjects[i]);
      }
      output += this.htmlClosingTag;
      return output;
    }; // projectsHTMLOutput()
    
    this.projectPaging(); // initial paging
  }; // constructor
  
  String.prototype.truncate = function (len) {
    return (this.length > len) ? this.substr(0, len) + "..." : String(this);
  };
  
  String.prototype.supplant = function (o) {
    return this.replace(/{([^{}]*)}/g, function (match, submatch, offset, orig) {
      if (submatch.match(/-t/g)) {
        var trunLen = submatch.match(/\d+$/);
        submatch = submatch.replace(/-t,\d+$/, "");
        var r = o[submatch].truncate(Number(trunLen));
      }
      else {
        var r = o[submatch];
      }
      return typeof r === 'string' ? r : match;
    });
  };