/**
 * @author roger
 */

function thumbalizeMe(target, image){
	jQ('#'+target).click(function() {
		var loading = 0;
		jQ('#thumbalizeLightBox').remove();
		jQ('#ttt_loadingLightBox').remove();
		jQ('body').append('<div id="ttt_loadingLightBox">Loading Image</div>');
		center(jQ('#ttt_loadingLightBox'));
		
		jQ('body').append('<div id="thumbalizeLightBox">\
								<div id="ttt_lbwrap">\
									<img id="lbimage" src="'+image+'"/>\
								</div>\
									<div id="ttt_closeLightBox">close</div>\
									<div id="ttt_lightBoxInfo">Loading...</div>\
								</div>');
								
		jQ('#ttt_closeLightBox').click(function() {
			jQ('#thumbalizeLightBox').remove();
		});
		
		if (!jQ.browser.msie) {
			jQ('#lbimage').unbind('load').load(function(){
				loading++;
				if (loading == 2) {
					showLightBox();
				}
			});
		}
		
		//compare image and info heights, adjust where necessary
		if (jQ('#ttt_lightBoxInfo').height() > jQ('#lbimage').height() && jQ('#ttt_lightBoxInfo').height() <= 400) { //info is larger than image, it will overflow out of the lightbox so adjust lightbox height
			jQ('#thumbalizeLightBox').height(jQ('#ttt_lightBoxInfo').outerHeight() + 20);
		} else if (jQ('#ttt_lightBoxInfo').height() > jQ('#lbimage').height() && jQ('#ttt_lightBoxInfo').height() > 400) { //info is larger than image and larger than 500px, constrain it at 500, add scrollbar and adjust the height of the lightbox
			jQ('#ttt_lightBoxInfo').css('overflow', 'auto').height(500);
			jQ('#thumbalizeLightBox').height(jQ('#ttt_lightBoxInfo').outerHeight() + 20);
		}
		
		//ajax call to get title and description
		jQ.ajax({
			type: 'post',
			url: '/ajax/content/thumbalizer',
			dataType: 'json',
			data: {
				image: image
			},
			success: function(data){
				if (data) {
					if (data['photo_name']) {
						var name = data['photo_name'];
					} else {
						var name = '';
					}
					if (data['photo_description']) {
						var description = data['photo_description'];
					} else {
						var description = '';
					}
					if (name == '' && description == '') {
						jQ('#ttt_lightBoxInfo').remove();
						jQ('#ttt_lbwrap').css('margin-right', '0px').css('margin-top', '20px');
					} else {
						jQ('#ttt_lightBoxInfo').html('<b>' + name + '</b><p>' + description + '</p>');
					}
				}
				if (jQ.browser.msie) {
					showLightBox();
				} else {
					loading++;
					if (loading == 2) {
						showLightBox();
					}
				}
			}
		});
		
	});
}


function showLightBox(){
	center(jQ('#thumbalizeLightBox'));
	jQ('#ttt_loadingLightBox').fadeOut(200, function() {jQ('#ttt_loadingLightBox').remove();});
	jQ('#thumbalizeLightBox').fadeIn(300);
}

function center(object) {
	width = jQ(object).width();	
	height = jQ(object).height();	
	containerWidth = jQ(window).width();
	containerHeight = jQ(window).height();
	
	width = width/2;
	height = height/2;
	containerWidth = containerWidth/2;
	containerHeight = (containerHeight/2)+jQ(window).scrollTop();
	
	leftOffset = containerWidth - width;
	topOffset = containerHeight - height;
	if (topOffset < 20) {
		topOffset = 20;
	}
	
	jQ(object).css('left', leftOffset+'px').css('top', topOffset+'px');
}