function hb_h(obj, offset) {
   obj.parentNode.style.backgroundPosition='center '+(offset-30)+'px';
}

function hb_o(obj, offset) {
   obj.parentNode.style.backgroundPosition='center '+offset+'px';  
}

function sb_h(obj, offset) {
   obj.parentNode.style.backgroundPosition='center '+(offset-15)+'px';
}

function sb_o(obj, offset) {
   obj.parentNode.style.backgroundPosition='center '+offset+'px';  
}


// 
// FlickrSets Class.
// Adds behavior to flickr set links
// 

FlickrSets = Class.create();
FlickrSets.prototype = {

  initialize: function(className) {
    var a  = document.getElementsByClassName(className);
    for(var i=0; i<a.length; i++) {
      Event.observe(a[i], 'mouseout', this.imageOut.bind(this), true);
      Event.observe(a[i], 'mouseover', this.imageOver.bind(this), true);
    }
  },
  
  imageOver: function(e) {
    var el = Event.element(e).parentNode;
    if(el.title!="") {
      $("set-"+el.rel).innerHTML = el.title;
    }
  },
  
  imageOut: function(e) {
    var el = Event.element(e).parentNode;
    $("set-"+el.rel).innerHTML = $("set-"+el.rel).title;
  }
}

/*
LinkInfo Class.
Creates a styled info balloon on links with a title element.
*/

LinkInfo = Class.create();
LinkInfo.prototype = {

   // Working variable to temporary hold the title so the browser title won't appear:
   text: '',

   // Number of <a> elements currently observing in the document (for debugging):
   observing: 0,
   
   balloon: "",

   initialize: function(element) {
      // Element in which to search for links:
      element = (element) ? $(element) : document;
      
      if(element) {

         // Observe all the a elements that have titles:
         var a = element.getElementsByTagName('a');
         for(var i=0; i<a.length; i++) {
            if(a[i].title && a[i].title != '' && !Element.hasClassName(a[i], "no-fancy-links")) {
               Event.observe(a[i], 'mouseover', this.mouseover.bind(this), true);
               Event.observe(a[i], 'mouseout', this.mouseout.bind(this), true);
               this.observing++;
            }
         }

      }
   },

   // hover event handler:
   mouseover: function(e){
      
      //even kijken welke ballon het beste gaat passen
      if( Event.pointerX(e) < 400) {
         this.balloon=$('info-balloon-l');
         this.balloon.style.left = (Event.pointerX(e)-263)+'px';
      } else {
         this.balloon=$('info-balloon-r');
         this.balloon.style.left = (Event.pointerX(e)-273)+'px';
      }
      
      if(Event.element(e).title!='') {
         this.text=Event.element(e).title;
          this.balloon.innerHTML = Event.element(e).title;  
         Event.element(e).title='';
      } else {
          this.balloon.innerHTML = this.text;
      }
       
       this.balloon.style.top = (Event.pointerY(e)-55)+'px';
       this.balloon.style.display = 'block';
      return false;
   },

   // mouseout handler:
   mouseout: function(e) {
      this.balloon.style.display = 'none';
      Event.element(e).title = this.text;
      this.balloon.innerHTML = '';
   }
}


window.onload = function() {
   // ballonnen aanmaken
   new LinkInfo('content');
   new LinkInfo('testimonials');
   new LinkInfo('header');
   new LinkInfo('footer');
   new LinkInfo('blocklinks-recently');
                
   new LinkInfo('title');
   new LinkInfo('content-left');
   
   new FlickrSets('image-set-link');
}