$(document).ready(function() {

    lastBlock = $(".selected");
    maxWidth = 402;
    minWidth = 30;

    $("#multi-select ul li div").click(function() {
        $(lastBlock).animate({
			width: minWidth+"px"
		}, {
			queue:false,
			duration:400
		});
		$(this).animate({
			width: maxWidth+"px"
		}, {
			queue:false,
			duration:400
		});

		// control tab images
		var mornings = $('#multi-select ul li #tab1');
		var middays = $('#multi-select ul li #tab2');
		var afternoons = $('#multi-select ul li #tab3');
		var id = $(this).attr('id');

		$(this).children('img.tab').replaceWith('<img id="'+id+'" class="tab" src="/graphics/banners/'+id+'-selected.png" />');

		if (id == 'tab1') {
			middays.children('img.tab').attr('src', '/graphics/banners/tab2-hidden2.png');
			afternoons.children('img.tab').attr('src', '/graphics/banners/tab3-hidden1.png');
		} else if (id == 'tab2') {
			mornings.children('img.tab').attr('src', '/graphics/banners/tab1-hidden.png');
			afternoons.children('img.tab').attr('src', '/graphics/banners/tab3-hidden1.png');
		} else if (id == 'tab3') {
			mornings.children('img.tab').attr('src', '/graphics/banners/tab1-hidden.png');
			middays.children('img.tab').attr('src', '/graphics/banners/tab2-hidden1.png');
		}

		$(lastBlock).toggleClass('selected');
		$(this).toggleClass('selected');
		lastBlock = this;
    });

	// needs work: hover images
/*
	$("#multi-select ul li img.tab").mouseenter(function() {
		var id = $(this).parent().attr('id');

		if (id == 'tab1') {
			$(this).attr('src', '/graphics/banners/tab1-hover.png');
		} else if (id == 'tab2') {
			
		}
	}).mouseleave(function() {
		var id = $(this).parent().attr('id');

		if (id == 'tab1') {
            $(this).attr('src', '/graphics/banners/tab1-hidden.png');
        }
	});
*/
});