$(document).ready(function() {
    /* 
    * attach a function to open all links with a class of "external" in a new window 
    * this avoids the use of target="_blank" and allows us to validate as XHTML strict
    */
    $("a[rel^='external']").click( function() {
        window.open(this.href);
        return false;
    });
    
    $("a[rel^='prettyPhoto']").prettyPhoto({
            animationSpeed: 'normal', /* fast/slow/normal */
            opacity: 0.80, /* Value between 0 and 1 */
            showTitle: true, /* true/false */
            allowresize: true, /* true/false */
            default_width: 500,
            default_height: 344,
            theme: 'facebook'
        });

    // set tre form defaults
    $('#os0').val($('#woodLabel-1').html());
    $('#item_number').val($('#item_number-1').html());
    
    // vertically center text on index page
    verticallyCenter("indexText","index");
    verticallyCenter("largeTreeDiv","trees");
    // keep centered
    $(window).resize(function() {
        verticallyCenter("indexText","index");
        verticallyCenter("largeTreeDiv","trees");
    });


    $("#logo").hover(function() {  
        $(this).attr("src","/images/logo-over.gif");
    }, function() {  
        $(this).attr("src","/images/logo-out.gif");
    }); 
    
    $('a.treeThumbLink').click(function(){
        // get the ID of the image to fade in
        var targetID = $(this).attr("name").replace("thumb-", "full-");
        
        if ($('#thumbs img.treeThumbActive').length > 0){
            // fade them out (and remove the flag)
            $('#thumbs img').removeClass('treeThumbActive');
            $('#thumbs img').addClass('treeThumb');
        }
        
        $('img', this).addClass('treeThumbActive');
        
        // if there are any active images in the container
        if ($('#largeTreeDiv img.active').length > 0){
            // fade them out (and remove the flag)
            $('#largeTreeDiv img.active').fadeOut(300, function(){
                // when the fade out is done, fade in the new image and flag it
                $('#'+targetID).fadeIn(300).addClass('active');
            }).removeClass('active');

        } else {
            // just fade in the target image and flag it
            $('#'+targetID).fadeIn('normal').addClass('active');
        }
    });

    // initialize tooltip
    $(".wt").tooltip({
       // use the "slide" effect
       effect: 'slide'
    });
    

    $(".wt").click(function(){
        
        $(".wt").each(function(){
            var newSrc = $(this).attr("src").replace("-over", "");
            $(this).attr("src",newSrc);
        });
        
        var src = $(this).attr('src').match(/[^\.]+/) + '-over';
        $(this).attr("src", src+".jpg");

        // for thumb outlines
        $('.wt').removeClass('woodTypeThumbActive');
        $('.wt').addClass('woodTypeThumb');
        $(this).addClass('woodTypeThumbActive');
        
        // hide all labels then show the one we selected
        var woodLabel = $(this).attr("id").replace("woodThumb-", "woodLabel-");
        $('.selectedWoodType').hide();
        $('#'+woodLabel).show();
        
        // change order form vars
        $('#os0').val($('#'+woodLabel).html());
        
        switch(woodLabel){
            case 'woodLabel-1': $('#item_number').val($('#item_number-1').html());
                break;
            case 'woodLabel-2': $('#item_number').val($('#item_number-2').html());
                break;
            case 'woodLabel-3': $('#item_number').val($('#item_number-3').html());
                break;
            case 'woodLabel-4': $('#item_number').val($('#item_number-4').html());
                break;
            case 'woodLabel-5': $('#item_number').val($('#item_number-5').html());
                break;
            
        }
        
        // hide all buttons then show the "active" one
        var woodCartAdd = $(this).attr("id").replace("woodThumb-", "addToCart-");
        $('a.addToCart').hide();
        $('#'+woodCartAdd).show();

    });
    
       
});

function verticallyCenter(itemId, containerId){
    var containerHeight = $("#"+containerId).height();
    var itemHeight = $("#"+itemId).height();
    $("#"+itemId).css("margin-top",containerHeight/2 - itemHeight/2);
    // alert(containerHeight/2 - itemHeight/2);
}