var ajax_script = '/doAjax';
    
    // item stack element
    var stackItem = 'img.item-image';

    // image sizes
    var smallSizeWidth = 122;
    var largeSizeWidth = 316;
    var smallSizeHeight = 110;
    var largeSizeHeight = 329;
    
    // left position of stack items
    var leftPos = 0;
    var centrePos = 415;
    var rightPos = 765;
    var stackPos = 550;

    // top position of stack items
    var largeImgTopPos = 50;
    var smallImgTopPos = 180;
    var stackBottomPos = 250;

    // bottom position of stack items
    var largeImgBottomPos = largeImgTopPos;//largeImgTopPos + largeSizeHeight;
    var smallImgBottomPos = smallImgTopPos;//smallImgTopPos + smallSizeHeight;

    // class names
    var leftClass = 'leftImg';
    var rightClass = 'rightImg';
    var currentClass = 'current';
	
	// are we using a stack
	var hasStack = true;
	
	/// do we need to rotate
	var isRotating = true
	
	// numImages
	var numImages = 0;
    
    $(function() {
			
			//get the number of images to see if we are using a stack
			numImages = $('#holder_images .item-image').length;

			if(numImages <=3) {hasStack = false;}
            $('.item-content').hide();

            $('#holder_images '+stackItem).each(function() {
                $(this).attr('width',smallSizeWidth);
                $(this).attr('height',smallSizeHeight);
                $(this).css({position:'absolute',left:stackPos+'px','bottom':stackBottomPos+'px',opacity:'0','z-index':0});
            });

            // make the first image the current image
            $('#holder_images '+stackItem+':nth(0)').addClass(currentClass).css({left:centrePos+'px','bottom':largeImgTopPos+'px',opacity:'1','z-index':2});
            $('.'+currentClass).attr('width',largeSizeWidth);
            $('.'+currentClass).attr('height',largeSizeHeight);
            //$('.'+currentClass+' .item-content').show();

            // get the next image along, position it and add a class of right to it
            $('.'+currentClass).nextAll(stackItem+':nth(0)').css({position:'absolute',left:rightPos+'px','bottom':smallImgTopPos+'px',opacity:'1'}).addClass(rightClass);

            // grab the last image and bring it to the start, one before current
            // add a class of left to it only if there is more than one image
		   	if (numImages > 1) {
				var lastImg = $('#holder_images ' + stackItem + ':last').clone();
				$('#holder_images ' + stackItem + ':last').remove();
				$('#holder_images').prepend(lastImg);
				$('#holder_images ' + stackItem + ':nth(0)').css({
					left: leftPos + 'px',
					'bottom': smallImgTopPos + 'px',
					opacity: '1'
				}).addClass(leftClass).removeClass(rightClass);
			}

            // show image text
            showText();
            attachRightImageClick();
            attachLeftImageClick();

        });

        function attachLeftImageClick() {
            $('.'+leftClass).click(function() {
                $('.item-content').hide();
                $(this).unbind('click');

                // right image
                if (numImages > 3) {
					// right to stack
					$('.' + rightClass).unbind('click');
					$('.' + rightClass).removeClass(rightClass).animate({
						left: stackPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						bottom: stackBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						width: smallSizeWidth + 'px',
						height: smallSizeHeight + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						'opacity': '0'
					}, {
						queue: false,
						duration: 200
					});
					
				} else if (numImages == 3) {
					// right to left	
					$('.' + rightClass).unbind('click');
					$('.' + rightClass).removeClass(rightClass).addClass(leftClass).animate({
						'opacity': '0'
					}, {
						queue: true,
						duration: 200
					}).animate({
						left: leftPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).css({
						'z-index': 0
					}).animate({
						'opacity': 1
					}, {
						queue: true,
						duration: 750
					});
					
				}
				
                // centre image
				if (numImages >=3) {
					// centre to right
					$('.' + currentClass).addClass(rightClass).animate({
						left: rightPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						bottom: smallImgBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						width: smallSizeWidth + 'px',
						height: smallSizeHeight + 'px'
					}, {
						queue: false,
						duration: 650
					}).removeClass(currentClass)
				} else {
					//centre to left
					$('.' + currentClass).addClass(leftClass).animate({
						left: leftPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						'opacity':0
					}, {
						queue: true,
						duration: 300
					}).animate({
						bottom: smallImgBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						width: smallSizeWidth + 'px',
						height: smallSizeHeight + 'px'
					}, {
						queue: false,
						duration: 650
					}).removeClass(currentClass)
					.animate({
						'opacity': 1
					}, {
						queue: true,
						duration: 750
					});
				}
                

                // left image
                // left to centre 

                $(this).removeClass(leftClass)
                       .addClass(currentClass)
                       .animate({left:centrePos+'px'}, { queue:false, duration: 750})
                       .animate({bottom:largeImgBottomPos+'px'}, { queue:false, duration: 600 })
                       .animate({width:largeSizeWidth+'px',height:largeSizeHeight+'px'}, { queue:false, duration: 750 })
					   .css({'z-index':2});

				setTimeout('cloneRightToStack()', 700);
                if (hasStack) {
					// from stack to left
					$('#holder_images ' + stackItem + ':last').css({
						display: 'none'
					}).animate({
						left: leftPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						bottom: smallImgBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						width: smallSizeWidth + 'px',
						height: smallSizeHeight + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						'opacity': '1'
					}, {
						queue: false,
						duration: 750
					});
				}

                return false;
            });
			
			$('.item-image').css({cursor:'normal'});
			$('.'+leftClass).css({cursor:'pointer'});
        }

        function cloneLeftToStack() {
			if (hasStack) {
				$('#holder_images ' + stackItem + ':nth(0)').removeClass(leftClass).unbind('click');
				var firstImg = $('#holder_images ' + stackItem + ':nth(0)').clone();
				$('#holder_images ' + stackItem + ':nth(0)').remove();
				$('#holder_images').append(firstImg);
				//$('#holder_images '+stackItem+':nth(0)').addClass(leftClass);
				$('#holder_images ' + stackItem + ':last').css({
					left: stackPos + 'px',
					'bottom': stackBottomPos + 'px'
				});
			}

            attachRightImageClick();
            attachLeftImageClick();

            // show image text
            showText();
        }

        function cloneRightToStack() {
			if (hasStack) {
				var lastImg = $('#holder_images ' + stackItem + ':last').clone();
				$('#holder_images').prepend(lastImg);
				$('#holder_images ' + stackItem + ':nth(0)').addClass(leftClass).css({
					left: leftPos + 'px'
				});
				setTimeout("$('#holder_images '+stackItem+':last').remove()", 400);
			}

            attachRightImageClick();
            attachLeftImageClick();

            // show image text
            showText();
        }

        function showText() {
            var textId = $('.'+currentClass).attr('id');
			if (textId) {
				textId = textId.match(/image_(\d+)/)[1];
				textId = "text_" + textId;
				$('#' + textId).fadeIn();
			}
        }

        function attachRightImageClick() {
            $('.'+rightClass).click(function() {
                $('.item-content').hide();
                $(this).unbind('click');
                $(this).removeClass(rightClass);
				
				if (hasStack) {
					// animate from stack to right
					$(this).nextAll(stackItem + ':nth(0)').addClass(rightClass).css({
						display: 'none'
					}).animate({
						'opacity': '1'
					}, {
						queue: false,
						duration: 750
					}).animate({
						left: rightPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						bottom: smallImgBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						width: smallSizeWidth + 'px',
						height: smallSizeHeight + 'px'
					}, {
						queue: false,
						duration: 600
					});
				}
				
                setTimeout('cloneLeftToStack()',755);
                if (hasStack) {
					//animate from left to stack
					$('#holder_images ' + stackItem + ':nth(0)').animate({
						left: stackPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						bottom: stackBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						'opacity': '0'
					}, {
						queue: false,
						duration: 400
					});
				} else {
					// left to right
					$('.'+leftClass).unbind('click');
					$('.'+leftClass).addClass(rightClass).removeClass(leftClass).animate({
						left: rightPos + 'px'
					}, {
						queue: false,
						duration: 600
					}).animate({
						'opacity': '0'
					}, {
						queue: true,
						duration: 300
					}).animate({
						bottom: smallImgBottomPos + 'px'
					}, {
						queue: false,
						duration: 750
					}).animate({
						'opacity': '1'
					}, {
						queue: true,
						duration: 400
					});
				}

                $('.'+currentClass).removeClass(currentClass)
                              // animate centre to left
                             .addClass(leftClass)
                             .animate({left:leftPos+'px'}, { queue:false, duration: 700})
                             .animate({bottom:smallImgBottomPos+'px'}, { queue:false, duration: 750 })
                             .animate({width:smallSizeWidth+'px',height:smallSizeHeight+'px'}, { queue:false, duration: 600 })
                             //.nextAll(stackItem+':nth(0)')
                             // animate right to centre
                             //.addClass(currentClass)
                             //.animate({left:centrePos+'px'}, { queue:false, duration: 750})
                             //.animate({bottom:largeImgBottomPos+'px'}, { queue:false, duration: 600 })
                             //.animate({width:largeSizeWidth+'px',height:largeSizeHeight+'px'}, { queue:false, duration: 750 });
                
				$(this).removeClass(rightClass)
                       .addClass(currentClass)
                       .animate({left:centrePos+'px'}, { queue:false, duration: 750})
                       .animate({bottom:largeImgBottomPos+'px'}, { queue:false, duration: 600 })
                       .animate({width:largeSizeWidth+'px',height:largeSizeHeight+'px'}, { queue:false, duration: 750 })
					   .css({'z-index':2});
               
                return false;
            });
			$('.item-image').css({cursor:'normal'});
			$('.'+rightClass).css({cursor:'pointer'});
        }