﻿$j(document).ready(function () {
  //replace mediagallery in the markup
  var mediaGallery = $j('.MediaGallery');
  $j('.MediaGallery').remove();
  $j('#navMain').after(mediaGallery);
  // Close gallery
  $j(".MediaGallery .Close").click(
      function (event) {
        event.preventDefault();
        $j(".MediaGallery").addClass("Hidden");
      }
  );

  // Open gallery and select first image
      $j(".MediaGallerySelector .LinkContainer .Gallery, .MediaGallerySelector .LinkContainer .Gallery a").click(
    function (event) {
      event.preventDefault();
      selectMediaGalleryLink($j(".MediaGallery .Image:first"));
      switchGalleryContents();
    }
  );

  // Open gallery and select feature video
    $j(".MediaGallerySelector .LinkContainer .FeatureVideo, .MediaGallerySelector .LinkContainer .FeatureVideo a").click(
    function (event) {
      event.preventDefault();
      selectMediaGalleryLink($j(".MediaGallery .FeatureVideo"));
      switchGalleryContents();
    }
  );

  // Open gallery and select round view
    $j(".MediaGallerySelector .LinkContainer .RoundView, .MediaGallerySelector .LinkContainer .RoundView a").click(
    function (event) {
      event.preventDefault();
      selectMediaGalleryLink($j(".MediaGallery .RoundView"));
      switchGalleryContents();
    }
  );

  // Select gallery link and show related content
  $j(".MediaGallery .Navigation li a").click(
      function (event) {
        event.preventDefault();
        selectMediaGalleryLink($j(this).parent());
        switchGalleryContents();
      }
  );
});

function selectMediaGalleryLink(mediaGalleryLink) {
  $j(".MediaGallery").removeClass("Hidden");
  $j(".MediaGallery .Navigation li").removeClass("Selected");
  $j(mediaGalleryLink).addClass("Selected");
}

function switchGalleryContents() {
  var gallery = $j(".MediaGallery .Gallery");
  $j(gallery).empty();
  var media = $j(".MediaGallery .Selected .Media");
  if (media) {
    // clone() will not work properly in IE8 and earlier when the div containing the object-element is cloned directly. 
    // Instead the object-element has to be cloned "by itself".
    $j(gallery).append('<div class="Media"></div>');
    var mediaDiv = $j(".Media", gallery);
    $j(media).clone().appendTo(mediaDiv); 
  }
}
