/* <![CDATA[ */
jQuery(document).ready(function($){


jQuery.fn.slideFadeToggle = function(speed, easing, callback) {
  return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);  
};


$('#pane1').jScrollPane({
    animateTo:false,
    animateInterval:50,
    animateStep:5
    });
    
$('#navArch li a').each(function() {
    $(this).click(function() {
         $('.active').removeClass('active');
        $(this).parent().addClass('active');
    });
});


 Shadowbox.init({
   handleOversize: "drag",
   modal: true
});

$("#bar").animate({ 
    width: "30%"
  }, 3500 );

$('#panel').hide().css({ height: '0' });
$('#panel_inner').hide();

$('#btnVcard').toggle(

    function(){

        /* SLIDER ELEMENTS */
        if(jQuery.browser.msie) {
                $('.slides').css("display","none");
                $('.previous').css("display","none");
                $('.next').css("display","none");
        } else {
                $('.slides').stop().animate({"opacity": "0"}, "fast");
                $('.previous').stop().animate({"opacity": "0"}, "fast");
                $('.next').stop().animate({"opacity": "0"}, "fast");
        }
        /*$('.slides').stop().fadeTo("slow", 0.33);
        $('.previous').stop().fadeTo('slow', 0, function() { $(this).hide();  });
        $('.next').stop().fadeTo('slow', 0, function() { $(this).hide();  });*/

        /*PANEL*/
        $('#panel').stop().animate({
           height: "457", 
           opacity:1
        },1000,function(){
            $('#panel_inner').css({ opacity : 1 });
            $('#panel_inner').stop().fadeIn(350);

        });

        /*CONTROLER*/
        $(this).toggleClass('toggleOpen');
    },
    function(){

        /* SLIDER ELEMENTS */
        if(jQuery.browser.msie) {
                $('.slides').css("display","block");
                $('.previous').css("display","block");
                $('.next').css("display","block");
        } else {
                $('.slides').stop().animate({"opacity": "1"}, "fast");
                $('.previous').stop().animate({"opacity": "1"}, "fast");
                $('.next').stop().animate({"opacity": "1"}, "fast");
        }
        
        /*$('.slides').stop().fadeTo("fast", 1);
        $('.previous').stop().fadeTo('fast', 1, function() { $(this).show();   });
        $('.next').stop().fadeTo('fast', 1, function() { $(this).show();   });*/

        /*PANEL*/
        $('#panel_inner').stop().animate({
            opacity: 0
        },250, function(){
          $('#panel_inner').hide();
          //$('#panel_inner').fadeIn();
          $('#panel').stop().animate({
            height: "0", 
            opacity:0.3
          }, 600);
        } );

        /*CONTROLER*/
        $(this).toggleClass('toggleOpen');


    }
);

/*TAGS */
$(".tags a").append('<span>&nbsp;</span>');
$("ul.wp-tag-cloud li a").append('<span>&nbsp;</span>');

//$(".tags a").wrapInner('<span />');
/* SHADOW */
$(".project-screen").append('<img class="shadow" src="http://mauriciocaballero.com/wp-content/themes/yeux/pix/iface/icons-shadow.png" width="100%" height="27" alt="" />');
  
  $(".project-screen").hover(function() {
      var e = this;
      $(e).find("img.wp-post-image").stop().animate({ marginTop: "5px" }, 250, function() {
          $(e).find("img.wp-post-image").animate({ marginTop: "8px" }, 350);
      });
      //ribbon
      $(e).find("img.ribbon").stop().animate({ top: "0px" }, 250, function() {
          $(e).find("img.ribbon").animate({ top: "3px" }, 350);
      });
       //grid
      $(e).find(".grid_dev").stop().animate({ top: "14px" }, 250, function() {
          $(e).find(".grid_dev").animate({ top: "17px" }, 350);
      });
	  //media
	  $(e).find(".media").stop().animate({ top: "313px" }, 250, function() {
          $(e).find(".media").stop().animate({ top: "316px" }, 350);
      });
	  //shadow
      $(e).find("img.shadow").stop().animate({ width: "90%", height: "20px", marginLeft: "20px", opacity: 0.45 }, 400);
  },function(){
      var e = this;
      $(e).find("img.wp-post-image").stop().animate({ marginTop: "20px" }, 250, function() {
          $(e).find("img.wp-post-image").animate({ marginTop: "12px" }, 350);
      });
       //ribbon
      $(e).find("img.ribbon").stop().animate({ top: "15px" }, 250, function() {
          $(e).find("img.ribbon").animate({ top: "7px" }, 350);
      });
       //grid
      $(e).find(".grid_dev").stop().animate({ top: "29px" }, 250, function() {
          $(e).find(".grid_dev").animate({ top: "21px" }, 350);
      });
	  //media
	  $(e).find(".media").stop().animate({ top: "328px" }, 250, function() {
          $(e).find(".media").stop().animate({ top: "320px" }, 350);
	 });
	  //shadow
      $(e).find("img.shadow").stop().animate({ width: "100%", height: "27px", marginLeft: "0", opacity: 1 }, 350);
  });



$(".navigation .alignright a").addClass('next');
$(".navigation .alignleft a").addClass('previous');

$(".previous").prepend('<span>&nbsp;</span>');
 $('a.previous').hover(function() {
          $(this).stop().animate({ 
              width: "45px",
            left : "-35px" }, 350);            
      }, function() {
          $(this).stop().animate({
              width: "34px",
              left : "-24px" }, 250);
      });
$(".next").prepend('<span>&nbsp;</span>');
 $('a.next').hover(function() {
          $(this).stop().animate({ 
              width: "45px",
            right : "-35px" }, 350);            
      }, function() {
          $(this).stop().animate({
              width: "34px",
              right : "-24px" }, 250);
      });

/* CUSTOM FONTS */
Cufon('.post h2', {
    color: '#122a45',
        hover: {
            color: '#ff004e'
    }
});

Cufon.replace('h3', {
    textShadow: '1px 1px rgba(255, 255, 255, 0.5)'
});
Cufon.replace('h4');
Cufon.replace('h5');
Cufon.replace('h6');

Cufon.replace('#vcard .fn', {
    textShadow: '1px 1px rgba(8, 46, 84, 0.8)'
});


/* SLIDER */

$('#slider').loopedSlider({
            container: '.slider-container', // Class or ID of main container
            slides: '.slides', // Class or ID of slide container
            pagination: '.pagination', // Class or ID of pagination container
            containerClick: false, // Click container for next slide
            autoStart: 0, // Set to positive number for auto start and interval time
            restart: 0, // Set to positive number for restart and restart interval
            slidespeed: 300, // Speed of slide animation
            fadespeed: 300, // Speed of fade animation
            autoHeight: false // Set to positive number for auto height and animation speed
        });

/* TOOLTIPS */    
$("acronym").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,   
    gravity: 's'
    });    
$(".tipTop").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,   
    gravity: 's'
    });  
$(".tipRight").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,   
    gravity: 'w'
    });
$(".tipBottom").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,   
    gravity: 'n'
    });
$(".tipLeft").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'e'
    });    
$(".tipSe").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'se'
    });  
$(".tipSw").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'sw'
    }); 	  
$(".tipNe").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'ne'
    });
$(".tipNw").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'nw'
    });
$(".pagination a").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'sw'
    });        
$(".project-tools a").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true, 
    gravity: 'nw'
    });        
$(".ribbon").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,
    title: 'alt',
    gravity: 'se'
    });         
$(".agncy a").tipsy({
    delayIn: 200, 
    delayOut: 100,
    fade: true,   
    gravity: 'w'
    });
$('a[href^=mailto:]').each(function(i) {
        var xr = this.href.match(/^mailto:([0-9a-f]+)$/);
        if(!xr) {  return; }
        var x = xr[1]; // encoded address
        var s = 'hola@mauriciocaballero.com'; // decoded address
        /*
        Here be decoding of 'x' into 's'.
        */
        xr = s.split(/\|/);  // optionally split real address from url text
        this.href = "mailto:" + xr[0];
        if(xr.length > 1) {  $(this).html(xr[1]); }
    });

});

 // wrap as a jQuery plugin and pass jQuery in to our anoymous function
    (function ($) {
        $.fn.cross = function (options) {
            return this.each(function (i) { 
                // cache the copy of jQuery(this) - the start image
                var $$ = $(this);
                
                // get the target from the backgroundImage + regexp
                var target = $$.css('backgroundImage').replace(/^url|[\(\)'"]/g, '');

                // nice long chain: wrap img element in span
                $$.wrap('<span style="position: relative;"></span>')
                    // change selector to parent - i.e. newly created span
                    .parent()
                    // prepend a new image inside the span
                    .prepend('<img>')
                    // change the selector to the newly created image
                    .find(':first-child')
                    // set the image to the target
                    .attr('src', target);

                // the CSS styling of the start image needs to be handled
                // differently for different browsers
                if ($.browser.msie || $.browser.mozilla) {
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : '',
                        'top' : this.offsetTop
                    });
                } else if ($.browser.opera && $.browser.version < 9.5) {
                    // Browser sniffing is bad - however opera < 9.5 has a render bug 
                    // so this is required to get around it we can't apply the 'top' : 0 
                    // separately because Mozilla strips the style set originally somehow...                    
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : '',
                        'top' : "0"
                    });
                } else { // Safari
                    $$.css({
                        'position' : 'absolute', 
                        'left' : 0,
                        'background' : ''
                    });
                }

                // similar effect as single image technique, except using .animate 
                // which will handle the fading up from the right opacity for us
                $$.hover(function () {
                    $$.stop().animate({
                        opacity: 0
                    }, 650);
                }, function () {
                    $$.stop().animate({
                        opacity: 1
                    }, 350);
                });
            });
        };
        
    })(jQuery);
    
    // note that this uses the .bind('load') on the window object, rather than $(document).ready() 
    // because .ready() fires before the images have loaded, but we need to fire *after* because
    // our code relies on the dimensions of the images already in place.
    $(window).bind('load', function () {
        $('img.fade').cross();
    });
/* ]]> */

