Cufon.replace('#masthead .navigation li a');
Cufon.replace('h2, h3:not(body.request-a-quote h3)');
Cufon.replace('.section-navigation li a', {'hover': true});
Cufon.replace('body.portfolio .work .meta h4');
Cufon.replace('#contact p.headline');
Cufon.replace('#contact a.call-to-action');

$(document).ready(function (event) {
    
    // Demi
    $('a#demi').hide();
    $('a#demi').delay(1500).slideDown(300);
    $('body').live('click', function (event) {
      $('a#demi').slideUp(300);
    });
    
    // External Links
    $('a[rel*="external"]').live('click', function (event) {
        var href = $(this).attr('href'),
            newWindow = window.open(href, '_blank');
        newWindow.focus();
        return false;
    });
    
    // Smooth Scrolling
    $('a[href^="#"]').live('click.smoothscroll', function (event) {
        var href = $(this).attr('href'),
            targetElement;
        
        if (href && href != '#') {
            targetElement = $(href);
            $('html, body').animate({
                scrollTop: targetElement.offset().top
            }, 600, 'easeInOutExpo');
            return false;
        }
    });
    
    // Image Expansion
    $('a.image-wrap').each(function (i) {
        var originalScrollY = null;
        $(this).toggle(function (event) {
            originalScrollY = window.scrollY;
            $(this).find('.mask').animate({'height': $(this).find('img.feature').height()}, 800, 'easeInOutExpo');
            $(this).addClass('expanded');
        }, function (event) {
            $(this).find('.mask').animate({'height': 280}, 800, 'easeInOutExpo');
            $(this).removeClass('expanded');
            
            /*
            If the current Y scroll is greater than the original scroll, revert to the previous position.
            
            Why? Because the window expands horizontally to view the images.
            If the user has scrolled down and closes the expandable panel,
            they'll be looking at a different work, and that doesn't seem to
            make a whole lot of sense, so we'll just avoid it altogether.
            */
            if (window.scrollY > originalScrollY) {
                $('html, body').animate({scrollTop: originalScrollY}, 300, 'easeInOutExpo');
            }
        });
    });
    
});