jQuery.fn.ImageSlider = function(options) {
    var Settings = jQuery.extend({
        NumberOfVisible: 50,
        NextSelector: '',
        PrevSelector: '',
        NextThumbSelector: '',
        PrevThumbSelector: '',
        GoToSelector: '',
        UseThumbnails: false,
        Animation: 'easeOutCubic',
        Opacity: '0.2',
        SlideElement: 'img',
        SlideElementWidth: 0,
        SlideWidth: 0,
        Padding: 4,
        StartOffset: 2,
        ShowCenter: true,
        UseIdHolder: false
    }, options);
    var Images = new Array()
    var GlobalPhotoIndex = 0;
    var SlideObj = this;
    var SliderIndex = 0;

    $(Settings.SlideElement + ':lt(' + (Settings.NumberOfVisible + 1) + ')', this).show();
    $(Settings.SlideElement + ':first', this).css('opacity', '1');

    $(Settings.SlideElement, SlideObj).each(function(i) {
        var Photo = new Object();
        Photo.x = GlobalPhotoIndex;
        Photo.width = $(this).width() + Settings.Padding;
        Photo.id = $(this).attr("src");
        Images[i] = Photo;
        GlobalPhotoIndex += $(this).width() + Settings.Padding;
        if (i == ($(Settings.SlideElement, SlideObj).length - 1)) {
            if (SliderIndex == i)
                $(Settings.NextSelector).hide();
            else
                $(Settings.NextSelector).show();
        }
        else if (i == 0) {
            $("#" + _CurrentImageInput).val(Images[i].id);
        }
    });

    $(Settings.PrevSelector).hide();

    $(Settings.NextSelector).click(function() {
        SliderIndex++;
        if (Settings.UseThumbnails) {
            $(Settings.NextThumbSelector).click();
        }
        Move();
    });

    $(Settings.PrevSelector).click(function() {
        SliderIndex--;
        if (Settings.UseThumbnails) {
            $(Settings.PrevThumbSelector).click();
        }
        Move()
    });

    $(Settings.GoToSelector).click(function(e) {
        SliderIndex = $(Settings.GoToSelector).data("SliderIndex");
        Move();
    });

    function Move() {
        if (SliderIndex == 0)
            $(Settings.PrevSelector).hide();
        else
            $(Settings.PrevSelector).show();
        if (SliderIndex == Images.length - 1)
            $(Settings.NextSelector).hide();
        else
            $(Settings.NextSelector).show();

        $(Settings.SlideElement + ':eq(' + (SliderIndex + (Settings.NumberOfVisible - 1)) + ')', SlideObj).show();
        Settings.ScrollPosition = Images[SliderIndex].x * (-1);
        if (Settings.ShowCenter)
            Settings.ScrollPosition += ((Settings.SlideWidth / 2) - (Images[SliderIndex].width / 2));

        if (SliderIndex == 0)
            Settings.ScrollPosition = 0;
        else if (SliderIndex == Images.length - 1)
            Settings.ScrollPosition = (Images[SliderIndex].x * (-1) + Settings.SlideWidth) - (Images[SliderIndex].width - Settings.Padding);
        $(Settings.SlideElement + ':eq(' + SliderIndex + ')', SlideObj).animate({ opacity: 1 })
        if (SliderIndex > 0)
            $(Settings.SlideElement + ':eq(' + (SliderIndex - 1) + ')', SlideObj).animate({ opacity: Settings.Opacity })
        $(Settings.SlideElement + ':eq(' + (SliderIndex + 1) + ')', SlideObj).animate({ opacity: Settings.Opacity })

        $(SlideObj).animate({ marginLeft: Settings.ScrollPosition+Settings.StartOffset })
        $("#" + _CurrentImageInput).val(Images[SliderIndex].id);
    }
    return this;
};

jQuery.fn.ThumbnailSlider = function(options) {
	var Settings = jQuery.extend({
		NumberOfVisible: 8,
		NextSelector: '',
		PrevSelector: '',
		GoToSelector: '',
		NextSectionSelector: '',
		PrevSectionSelector: '',
		Animation: 'easeOutCubic',
		Opacity: '.5',
		SlideElement: 'div',
		SlideElementWidth: 0,
		SlideWidth: 0,
		Padding: 3,
		ShowCenter: true,
		ReverseOpacity: false,
		ThumbnailsPerPage: 0,
		CurrentIndex: 0,
		UseIdHolder: false
	}, options);
	var Images = new Array()
	var GlobalPhotoIndex = 0;
	var SlideObj = this;
	var SliderIndex = 0;
	var SectionIndex = 0;

	$(Settings.SlideElement, SlideObj).each(function(i) {
		//alert("i: " + i);
		var Photo = new Object();
		Photo.x = GlobalPhotoIndex;
		// Behövs en lösning för att scrolla fram behållarens bredd istället för  bildens bredd, det blir fel annars
		Photo.width = $(this).width() + Settings.Padding;
		Photo.id = $(this).attr("src");
		Images[i] = Photo;
		GlobalPhotoIndex += $(this).width() + Settings.Padding;
		if (i == $(Settings.SlideElement, SlideObj).length - 1) {
			LoadImage(false)
		}
		else if (i == 0) {
			$("#" + _CurrentImageInput).val(Images[i].id);
		}
	});

	function LoadImage(animate) {
		if (typeof animate == "undefined")
			animate = true;
		SliderIndex = Settings.CurrentIndex;
		SectionIndex = (Math.floor(SliderIndex / Settings.ThumbnailsPerPage)) * Settings.ThumbnailsPerPage;
		if (SectionIndex < 0)
			SectionIndex = 0;
		var moveForward = SliderIndex >= Settings.ThumbnailsPerPage ? true : false;
		//alert("Init: " + SliderIndex + "SectionIndex: " + SectionIndex);
		GoTo(moveForward, SliderIndex, animate);
	}

	$(Settings.NextSelector).click(function() {
		SliderIndex++;
		MoveSingle(true);
	});

	$(Settings.PrevSelector).click(function() {
		SliderIndex--;
		MoveSingle(false)
	});

	$(Settings.NextSectionSelector).click(function() {
		SectionIndex += Settings.ThumbnailsPerPage;
		MoveSection(true);
	});

	$(Settings.PrevSectionSelector).click(function() {
		SectionIndex -= Settings.ThumbnailsPerPage;
		MoveSection(false)
	});

	$(Settings.SlideElement, this).each(function(index) {
		//alert("index: " + index);
		$(this).data("SliderIndex", index);
		$(this).click(function() {
			SliderIndex = $(this).data("SliderIndex");
			//var moveForward = (SliderIndex > (SectionIndex + Settings.ThumbnailsPerPage)) ? true : false;
			$(Settings.GoToSelector).data("SliderIndex", SliderIndex);
			$(Settings.GoToSelector).click();
			GoTo(false, SliderIndex);
		});
	});

	function GoTo(NextSlide, selected, animate) {
		if (typeof animate == "undefined")
			animate = true;
		//alert("Item: " + selected + " Page: " + SectionIndex + " ny slide: " + NextSlide);
		if (SectionIndex == 0)
			$(Settings.PrevSectionSelector).hide();
		else
			$(Settings.PrevSectionSelector).show();
		if (SectionIndex == (Math.ceil(Images.length / Settings.ThumbnailsPerPage) - 1) * Settings.ThumbnailsPerPage)
			$(Settings.NextSectionSelector).hide();
		else {
			$(Settings.NextSectionSelector).show();
		}

		$(Settings.SlideElement + ':eq(' + (SliderIndex + (Settings.NumberOfVisible - 1)) + ')', SlideObj).show();

		if (NextSlide) {
			//SectionIndex = (Math.floor(Images.length / Settings.ThumbnailsPerPage) * Settings.ThumbnailsPerPage);
			Settings.ScrollPosition = Images[SectionIndex].x * (-1);
		}

		if (SectionIndex == 0)
			Settings.ScrollPosition = 0;

		if (Settings.ReverseOpacity) {
			$(Settings.SlideElement, SlideObj).css("opacity", 1);
			$(Settings.SlideElement + ':eq(' + selected + ')', SlideObj).css("opacity", Settings.Opacity);
		}
		else {
			$(Settings.SlideElement + " .tn-text", SlideObj).addClass("inactive");
			$(Settings.SlideElement + " .tn-text" + ':eq(' + selected + ')', SlideObj).removeClass("inactive");
		}
		if (animate)
			$(SlideObj).animate({ marginLeft: Settings.ScrollPosition });
		else {
			$(SlideObj).css("marginLeft", Settings.ScrollPosition);
			$("#content-holder-no-margin .slider-thumbnails div.thumb-item").show()
		}
	}

	function MoveSingle(NextSlide) {

		SectionIndex = SliderIndex - (SliderIndex % Settings.ThumbnailsPerPage);
		if (SectionIndex == 0)
			$(Settings.PrevSectionSelector).hide();
		else
			$(Settings.PrevSectionSelector).show();

		if (SectionIndex == Images.length - 1 % Settings.ThumbnailsPerPage)
			$(Settings.NextSectionSelector).hide();
		else
			$(Settings.NextSectionSelector).show();

		$(Settings.SlideElement + ':eq(' + (SliderIndex + (Settings.NumberOfVisible - 1)) + ')', SlideObj).show();

		Settings.ScrollPosition = Images[SectionIndex].x * (-1);

		if (NextSlide) {
			if (SectionIndex + Settings.ThumbnailsPerPage > Images.length)
				SectionIndex = (Images.length - Settings.ThumbnailsPerPage)
			Settings.ScrollPosition = Images[SectionIndex].x * (-1);
		}

		if (SectionIndex == 0)
			Settings.ScrollPosition = 0;

		if (!Settings.ReverseOpacity) {
			$(Settings.SlideElement + ':eq(' + SliderIndex + ')', SlideObj).animate({ opacity: 1 })
			$(Settings.SlideElement + ':eq(' + (SliderIndex - 1) + ')', SlideObj).animate({ opacity: Settings.Opacity })
			$(Settings.SlideElement + ':eq(' + (SliderIndex + 1) + ')', SlideObj).animate({ opacity: Settings.Opacity })
		}
		else {
			$(Settings.SlideElement + ':eq(' + SliderIndex + ')', SlideObj).animate({ opacity: Settings.Opacity })
			$(Settings.SlideElement + ':eq(' + (SliderIndex - 1) + ')', SlideObj).animate({ opacity: 1 })
			$(Settings.SlideElement + ':eq(' + (SliderIndex + 1) + ')', SlideObj).animate({ opacity: 1 })
		}
		$(SlideObj).animate({ marginLeft: Settings.ScrollPosition });
		$("#" + _CurrentImageInput).val(Images[SliderIndex].id);
	}

	function MoveSection(NextSlide) {

		//alert("Move: " + SectionIndex);

		if (SectionIndex <= 0)
			$(Settings.PrevSectionSelector).hide();
		else
			$(Settings.PrevSectionSelector).show();

		if ((SectionIndex + Settings.ThumbnailsPerPage) < Images.length)
			$(Settings.NextSectionSelector).show();
		else
			$(Settings.NextSectionSelector).hide();

		//$(Settings.SlideElement + ':eq(' + (SliderIndex + (Settings.NumberOfVisible - 1)) + ')', SlideObj).show();

		Settings.ScrollPosition = Images[SectionIndex].x * (-1);

		/*if (NextSlide) {
		if (SectionIndex + Settings.ThumbnailsPerPage > Images.length)
		Settings.ScrollPosition = Images[(Images.length - Settings.ThumbnailsPerPage)].x * (-1);
		else
		Settings.ScrollPosition = Images[SectionIndex].x * (-1);
		}

        if (SectionIndex == 0)
		Settings.ScrollPosition = 0;
		*/
		$(SlideObj).animate({ marginLeft: Settings.ScrollPosition });
		$("#" + _CurrentImageInput).val(Images[SliderIndex].id);
	}

	return this;
};