// ======================================
// = Highslide javascript configuration =
// ======================================
hs.graphicsDir            = '/images/highslide/';  // set the path to the required images
hs.showCredits            = false;                 // suppress the link to highslide
hs.align                  = 'center';             
hs.transitions            = ['fade', 'crossfade']; // the first transition is what happens when you click a link the second is what happens when you go between images in a gallery
hs.outlineType            = 'rounded-white';       // the look of the image outline
hs.fadeInOut              = true;                  
hs.allowMultipleInstances = false;                 // we only want one window at a time


// This function get executed after the image has been displayed.
// It is used to move an assosiated vertical scroll gallery to the same position as the image (on a buy page)
hs.Expander.prototype.onAfterExpand = function(expander) {
  // see if this link is inside of a slider
  var a = $(expander.a);
  if (a.up().className.match(/slider/)) {
    var slider       = a.up();
    var img          = a.down('img');
    var image_height = img.getHeight();
    var offset       = a.positionedOffset().top - image_height + a.getHeight();
    slider.setStyle({top: "-"+offset+ "px"});
  }
}

hs.onSetClickEvent = function ( sender, e ) {
   // set the onclick for the element, output the group name to the caption for debugging
   e.element.onclick = function () {
      return hs.expand(this, { 
               slideshowGroup: this.parentNode.className
             });
   }
   // return false to prevent the onclick being set once again
   return false;
}

// this sets up the small x that is used to close a window
// hs.registerOverlay({
//   overlayId: 'closebutton',
//   position: 'top right',
//   fade: 2
// });

hs.addSlideshow({
 slideshowGroup: 'gallery_slider',
 interval: 5000,
 repeat: true,
 useControls: true,
 fixedControls: false,
 overlayOptions: {
   opacity: .5,
   hideOnMouseOut: false,
   position: 'bottom right',
   hideOnMouseOut: true
 }
});

hs.addSlideshow({
 slideshowGroup: 'pics',
 interval: 5000,
 repeat: true,
 useControls: true,
 fixedControls: false,
 overlayOptions: {
   opacity: .5,
   hideOnMouseOut: false,
   position: 'bottom right',
   hideOnMouseOut: true
 }
});

hs.addSlideshow({
 slideshowGroup: 'square_pics',
 interval: 5000,
 repeat: true,
 useControls: true,
 fixedControls: false,
 overlayOptions: {
   opacity: .5,
   hideOnMouseOut: false,
   position: 'bottom right',
   hideOnMouseOut: true
 }
});