window.fbf = window.fbf||{};

/************************************
 * SIFR
 ************************************/

	var futuraCondBold = { src: '/futura-cond-bold.swf' };
	sIFR.activate(futuraCondBold);

	/****** COMMON *****/

	sIFR.replace(futuraCondBold, {
		selector: '#content h2',
		wmode: 'transparent',
		offsetTop: 0,
		css: [
		  '.sIFR-root { color: #222E3C; text-transform: uppercase; }',
		]
	});

	sIFR.replace(futuraCondBold, {
		selector: '#header #tag span',
		wmode: 'transparent',
		offsetTop: 0,
		tuneHeight: -11,
		css: [
		  '.sIFR-root { color: #004B96; text-transform: uppercase; }',
		]
	});

/************************************
 * MENU
 ************************************/


	var Menu = Class.create({

		menu : null,
		tab : null,

		status : 'CLOSED',
		timeout : null,

		initialize : function(tab) {

		 this.menu = tab.down("div.sub");
      this.tab = tab;

      tab.observe('mouseenter', this.open.bindAsEventListener(this));
      tab.observe('mouseleave', this.close.bindAsEventListener(this));

		},

		open : function() {
		  if(!this.opening){
		    if(this.closing){
		      this.closing.cancel();
          this.closing = false;
          this.menu.setStyle({display: 'none', height:'auto'});
		    }
		    this.opening = Effect.BlindDown(this.menu, {
          afterFinish : function() {
            this.opening = false;
          }.bind(this),
          duration: 0.25
  		  });
  		}

       this.tab.addClassName('active');
  	},

  	close : function() {
		  if(!this.closing){
		    if(this.opening){
		      this.opening.cancel();
          this.opening = false;
          this.menu.setStyle({display: 'block', height:'auto'});
		    }
		    this.closing = Effect.BlindUp(this.menu, {
        	beforeStart : function() {
          	this.menu.setStyle({display: 'none', height:'auto', zIndex:9998});
          }.bind(this),
          afterFinish : function() {
            this.closing = false;
            this.menu.setStyle({display: 'none', height:'auto', zIndex:9999});
          }.bind(this),
          duration: 0.25
  		  });
  		}

       this.tab.removeClassName('active');
  	}

	});

/************************************
 * Roatating ferry operator banner
 ************************************/

	FerryOperators = function(){
 		var element, // element containing the slides
      index, // the index of the currently displayed slide
      items, // the slides
      prev, // the previous slide
      totalItems; // total number of slides

    function build() {
    	items = element.select('li');	 // grab the slides

      // absolutely position all slides to the top left of the containing
      // div (must have position: relative) and then hide them
      items.each(function(el) {
        el.setStyle({
          'left' : 0,
          'position' : 'absolute',
          'top' : 0
        }).hide();
      });

      totalItems = items.size(); // grab the total number of slides
      index = Math.floor(Math.random()*totalItems); // randomise the first slide
      next(); // display first slide
    }

    function next() {
      prev = index; // store current (soon to be previous) slide

      // if we at the end of the slides, set back to the start, else move to next one
      if(index == totalItems-1) {
        index = 0;
      } else {
        index++;
      }

      // swap the prev and next slides z-index, thus bringing the next to teh front but setting it's
      // opacity to 0 so you can still see current thru it. The fade teh next slide in, obscuring the
      // previous before hiding the previous slide.
      Effect.Appear(items[index], {
        afterFinish : function() {
          items[prev].hide();
        },
        beforeStart : function() {
          items[prev].setStyle({
            'zIndex' : 9998
          });
          items[index].setStyle({
            'opacity' : 0,
            'zIndex' : 9999
          }).show();
        }
      });
    }

    function play() {
      new PeriodicalExecuter(next, 2.5); // move to next slide every 5 seconds
    }

	  return {
    	initialize : function(el){
      	element = $(el);
      	build();
        play();
    	}
		}
	}();