var undefined;
var page;
if (page == undefined){ page = new Object(); }

if (!page.currentIndex)           { page.currentIndex = new Array; }
if (!page.hideBackNext)           { page.hideBackNext = new Array; }
if (!page.hideInactivePagination) { page.hideInactivePagination = new Array; }


// current -- the index of the leftmost item currently shown
// pagesize -- the number of items to show on each page
// skip -- how many items to cycle out if the arrow is clicked
// max -- the maximum index for this box (num items - 1)
page.getNewPrevArrow = 
function page_getNewPrevArrow(widget_index, pagesize, skip, current, max) {

   var prev_baseindex = current - skip;

   if (prev_baseindex >= 0) {
      var to_hide = "[";
      var j;
      for (j = prev_baseindex + pagesize; j < current + pagesize; j++) {
         to_hide += j;
         if (j < current + pagesize - 1) {
            to_hide += ",";
         }
      }
      to_hide += "]";
      var to_show = "[";
      for (j=prev_baseindex; j < prev_baseindex + skip; j++) {
         to_show += j;
         if (j < prev_baseindex + skip - 1) {
            to_show += ",";
         }
      }
      to_show += "]";

       return "<a class='spw_arrow" + widget_index + "' href='javascript:page.turnPage(" + widget_index + "," + pagesize + "," + skip + "," + to_hide + "," + to_show + "," + max + ")'>&larr;" + ((page.hideBackNext[widget_index] == undefined) ? "<br><span style='font-size: x-small; font-weight: normal;'>back</span>" : "") + "</a>";
   } else {
      if (page.hideInactivePagination[widget_index] == undefined) {
          return "<span class='spw_arrow" + widget_index + "' style='color: #cccccc;'>&larr;" + ((page.hideBackNext[widget_index] == undefined) ? "<br><span style='font-size: x-small; font-weight: normal;'>back</span>" : "") + "</span>";
      } else {
          return "";
      }
   }
};

page.getNewNextArrow = 
function page_getNewNextArrow(widget_index, pagesize, skip, current, max) {

   var next_baseindex = current + skip;

   if (next_baseindex < max) {
      var to_hide = "[";
      var j;
      for (j=current; j < current+skip && j <= max ; j++) {
         to_hide += j;
         if (j < current+skip-1 && j < max) {
            to_hide += ",";
         }
      }
      to_hide += "]";
      var to_show = "[";
      for (j=next_baseindex; 
           j < next_baseindex + pagesize && j < max ; 
           j++) {
         to_show += j;
         if (j < next_baseindex + pagesize - 1 && j > 0) {
            to_show += ",";
         }
      }
      to_show += "]";

      return "<a class='spw_arrow" + widget_index + "' href='javascript:page.turnPage(" + widget_index + "," + pagesize + "," + skip + "," + to_hide + "," + to_show + "," + max + ")'>&rarr;" + ((page.hideBackNext[widget_index] == undefined) ? "<br><span style='font-size: x-small; font-weight: normal;'>next</span>" : "") + "</a>";

   } else {
      if (page.hideInactivePagination[widget_index] == undefined) {
          return "<span class='spw_arrow" + widget_index + "' style='color: #cccccc;'>&rarr;" + ((page.hideBackNext[widget_index] == undefined) ? "<br><span style='font-size: x-small; font-weight: normal;'>next</span>": "") + "</span>";
      } else {
          return "";
      }
   }
};

page.refreshArrows = 
function page_refreshArrows(widget_index, span, pagesize, skip, current, max) {

   var prev_arrow_html = page.getNewPrevArrow(widget_index, pagesize, skip, current, max);
   var next_arrow_html = page.getNewNextArrow(widget_index, pagesize, skip, current, max);

   // If we got a single span, put both arrows there
   // If we got an array of two spans, put the left arrow in the first one
   // and the right arrow in the second one
   if (span[0] == undefined && span.prevArrow == undefined) {
      span.innerHTML = prev_arrow_html + "&nbsp;&nbsp;" + next_arrow_html;
   } else if (span[0] != undefined && span[1] != undefined) {
      span[0].innerHTML = prev_arrow_html;
      span[1].innerHTML = next_arrow_html;
   } else if (span.prevArrow != undefined && span.nextArrow != undefined) {
      span.prevArrow.innerHTML = prev_arrow_html;
      span.nextArrow.innerHTML = next_arrow_html;
   }

};

page.turnPage = 
function page_turnPage(widget_index, pagesize, skip, oldindex, newindex, max) {
   var i;
   var max_olditem = 0;
   for (i in oldindex) {
      var olditem = document.getElementById('sp_product' + widget_index + '_' + oldindex[i]);
      if (olditem != undefined) {
         olditem.className = 'spw_product' + widget_index + ' spw_hidden' + widget_index;
         if (oldindex[i] > max_olditem) {
            max_olditem = oldindex[i];
         }
      }
      var oldthumbnail = document.getElementById('sp_product_thumbnail' + widget_index + '_' + oldindex[i]);
      if (oldthumbnail != undefined) {
	 oldthumbnail.blur();
         oldthumbnail.style.border = '2px solid white';
      }
   }

   var min_newitem = 99999;
   for (i in newindex) {
      var newitem = document.getElementById('sp_product' + widget_index + '_' + newindex[i]);
      if (newitem != undefined) {
         newitem.className = 'spw_product' + widget_index;
         if (newindex[i] < min_newitem) {
            min_newitem = newindex[i];
         }
      }
      var newthumbnail = document.getElementById('sp_product_thumbnail' + widget_index + '_' + newindex[i]);
      if (newthumbnail != undefined) {
         newthumbnail.style.border = '2px solid yellow';
      }
   }

   page.currentIndex[widget_index] = min_newitem;

   var span_leftarrow = document.getElementById("sp_leftarrow" + widget_index);
   var span_rightarrow = document.getElementById("sp_rightarrow" + widget_index);
   var span;
   if (span_leftarrow != undefined && span_rightarrow != undefined) {
      span = [span_leftarrow, span_rightarrow];
   } else {
      span = document.getElementById("sp_arrows" + widget_index);
   }
   page.refreshArrows(widget_index, span, pagesize, skip, page.currentIndex[widget_index], max);
};