//INCLUDE animations.js

if (document && document.execCommand) {
  try {
    document.execCommand("BackgroundImageCache",false, true);
  }
  catch (e) {
  }
}

$(document).ready(function(){
        CONTENT_MANAGER.init();
});

/***************************************************************************************************************************/
/*                                M A I N   M E N U   S T A T E   M A C H I N E                                            */
/***************************************************************************************************************************/

var HOME_MENU = {
  
  /* The states of the state machine */
  currentState: null,
  STATE_MENU_COLLAPSED: 0,
  STATE_MENU_EXPANDED: 1,
  STATE_MENU_COLLAPSING: 2,
  STATE_MENU_EXPANDING: 3,
  
  /* Other constants */
  COLLAPSE_TIME: 950,    //How long it takes for a menu item to completely collapse ( // ?? DEPRECATED )
  ROLLOVER_TIME: 350,     //How long it takes for a menu item to completely display its rollover state
  ARROW_ROLLOVER_TIME: 500,     //How long it takes for an arrow marker to completely display its rollover state
  
  /* The last clicked URL */
  lastClickedURL: null,
  
  /* The position state of an arrow-marker when it is not hovered */
  arrowStateNormal: {
    position : null,
    width : null,
    height : null,
    backgroundColor : null
  },
  
  /* The position state of an arrow-marker when it is hovered */
  arrowStateHover: {
    position : null,
    width : null,
    height : null,
    backgroundColor : null
  },
  
  /* Initializes the state machine */
  init: function( container ){ //////////////////////////////////////////////////////////////////////////////////////////////////////////////////
    
    /* Find main-menu animation */
    var menuAnim = $(container).find(".main-menu-animation")
    
    /* Initialise rollovers and buttons */
    HOME_MENU.initButtons(menuAnim);
    
    /* Parse animation */
    ANIMATION_MANAGER.parseAnimation(menuAnim,"main-menu-animation");
    
    /* Sub menu starts in collapsed state */
    HOME_MENU.next( HOME_MENU.STATE_MENU_COLLAPSED );
    
  },
  
  initButtons: function( menuAnim ){ ////////////////////////////////////////////////////////////////////////////////////////////////////////
    var arrows = new Array();
    
    /* For each element in the menu containing menu items ... */
    $(menuAnim).find("ul.main-menu li").each( function( i ){
      
      /* Get the menu item from this container */
      var item = ($(this).find(".home-menu-item"))[0];

      /* Get the arrow */
      var arrow = ($(this).find(".arrow-marker"))[0];
      arrows.push(arrow);
      
      /* Record arrow states if they are undefined */
      if( i == 0){
        HOME_MENU.arrowStateNormal.position = $(arrow).position();
        HOME_MENU.arrowStateNormal.backgroundColor = $(arrow).css("background-color");
        HOME_MENU.arrowStateNormal.width = $(arrow).css("width");
        HOME_MENU.arrowStateNormal.height = $(arrow).css("height");
        $(arrow).addClass("hover");
        HOME_MENU.arrowStateHover.position = $(arrow).position();
        HOME_MENU.arrowStateHover.backgroundColor = $(arrow).css("background-color");
        HOME_MENU.arrowStateHover.width = $(arrow).css("width");
        HOME_MENU.arrowStateHover.height = $(arrow).css("height");
        $(arrow).removeClass("hover");
      }
      
      /* Set up mouse listeners for this menu item */
      $(item).click( HOME_MENU.makeMenuItemClickListener( $(item).attr("href") ));
      $(item).mouseenter( HOME_MENU.makeMenuItemHoverInListener( item, arrows[i]) );
      $(item).mouseleave( HOME_MENU.makeMenuItemHoverOutListener( item, arrows[i] ) );
      
      /* Remove link */
      $(item).removeAttr("href");

    /* Remove all non-javascript rollovers */
    $("a").removeClass("nojs");

    });
    
    /* Set up mouse listeners for 'thank-you' and 'murray bridge' */
    var sound_track = $(menuAnim).find("a.soundtrack");
    $(sound_track).clone().insertBefore( $(sound_track) );
    $(sound_track).addClass("hover");
    $(sound_track).css("opacity","0");
    var thank_you = $(menuAnim).find("a.thank-you");
    $(thank_you).clone().insertBefore( $(thank_you) );
    $(thank_you).addClass("hover");
    $(thank_you).css("opacity","0");
    var murray_bridge = $(menuAnim).find("a.murray-bridge-2010");
    $(murray_bridge).clone().insertBefore( $(thank_you) );
    $(murray_bridge).addClass("hover");
    $(murray_bridge).css("opacity","0");
    $(thank_you).mouseenter( HOME_MENU.makeMenuGenericHoverInListener(thank_you) );
    $(thank_you).mouseleave( HOME_MENU.makeMenuGenericHoverOutListener(thank_you) );
    $(thank_you).click( HOME_MENU.makeMenuItemClickListener( $(thank_you).attr("href") ) );
    $(sound_track).mouseenter( HOME_MENU.makeMenuGenericHoverInListener(sound_track) );
    $(sound_track).mouseleave( HOME_MENU.makeMenuGenericHoverOutListener(sound_track) );
    $(sound_track).click( HOME_MENU.makeMenuItemClickListener( $(sound_track).attr("href") ) );
    $(murray_bridge).mouseenter( HOME_MENU.makeMenuGenericHoverInListener(murray_bridge) );
    $(murray_bridge).mouseleave( HOME_MENU.makeMenuGenericHoverOutListener(murray_bridge) );
    $(thank_you).removeAttr("href");
    $(sound_track).removeAttr("href");
  },
  
  slideIn: function( callback ){
    HOME_MENU.next( HOME_MENU.STATE_MENU_EXPANDING );
    
    if( callback != null && typeof(callback) == "function" ){
      waitForSlideIn()
    }
    
    function waitForSlideIn(){
      if( HOME_MENU.currentState != HOME_MENU.STATE_MENU_EXPANDED ){
        setTimeout( waitForSlideIn, 100);
      }else{
        callback();
      }
    }
  },
  
  slideOut: function( callback ){
    HOME_MENU.next( HOME_MENU.STATE_MENU_COLLAPSING );
    
    if( callback != null && typeof(callback) == "function" ){
      waitForSlideOut()
    }
    
    function waitForSlideOut(){
      if( HOME_MENU.currentState != HOME_MENU.STATE_MENU_COLLAPSED ){
        setTimeout( waitForSlideOut, 100);
      }else{
        callback();
      }
    }
  },
  
  transitionTo: function( currentWrapper, newWrapper, callback ){

    /* Get the type of the new page via the rel attribute in the wrappers */
    var newPageType = $(newWrapper).attr("rel");
    var oldPageType = $(currentWrapper).attr("rel");
    
    if( newPageType == "slideshow" ){
      
      /* wait for animations to complete */
      var barrier = new BarrierSync(2)
      
      /* Fade in the new content */
      $(newWrapper).find("#content").children().css("opacity",0);
      $(newWrapper).find("#content").children().animate({opacity : 1},2000,barrier.getNotifier(0));
      //?? IE doesn't support rgba
      //$(currentWrapper).find("#home-page").css("background-color","rgba( 0, 0, 0, 0 )");
      
      /* slide out menu */
      HOME_MENU.slideOut( function(){
        /* Fade out what is left of the menu */
        $(currentWrapper).find("#home-page").animate({opacity : 0},900,barrier.getNotifier(1));
        /* Do callback */
        barrier.wait(200, function(){
          $(currentWrapper).remove();
          SLIDESHOW.slideIn(callback);
        });
      });
    }
    
    else{
      //Slide out old content, slide in the new
      var newPage = CONTENT_MANAGER.getPageManager( newPageType );
      var oldPage = CONTENT_MANAGER.getPageManager( oldPageType );
      oldPage.slideOut(function(){
        $(currentWrapper).remove();
        newPage.slideIn( callback );
      });
    }
  },
  
  /* Handles entry conditions */
  next: function( state ){ ///////////////////////////////////////////////////////////////////////////////////////////////////////////
    
    HOME_MENU.currentState = state;
    
    switch( HOME_MENU.currentState ){
      
      case HOME_MENU.STATE_MENU_COLLAPSED: ///////////////////////////////////////////////////////////////////////////////////////////
        /* Do Nothing */
        break;
        
      case HOME_MENU.STATE_MENU_EXPANDED: ////////////////////////////////////////////////////////////////////////////////////////////
        /* Do Nothing */
        break;
        
      case HOME_MENU.STATE_MENU_COLLAPSING: //////////////////////////////////////////////////////////////////////////////////////////
        var anim = ANIMATION_MANAGER.getAnimation("main-menu-animation");
        ANIMATION_MANAGER.animateFrame(anim, 1, function(){ HOME_MENU.next( HOME_MENU.STATE_MENU_COLLAPSED ) });
        break;
        
      case HOME_MENU.STATE_MENU_EXPANDING: ///////////////////////////////////////////////////////////////////////////////////////////
        var anim = ANIMATION_MANAGER.getAnimation("main-menu-animation");
        ANIMATION_MANAGER.animateFrame(anim, 3, function(){ HOME_MENU.next( HOME_MENU.STATE_MENU_EXPANDED ) });
        break;

      default: ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
        /* This should never happen */
        window.alert("Error in HOME_MENU state machine!");
        break;
    }
  },
  
  /* Makes a listener function to handle the event that a menu item was clicked */
  makeMenuItemClickListener: function( SUBMENU ){ ////////////////////////////////////////////////////////////////////////////////////
    return function(){
      /* Menu items are only active whilst it is expanded */
      if( HOME_MENU.currentState == HOME_MENU.STATE_MENU_EXPANDED ){
        CONTENT_MANAGER.changeContent( SUBMENU );
      }
    }
  },
  
  /* Makes a listener function to handle the event that a menu item was hovered in */
  makeMenuItemHoverInListener: function( elem, arrow ){ //////////////////////////////////////////////////////////////////////////////
    
    return function(){
      
      if( HOME_MENU.currentState == HOME_MENU.STATE_MENU_EXPANDED ){
        /* Fade out the menu-item to reveal the roll-over state */
        $(elem).find("div").stop().animate({opacity : 0},HOME_MENU.ROLLOVER_TIME);

        /* Change arrow color to rollover color */
        $(arrow).stop().animate({left : HOME_MENU.arrowStateHover.position.left,
                                 top : HOME_MENU.arrowStateHover.position.top,
                                 width : HOME_MENU.arrowStateHover.width,
                                 height : HOME_MENU.arrowStateHover.height,
                                 backgroundColor : HOME_MENU.arrowStateHover.backgroundColor },HOME_MENU.ARROW_ROLLOVER_TIME);
      }
    }
  },
  
  /* Makes a listener function to handle the event that a menu item was hovered out */
  makeMenuItemHoverOutListener: function( elem, arrow ){ /////////////////////////////////////////////////////////////////////////////
    return function(){
        /* Fade in the menu-item to hide the rollover state */
        $(elem).find("div").stop().animate({opacity : 1},HOME_MENU.ROLLOVER_TIME);
        
        /* Change arrow color to rollout color */
        $(arrow).stop().animate({left : HOME_MENU.arrowStateNormal.position.left,
                                 top : HOME_MENU.arrowStateNormal.position.top,
                                 width : HOME_MENU.arrowStateNormal.width,
                                 height : HOME_MENU.arrowStateNormal.height,
                                 backgroundColor : HOME_MENU.arrowStateNormal.backgroundColor },HOME_MENU.ARROW_ROLLOVER_TIME);
    }
  },
  
  /* Makes a listener function to handle the event that a generic item was hovered in */
  makeMenuGenericHoverInListener: function( elem ){ /////////////////////////////////////////////////////////////////////////////
    return function(){
      if( HOME_MENU.currentState == HOME_MENU.STATE_MENU_EXPANDED ){
        $(elem).stop().animate({opacity : 1});
      }
    }
  },
  
  /* Makes a listener function to handle the event that a generic item was hovered out */
  makeMenuGenericHoverOutListener: function( elem ){ /////////////////////////////////////////////////////////////////////////////
    return function(){
      if( HOME_MENU.currentState == HOME_MENU.STATE_MENU_EXPANDED ){
        $(elem).stop().animate({opacity : 0});
      }
    }
  }
}



















var SUB_MENU = {
  
  currentState: null,
  menuContainer: null,
  STATE_COLLAPSED: 0,
  STATE_SLIDING_IN: 1,
  STATE_EXPANDED: 2,
  STATE_SLIDING_OUT: 3,
  
  init: function( container ){
    
    menuContainer = container;
    
    /* Find the sub-menu animation */
    var submenuAnim = $(container).find(".sub-menu-animation");
    
    /* Setup back link */
    var backButton = $(container).find(".nav-back:last");
    var hoverButton = $(backButton).clone();
    $(hoverButton).insertAfter( $(backButton) );
    $(backButton).find("#nav-back").remove();
    var backLink = $(hoverButton).find("#nav-back");
    $(hoverButton).addClass("hover");
    $(hoverButton).css("opacity","0");

    $(hoverButton).click( SUB_MENU.makeBackClickListener( $(backLink).attr("href") ) );
    $(backLink).removeAttr("href");
    $(hoverButton).mouseenter( SUB_MENU.makeBackHoverInListener( hoverButton ) );
    $(hoverButton).mouseleave( SUB_MENU.makeBackHoverOutListener( hoverButton ) );
    
    /* Set up listeners for other menu items */
    var links = $(container).find("a.sub-menu-item:not(#nav-back)");
    $(links).each( function( i ){
      
      /* Get the link container */
      var parent = $(this).parent()[0];
      
      /* Get the URL of the link */
      var url = $(this).attr("href");
      /* Remove the URL */
      $(this).removeAttr("href");
      
      /* Add click listener */
      $(parent).click( SUB_MENU.makeLinkClickListener( url ) );
      /* Get REL attribute to find what arrow marker corresponds to this link */
      var linkREL = $(parent).attr("rel");
      var linkArrow = null;
      $(".arrow-marker").each(function(){
        if( $(this).attr("rel") == linkREL ){
          linkArrow = $(this);
        }
      });
      
      /* add class to link to position it properly (because IE6 and 7 will add extra space to it) */
      $(parent).addClass("LINK" + linkREL);
      
      /* Replace link with a hidden rollover image */
      $(this).wrapAll("<div></div>");
      $(this).text("");
      var rollover = $(parent).find("div");
      $(rollover).addClass("preload");
      $(rollover).css("opacity","0");
      
      /* Show rollover div on mouseover */
      $(parent).mouseenter( SUB_MENU.makeLinkHoverInListener( linkArrow, rollover ) );
      $(parent).mouseleave( SUB_MENU.makeLinkHoverOutListener( linkArrow, rollover ) );
    });
    
    /* Parse the sub-menu animation */
    ANIMATION_MANAGER.parseAnimation(submenuAnim, "sub-menu-animation");
    
    /* Sub menu starts in collapsed state */
    SUB_MENU.next( SUB_MENU.STATE_COLLAPSED );
  },
  
  next: function( state ){ ///////////////////////////////////////////////////////////////////////////////////////////////////////////

    SUB_MENU.currentState = state;

    switch( SUB_MENU.currentState ){

      case SUB_MENU.STATE_COLLAPSED: /////////////////////////////////////////////////////////////////////////////////////////////////
        /* Do Nothing */
        break;
        
      case SUB_MENU.STATE_SLIDING_IN: ////////////////////////////////////////////////////////////////////////////////////////////////
      
        /* Slide in the sub-menu */
        var anim = ANIMATION_MANAGER.getAnimation("sub-menu-animation");
        ANIMATION_MANAGER.animateFrame(anim, 2, function(){SUB_MENU.next( SUB_MENU.STATE_EXPANDED )});
        break;

      case SUB_MENU.STATE_EXPANDED: //////////////////////////////////////////////////////////////////////////////////////////////////
        /* Do Nothing */
        break;
        
      case SUB_MENU.STATE_SLIDING_OUT: ///////////////////////////////////////////////////////////////////////////////////////////////

        /* Slide out the sub-menu and transition to the main menu */
        var anim = ANIMATION_MANAGER.getAnimation("sub-menu-animation");
        ANIMATION_MANAGER.animateFrame(anim, 1, function(){SUB_MENU.next( SUB_MENU.STATE_COLLAPSED )});
        break;

      default: ///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
        /* This should never happen */
        window.alert("Error in SUB_MENU state machine!");
        break;
    }
  },
  
  slideIn: function( callback ){
    SUB_MENU.next( SUB_MENU.STATE_SLIDING_IN );
    
    if( callback != null && typeof(callback) == "function" ){
      waitForSlideIn()
    }
    
    function waitForSlideIn(){
      if( SUB_MENU.currentState != SUB_MENU.STATE_EXPANDED ){
        setTimeout( waitForSlideIn, 100);
      }else{
        callback();
      }
    }
  },
  
  slideOut: function( callback ){
    
    /* Remove the links from the sub-menu */
    $(menuContainer).find("ul").remove();
    $(menuContainer).find("ul").css("width","0px");
    $(menuContainer).find("ul").css("height","0px");
    
    SUB_MENU.next( SUB_MENU.STATE_SLIDING_OUT );
    
    if( callback != null && typeof(callback) == "function" ){
      waitForSlideOut()
    }
    
    function waitForSlideOut(){
      if( SUB_MENU.currentState != SUB_MENU.STATE_COLLAPSED ){
        setTimeout( waitForSlideOut, 100);
      }else{
        callback();
      }
    }
  },
  
  transitionTo: function( currentWrapper, newWrapper, callback ){
    
    /* Get the type of the new page via the rel attribute in the wrappers */
    var newPageType = $(newWrapper).attr("rel");
    var oldPageType = $(currentWrapper).attr("rel");
        
    if( newPageType == "slideshow" ){
      
      /* wait for animations to complete */
      var barrier = new BarrierSync(3)
      
      /* Fade in the new content */
      $(newWrapper).find("#content").children().css("opacity",0);       
      $(newWrapper).find("#content").children().animate({opacity : 1},2000,barrier.getNotifier(0));      
      //$(currentWrapper).find("#home-page").css("background-color","rgba( 0, 0, 0, 0 )");
      $(currentWrapper).find("#home-page").animate({opacity : 0},2000,barrier.getNotifier(2));
      
      /* slide out menu */
      SUB_MENU.slideOut( function(){
        
        /* Fade out what is left of the menu */
        $(currentWrapper).find("#home-page").animate({opacity : 0},900,barrier.getNotifier(1));
                
        /* Do callback */
        barrier.wait(200, function(){        
          $(currentWrapper).remove();
          SLIDESHOW.slideIn(callback);
//?? REMOVED THIS
          //callback()
        });
      });
    }
    
    else{
      //Slide out old content, slide in the new
      var newPage = CONTENT_MANAGER.getPageManager( newPageType );
      var oldPage = CONTENT_MANAGER.getPageManager( oldPageType );
      oldPage.slideOut(function(){
        $(currentWrapper).remove();
        newPage.slideIn( callback );
      });
    }
  },
  
  makeLinkClickListener: function( URL ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      if( SUB_MENU.currentState == SUB_MENU.STATE_EXPANDED ){
        CONTENT_MANAGER.changeContent( URL );
      }
    }
  },
  
  makeLinkHoverInListener: function( arrowElem, rollover ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
        $(arrowElem).addClass("hover");
        $(rollover).stop().animate({opacity : 1}, 450);
    }
  },
  
  makeLinkHoverOutListener: function( arrowElem, rollover ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
        $(arrowElem).removeClass("hover");
        $(rollover).stop().animate({opacity : 0}, 450);
    }
  },
  
  makeBackHoverInListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      if(SUB_MENU.currentState == SUB_MENU.STATE_EXPANDED){
        $(elem).stop().animate({opacity : 1}, 450);
      }
    }
  },
  
  makeBackHoverOutListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      if(SUB_MENU.currentState == SUB_MENU.STATE_EXPANDED){
        $(elem).stop().animate({opacity : 0}, 450);
      }
    }
  },
  
  makeBackClickListener: function( url ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      CONTENT_MANAGER.changeContent( url );
    }
  }
}












var SLIDESHOW = {
  
  /* The position state of an arrow-marker when it is not hovered */
  arrowStateNormal: {
    position : null,
    width : null,
    height : null,
    backgroundColor : null
  },
  
  /* The position state of an arrow-marker when it is hovered */
  arrowStateHover: {
    position : null,
    width : null,
    height : null,
    backgroundColor : null
  },
  
  init: function( container ){
    
    /* Find the slideshow animation */
    var slideshowAnim = $(container).find(".slideshow");
    
    /* Setup back link */
    var backLink = $(container).find(".content-footer a.home-link");
    var backLinkHover = $(backLink).clone();
    $(backLinkHover).insertAfter(backLink);
    $(backLinkHover).addClass("hover");
    $(backLinkHover).css("opacity","0");
    var subMenuLink = $(container).find(".content-footer a.submenu-link");
    var subMenuCaption = $(container).find(".content-footer h3");
    var footer = $(container).find(".content-footer");
    
    if(backLink != null){
      
      $(backLinkHover).wrapAll("<div></div>");
      
      $(backLinkHover).parent(0).click( SLIDESHOW.makeHomeClickListener( $(backLink).attr("href") ) );
      $(backLinkHover).removeAttr("href");
      $(backLink).removeAttr("href");
      $(backLinkHover).parent(0).mouseenter( SLIDESHOW.makeHomeHoverInListener( backLinkHover ) );
      $(backLinkHover).parent(0).mouseleave( SLIDESHOW.makeHomeHoverOutListener( backLinkHover ) );
    }
    
    if(subMenuLink != null && subMenuCaption != null){
      $(subMenuCaption).click( SLIDESHOW.makeHomeClickListener( $(subMenuLink).attr("href") ) );
      $(subMenuLink).removeAttr("href");
    }
    
    /* Setup linkouts */
    var linkouts = $(container).find(".linkout");
    $(linkouts).each(function(i){
      
      /* Record arrow states if they are undefined */
      if( i == 0){
        var arrow = $(this).find(".arrow-marker");
        SLIDESHOW.arrowStateNormal.position = $(arrow).position();
        SLIDESHOW.arrowStateNormal.backgroundColor = $(arrow).css("background-color");
        SLIDESHOW.arrowStateNormal.width = $(arrow).css("width");
        SLIDESHOW.arrowStateNormal.height = $(arrow).css("height");
        $(arrow).addClass("hover");
        SLIDESHOW.arrowStateHover.position = $(arrow).position();
        SLIDESHOW.arrowStateHover.backgroundColor = $(arrow).css("background-color");
        SLIDESHOW.arrowStateHover.width = $(arrow).css("width");
        SLIDESHOW.arrowStateHover.height = $(arrow).css("height");
        $(arrow).removeClass("hover");
      }
      
      $(this).mouseenter( SLIDESHOW.makeLinkHoverInListener( $(this) ) );
      $(this).mouseleave( SLIDESHOW.makeLinkHoverOutListener( $(this) ) );
    });
    
    /* Hide slideshow title */
    var slideTitle = $(".content-footer h3");
    if(slideTitle != null){
      $(slideTitle).css("opacity",0);
    }
    
    /* Parse the slideshow animation */
    ANIMATION_MANAGER.parseAnimation(slideshowAnim, "slideshow");
    
  },
  
  slideIn: function( callback ){

    /* Terminate any running slideshows */
    ANIMATION_MANAGER.terminateActiveSlideshows();

    /* Run the slideshow */
    var anim = ANIMATION_MANAGER.getAnimation("slideshow");
    ANIMATION_MANAGER.animateSlideshow(anim);
    
    /* Fade in slideshow title */
    var slideTitle = $(".content-footer h3");
    if(slideTitle != null){
      $(slideTitle).animate({opacity : 1}, 650, doCallback);
    }else{
      doCallback();
    }
    
    function doCallback(){
      if(callback != null && typeof(callback) == "function"){
          callback();
      }
    }
  },
  
  slideOut: function( callback ){

    /* Terminate any running slideshows */
    ANIMATION_MANAGER.terminateActiveSlideshows();

    /* Fade out slideshow title */
    var slideTitle = $(".content-footer h3");
    if(slideTitle != null){
      
//?? NOTE: There should only be one title selected but there is 2!
//?? so we use a barrier to avoid callbacks being duplicated.
      var barrier = new BarrierSync(slideTitle.length);
      $(slideTitle).each(function(i){
        $(this).animate({opacity : 0}, 650, barrier.getNotifier(i));
      });
      barrier.wait(200,doCallback);
    }else{
      doCallback();
    }

    function doCallback(){
      if(callback != null && typeof(callback) == "function"){
          callback();
      }
    }
  },
  
  transitionTo: function( currentWrapper, newWrapper, callback ){
    
    /* Get the type of the new page via the rel attribute in the wrappers */
    var newPageType = $(newWrapper).attr("rel");
    var oldPageType = $(currentWrapper).attr("rel");
    
    if( newPageType == "main-menu" ){
      
      /* Stop the slideshow */
      SLIDESHOW.slideOut( function(){
        
        var barrier = new BarrierSync(2);
        
        /* Fade out slideshow for now */
        $(currentWrapper).find("#content").stop().animate({opacity : 0},900,function(){
            $(currentWrapper).remove();
            var notifier = barrier.getNotifier(0);
            notifier();
        })
        
        /* Slide in menu whilst slideshow fades out */
        HOME_MENU.slideIn(barrier.getNotifier(1));
        barrier.wait(200, callback);
      });
    }
    
    else if( newPageType == "sub-menu" ){
      
      /* Stop the slideshow */
      SLIDESHOW.slideOut( function(){
        
        var barrier = new BarrierSync(2);
        
        /* Fade out slideshow for now */
        $(currentWrapper).find("#content").stop().animate({opacity : 0},900,function(){
            $(currentWrapper).remove();
            var notifier = barrier.getNotifier(0);
            notifier();
        })
        
        /* Slide in menu whilst slideshow fades out */
        SUB_MENU.slideIn(barrier.getNotifier(1));
        
        barrier.wait(200, callback);
      });
    }
    
    else{

      //Slide out old content, slide in the new
      var newPage = CONTENT_MANAGER.getPageManager( newPageType );
      var oldPage = CONTENT_MANAGER.getPageManager( oldPageType );
//?? SlideOut callback is being executed twice for some reason.
      oldPage.slideOut(function(){
        $(currentWrapper).remove();
        newPage.slideIn( callback );
      });
    }

  },
  
  makeHomeHoverInListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
        //var width = $(elem).css("width")
        //$(elem).css("background-position","-" + width)
        $(elem).stop().animate({opacity : 1});
    }
  },
  
  makeHomeHoverOutListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
        //$(elem).css("background-position","0px");
        $(elem).stop().animate({opacity : 0});
    }
  },
  
  makeHomeClickListener: function( url ){ ////////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      CONTENT_MANAGER.changeContent( url );
    }
  },
  
  makeLinkHoverInListener: function( elem ){ /////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      var image = $(elem).find("img.rollover");
      var arrow = $(elem).find(".arrow-marker");
      if(image != null){
        $(image).stop().animate({opacity : 0},450);
      }
      if(arrow != null){

        /* Change arrow color to rollover color */
        $(arrow).stop().animate({left : SLIDESHOW.arrowStateHover.position.left,
                                 top : SLIDESHOW.arrowStateHover.position.top,
                                 width : SLIDESHOW.arrowStateHover.width,
                                 height : SLIDESHOW.arrowStateHover.height,
                                 backgroundColor : SLIDESHOW.arrowStateHover.backgroundColor },HOME_MENU.ARROW_ROLLOVER_TIME);
      }
    }
  },
  
  makeLinkHoverOutListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      var image = $(elem).find("img.rollover");
      var arrow = $(elem).find(".arrow-marker");
      if(image != null){
        $(image).stop().animate({opacity : 1},450);
      }
      if(arrow != null){
        
        /* Change arrow color to rollout color */
        $(arrow).stop().animate({left : SLIDESHOW.arrowStateNormal.position.left,
                                 top : SLIDESHOW.arrowStateNormal.position.top,
                                 width : SLIDESHOW.arrowStateNormal.width,
                                 height : SLIDESHOW.arrowStateNormal.height,
                                 backgroundColor : SLIDESHOW.arrowStateNormal.backgroundColor },HOME_MENU.ARROW_ROLLOVER_TIME);
      }
    }
  }
  
}












var OTHER = {
  
  currentState: null,
  STATE_SLIDING: 1,
  STATE_SHOWING: 2,
  
  init: function( container ){
    
    /* Find the animation */
    var pageAnim = $(container).find(".page-animation");
    
    /* Setup back link */
    var backButton = $(container).find(".nav-back:last");
    var hoverButton = $(backButton).clone();
    $(hoverButton).insertAfter( $(backButton) );
    $(backButton).find("#nav-back").remove();
    var backLink = $(hoverButton).find("#nav-back");
    $(hoverButton).addClass("hover");
    $(hoverButton).css("opacity","0");

    $(hoverButton).click( OTHER.makeBackClickListener( $(backLink).attr("href") ) );
    $(backLink).removeAttr("href");
    $(hoverButton).mouseenter( OTHER.makeBackHoverInListener( hoverButton ) );
    $(hoverButton).mouseleave( OTHER.makeBackHoverOutListener( hoverButton ) );
    
    /* Parse the animation */
    ANIMATION_MANAGER.parseAnimation(pageAnim, "page-animation");
  },
  
  slideIn: function( callback ){
    OTHER.currentState = OTHER.STATE_SLIDING;
    var anim = ANIMATION_MANAGER.getAnimation("page-animation");
    ANIMATION_MANAGER.animateFrame(anim, 2, function(){
      if( callback !== null && typeof(callback) == "function" ){
        OTHER.currentState = OTHER.STATE_SHOWING;
        callback();
      }
    });
  },
  
  slideOut: function( callback ){
    OTHER.currentState = OTHER.STATE_SLIDING;
    var anim = ANIMATION_MANAGER.getAnimation("page-animation");
    ANIMATION_MANAGER.animateFrame(anim, 1, function(){
      if( callback !== null && typeof(callback) == "function" ){
        OTHER.currentState = OTHER.STATE_SHOWING;
        callback();
      }
    });
  },
  
  transitionTo: function( currentWrapper, newWrapper, callback ){
    
    /* Get the type of the new page via the rel attribute in the wrappers */
    var newPageType = $(newWrapper).attr("rel");
    var oldPageType = $(currentWrapper).attr("rel");
    
    //Slide out old content, slide in the new
    var newPage = CONTENT_MANAGER.getPageManager( newPageType );
    var oldPage = CONTENT_MANAGER.getPageManager( oldPageType );
    oldPage.slideOut(function(){
      $(currentWrapper).remove();
      newPage.slideIn( callback );
    });
  },
  
  makeBackHoverInListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      if(OTHER.currentState == OTHER.STATE_SHOWING){
        $(elem).stop().animate({opacity : 1}, 450);
      }
    }
  },
  
  makeBackHoverOutListener: function( elem ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      if(OTHER.currentState == OTHER.STATE_SHOWING){
        $(elem).stop().animate({opacity : 0}, 450);
      }
    }
  },
  
  makeBackClickListener: function( url ){ ////////////////////////////////////////////////////////////////////////////////////////////
    return function(){
      CONTENT_MANAGER.changeContent( url );
    }
  }
}