﻿function over(val) {
    var $active = $('#images a img.active');
    
    if ($active.attr('id') != val) {
        $('#' + val).css({ opacity: 0.4 }).animate({ opacity: 1.0 }, 200, function() { });
    }
    
    $('#' + val + 'TT').addClass('active').css({ opacity: 0.0 }).animate({ opacity: 1.0 }, 200, function() { });
}
function out(val) {
    var $active = $('#images a img.active');
    
    if ($active.attr('id') != val) {
        $('#' + val).css({ opacity: 1.0 }).animate({ opacity: 0.4 }, 200, function() { });
    }
    
    $('#' + val + 'TT').animate({ opacity: 0.0 }, 200, function() { $('#' + val + 'TT').removeClass('active'); });
}

function click(val) {
    swapItems(val);
}

function swapItems(val) {
    var inId = val;
    var outId;

    var $active = $('#images a img.active');
    outId = $active.attr('id');
    $active.removeClass('active');
    $active.addClass('last-active');

    $('#' + inId).addClass('active');
    
    if (inId != outId) {
        var $inText = $('#' + inId + 'Text');
        var $inImage = $('#' + inId + 'Image');
        var $outText = $('#' + outId + 'Text');
        var $outImage = $('#' + outId + 'Image');

        $active.css({ opacity: 1.0 }).animate({ opacity: 0.4 }, 200, function() { });
        $inImage.css({ opacity: 0.0 }).addClass('active').animate({ opacity: 1.0 }, 500, function() { });
        $outText.animate({ opacity: 0.0 }, 500, function() {
            $outText.removeClass('active');
            $inText.css({ opacity: 0.0 }).addClass('active').animate({ opacity: 1.0 }, 500, function() { });
        });
        $outImage.animate({ opacity: 0.0 }, 500, function() { $outImage.removeClass('active'); });
    }

    $active.removeClass('last-active');
}
