function slider(sliderCont, sliderList, sliderPaginator, sliderOptions) {
  var sliderContEl = $(sliderCont),
      orientation = sliderOptions.orientation,
      maxListItems = sliderOptions.maxListItems,
      interval = sliderOptions.interval,
      fxOption = sliderOptions.fxOption;

  if($$('#'+sliderList+' li').length > maxListItems) {
    var listSlider = new S2.UI.Carousel(sliderCont, {orientation: orientation, paginator: sliderPaginator, cycle: 'loop', fxOption: fxOption});
    var sliderPE = null;
    function pauseSlider(aEvent) {
      Event.stop(aEvent);
      Event.stopObserving(sliderContEl, 'mouseenter', pauseSlider);
      sliderPE.stop();
      sliderPE = null;
      Event.observe(sliderContEl, 'mouseleave', playSlider);
    }
    function playSlider(aEvent) {
      if(aEvent != null) {
        Event.stop(aEvent);
        Event.stopObserving(sliderContEl, 'mouseleave', playSlider);
	  }
      sliderPE = new PeriodicalExecuter(function(pe) {listSlider.scrollNext();}, interval);
      Event.observe(sliderContEl, 'mouseenter', pauseSlider);
    }
    playSlider(null);
  }
}
document.observe('dom:loaded', function() {
  slider('photos', 'photos-list', 'photos-paginate', {
    orientation: 'horizontal', maxListItems: 3, interval: 5,
    fxOption: {transition: 'easeOutQuad', duration: 0.5}
  });
  slider('banners', 'banners-list', 'banners-paginate', {
    orientation: 'vertical', maxListItems: 5, interval: 10,
    fxOption: {transition: 'easeOutQuad', duration: 5}
  });
  if($('lightbox') != undefined) {
    Element.appear($('lightbox-close'), {duration: 0.5});
    Element.appear($('lightbox'), {duration: 0.5});
    $$('#lightbox .active')[0].scrollIntoView();
    Element.observe(window, 'beforeunload', function() {
      Element.fade($('lightbox-close'), {duration: 0.5});
      Element.fade($('lightbox'), {duration: 0.5});
    });
    $$('#lightbox ul li a').each(function(el) {
      Event.observe(el, 'click', function(event) {
        var activeImg = $$('#lightbox .active')[0], 
            img = el.down('img');
        Event.stop(event);
        if(!img.hasClassName('active')) {
          Event.stopObserving(img, 'mouseout');
          activeImg.removeClassName('active');
          img.addClassName('active');
          img.scrollIntoView();

          Element.fade($$('#lightbox p')[0], {duration: 1, after: function() {
            new Ajax.Updater('lightbox-big-image', $$('#lightbox .active')[0].parentNode.readAttribute('href'), {
              onComplete: function() {
                Element.appear($$('#lightbox p')[0], {duration: 0.5});
                //history.pushState({}, '', $$('#lightbox .active')[0].parentNode.readAttribute('href'));
              }
            });
          }});
		}

      });
    });
  }
});

function loadGoogleMap(mapCanvas) {
  var infowindow = new google.maps.InfoWindow({
    content: '<p style="color: #000; width: 200px;"><strong>Dorpshuis "De Nije Warf"</strong><br />'+
             'Foarwei 31ª 9113 PA Wâlterswâld<br />'+
             //'<a href="mailto:andrieskoning@nijewarf.nl">andrieskoning@nijewarf.nl</a><br />'+
			 //'<a href="mailto:info@nijewarf.nl">info@nijewarf.nl</a><br />'+
             '<strong>0511 42 19 87</strong> (kantoor uren)</p>'
  });
  var latLng = new google.maps.LatLng(53.291483,6.031467);
  var options = {
    zoom: 15,
    center: latLng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(mapCanvas, options);

  var marker = new google.maps.Marker({
    position: latLng, 
    map: map, 
    title: "Dorpshuis De Nije Warf"
  });

  //google.maps.event.addListener(marker, 'click', function() {
  setTimeout(function() {
    infowindow.open(map, marker);
  }, 500);
  //});
}
document.observe('dom:loaded', function() {
  var mapCanvas = $('mapCanvas');
  if(mapCanvas != undefined) {
    loadGoogleMap(mapCanvas);
  }
});

function ajaxLink(container) {
  container.observe('click', function(event) {
      var el = event.element();
      if(el.hasClassName('ajaxLink')) {
        event.preventDefault();
        new Ajax.Updater(container, el.readAttribute('href'), {
          onComplete: function() {}
        });
      }
  });
}
document.observe('dom:loaded', function(){ajaxLink($('content'));});

function preloadImages() {
  var url = location.href+'.json';

  new Ajax.Request(url, {
    method: 'get',
    onSuccess: function(response) {
      if(response.getHeader('Content-Type') == 'application/json') {
        var images = response.responseText.evalJSON();
        var preload_img = [];
        images.img.each(function(img_url, i) {
          preload_img[i] = new Image();
          preload_img[i].src = 'img/'+img_url;
        });
      }
    }
  });
}
Event.observe(window, 'load', preloadImages);

