//Sets up transition effect from thumbs to featured project image

var FWJQ = jQuery.noConflict();

function transition(nextImage, containerName, speed) {
    var container = "#" + containerName;
    var image = container + " img.featured-image";
    FWJQ(container).css({ "background-image": "url(" + nextImage + ")" });
    FWJQ(image).fadeOut(speed, function() {
        FWJQ(image).attr({ 'src': nextImage });
        FWJQ(image).fadeIn(speed);
    });
}

FWJQ(document).ready(function() {
    //For each thumbnail: Capture href, then assign 'transition' to the click event.
    FWJQ("#project-thumbs ul li a").each(function() {
        var imgHref = FWJQ(this).attr('href');
        FWJQ(this).attr({ 'href': 'javascript:void(0);' });
        FWJQ(this).click(function() {
            if (FWJQ("#portfolio-container").is(':animated') || FWJQ("#portfolio-container img.featured-image").is(':animated')) {
            } else {
                FWJQ(this).addClass('selected-image').parent().siblings().find('a').removeClass('selected-image');
                transition(imgHref, "portfolio-container", 350);
            }
        });
    });
});