

window.addEvent('domready', function(e) {
  // Add hover effect to prev/next clickable areas
  ['previous','next'].each(function(name) {
    if($('photo-' + name + '-link')) {
      $('photo-hover-' + name).setStyles({display:'block', opacity: 0}).set('tween', {duration:140});
      // Apply hover trigger to both the image map and the arrow "button" 
      $$($('photo-' + name + '-link'), '#photo-hover-' + name + ' a').addEvent('mouseover', function(e) {
        $('photo-hover-' + name).fade('in');

        // Store global 'hovered' state in relevant map area
        $('photo-hover-' + name).store('hovered', true);
      });
      $$($('photo-' + name + '-link'), '#photo-hover-' + name + ' a').addEvent('mouseout', function(e) {

        // Delay hiding arrow because focus may simply be changing to arrow button (or from button to map area)
        setTimeout(fadeOutClosure(name), 100);

        // Register change to hover state
        $('photo-hover-' + name).store('hovered', false);
      });

    }
  });

  // Set target=_blank for all rel='external' links 
  $$('a[rel=external]').each(function(el) {
    el.setProperty('target', '_blank');
  });

  // Preload next images
  if(typeof preload_photo_urls != 'undefined') {
    preload_photo_urls.each(function(url) {
      var img = new Element('img');
      img.setProperty('src',url);
      img.setStyle('display','none');
      document.body.adopt(img);
    });
  }
});

// Returns a function that hides the named arrow
function fadeOutClosure(name) {
  return function() {
    // If global hover state TRUE, mouse must have re-activated the button
    if(!$('photo-hover-' + name).retrieve('hovered')) {
      $('photo-hover-' + name).fade('out');
    }
  };
}

