var _donationFullImages = new Array();
	var _donationImages = null;

	$(document).ready(function() {

		InitializeImages();

		var checkbox = $("[id$='_fldIsThisAGift']");
		$(checkbox).bind('click', function() {

			ToggleDonationFormValidators.call(this);

		});

	});

	function ToggleDonationFormValidators() {

		var inputs = $("#isthisagiftform .validationField");
		
		for (var i = 0; i < inputs.length; i++) {

			console.debug(inputs[i].id);

			ValidatorEnable(inputs[i], this.checked);
		}
	}

	function InitializeImages() {

		_donationImages = $('.giftImageChoice > img');

		for (var i = 0; i < _donationImages.length; i++) {

			var image = _donationImages[i];

			var fullImage = new Image();
			fullImage.src = $(image).attr('fullsrc');
			fullImage.id = $(image).attr('alt');

			_donationFullImages.push(fullImage);

			$(image).bind('click', ToggleFullSize);

		}
	}

	function FindFullImage(fullImageId) {

		for (var i = 0; i < _donationFullImages.length; i++) {

			var image = _donationFullImages[i];

			if (image.id == fullImageId) {
				return image;
			}
		}

		return null;
	}


	function FindOriginalImage(imageAlt) {

		for (var i = 0; i < _donationImages.length; i++) {

			var image = _donationImages[i];

			if (image.alt == imageAlt) {
				return image;
			}
		}

		return null;
	}

	function MakeImageSmallSize(image) {

		var smallSrc = $(image).attr('thumbsrc');

		if (smallSrc != undefined && image.src !== smallSrc) {

			image.src = $(image).attr('thumbsrc');
			$(image).css({ width: '150px', height: '115px', top: '0px', left: '0px' });
			$(image).css('z-index', '1');
		}
		
		
	}

	function TurnOffOtherImages(fullImageId) {

		for (var i = 0; i < _donationImages.length; i++) {

			var image = _donationImages[i];

			if (image.alt == fullImageId) {
			}
			else {
				MakeImageSmallSize(image);
			}
		}

		return false;
	}
	
	function ToggleFullSize(e) {

		// Now maximize this one
		var currentWidth = $(this).css('width');

		// a hack yes i know but the quickest way to do this right now
		if (currentWidth == '646px') {

			$(this).animate({ width: '150px', height: '115px', top: '0px', left: '0px' }, 500, function() {
				this.src = $(this).attr('thumbsrc');
				$(this).css('z-index', '1');
			});

		}
		else {
			
			//height: 936px;
			//width: 1211px;

			// first turn off all others if they are maximized
			TurnOffOtherImages(this.alt);

			var containerPosition = $('#giftImages').position();
			var containerLeft = containerPosition.left;

			var desiredTop = -100;
			var desiredLeft = 0;

			var imageContainerPosition = $(this).parent('div').position();
			var imageContainerLeft = imageContainerPosition.left;

			var imagePosition = $(this).position();
			var imageTop = imagePosition.top;
			var imageLeft = imagePosition.left;

			var desiredLeft = imageLeft - 323;

			desiredTop = desiredTop;

			//console.debug('desiredLeft', desiredLeft);
			//console.debug('desiredTop', desiredTop);

			this.src = FindFullImage(this.alt).src;

			$(this).css('z-index', '100');

			$(this).animate({ width: '646px', height: '500px', top: desiredTop.toString() + 'px', left: desiredLeft.toString() + 'px' }, 500, function() {

			});
		}


	}