var galleryItemsCount;
    var visiblePage = 0;
    var galleryItemsPerPage = 1;
    var galleryPagesToPreload = 0;
    var galleryPagesOutToUnload = 0;
    var galleryLoadingImgUrl = "";
    var galleryMaxPage;
    var galleryItemIds;
    var visibleItemIds = new Array();
    var galleryLabel;
    var galleryLabelPlural;
    var selectedPageNumStyle = "";

    // Initializes the gallery
    //     itemIds - Initial set of item ids
    //     itemsPerPage - # of items to show per page
    //     pagesToPreload - # of pages to preload when gallery:item is used (otherwise use 0)
    //     label - Label of content (e.g. "Image")
    //     labelPlural - Plural label of content (e.g. "Images")


    function initGallery(itemIds, itemsPerPage, label, labelPlural) {
      galleryItemsPerPage = itemsPerPage;
      galleryLabel = label;
      galleryLabelPlural = labelPlural;
      setItems(itemIds);
    }

    function setSelectedPageNumStyle(style) {
      selectedPageNumStyle = style;
    }

    // Initialize images values (only relevant if gallery:item tag is used
    function initImages(pagesToPreload, pagesOutToUnload, loadingImgUrl) {
      galleryPagesToPreload = pagesToPreload;
      galleryPagesOutToUnload = pagesOutToUnload;
      galleryLoadingImgUrl = loadingImgUrl;
    }

    function setItems(itemIds) {
      galleryItemIds = itemIds;
      galleryItemsCount = galleryItemIds.length;
      galleryMaxPage = Math.floor((galleryItemsCount - 1) / galleryItemsPerPage);
      setVisiblePage(0);

    }

    function gotoPage(page) {
      setVisiblePage(page);
      refreshPage();
    }

    function refreshPage() {
      displayPage();
      page.reloadAssets();
    }

    document.__clearers = new Array();


    function displayPage() {
      // BA CLEARER ADDITIONS
      var tmpClearer;
      var clearCounter = 0;
      // Hide every visible item
      for(var i = 0 ; i < visibleItemIds.length ; ++i) {
        var id = "gallery_" + visibleItemIds[i];
        document.getElementById(id).style.display = 'none';
      }

      // BA CLEARER ADDITIONS
      for (var i = 0; i<document.__clearers.length; i++) {
        document.__clearers[i].parentNode.removeChild(document.__clearers[i]);
      }
      document.__clearers = new Array();

      visibleItemIds = new Array();

      // Set images from the current page of our current pallette of items to visible

      for(var i=0 ; i < galleryItemsCount ; ++i){
        var id = "gallery_" + galleryItemIds[i];
        if (i >= (visiblePage * galleryItemsPerPage) && i < ((visiblePage+1) * galleryItemsPerPage)) {
          document.getElementById(id).style.display = 'block';
          visibleItemIds.push(galleryItemIds[i]);

          // BA CLEARER ADDITIONS
          clearCounter ++;
          if (clearCounter == 4 || clearCounter == 7){
            tmpClearer = document.createElement('div');
            document.__clearers.push(tmpClearer);
            tmpClearer.className = "tmpClearer";
            tmpClearer.innerHTML = "&nbsp;";
            n = document.getElementById(id);
            n.parentNode.insertBefore(tmpClearer, n);
          }

          else if (clearCounter == galleryItemsPerPage) {
            tmpClearer = document.createElement('div');
            document.__clearers.push(tmpClearer);
            tmpClearer.className = "tmpClearer";
            tmpClearer.innerHTML = "&nbsp;";
            n = document.getElementById(id);
            n.parentNode.appendChild(tmpClearer);
          }

        }
      }


      // Set 'Previous' link visibility
      if (visiblePage < 1)
        setSpanDisplayByTitle("gallery_prevLink", "none");
      else
        setSpanDisplayByTitle("gallery_prevLink", "");

      // Set 'Next' link visibility
      if (visiblePage == galleryMaxPage)
        setSpanDisplayByTitle("gallery_nextLink", "none");
      else
        setSpanDisplayByTitle("gallery_nextLink", "");

      // Set images description
      var startItem = (visiblePage * galleryItemsPerPage) + 1;
      var endItem = Math.min((visiblePage + 1) * galleryItemsPerPage, galleryItemsCount);
      var description;
      if (galleryItemsCount == 0)
        description = "No " + galleryLabelPlural;
      else if (galleryItemsCount == 1)
        description = galleryLabel + " 1 of 1";
      else {
        if (galleryItemsPerPage == 1)
          description = galleryLabel + " " + startItem + " of " + galleryItemsCount;
        else
          description = galleryLabelPlural + " " + startItem + "-" + endItem + " of " + galleryItemsCount;
      }
      setSpanHTMLByTitle("gallery_label", description);

      // Set pagination
      setSpanHTMLByTitle("gallery_pagination", getPagingHTML());

      // Preload the images
      preloadImages();
    }

    function getPagingHTML() {
      if (galleryItemsCount == 0)
        return "";

      var html = "Page: ";

      // Fist page
      if (visiblePage == 0)
        html += "<span class=\"" + selectedPageNumStyle + "\">1</span>\n";
      else
        html += "<a href=\"javascript:gotoPage(0);\">1</a>\n";

      // Ellipsis?
      if (visiblePage > 5)
        html += "&hellip;\n";

      // Middle pages
      var startPage = 0;
      if (visiblePage < (galleryMaxPage - 3))
        startPage = Math.max(1, visiblePage - 4)
      else
        startPage = Math.max(1, galleryMaxPage - 8);

      var endPage = galleryMaxPage;
      if (visiblePage > 3)
        endPage = Math.min((galleryMaxPage - 1), visiblePage + 4);
      else
        endPage = Math.min((galleryMaxPage - 1), 8);

      for(var i = startPage ; i <= endPage ; ++i) {
        if (visiblePage == i)
          html += "<span class=\"" + selectedPageNumStyle + "\">" + (i + 1) + "</span>\n";
        else
          html += "<a href=\"javascript:gotoPage(" + i + ");\">" + (i + 1) + "</a>\n";
      }

      // Ellipses again?
      if (visiblePage < (galleryMaxPage - 5))
        html += "&hellip;\n";

      // Last page
      if (galleryMaxPage > 0) {
        if (visiblePage == galleryMaxPage)
          html += "<span class=\"" + selectedPageNumStyle + "\">" + (galleryMaxPage + 1) + "</span>\n";
        else
          html += "<a href=\"javascript:gotoPage(" + galleryMaxPage + ");\">" + (galleryMaxPage + 1) + "</a>\n";
      }

      return html;
    }

    function setSpanDisplayByTitle(spanTitle, displayStyle) {
      var elements = document.getElementsByTagName('span');
      for(var i=0 ; i < elements.length ; ++i) {
        if (elements[i].title == spanTitle) {
          elements[i].style.display = displayStyle;
        }
      }
    }

    function setSpanHTMLByTitle(spanTitle, innerHTML) {
      var elements = document.getElementsByTagName('span');
      for(var i=0 ; i < elements.length ; ++i) {
        if (elements[i].title == spanTitle) {
          elements[i].innerHTML = innerHTML;
        }
      }
    }

    function prevLink() {
      setVisiblePage(visiblePage-1);
      refreshPage();
      if (galleryPagesOutToUnload > 0)
        unloadImagePage(visiblePage + galleryPagesOutToUnload);
    }

    function nextLink() {
      setVisiblePage(visiblePage+1);
      refreshPage();
      if (galleryPagesOutToUnload > 0)
        unloadImagePage(visiblePage - galleryPagesOutToUnload);
    }

    function setVisiblePage(page) {
      page = Math.max(0, page);
      page = Math.min(galleryMaxPage, page);
      visiblePage = page;
      var element = document.getElementById('gallery_page');
      if (element != null)
        element.value = page;
    }

    function setChecks(checkboxes, checked) {
      if (!isArray(checkboxes)) {
        if (contains(visibleItemIds, checkboxes.value))
          checkboxes.checked = checked;
        else
          checkboxes.checked = false;
      }
      for(var i = 0; i < checkboxes.length ; ++i) {
        // Do not set items that aren't visible
        if (contains(visibleItemIds, checkboxes[i].value))
          checkboxes[i].checked = checked;
        else
          checkboxes[i].checked = false;
      }
    }

    function contains(array, value) {
      for(var i = 0; i < array.length; ++i) {
        if (array[i] == value)
          return true;
      }
      return false;
    }

    function setCheckAlls(checked) {
      var checkalls = document.getElementsByName('gallery_checkall');
      for(var i = 0 ; i < checkalls.length ; ++i) {
        checkalls[i].checked = checked;
      }
    }

    function uncheckAll(galleryForm) {
      setCheckAlls(false);
      document.getElementById('gallery_checkall').checked = false;
      //setChecks(galleryForm.selectedIds, false);
    }

    function preloadImages() {
      // Set images from the current page and the visible page "window" to visible
      for(var i=0 ; i < galleryItemsCount ; ++i){
        if (i >= ((visiblePage - galleryPagesToPreload) * galleryItemsPerPage)
            && i < ((visiblePage + galleryPagesToPreload + 1) * galleryItemsPerPage)) {
          var img = document.getElementById("gallery_img_" + galleryItemIds[i]);
          if (img != null) {
            img.src = img.name;
          }


        }
      }
    }

    function unloadImagePage(page) {
      if (page < 0 || page > galleryMaxPage)
        return;
      // Set images from the current page of our current pallette of clips to visible
      for(var i=0 ; i < galleryItemsCount ; ++i){
        if (i >= (page * galleryItemsPerPage) && i < ((page + 1) * galleryItemsPerPage)) {
          var img = document.getElementById("gallery_img_" + galleryItemIds[i])
          if (img != null)
            img.src = galleryLoadingImgUrl;
        }
      }
    }

    function isArray(a) {
        return (a && typeof a == 'object') && a.constructor == Array;
    }