//credits
$(function() {
    var $credits = $('#credits');
    var $p = $credits.find( 'p' );

    var org_width = $credits.width();
    var full_width = $p.outerWidth();

    $credits.hover(
        function() {
            $( this ).stop( true, true ).animate({ 'width': full_width }, 333);
        },
        function() {
            $( this ).animate({ 'width': org_width }, 333);
        }
    );
}); 


//bg
$(function() {
	$.backstretch("gfx/Acr699132904302272-9528.png");
});


//colorbox
$(function() {
	$(".inline").colorbox({
	    rel: $( this ).attr( 'rel' ),
		inline: true, 
		width: "702px",
		opacity: "1",
		transition: "none",
		speed: 250,
		height: "710px",
		onComplete: function() {
		    $('#cboxLoadedContent').css({
		        'width': '360px',
		        'height': '470px',
		        'margin': '120px auto'
		    }).jScrollPane();
		}
	});
});


//scroll
$(function() {
	$('.box').jScrollPane();
});


//menu
jQuery( function($) {

    // Center-align content slider
    var $slider = $('#slider');

    var width = 0;
    function incWidth( val ) {
        width = width + val;
    }

    $slider.children().each( function() {
        incWidth( $( this ).outerWidth() );
    }).parent().css({
        'width': width,
        'margin-left': 0 - ( width / 2 )
    });


    // Menu links: Align relevant content to link on click
    var content_offset_base = width / 2;
    var optical_trickery = 20;
    var $menu = $('#menu');
    var $menu_elems = $menu.find( 'li' );

    function alignContent( $menu_elem, animate ) {
        var $anchor = $menu_elem.find( 'a' );
        var $target = $slider.find( $anchor.attr( 'href' ).replace( '#', '#target-' ) );

        var target_pos = ( $target.position().left + ( $target.outerWidth() / 2 ) ) - optical_trickery;
        var link_pos = $menu_elem.position().left + ( $menu_elem.outerWidth() / 2 );

        var slider_left_pos = ( 0 - target_pos ) + link_pos + content_offset_base;

        if ( animate ) {
            $slider.stop().animate({
                'left': slider_left_pos
            }, 250, function() {
                window.location.hash = $anchor.attr( 'href' );
            });
        } else {
            $slider.css({
                'left': slider_left_pos
            });
        }
    }

    // Align on click
    $menu_elems.bind( 'click', function( event ) {
        event.preventDefault();

        var $this = $(this);
        if ( $this.is( '.active' ) ) {
            return false;
        }

        $menu_elems.removeClass( 'active' );
        $this.addClass( 'active' );

        alignContent( $this, true );
    });

    // Keep alignment on resize if needed
    // Update alignment on hash change
    $(window).bind( 'resize', function() {
        var $active_menu_elem = $menu.find( '.active' );
        if ( $active_menu_elem.length === 1 ) {
            alignContent( $active_menu_elem, false );
        }
    }).bind( 'hashchange', function() {
        var $active_menu_elem = $menu.find( 'a[href=' + window.location.hash + ']' );
        if ( $active_menu_elem.length === 1 ) {
            $active_menu_elem = $active_menu_elem.parent();
            
            $menu_elems.removeClass( 'active' );
            $active_menu_elem.addClass( 'active' );

            alignContent( $active_menu_elem, false );
        }
    });

    // Set alignment on load if needed
    if ( window.location.hash ) {
        var $active_menu_elem = $menu.find( 'a[href=' + window.location.hash + ']' );
        if ( $active_menu_elem.length === 1 ) {
            $active_menu_elem = $active_menu_elem.parent();
            $active_menu_elem.addClass( 'active' );
            alignContent( $active_menu_elem, false );
        }
    }

    // Set alignment on click on content link
    $( '.box' ).find( 'a' ).filter( '[href^="#"]' ).bind( 'click', function() {
        var index = $( this ).parents( '.box' ).index();
        var $active_menu_elem = $menu_elems.eq( index );
        if ( $active_menu_elem.length === 1 ) {
            $menu_elems.removeClass( 'active' );
            $active_menu_elem.addClass( 'active' );
            alignContent( $active_menu_elem, true );
        }
    } );

    // Some help for iOS5, with its mysterious ways of handling position
    var iOS5 = navigator.userAgent.match(/OS 5_/i) != null;
    if ( iOS5 ) {
        $('#slider-wrap').css({ 'position': 'fixed' });
    }

});