$(function() {
  //604
  //3020
  $(document).ready(function() {
    
    $(".wp-post-image").each(function(){
      $(this).after('<div class="round_frame" style="width: '+$(this).css('width')+'; height: '+$(this).css('height')+';  background: transparent url('+$(this).attr('src')+') top left no-repeat;"></div>');
      if($(this).parent().parent().attr('class') == 'about2' || $(this).parent().parent().attr('class') == 'blog_item'){
        //alert($(this).css('width'));
        // Resize Background Image
        resize_background($(this).next(),$(this).attr('src'));
      }
      $(this).remove();
    });

    function body_height()
    {
      var window_height = $(window).height();
      //alert(window_height);
      if ( window_height > 580 ){
        var height_10 = $(document).height() / 10;
        var body_height = height_10 * 8;
        var body_margin = (body_height / 2);
        var body_top = 50;
        $("#body_wrapper").css( 'height', body_height+'px' );
        $("#body_wrapper").css( 'marginTop', -body_margin+'px' );
        $("#body_wrapper").css( 'top', '50%' );
      }
    }

    var window_height = $(window).height();
    //$(".story").css( 'height', window_height+'px');
    var opener = null;
    var winRef = null;

    $("#back_to_island").click(function() {

      if(winRef){
        var test = winRef.focus();
      }
      else{
        winRef = window.open( 'http://www.rumblecreative.co.uk', 'myWindow' );
      }
      return false;

    });


    if ( window.location.href == 'http://localhost/rumble/' || window.location.href == 'http://www.rumblecreative.co.uk/' ) {
      //body_height();
      $("body").css( 'overflow', 'hidden');
      if ( !$.browser.msie ) {
        $("h1").css( 'opacity', 0);
        $(".about2").css( 'opacity', 0);
        $("#page-item-1 .about").css( 'opacity', 0);
        $("body").find('h1').oneTime(1000, 'controlled', function() {
            $("h1").stop().animate({ opacity: 1 }, 2000);
        });
        $("body").find('h1').oneTime(2000, 'controlled', function() {
            $("#test1").stop().animate({ opacity: 1 }, 1000);
        });
        $("body").find('h1').oneTime(3000, 'controlled', function() {
            $("#test2").stop().animate({ opacity: 1 }, 1000);
        });
        $("body").find('h1').oneTime(4000, 'controlled', function() {
            $("#test3").stop().animate({ opacity: 1 }, 1000);
        });
      }
      $("#page_navigation").append('<div id="up">&lt;</div><div id="down">&gt;</div>');
    }
    
    $(".external_link").click(function(){
      window.open($(this).attr('href'));
      return false;
    });
    
    $(window).resize(function() {
      if ( current_navigation > 1 ){
        var new_window_height = $(window).height();
        var multiplier = current_navigation - 1;
        var new_position = new_window_height * multiplier;
        $(document).scrollTo(new_position, { axis:'y' }, 2000);
      } 
      //body_height();
    });

    // Make top item current when page loads
    //$(document).scrollTo("#page-item-1", 2000);
    $(".menu ul li.page-item-1").attr('id','current');
    var current_navigation = 1;
    $("#up").addClass("inactive");

    var wrapper_margin_left;
    var wrapper_margin_top;
    var sub_content_wrapper;
    var sub_navigation;
    var old_navigation;
    var page_item;
    var modified = false;
    var active = false;
    var default_image;
    var media_src;
    var media_type;
    var callback = 1;
    var media_active = 1;

    function scroll_page() {

      // Scroll to specific div on page
      var new_position = $("#page-item-"+current_navigation).position();
      $("#body_content").stop().animate({ marginLeft: -new_position.left+"px" }, 1000);
      reset_id(1);
      $(".sub_content_wrapper").css({ marginTop: "0px", marginLeft: "0px" });
      if ( current_navigation == 2 ){
        active = true;
      }

      if ( current_navigation == 2 ) {
        var cut = 9;
        // Get class from href attribute
        var theClass = $("#page-item-2 li:first-child a").attr('href');
        // Get length of class
        var strLength = theClass.length;

        // Remove unneccesary class names
        var id = theClass.substr(cut,strLength);
        // TEST
        if ( $.browser.msie ) {
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background') );
        }
        else{
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background-image') );
        }
        page_item = 'page-item-2';
        $(".item a img").addClass('active_image');
        $(".thumbnails").parent().find("a").addClass( 'show_media');
        media_active = 1;
        // Add callbacks for media
        if ( callback == 1 ) {
          addCallbacks(".show_media");
          callback++;
        }
      }

      if ( current_navigation == 2 || current_navigation == 3 || current_navigation == 4 ){

        $("#page-item-"+current_navigation+" .sub_menu ul li:first-child").attr('id','current_sub');
        var theClass = $("#page-item-"+current_navigation+" .sub_menu ul li:first-child a").attr('href');
        reset_nav();
        // Get length of class
        var strLength = theClass.length;
        // Length of class names to ignore
        var cut = 9;
        // Remove unneccesary class names
        var id = theClass.substr(cut,strLength);
        sub_navigation = id;
        old_navigation = sub_navigation;
      
      }
    }
    
    function background_image(str)
    {
      if ( $.browser.msie ) {
        str = str.replace(') no-repeat left top', '');
        str = str.replace('url(', '');
      }
      if ( $.browser.safari ) {
        str = str.replace(') no-repeat 0% 0%', '');
        str = str.replace(') no-repeat 0px 50%', '');
        str = str.replace('transparent url(', '');
        str = str.replace(')', '');
        str = str.replace('url(', '');
      }
      else {
        str = str.replace('") no-repeat scroll 0px 50% transparent', '');
        str = str.replace('") no-repeat scroll left top transparent', '');
        str = str.replace('")', '');
        str = str.replace('url("', '');
      }
      return str;
    }
    
    function reset_id(mode) {
      // Reset all menu items to default
      if ( mode ){
        $(".sub_menu ul li").attr('id','');
      }
      else {
        $(".menu ul li").attr('id','');
      }
      $(".sub_menu ul li span").hide();
      $(".menu ul li span.link").hide();
    }

    function set_id(mode) {
      // Set current menu item
      if ( mode ){
        $(".sub_menu ul li.sub-item-"+sub_navigation).attr('id','current_sub');
      }
      else {
        $(".menu ul li.page-item-"+current_navigation).attr('id','current');
      }                             
      $(".sub_menu ul li span").show();
      $(".menu ul li span.link").show();
    }
    
    $("#home_link").click(function() {

      current_navigation = 1;
      clear_content();
      clear_media(1);
      $(".sub_content_wrapper").css( 'marginLeft', '0px');
      scroll_page();
      active_nav1();
      reset_id(0);
      set_id(0);
      wrapper_margin_top = 0;
      wrapper_margin_left = 0;
      revert();
      return false;

    });
    
    $(".internal_link").click(function() {
      
      var id = $(this).attr('id').replace("internal_","");

      current_navigation = id;
      clear_content();
      clear_media(1);
      $(".sub_content_wrapper").css( 'marginLeft', '0px');
      scroll_page();
      active_nav1();
      reset_id(0);
      set_id(0);
      wrapper_margin_top = 0;
      wrapper_margin_left = 0;
      revert();
      return false;

    });

    $("#up").click(function() {
      if ( current_navigation > 1 ) {
        current_navigation--;
        clear_content();
        clear_media(1);
        scroll_page();
        active_nav1();
        reset_id(0);
        set_id(0);
        wrapper_margin_top = 0;
        wrapper_margin_left = 0;
      }
    });

    $("#down").click(function() {
      if ( current_navigation < 6 ) {
        current_navigation++;
        clear_content();
        clear_media(1);
        scroll_page();
        active_nav1();
        reset_id(0);
        set_id(0);
        wrapper_margin_top = 0;
        wrapper_margin_left = 0;
      }
    });

    $(".menu ul li a").click(function() {
      var theClass = $(this).parent().attr('class');
      var strLength = theClass.length;
      var cut = 20;
      var id = theClass.substr(cut,strLength);
      current_navigation = id;
      clear_content();
      clear_media(1);
      $(".sub_content_wrapper").css( 'marginLeft', '0px');
      scroll_page();
      active_nav1();
      reset_id(0);
      set_id(0);
      wrapper_margin_top = 0;
      wrapper_margin_left = 0;
      revert();
      return false;
    });
    
    $(".left").click(function() {
      modified = true;
      // Get the sub_content_wrapper for this div
      sub_content_wrapper = $(this).parent().next();
      // Get class from href attribute
      var theClass = $("#current_sub").prev().children().attr('href');
      active_nav( 'left', 0 );
      // Get length of class
      var strLength = theClass.length;
      // Length of class names to ignore
      var cut = 9;
      // Remove unneccesary class names
      var id = theClass.substr(cut,strLength);
      sub_navigation = id;
      // Get selected item
      if ( current_navigation == 4) {
        var item = $("#sub_"+id).parent();
      }
      else {                
        var item = $("#sub_"+id);
      }
      // Get position of selected item
      var item = item.position();
      // Get current margin of content wrapper
      wrapper_margin_left = $(sub_content_wrapper).css('marginLeft').replace('px','');
      // Specify new margin of content wrapper
      var margin_left = wrapper_margin_left - item.left;

      // If selected item is not currently first    
      clear_content();
      clear_media(1);
      $(sub_content_wrapper).stop().animate({ marginLeft: margin_left+"px" }, 500);
      reset_id(1);
      set_id(1);

      if ( current_navigation == 2) { 
        active = true;
        // TEST
        if ( $.browser.msie ) {
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background') );
        }
        else{
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background-image') );
        }
        $(".item a img").addClass('active_image');
        $(".thumbnails").parent().find("a").addClass( 'show_media');
        media_active = 1;
      }
      return false;
    });
    
    function reset_nav ()
    {
      switch(current_navigation){
        case '2': var section = 'about'; break;
        case 2:   var section = 'about'; break;
        case '3': var section = 'service'; break;
        case 3:   var section = 'service'; break;
        case '4': var section = 'client'; break;
        case 4:   var section = 'client'; break;
      }
      $(".left").addClass("inactive");
      $(".right").removeClass("inactive");
      
      if ( $("."+section).size() < 1 ){
        $(".right").addClass("inactive");
      }
    }
    
    function active_nav1()
    {
      if ( current_navigation == 1 ){
        $("#up").addClass("inactive");
      }
      else {
        $("#up").removeClass("inactive");
      }
      if ( current_navigation == 6 ){
        $("#down").addClass("inactive");
      }
      else {
        $("#down").removeClass("inactive");
      }
    }
    
    function active_nav( direction, item )
    {
      $(".left").removeClass("inactive");
      $(".right").removeClass("inactive");
      if ( direction == 'left' ){
        var theClass3 = $("#current_sub").prev().children().attr('href');
        var theClass4 = $("#current_sub").prev().prev().children().attr('href');
        if ( !theClass4 ){
          $(".left").addClass("inactive");
        }
        else {
          $(".left").removeClass("inactive");
        }
      }
      else {
        if ( direction == 'right' ){
          var theClass = $("#current_sub").next().children().attr('href');
          var theClass2 = $("#current_sub").next().next().children().attr('href');
          if ( !theClass2 ){
            $(".right").addClass("inactive");
          }
          else {
            $(".right").removeClass("inactive");
          }
        }
        else {
          if ( direction == 'click' ){
            var theClass = $(item).parent().parent().prev().children().attr('href');
            var theClass2 = $(item).parent().parent().next().children().attr('href');
            if ( !theClass ){
              $(".left").addClass("inactive");
            }
            else {
              $(".left").removeClass("inactive");
            }
            if ( !theClass2 ){
              $(".right").addClass("inactive");
            }
            else {
              $(".right").removeClass("inactive");
            }
          }
        }
      } 
    }

    $(".right").click(function() {
      modified = true;
      // Get the sub_content_wrapper for this div
      sub_content_wrapper = $(this).parent().next();
      // Get class from href attribute
      var theClass = $("#current_sub").next().children().attr('href');
      active_nav( 'right', 0 );
      // Get length of class
      var strLength = theClass.length;
      // Length of class names to ignore
      var cut = 9;
      // Remove unneccesary class names
      var id = theClass.substr(cut,strLength);
      sub_navigation = id;
      // Get selected item
      if ( current_navigation == 4) {
        var item = $("#sub_"+id).parent();
      }
      else {                
        var item = $("#sub_"+id);
      }
      // Get position of selected item
      var item = item.position();
      // Get current margin of content wrapper
      wrapper_margin_left = $(sub_content_wrapper).css('marginLeft').replace('px','');
      // Specify new margin of content wrapper
      var margin_left = wrapper_margin_left - item.left;

      // If selected item is not currently first    
      clear_content();
      clear_media(1);
      $(sub_content_wrapper).stop().animate({ marginLeft: margin_left+"px" }, 500);
      reset_id(1);
      set_id(1);

      if ( current_navigation == 2) { 
        active = true;
        // TEST
        if ( $.browser.msie ) {
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background') );
        }
        else{
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background-image') );
        }
        $(".item a img").addClass('active_image');
        $(".thumbnails").parent().find("a").addClass( 'show_media');
        media_active = 1;
      }
      return false;
    });

    $(".sub_menu a").click(function() {
      return false;
    });

    $(".sub_menu a span").click(function() {
      modified = true;
      // Get the sub_content_wrapper for this div
      sub_content_wrapper = $(this).parent().parent().parent().parent().next();
      // Get class from href attribute
      var theClass = $(this).parent().attr('href');
      active_nav( 'click', this );
      // Get length of class
      var strLength = theClass.length;
      // Length of class names to ignore
      var cut = 9;
      // Remove unneccesary class names
      var id = theClass.substr(cut,strLength);
      sub_navigation = id;
      // Get selected item
      if ( current_navigation == 4) {
        var item = $("#sub_"+id).parent();
      }
      else {
        var item = $("#sub_"+id);
      }
      // Get position of selected item
      var item = item.position();
      // Get current margin of content wrapper                                
      wrapper_margin_top = $(sub_content_wrapper).css('marginTop').replace('px','');
      wrapper_margin_left = $(sub_content_wrapper).css('marginLeft').replace('px','');
      // Specify new margin of content wrapper
      var margin_top = (wrapper_margin_top - item.top) + 49;
      // Specify new margin of content wrapper
      var margin_left = wrapper_margin_left - item.left;

      // If selected item is not currently first    
      clear_content();
      clear_media(1);
      $(sub_content_wrapper).stop().animate({ marginLeft: margin_left+"px", marginTop: margin_top+"px" }, 500);
      reset_id(1);
      set_id(1);

      if ( current_navigation == 2) {
        active = true;
        // TEST
        if ( $.browser.msie ) {
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background') );
        }
        else{
          media_src = background_image ( $("#sub_"+id+" .round_frame").css('background-image') );
        }
        $(".item a img").addClass('active_image');
        $(".thumbnails").parent().find("a").addClass( 'show_media');
        media_active = 1;
      }
      return false;
    });
    
    $(".item a").click(function() { 
      if($(this).parents(".article_content").length == 1){
        window.open($(this).attr('href'));
      }
      if(!active){
        //alert($(this).find('.round_frame').parent().html());
        //alert($(this).find('.round_frame').css('background-image'));
        // TEST
        if ( $.browser.msie ) {
          default_image = background_image ( $(this).find('.round_frame').css('background') );
        }
        else{
          default_image = background_image ( $(this).find('.round_frame').css('background-image') );
        }
        // CHANGE TO BACKGROUND-IMAGE FOR FIREFOX
        //default_image = $(this).find('img').attr('src');
        modified = true;
        // Get the sub_content_wrapper for this div
        if ( current_navigation == 4) {
          sub_content_wrapper = $(this).parent().parent().parent();
          page_item = $(this).parent().parent().parent().parent().parent().attr('id');
        }
        else {
          sub_content_wrapper = $(this).parent().parent();
          page_item = $(this).parent().parent().parent().parent().attr('id');
        }

        //Length of class names to ignore
        var cut = 9;
        var extra = 0;

        if ( current_navigation == 4) {
          
          if ($(this).parent().prev().hasClass('client')){
            // Get class from href attribute
            var theClass2 = $(this).parent().prev().find('a').attr('href');
            // Get length of class
            var strLength2 = theClass2.length;
            // Remove unneccesary class names
            var id2 = theClass2.substr(cut,strLength2);
            extra = 0;
          }
        
        }

        // Get class from href attribute
        var theClass = $(this).attr('href');
        // Get length of class
        var strLength = theClass.length;

        // Remove unneccesary class names
        var id = theClass.substr(cut,strLength);
        old_navigation = sub_navigation;

        if ( current_navigation == 4) {

          if ($(this).parent().prev().hasClass('client')){
            sub_navigation = id2;
          }
          else {
            sub_navigation = id;
          }
        
        }
        else {   
          
          sub_navigation = id;
        
        }

        // Get selected item
        var item = $("#sub_"+id);
        // Get position of selected item
        var item = item.position();
        // Get current margin of content wrapper
        wrapper_margin_left = $(sub_content_wrapper).css('marginLeft').replace('px','');

        if ( current_navigation == 4) {
          
          // Get selected group
          var group = $("#sub_"+id).parent();
          // Get position of selected group
          var group = group.position()
          // Get current margin of content wrapper
          wrapper_margin_top = $(sub_content_wrapper).css('marginTop').replace('px','');
          // Specify new margin of content wrapper
          var margin_top = (wrapper_margin_top - item.top) + extra;
          // Specify new margin of content wrapper
          var margin_left = wrapper_margin_left - group.left;
        
        }
        else {
                  
          // Specify new margin of content wrapper
          var margin_left = wrapper_margin_left - item.left;

        }

        // If selected item is not currently first
        clear_content();
        clear_media(1);
        $("#sub_"+id).siblings().stop().animate({ opacity: 0 }, 500);
        //$("#sub_"+id).siblings().css( 'visibility', 'hidden');
        $(this).css( 'zIndex', '-1');
        $(".item a span").css( 'display', 'none');
        
        if ( current_navigation == 4) {
          $("#sub_"+id).parent().siblings().children().stop().animate({ opacity: 0 }, 500);
          $(sub_content_wrapper).stop().animate({ marginLeft: margin_left+"px", marginTop: margin_top+"px" }, 500);
        }
        else {
          $(sub_content_wrapper).stop().animate({ marginLeft: margin_left+"px" }, 500);
        }

        show_content(id);
        reset_id(1);
        set_id(1);
        active = true;
      }
      return false;
    });
    
    function revert ()
    {
      if ( modified ) {
        $(sub_content_wrapper).stop().animate({ marginTop: wrapper_margin_top+"px", marginLeft: wrapper_margin_left+"px" }, 500);
        sub_navigation = old_navigation;
      }
    }

    function show_content ( id ) {

      $("#"+page_item+" .sub_content").append('<div id="article_content"><h2>'+$("#sub_"+id).find("span").html()+'</h2><div>'+$("#sub_"+id).find(".full_content").html()+'</div></div>');
      $("#article_content").stop().animate({ left: "222px" }, 500);
      $("#sub_"+id).append('<div class="thumbnails">'+$("#sub_"+id).find(".images").html()+$("#sub_"+id).find(".videos").html()+'</div>');
      
      // TEST
      if ( $.browser.msie ) {
        media_src = background_image ( $("#sub_"+id+" .round_frame").css('background') );
      }
      else{
        media_src = background_image ( $("#sub_"+id+" .round_frame").css('background-image') );
      }

      var test1 = '';
      // Creat video thumbnails
      $(".thumbnails img").each(function() {
        $(this).attr('rel','image');
      });
      /*$(".thumbnails object").each(function(){
        if ( $.browser.msie ) {
          var patt1=new RegExp('<PARAM NAME="Src" +VALUE="(.+?)["/?:]>');
          var output = patt1.exec($(this).html());
          var img = output[1].replace("v/","watch?v=");
        }
        else {
          var img = $(this).find('param[name="src"]').attr('value').replace("v/","watch?v=");
        }    
        var id = img.replace("http://www.youtube.com/watch?v=","");
        $(".thumbnails").append('<img src="'+$.jYoutube(img,'large')+'" alt="Video Thumbnail" rel="video" id="'+id+'" />');
      });*/
      $(".thumbnails span").each(function(){
        
        var id = $(this).html().replace("http://vimeo.com/","");
        id = id.substring(0, id.length-1);

        $.getJSON('http://www.vimeo.com/api/v2/video/' + id + '.json?callback=?', {format: "json"}, function(data) {
         //$(".thumbs").attr('src', data[0].thumbnail_large);
         $(".thumbnails").append('<img src="'+data[0].thumbnail_large+'" class="vimeo" alt="Video Thumbnail" rel="vimeo" id="'+id+'" />');
      addCallbacks(".vimeo");
});
      });
  
      // Add back link
      $("#sub_"+id).append('<a href="" class="back_to_list">&lt; Go back</a>');

      // Add callbacks
      addCallbacks(".thumbnails");
      addCallbacks(".back_to_list");
      $(".item a img").addClass('active_image');
    }

    function clear_content () {
      media_active = 0;
      media_type = 'image';
      thumbnail_callback = false;
      // Resize Background Image 
      resize_background($(".thumbnails").parent().find(".round_frame"),default_image);
      //$(".sub_content_wrapper").css({marginLeft: '0px', marginTop: '0px'});
      $("#article_content").remove();
      $(".thumbnails").remove();
      $(".back_to_list").remove();
      //$("#article_content").stop().animate({ left: "888px" }, 500);
      $(".group").stop().animate({ opacity: 1 }, 500);
      //$(".group").css( 'visibility', 'visible');
      $(".sub_content_item").stop().animate({ opacity: 1 }, 500);
      //$(".sub_content_item").css( 'visibility', 'visible');
      $(".sub_content_item a").css( 'zIndex', '1');
      $(".sub_content_item a span").css( 'display', 'block');
      active = false;
      $(".item a img").removeClass('active_image');
    }

    function show_media ( id ) {
      
      var data = "img="+id;

      //start the ajax
        $.ajax({
          //this is the php file that processes the data and send mail
          url: "http://www.rumblecreative.co.uk/wp-content/themes/twentyten/js/change_image.php",
          
          //GET method is used
          type: "GET",

          //pass the data           
          data: data,
          
          //Do not cache the page
          cache: false,
          
          //success
          success: function (img) {

            if ( !$.browser.msie ) {
              $("#"+page_item+" .sub_content").stop().animate({ opacity: 0.2 }, 500);
            }
      
            $("body").find('#'+page_item).oneTime(500, 'controlled', function() {
              if (media_type == 'video') {
                $("#"+page_item).append('<div id="media_container"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="566" height="380" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0"><param name="src" value="http://www.youtube.com/v/'+id+'" /><embed type="application/x-shockwave-flash" width="566" height="380" src="http://www.youtube.com/v/'+id+'"></embed></object><a href="#" class="clear_media" title="Close Video">&nbsp;</a></div>');
                var element = 'object';
              }
              else{
                if (media_type == 'vimeo') {
                  $("#"+page_item).append('<div id="media_container"><iframe src="http://player.vimeo.com/video/'+id+'" width="566" height="380" frameborder="0"></iframe><a href="#" class="clear_media" title="Close Video">&nbsp;</a></div>');
                var element = 'iframe';
                }
                else {
                  $("#"+page_item).append('<div id="media_container"><img src="'+img+'" alt="'+img+'" /><a href="#" class="clear_media" title="Close Image">&nbsp;</a></div>');
                  var element = '.round_frame_full';
                  
                 $("#media_container img").after('<div title="'+$("#media_container img").attr('alt')+'" class="round_frame_full" style="width: '+$("#media_container img").width()+'px; height: '+$("#media_container img").height()+'px;  background: transparent url('+$("#media_container img").attr('src')+') top left no-repeat;"></div>');
                                                               
                 // Resize Background Image
                   resize_background($("#media_container img"),img);
  
                 $("#media_container img").remove();
                }
              }

              var img_str = img.split('-');
              var img_str_length = img_str.length;
              var img_str_length = img_str[img_str_length-1];
              var img_str_length = img_str_length.split('.');
              var img_dimensions = img_str_length[0].split('x');
              var new_width = img_dimensions[0];
              var new_height = img_dimensions[1];

              if(!new_height){
                new_width = $("#media_container "+element).width();
                new_height = $("#media_container "+element).height();
              }
			  
              $("#media_container "+element).css({ width: "566px", height: "380px", marginTop: "-190px", marginLeft: "-283px" });
              $("#media_container "+element).stop().animate({ height: "380px" }, 1000);
              var button_position_top = 179-(380/2)+20;
              var button_position_left = 445+(566/2)+10;
              $(".clear_media ").css({ top: button_position_top+"px", left: button_position_left+"px" });
      
              // Add callbacks
              addCallbacks(".clear_media");
            });
          
          }
        });
    }
    
    function clear_media ( mode ) {
      
      $("#media_container").remove();
      $(".show_media").removeClass('show_media');

      if ( !$.browser.msie ) {
        $("body").find('#'+page_item).oneTime(500, 'controlled', function() {
          $("#"+page_item+" .sub_content").stop().animate({ opacity: 1 }, 500);
        });
      }
    }

    $(".hover").hover(function() {
      if(media_active > 0){
        if (media_type == 'image') {
          $(".play").attr('src','wp-content/themes/twentyten/images/view.png');
          $(".play").attr('title','View Image');
        }
        else {
          $(".play").attr('src','wp-content/themes/twentyten/images/play.png');
          $(".play").attr('title','View Video');
        }
        $(".play").css('display','block');
        $(".active_image").addClass('indicator');
      }
    },
    function(){
      if(media_active > 0){
        $(".play").css('display','none');
        $(".active_image").removeClass('indicator');
      }
    });
    
    $(".hover").click(function(){
      
      switch (media_active) {
        
        case 0:
          media_active = 1;
        break;
        
        case 1:
          show_media( media_src );
          media_active = 2;
        break;
        
        case 2:
          show_media( media_src );
        break;
      
      }
      
      return false;
    
    });
    
    function resize_background(element, image)
    {
		//alert(image);
      $(element).css('background-image' , 'url('+image+')');
      $(element).css('background-position', '0px');
      $(element).css('background-repeat', 'no-repeat');
      $(element).css('background-size', 'cover');
      $(element).css('-moz-background-size', 'cover');
      $(element).css('filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+image+"', sizingMethod='scale')");
      $(element).css('-ms-filter', "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+image+"', sizingMethod='scale')");
      $(element).css('position', 'relative');
    }

    function addCallbacks ( element )
    {
      switch ($(element).attr('class')) {
        case 'thumbnails':
          $(element).children().click(function() {
            clear_media(1);
            if ( $(this).attr('rel') == "video" ){
              media_src = $(this).attr('id');
              media_type = 'video';
              var image_src = $(this).attr('src');
            }
            else {
              if( $(this).attr('rel') == "image" ){
                media_src = $(this).attr('src');
                media_type = 'image';
                var image_src = $(this).attr('src');
              }
            }              

            // Resize Background Image
            resize_background($(".thumbnails").parent().find(".round_frame"),image_src);

            $(".thumbnails").parent().find(".round_frame").attr('title', $(this).attr('title'));
            //$(".thumbnails").parent().find(".round_frame").attr('alt', $(this).attr('alt'));
            $(".thumbnails").parent().find(".round_frame").attr('rel', media_src);
                                                                          
            $(".thumbnails").parent().find("a").addClass( 'show_media');
            // Add callbacks for media
            if ( callback == 1 ) {
              addCallbacks(".show_media");
              callback++;
            }             
            media_active = 1;

            return false;
          
          });
        break;

        case 'vimeo':
          $(element).click(function() {

            media_src = $(this).attr('id');
            media_type = 'vimeo';
            var image_src = $(this).attr('src');

            // Resize Background Image
            resize_background($(".thumbnails").parent().find(".round_frame"),image_src);

            $(".thumbnails").parent().find(".round_frame").attr('title', $(this).attr('title'));
            //$(".thumbnails").parent().find(".round_frame").attr('alt', $(this).attr('alt'));
            $(".thumbnails").parent().find(".round_frame").attr('rel', media_src);
                                                                          
            $(".thumbnails").parent().find("a").addClass( 'show_media');
            // Add callbacks for media
            if ( callback == 1 ) {
              addCallbacks(".show_media");
              callback++;
            }             
            media_active = 1;

            return false;
          
          });
        break;
        
        case 'back_to_list':
          $(element).click(function() {
            clear_content();
            clear_media(1);
            revert();
            reset_id(1);
            set_id(1);
            //media_active = 0;
            return false;
          });
        break;
        
        case 'clear_media':
          $(element).click(function() {
            clear_media(0);
            return false;
          });
        break;

        case 'show_media':
          $(element).click(function() {
            switch (media_active) {
              case 0:
              break;
              case 1: 
              show_media( media_src );
              media_active = 2;
              break;
              case 2:
              show_media( media_src );
              break;
            }
            return false;
          });
        break;
      }

    }

  });

});
