$(document).ready(function() {
  
  removeNonScriptClasses('div.main-sponsor-image a', 'non-script-sponsor');
  removeNonScriptClasses('div#did-you-know div.content', 'non-script-content');
  removeNonScriptClasses('div#previous-bearers div.content', 'non-script-content');
  removeNonScriptClasses('div#top-tips div.content', 'non-script-content');
  removeNonScriptClasses('div#virtual-tours div.content', 'non-script-content');
  removeNonScriptClasses('div#who-details div.content', 'non-script-content');
  removeNonScriptClasses('div#related-images div.content', 'non-script-content');
  removeNonScriptClasses('div#related-videos div.content', 'non-script-content');
  removeNonScriptClasses('div#your-photos div.content', 'non-script-content');
  removeNonScriptClasses('div#BlogCalendar div', 'non-script-content');
  removeNonScriptClasses('div#calendar-tabs ul.tabbed-headers', 'non-script-content');
  
  /* Lars: Shop update */
  removeNonScriptClasses('div#shop-module div.content', 'non-script-content'); 

  //removeNonScriptClasses('div#did-you-know div.content', 'first');
  
  showNavigation('div.sponsor-slider-images a.prev', 'inline');
  showNavigation('div.sponsor-slider-images a.next', 'inline');
  
  setUpSnippetNavigation('div#Content div.snippet div.snippet-header');
  /* setUpSnippetNavigation('div#Content div.torch-snippet div.snippet-header'); */
  
  makeTextFader("#related-images", "div.content", "block");
  makeTextFader("#related-videos", "div.content", "block");
  makeTextFader("#virtual-tours", "div.content", "block");
  makeTextFader("#who-details", "div.content", "block");

  /* Lars: Shop update */
  makeTextFader("#shop-module", "div.content", "block");

  makeTextFader("#your-photos", "div.image-caption-container", "block");
  makeTextFader("#did-you-know", "div.content", "block");
  makeTextFader("#previous-bearers", "div.content", "block");  
  makeTextFader("#top-tips", "div.content", "block");
  
  makeNewFader("div#public-funders-slider", "div.main-sponsor-image a", "inline");
  makeNewFader("div#commercial-partners-slider", "div.main-sponsor-image a", "inline");

  makeCalendarTabFader("div#calendar-tabs", "div.tabbed-headers-container ul.tabbed-headers");
  
  makeFeatureFader("#feature-content-container",  "div.content-container", "");
  
  makeFeatureFader("#header-images-container", "div.header-fader-content", "div#header-images-controls-container div");

  /*Mart Tooltips for torch slider */
  styleToolTips();
  
});
  
  //creates the tooltips styling for the torch slider
  function styleToolTips() {
    if ($("div.scrollable-torch").length > 0) {
          $("div.scrollable-torch .main-slider-content img[title]").style_my_tooltips({ 
            tip_follows_cursor: "on", //on/off
            tip_delay_time: 500, //milliseconds
            cursor_tip_margin_x: -parseInt($("div.scrollWrapper").offset().left) + 20,
            cursor_tip_margin_y: -parseInt($("div.scrollWrapper").offset().top)
        });
      }
  }

  
  // receives an item and removes the class from it
  function removeNonScriptClasses(itemSelector, className) {
    $(itemSelector).each(function() {
      $(this).removeClass(className);
    });
  }

  function showNavigation(itemSelector, displayType) {
    $(itemSelector).each(function() {
      $(this).css('display', displayType);
    });
  }
  
var noslide = false;
  // Function to fade text and image in and out of a container
  // containerSelector: The ID of the container all the components 
  // contentSelector: The component container that will be faded in and out
  function makeFeatureFader(containerSelector, contentSelector, controllerContainer) {

    $(containerSelector+' '+contentSelector+':first').css('display', 'block');
    
    // create a div pager for controls
    var pagerHTML = '<div id="pager">';
    
    // count how many contentSelectors there are and make the links in pager
    var count = $(containerSelector+' '+contentSelector).size();
    
    $(containerSelector+' '+contentSelector).each(function(intIndex){
      if(intIndex==0){
        pagerHTML += '<a class="activeSlide" href="#">';
      }
      else {
        pagerHTML += '<a href="#">';
      }
      pagerHTML += (intIndex+1)+'</a>';
    });
    
    // close the html div
    pagerHTML += '</div>';
    
    // add the controls to the container
    if(controllerContainer) {
      $(controllerContainer).append(pagerHTML);
    }
    else {
       $(containerSelector).append(pagerHTML);
    }
    
    // handle the clicking controls
    $('div#pager a').click(function(){
      if($(this).attr('id') === 'playPause') {return false;}
      $(this).siblings().attr('class','');
      $(this).attr('class','activeSlide');
      
      // get the number in the link, minus 1 and display that div 
      var linkNumber = $(this).html();
      
      $(containerSelector+' '+contentSelector).each(function(){
        // fade out existing content
        if($(this).css('display') == 'block'){
          $(this).removeClass('current');
          $(this).fadeOut('slow', function() {
            // fade in the selected content
            $(containerSelector).find(contentSelector + ':eq(' + (linkNumber-1) + ')').fadeIn('slow');
          });
        }
      });
 
      if(containerSelector === '#feature-content-container') {
        var trlab = $('.feature-content-text:eq('+ $('div#pager a').index(this) +') > h2').text();
        trlab = trlab.replace(/^[\n|\ ]+/g,'');
        trlab = trlab.replace(/[\n|\ ]+$/g,'');
        if(trlab === '') {trlab = 'B_' + ($('div#pager a').index(this) + 1);}
        try {pageTracker._trackEvent('promo', 'switch', trlab)} catch(err) {}
      }
      return false;
    });
    var oldnoslide = false;
    
    if(containerSelector === "#feature-content-container") {
        var featureContentContainer = $('#feature-content-container')
        // $('#feature-content-container #pager a').each(function() {if(+$(this).html() > 0) {$(this).attr('title',$('.feature-content-text:eq('+ ($(this).html() - 1) +') > h2').html().replace(/(\n|\r|<br>|<br\ \/>)/g,'').replace(/^\ +/,'').replace(/\ +$/,''))}});
        if (featureContentContainer.find('.feature-content-text').length > 0) {
            featureContentContainer.find('#pager a').each(function() {if(+$(this).html() > 0) {$(this).attr('title',$('.feature-content-text:eq('+ ($(this).html() - 1) +') > h2').html().replace(/(\n|\r|((\&nb)(sp;))|<br>|<br\ \/>)/g,'').replace(/^\ +/,'').replace(/\ +$/,''))}});
        }
        featureContentContainer.find('#pager').append('<a id="playPause" href="">II</a>');
        
        //$('#feature-content-container').hover(function() {noslide = true;}, function() {noslide = false;});
        $('#pager').hover(function() {oldnoslide = noslide; noslide = true;}, function() {noslide = oldnoslide;});
        $('#playPause').click(function(e) {
            e.preventDefault();
            if($(this).html() === 'II') {$(this).html('<span style="font-family:sans-serif">►</span>'); noslide=true; oldnoslide = true;} else {$(this).html('II'); noslide=false; oldnoslide=false;}
        });
        
    }
    
}
    slidefn = function() {
        if(!noslide) {
            var ns = $('#pager a.activeSlide').next('a:not(#playPause)');
            if(ns.length == 0) {ns = $('#pager a:eq(0)');}
            ns.click();
        }
    }

    // Different slider speeds for the otr section
    if (location.href.indexOf("games/olympic-torch-relay") != -1){
        theSlider = setInterval(slidefn,10000);
    } else {
        theSlider = setInterval(slidefn,7000);
    }
  
  // Function to fade text in and out of a container
  // containerSelector: The ID of the container of the text 
  // contentSelector: The components that will be faded in and out
  function makeNewFader(containerSelector, contentSelector, displayType) {
    $(containerSelector+' '+contentSelector+':first').css('display', displayType);
    
    var pnf = function(evt){
      var pnmode = $(this).hasClass('next') ? 'next' : 'prev';
      if(evt.type === 'click') {
          clearInterval(autoClick);
      }
      evt.preventDefault();

      var currentVis = $(containerSelector+' '+contentSelector+':visible');
      $(currentVis).find('img').fadeOut(function() {
          $(currentVis).hide();
          if(pnmode === 'next') {
              var nextVis = $(currentVis).next();
              if(nextVis.length == 0) {nextVis = $(containerSelector+' '+contentSelector+':first');}
          } else {
              var nextVis = $(currentVis).prev();
              if(nextVis.length == 0) {nextVis = $(containerSelector+' '+contentSelector+':last');}
          }
          nextVis.find('img').hide().fadeIn().parent().show();
      });
      if(evt.type === 'click') {
          //user actually clicked, we want to track
          var cat = containerSelector.split('-')[1];
          if(cat === 'funders' || cat === 'partners') {
             try {pageTracker._trackEvent(cat, 'carousel', (pnmode === 'next' ? 'right' : 'left'))} catch(err) {}
          }
      }
    };

    $(containerSelector + ' a.next, ' + containerSelector + ' a.prev').bind('click', pnf);
    $(containerSelector + ' a.next, ' + containerSelector + ' a.prev').bind('shownext', pnf);

    $(containerSelector + ' ' + contentSelector).click(function(evt) {
        evt.preventDefault();
        document.location = $(this).parent().parent().parent().find('h3 a').attr('href');
    });

    var autoClick = setInterval(function() {
        $(containerSelector + ' a.next').trigger('shownext');
    },5000);
  };

  function makeTextFader(containerSelector, contentSelector, displayType) {
    $(containerSelector+' '+contentSelector+':first').css('display', displayType);
    
    // $(containerSelector + ' a.next, ' + containerSelector + ' a.prev').click(function(){
    $(containerSelector + ' a.next').click(function(){
    
      $(containerSelector+' '+contentSelector).each(function() {
        if($(this).css('display') == displayType){
          $(this).fadeOut('medium', function() {
            if($(this).next(contentSelector).length) {
              $(this).next(contentSelector).fadeIn('medium');
            }
            else {
              $(containerSelector+' '+contentSelector+':first').fadeIn('medium');
            }
          });
        }
      });
    return false;
    });
    $(containerSelector + ' a.prev').click(function(){
      
      $(containerSelector+' '+contentSelector).each(function(intIndex) {
        if($(this).css('display') == displayType){
          $(this).fadeOut('medium', function() {
            if($(this).prev(contentSelector).length) {
              $(this).prev(contentSelector).fadeIn('medium');
            } else {
              $(containerSelector+' '+contentSelector+':last').fadeIn('medium');
            }
          });
        }
      });
    return false;
    });
  }
  
  // Function to swap the calendar tabs and load in the content relevant
  // to the first tab that just been swapped in
  function makeCalendarTabFader(containerSelector, contentSelector) {

    //display the controls
    $(containerSelector+' span.prev-months').css('display','block');
    $(containerSelector+' span.next-months').css('display','block');
    
    //display the first content
    $(containerSelector+' '+contentSelector+':first').css('display','block');
    
    $(containerSelector + ' a.next').click(function(){
      
      $(containerSelector+' '+contentSelector).each(function() {
        if($(this).css('display') == 'block'){
          $(this).fadeOut('medium', function() {
            
            if($(this).next().length) {
              $(this).next().fadeIn('medium')
            }
            else {
              $(containerSelector+' '+contentSelector+':first').fadeIn('medium')            
            }
            swapCalendarContent();
          });
        }
      });
    return false;
    });
    
    $(containerSelector + ' a.prev').click(function(){
      
      $(containerSelector+' '+contentSelector).each(function(intIndex) {
        if($(this).css('display') == 'block'){
          $(this).fadeOut('medium', function() {
            if($(this).prev().length) {
              $(this).prev().fadeIn('medium')            
            }
            else {
              $(containerSelector+' '+contentSelector+':last').fadeIn('medium')
            }
            swapCalendarContent();
          });
        }
      });
    return false;
    });
    
  }
  
  // Function that turns normal images into an image slider,
  // sliderSelector: The ID container of the images/navigation
  // sliderComponents: The components within the container that are to scroll
  function makeSlider(sliderSelector, sliderComponents, transitionType) {    
    $(sliderSelector + ' .slider').cycle({
      fx:     transitionType,
      speed:  1200,
      timeout: 0,
      prev: sliderSelector + ' .prev',
      next: sliderSelector + ' .next',
      easing: 'backinout'
    });
  }
  
  // Function to write in the navigation for each snippet on a page
  function setUpSnippetNavigation(navigationContainer) {
    $(navigationContainer)
    .append('<div class="navigation">' +
          '<a class="prev" href="#"><span class="hide-content">Previous</span></a>' +
           '<div class="navigation-totals"><span  class="current">1</span> / <span  class="total"></span></div>' +
          '<a class="next" href="#"><span class="hide-content">Next</span></a>' +
        '</div>');
    
    //for each of the navigations, work out the correct numbers
    $(navigationContainer).each(function() {
      
      //get id of the navigation parent
      var sliderSelector = '#'+ $(this).parent().attr('id');
      
      //if it is did-you-know, then it will be text content, else img content
      //if(sliderSelector == '#did-you-know')
        var totalNumber = $(sliderSelector + ' div.content').size();
      //else
        //var totalNumber = $(sliderSelector + ' div.slider img').size();  
      
      // Grab current page element
      var elCurrent = $(sliderSelector + ' span.current');
      
      // Correctly set the total number of images in the slider 
      $(sliderSelector + ' span.total').html(totalNumber);
  
      // On click of 'previous' button, work out what the current page number should be
      $(sliderSelector + ' a.prev').click(function(){
        var currentNumber = parseInt($(sliderSelector + ' span.current').html());
        if (currentNumber == 1) {
          elCurrent.html(totalNumber)
        } else {
          elCurrent.html(currentNumber - 1)
        }
      })
      
      // On click of 'next' button, work out what the current page number should be
      $(sliderSelector + ' a.next').click(function(){
        var currentNumber = parseInt($(sliderSelector + ' span.current').html());
        if (currentNumber == totalNumber) {
          elCurrent.html(1)
        } else {
          elCurrent.html(currentNumber + 1)
        }
      })
    })

  }