$(function() {
  var defaultOptions = {
        resizable: false,
        closeOnEscape: true,
        autoOpen: false,
        width: '960px',
        modal: true
      },
      $dimOverlay,
      $videoOverlay,
      $tourOverlay,
      so,
      bigSwitch,
      MIN_FLASH_REQ = "8",
      flashContainer,
      movie = null; //we're always going to keep it around after we load it
  
  $("#popuplink").click(function(e){
    var options = {
      width: 600,
      height: 400,
      modal: true,
      buttons: {
        "Close": function() { $(this).dialog("close");}
      }
    }
    
    $("#popupfooter").dialog(options);
  });
  
  /**
  If we're entering the flash panel, currently panel #3, we'll move the container that
  holds the swf from offscreen into the panel itself.
  
  see afterFlashPanel
  */    
  beforeFlashPanel = function(currSlideElement, nextSlideElement, options, forwardFlag) {
    var nextId = $(nextSlideElement).attr("id"),
        flashContainer = $("#flashContainer"),
        holder;
    
    if (nextId != "panel-3") {
      holder = $(flashContainer).detach();
      $("#offscreen").append(holder);
    }
    
  };


  /**
  If we're leaving the flash panel, currently panel #3, we'll move the container that
  holds the swf back to offscreen.
  
  see beforeFlashPanel
  */
  afterFlashPanel = function(currSlideElement, nextSlideElement, options, forwardFlag) {
    var nextId = $(nextSlideElement).attr("id"),
        meetsMinFlashReq = swfobject.hasFlashPlayerVersion(MIN_FLASH_REQ),
        flashContainer = $("#flashContainer"),
        holder,
        att,
        par,
        id;

    if (nextId != "panel-3" || !meetsMinFlashReq) return;
    
    holder = $(flashContainer).detach();

    $("#panel-3").append(holder);

    if (!movie) {
      att = {
        data: "http://static.eharmony.com/assets/corp/flipbook/PeriodicTable-V4-600x430.swf?v=1",
        width: "600",
        height: "430"
      };

      par = {
        menu: "false",
        wmode:"transparent"
      };

      movie = swfobject.createSWF(att, par, "movie-3");
    }
  };

  if ($('#slideshow-overview').length) {
    $('#slideshow-overview').cycle({
      fx: 'wipe',
      cssBefore: {
        clip: 'rect(0px 701px 90px 600px)'
      },
      timeout: 0,
      autostop: 0,
      speed: 500,
      next: '.next',
      before: beforeFlashPanel,
      after: afterFlashPanel
    });
  }


  // Overview Experience
  $dimOverlay = $("<div class='overlay' id='overlay1'></div>")
    .html("<a class='close-link' href='#'><span>close</span></a><div class='dimensions'></div>")
    .dialog(defaultOptions);

  $videoOverlay = $("<div class='overlay' id='overlay2'></div>")
    .html("<a class='close-link' href='#'><span>close</span></a><div class='video'></div>")
    .dialog(defaultOptions);

  $tourOverlay = $("<div class='overlay' id='overlay3'></div>")
    .html("<a class='close-link' href='#'><span>close</span></a><div class='tour'></div>")
    .dialog(defaultOptions);

  $('#btn-learn').click(function () {
    $dimOverlay.dialog('open');
    $('.dimensions').html("<div id='flashcontent3' style='width: 960px; height: 550px;'></div>");
    so = new SWFObject("http://static.eharmony.com/assets/corp/flipbook/V2RollOver-29Definitions-960x550-1.swf", "tour", "960", "550", "8", "#FFFFFF");
    so.addParam("wmode", "transparent");
    so.write("flashcontent3");
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', '29 Dimensions Overlay']);
    }
    return false;
  });

  $('#btn-tour').click(function () {
    $tourOverlay.dialog('open');
    $('.tour').html("<div id='flashcontent2' style='width: 960px; height: 550px;'></div>");
    so = new SWFObject("http://static.eharmony.com/assets/corp/flipbook/ehTourLBH-960x550-1.swf", "tour", "960", "550", "8", "#FFFFFF");
    so.addParam("wmode", "transparent");
    so.write("flashcontent2");
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'Tour Overlay']);
    }
    return false;
  });

  $('.close-link').click(function () {
    if ($('.video').length) {
      $('.video').empty();
    };
    $('.overlay').dialog('close');
    return false;
  });


  $('#overview #btn-why').click(function () {
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'Why Join eHarmony']);
    }
    return false;
  });

  $('#overview #btn-how').click(function () {
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'How We Match']);
    }
    return false;
  });

  $('#overview #btn-new').click(function () {
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'New Features']);
    }
    return false;
  });

  $('#overview .nav1').click(function () {
    $('#slideshow-overview').cycle(0);
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'Home']);
    }
    return false;
  });

  $('#overview .nav2').click(function () {
    $('#slideshow-overview').cycle(1);
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'Why Join eHarmony']);
    }
    return false;
  });

  $('#overview .nav3').click(function () {
    $('#slideshow-overview').cycle(2);
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'How We Match']);
    }
    return false;
  });

  $('#overview .nav4').click(function () {
    $('#slideshow-overview').cycle(3);
    if (typeof _gaq.push != "undefined") {
      _gaq.push(['_trackEvent', 'Flipbook', 'New Features']);
    }
    return false;
  });  
  
}); //end onReady