var loadGallery = function(){
    var currentPosition = 0;
    var slideWidth = 420;
    var slides = $('.slide');
    var numberOfSlides = slides.length;
    var imageLink;
    
	$('#id1').addClass('imageHeadlineHidden');
	$('#id1').show();
	$('.imageGalleryControlBar').show();
	
    if (numberOfSlides > 1) {
        for (var i = 0; i < numberOfSlides; i++) {
            imageLink = '<a class="selectedImage" href="#">' + (i + 1) + '</a>';
            $('.imageNavi').append($(imageLink));
            if (i == 0) {
				$('.selectedImage').css("background-position", "-34px 0");
			}
			else {
				$('.selectedImage').css('color', '#4b4b4b');
			}
        }
    }
    else 
        if (numberOfSlides == 1) {
            $('.nextImage').hide();
            $('.prevImage').hide();
        }
    
    $('.selectedImage')
		.bind('mousedown', btnDown)
    	.bind('mouseup', btnUpOver)
    	.bind('mouseover', btnUpOver)
    	.bind('mouseleave', btnLeave);
    $('.selectedImage:first')
		.unbind('mousedown', btnDown)
    	.unbind('mouseup', btnUpOver)
    	.unbind('mouseover', btnUpOver)
    	.unbind('mouseleave', btnLeave);
    
    if ($('.selectedImage')) {
        $('.selectedImage').each(function(){
            $(this).bind('click', function(){
                var temp = $(this).text();
				
				$('.imageHeadlineHidden').hide();
				$('#id' + temp).show();
				
                currentPosition = parseFloat(temp) - 1;
                
                $('.selectedImage').each(function(){
                    if ($(this).text() != currentPosition + 1) {
                        $(this)
							.css('color', '#4b4b4b')
                        	.css("background-position", "0 0");
                    }
                    else {
                        $(this).css("background-position", "-34px 0");
                    }
                });
                
                $('#slideInner').animate({
                    'marginLeft': slideWidth * (-currentPosition)
                });
				return false;
            });
        });
    }
    
    // Remove scrollbar in JS
    $('#slidesContainer').css('overflow', 'hidden');
    
    // Wrap all .slides with #slideInner div
    slides.wrapAll('<div id="slideInner"></div>') // Float left to display horizontally, readjust .slides width
.css({
        'float': 'left',
        'width': slideWidth
    });
    
    // Set #slideInner width equal to total width of all slides
    $('#slideInner').css('width', slideWidth * numberOfSlides);
    
    // Create event listeners for .controls clicks
	if (numberOfSlides > 1) {
		$('.nextImage, .imageContainer').bind('click', function(){
			$('.imageHeadlineHidden').hide();
			if (currentPosition == numberOfSlides - 1) {
				currentPosition = 0;
			}
			else {
				currentPosition += 1;
			}
			
			$('.selectedImage').each(function(){
				if ($(this).text() != currentPosition + 1) {
					$(this).css('color', '#4b4b4b').css("background-position", "0 0");
					$(this).bind('mousedown', btnDown).bind('mouseup', btnUpOver).bind('mouseover', btnUpOver).bind('mouseleave', btnLeave);
				}
				else {
					var temp = $(this).text();
					$('.imageHeadlineHidden').hide();
					$('#id' + temp).show();
					
					$(this).css("background-position", "-34px 0");
					$(this).unbind('mousedown', btnDown).unbind('mouseup', btnUpOver).unbind('mouseover', btnUpOver).unbind('mouseleave', btnLeave);
				}
			});
			$('#slideInner').animate({
				'marginLeft': slideWidth * (-currentPosition)
			});
		}).bind('mousedown', nextPrevDown).bind('mouseup', nextPrevUpOver).bind('mouseover', nextPrevUpOver).bind('mouseleave', nextPrevLeave);
	}
    $('.prevImage').bind('click', function(){
		$('.imageHeadlineHidden').hide();
        if (currentPosition == 0) {
            currentPosition = numberOfSlides - 1;
        }
        else {
            currentPosition -= 1;
        }
		
        $('.selectedImage').each(function(){
            if ($(this).text() != currentPosition + 1) {				
                $(this)
					.css('color', '#4b4b4b')
                	.css("background-position", "0 0");
				$(this)
					.bind('mousedown', btnDown)
    				.bind('mouseup', btnUpOver)
    				.bind('mouseover', btnUpOver)
    				.bind('mouseleave', btnLeave);
            }
            else {
				var temp = $(this).text();
				$('.imageHeadlineHidden').hide();
				$('#id' + temp).show();
				
                $(this).css("background-position", "-34px 0");
				$(this)
					.unbind('mousedown', btnDown)
    				.unbind('mouseup', btnUpOver)
    				.unbind('mouseover', btnUpOver)
    				.unbind('mouseleave', btnLeave);
            }
        });
        $('#slideInner').animate({
            'marginLeft': slideWidth * (-currentPosition)
        });
    })
    .bind('mousedown', nextPrevDown)
    .bind('mouseup', nextPrevUpOver)
    .bind('mouseover', nextPrevUpOver)
    .bind('mouseleave', nextPrevLeave);
	
	// $('.infoTags').hide();
}

var btnDown = function(){
    $('.selectedImage').each(function(){
        $(this)
			.removeClass('activated')
        	.css("background-position", "0 0");
        $(this)
			.bind('mousedown', btnDown)
        	.bind('mouseup', btnUpOver)
        	.bind('mouseover', btnUpOver)
        	.bind('mouseleave', btnLeave);
    });
    $(this)
		.addClass('activated')
		.css("background-position", "-34px 0");
    $(this)
		.unbind('mousedown', btnDown)
    	.unbind('mouseup', btnUpOver)
    	.unbind('mouseover', btnUpOver)
    	.unbind('mouseleave', btnLeave);
}
var btnUpOver = function(){
    $(this).css("background-position", "-17px 0");
}
var btnLeave = function(){
    $(this).css("background-position", "0 0");
}
var nextPrevDown = function(){
    $(this).css("background-position", "-50px 0");
}
var nextPrevUpOver = function(){
    $(this).css("background-position", "-25px 0");
}
var nextPrevLeave = function(){
    $(this).css("background-position", "0 0");
}