var J = jQuery.noConflict();

var imgDiv;
var imgDiv0;
var img = new Image();
var height;
var width
var ratio;
var info = J('sth');

J(function(){
	/* if... */
	J('#Newsletters_1').attr('checked', 'checked');
	startFading();
	imgDiv0 = J('#content div.roll:visible');
	
	J('#artists .artist').hover(
		function(){
			J(this).find('a').animate(
				{'top': '-43px'}, '100'
			);
		}, function() {
			J(this).find('a').animate(
				{'top': '-9px'}, '400', 'easeOutExpo'
			);
		}
	)
	.click(function(){
		window.location = J(this).find('a').attr('href');
	});
	
	J('#show_biography').click(function(){
		hideArtwork();
		J('#biography').slideToggle();
		if (J(this).text() == 'show biography') {
			J(this).text('hide biography');
		} else {			
			J(this).text('show biography');
		}
		return false;
	});
	
	J('#artworks a').click(function() {
		info.remove();
		height = J(this).find('img').attr('height');
		width = J(this).find('img').attr('width');
		ratio = width/height;
		info = J(this).next().clone();
		J('#artworks').fadeTo('200', '0.25');
		J(img)
			.load(function(){
				J(this).hide();
				J('#artwork').append(this);
				if (ratio<1.2) {
					height = 400;
					width = height*ratio;
					margin_left = 220 - width/2;
				} else {
					width = 500;
					height = width/ratio;
					margin_left = 0;
				}
				J(this).attr('height', height);
				J(this).attr('width', width);
				J(this).css('margin-left', margin_left);
				J(this).fadeIn();
				info.hide();
				J('#artwork').append(info);
				info.fadeIn();
			})
			.attr('src', J(this).attr('href'));	
			
		return false;
	});
	J(document).click(function(){
		hideArtwork();
	});
	
});

function hideArtwork() {
	J('#artwork img').fadeOut('100');
	J('#artworks').fadeTo('100', '1');
	info.remove();
}

function startFading() {
	setTimeout(fadeOutImg, 5000);
}

function fadeOutImg() {
	imgDiv = J('#content div.roll:visible');
	imgDiv.fadeOut(400, fadeInImg);
}

function fadeInImg() {
	imgDiv = imgDiv.next();
	if (imgDiv.length == 0) {
		imgDiv = imgDiv0;
	}
	imgDiv.fadeIn(300, startFading);
	width  = imgDiv.find('img').attr('width');
	height = imgDiv.find('img').attr('height');
	if (width>400) {
		ratio = height / width;
		imgDiv.find('img').attr('width', 400);
		imgDiv.find('img').attr('height', height*ratio);
		imgDiv.css('top', '20px');
		imgDiv.css('position', 'relative');
	}
}