// requires jquery


this.balloons = function(){
	var yOffset = 10;
	var xOffset = 10;
	
	$("a.balloonimg").mouseover(function() {
		$(this).children().addClass("imgborder");
		
	});
	$("a.balloonimg").mouseout(function() {
		$(this).children().removeClass("imgborder");
		
	});
	
	
// hover over thumb shows medium sized preview picture
	$("a.preview").hover(function(e){
		this.t = this.title;
		this.title = "";
		var c = (this.t != "") ? "<br/>" + this.t : "";
		if (e.pageY > 480) {
			yOffset = -430;
		}
		else {
			yOffset = -100;
		}
		if (e.pageX > 520) {
			xOffset = -430;
		}
		else {
			xOffset = 10;
		}
		$("body").append("<p id='lrgimgp'><img src='"+ this.href +"' alt='Image' /><br />"+ c +"</p>");
		$("#lrgimgp")
			.css("top",(e.pageY + yOffset) + "px")
			.css("left",(e.pageX + xOffset) + "px")
			.fadeIn("fast");
    },
	function(){
		this.title = this.t;	
		$("#lrgimgp").remove();
    });	
	$("a.preview").mousemove(function(e){
		$("#lrgimgp")
			.css("top",(e.pageY + yOffset) + "px")
			.css("left",(e.pageX + xOffset) + "px");
	});
	
// on thumb click new page w full img
	$("a.preview").click(function(){
// new: onclick=dimm page, show imglarge
		$("#albumsdispldiv").hide();
		
		// img data
		var captiontxt = this.t;	// while hover: title is stored in this
		$("#captiontext").text(captiontxt);
		var thumbsrc = this.href;
		var largeimgID = this.name;
		var newfilename = thumbsrc.replace(/medium/,"large");	
		$("#imgID").attr("src", newfilename);
		$("#imgID").attr("name", largeimgID);	// stores pictID in name attribute

	
		$("#captioninput").val(captiontxt);	// set caption text in input field
		

		
				
		
		$("#largeimgdiv").fadeIn("slow");
		
		return false;
	});
	
	
	



};


// starting the script on page load
$(document).ready(function(){
	balloons();
});