function urlGetImageNumber(urlNumber){
  var url = window.location.href;
  var qparts = url.split("#");
  if(qparts.length > 1) {
      var query = qparts[1];
      var vars = query.split("&");
      var value = "";
      for (i=0;i<vars.length;i++){
        var parts = vars[i].split("-");
        if (parts[0] == urlNumber){
          value = parts[1];
          break;
        }
      }
      value = unescape(value);
      value.replace(/\+/g," ");
      return value;
  }
  return 1;
}
function changeImgFromUrl(){
    var urlImgNumber = urlGetImageNumber("img");
    if(urlImgNumber){
        gallery.showImage(urlImgNumber);
        
        var prev = parseInt(gallery.currentImg)-1;
        if(prev < 1) prev = 1;
        var next = parseInt(gallery.currentImg)+1;
        var allPhotos = $('pagination').getElementsByTagName('li').length;
        if(next > allPhotos) next = allPhotos;
        $('prev').getElementsByTagName('a')[0].href = "#img-"+prev;
        $('next').getElementsByTagName('a')[0].href = "#img-"+next;
    }
}
function resizeGalleryHolder(imageNumber) {
    $('img-holder').style.paddingTop = '0px';
    $('img-holder').style.height = '423px';
    galleryImage = $('img-holder').getElementsByTagName('img')[imageNumber-1];
    imageHeight = galleryImage.offsetHeight;
    var imgHolder = $('img-holder').offsetHeight - 1;
    if(imageHeight < imgHolder) {
        var imageHolderTopPadding;
        var calcTopPadding;
        imageHolderTopPadding = imgHolder - imageHeight;
        calcTopPadding = Math.round(imageHolderTopPadding / 2);
        $('img-holder').style.paddingTop = calcTopPadding + 'px';
        $('img-holder').style.height = imgHolder - calcTopPadding + 'px';
    }
}
function resizeImgDescription(){
    var articleWrapper = document.getElementsByClassName('article-wrapper-no-border');
    var largestHeight = 0;
    for(var i=0; i < articleWrapper.length; i++) {
        currentHeight = articleWrapper[i].getHeight();
        if(currentHeight > largestHeight){
            largestHeight = currentHeight;
        }
    }
    
    $('img-description').style.height = largestHeight + 'px';
}
function Gallery(galleryId, imagesPerPage) {
    this.galleryId = galleryId;
    this.imagesPerPage = imagesPerPage;
    this.currentImg = 1;
    this.pages = 0;
    this.inited = false;
    this.showImages = function(from, to) {
        var elements = $(galleryId).getElementsByTagName('li');
        for (var i = 0; i < elements.length; i++) {
            if (i < from || i > to) {
                elements[i].style.display = 'none';
            }
            else {
                var imageTitle;
                var imageDescription;
                if(elements[i].getElementsByTagName('div').length != 0) {
                    imageTitle = elements[i].getElementsByTagName('div')[0];
                }
                
                elements[i].getElementsByTagName('img')[0].style.margin = "0px auto";
                elements[i].getElementsByTagName('img')[0].style.textAlign = "center";
                if(imageTitle != undefined) {
                    imageTitle.style.display = "none";
                    $('img-description').innerHTML = imageTitle.innerHTML;
                }else{
                    $('img-description').innerHTML = "";
                }
                elements[i].style.display = '';
            }            
        }
    }
    this.enableCss = function() {
        $('img-holder').style.borderTop = "1px solid #4d4d4d";
        $('gallery').style.background = "#000000";
        $('gallery').style.borderBottom = "1px solid #4d4d4d";
        $('gallery-nav').style.display = "block";
        $('img-holder').textAlign = "center";
    }
    this.removeJumpLinks = function(){
        var anchor = document.getElementsByClassName('jump-link');
        for (i=0; i < anchor.length; i++){
            anchor[i].parentNode.removeChild(anchor[i]);
        }
    }
    this.showImage = function(imgNumber) {
        if (! this.inited) {
            return;
        }
        var normalPageAnchor = $('pg'+this.currentImg);
        normalPageAnchor.className = 'pg-normal';
        this.currentImg = imgNumber;
        var newPageAnchor = $('pg'+this.currentImg);
        newPageAnchor.className = 'current';
        var from = (imgNumber - 1) * imagesPerPage;
        var to = from + imagesPerPage - 1;
        this.showImages(from, to);
        resizeGalleryHolder(this.currentImg);
    }
    this.init = function() {
        resizeImgDescription();
        this.enableCss();
        this.removeJumpLinks();
        var elements = $(galleryId).getElementsByTagName('li');
        var records = (elements.length); 
        this.pages = Math.ceil(records / imagesPerPage);
        this.inited = true;
        this.showPageNav("gallery", "gallery-nav");
        this.showImage(1);
    }
    this.next = function() {
        if (this.currentImg < this.pages) {
            this.showImage(parseInt(this.currentImg) + 1);
            $("next").getElementsByTagName('a')[0].href = "#img-" + this.currentImg;
        }
        else {
            this.showImage(1);
            $("next").getElementsByTagName('a')[0].href = "#img-1";
        }
    }
    this.prev = function() {
        if (this.currentImg > 1) {
            this.showImage(parseInt(this.currentImg) - 1);
            $("prev").getElementsByTagName('a')[0].href = "#img-" + this.currentImg;
        }
        else {
            this.showImage(this.pages);
            $("prev").getElementsByTagName('a')[0].href = "#img-" + this.pages;
        }
    }
    this.showPageNav = function(paginationName, positionId) {
        if (! this.inited) {
            return;
        }
        var element = $(positionId);
        var paginationHtml = "\n" + '<div id="prev"><a a href="#" onclick="' + paginationName + '.prev();">Previous</a></div>' + "\n" + '<ul id="pagination">';
        for (var page = 1; page <= this.pages; page++) {
                paginationHtml += "\n" + '<li id="pg' + page + '" onclick="' + paginationName + '.showImage(' + page + ');"><a href="#img-'+page+'">' + page + '</a></li>';
            }
        paginationHtml += "\n" + '</ul>' + "\n" + '<div id="next"><a href="#" onclick="'+ paginationName +'.next();">Next</a></div></ul>' + "\n";
        element.innerHTML = paginationHtml;
    }
}
var gallery;
onloadHandlers[onloadHandlers.length] = 'gallery = new Gallery("img-holder", 1); gallery.init();';
onloadHandlers[onloadHandlers.length] = 'changeImgFromUrl();';