﻿var featureFade = {
	configholder: {},

	stopautostep: function (config) {
		clearTimeout(config.steptimer)
		clearTimeout(config.resumeautostep)
	},

	autorotate: function (galleryid) {
		var config = featureFade.configholder[galleryid]
		if (config.$gallery.attr('_ismouseover') != "yes") {
			this.stepBy(galleryid, config.autostep.moveby)
		}
		config.steptimer = setTimeout(function () { featureFade.autorotate(galleryid) }, config.autostep.pause)
	},

	stepTo: function (galleryid, pindex) { /*User entered pindex starts at 1 for intuitiveness. Internally pindex still starts at 0 */
		var config = featureFade.configholder[galleryid]
		if (typeof config == "undefined") {
			alert("There's an error with your set up of Carousel Viewer \"" + galleryid + "\"!")
			return
		};

		featureFade.stopautostep(config);
		config.newPanelID = pindex;
		config.oldPanelID = config.currentpanel;

		if (config.beforeItemMove != null) { config.beforeItemMove(config); }

		var $currentpanel;
		var $newpanel;
		var newCurrentPanel;

		config.$panels.each(function (index) {
			if (index == pindex) {
				$newpanel = $(this);
				//$newpanel.css({ visibility: "visible" }).fadeIn(config.panelbehavior.speed);
				$newpanel.fadeIn(config.panelbehavior.speed);

				if (config.defaultButtons.itemOn)
					$('#' + config.stepImgIDs[pindex]).attr({ src: config.defaultButtons.itemOn });

				if (config.defaultButtons.cssOn)
					$('#' + config.stepImgIDs[pindex]).addClass(config.defaultButtons.cssOn);

			} else if (index == config.currentpanel) {
				$currentpanel = $(this);
				//$currentpanel.css({ display: 'none' }).fadeOut(config.panelbehavior.speed);
				$currentpanel.fadeOut(config.panelbehavior.speed);

				if (config.defaultButtons.itemOff)
					$('#' + config.stepImgIDs[config.currentpanel]).attr({ src: config.defaultButtons.itemOff });

				if (config.defaultButtons.cssOff)
					$('#' + config.stepImgIDs[config.currentpanel]).removeClass(config.defaultButtons.cssOn);
			}
		})

		config.currentpanel = pindex;

		if (config.onItemMove != null) { config.onItemMove(config); }

	},

	stepBy: function (galleryid, steps) { //isauto if defined indicates stepBy() is being called automatically
		var config = featureFade.configholder[galleryid]
		if (typeof config == "undefined") {
			alert("There's an error with your set up of Carousel Viewer \"" + galleryid + "\"!")
			return
		};

		featureFade.stopautostep(config);


		var direction = (steps > 0) ? 'forward' : 'back'
		var pindex = config.currentpanel + steps

		if (pindex > config.lastvisiblepanel && direction == "forward") {
			//if destination pindex is greater than last visible panel, yet we're currently not at the end of the carousel yet
			pindex = (config.currentpanel < config.lastvisiblepanel) ? config.lastvisiblepanel : 0
		} else if (pindex < 0 && direction == "back") {
			//if destination pindex is less than 0, yet we're currently not at the beginning of the carousel yet
			pindex = (config.currentpanel > 0) ? 0 : config.lastvisiblepanel /*wrap around left*/
		}

		if (config.beforeItemMove != null) { config.beforeItemMove(config); }

		var $currentpanel;
		var $newpanel;
		var newCurrentPanel;

		config.$panels.each(function (index) {
			if (index == pindex) {
				$newpanel = $(this);
				//$newpanel.css({ visibility: "visible" }).fadeIn(config.panelbehavior.speed);
				$newpanel.fadeIn(config.panelbehavior.speed);

				if (config.defaultButtons.itemOn)
					$('#' + config.stepImgIDs[pindex]).attr({ src: config.defaultButtons.itemOn });

				if (config.defaultButtons.cssOn) {
					$('#' + config.stepImgIDs[pindex]).addClass(config.defaultButtons.cssOn);
				}

			} else if (index == config.currentpanel) {
				$currentpanel = $(this);
				//$currentpanel.css({ display: 'none' }).fadeOut(config.panelbehavior.speed);
				$currentpanel.fadeOut(config.panelbehavior.speed);

				if (config.defaultButtons.itemOff)
					$('#' + config.stepImgIDs[config.currentpanel]).attr({ src: config.defaultButtons.itemOff });

				if (config.defaultButtons.cssOn)
					$('#' + config.stepImgIDs[config.currentpanel]).removeClass(config.defaultButtons.cssOn);
			}
		})


		config.currentpanel = pindex

		if (config.onItemMove != null) { config.onItemMove(config); }

	},

	alignpanels: function ($, config) {

		var paneloffset = 0
		config.paneloffsets = [paneloffset] //array to store upper left offset of each panel (1st element=0)
		config.panelwidths = [] //array to store widths of each panel
		config.$panels.each(function (index) { //loop through panels
			var $currentpanel = $(this);
			if (index == config.currentpanel) {
				$currentpanel.css({ float: 'none', position: 'absolute', left: '0px', top: '0px', display: 'none' });
				$currentpanel.fadeIn(config.panelbehavior.speed);
			} else {
				$currentpanel.css({ float: 'none', position: 'absolute', left: '0px', top: "0px", display: 'none' }); //position panel
			}
		})

		var lastpanelindex = config.$panels.length - 1;
		config.lastvisiblepanel = lastpanelindex;

		if (config.autostep.enable) {
			config.steptimer = setTimeout(function () { featureFade.autorotate(config.galleryid) }, config.autostep.pause)
		}


	},

	setup: function (config) {
		document.write('<style type="text/css">\n#' + config.galleryid + '{overflow: hidden;}\n</style>');
		jQuery(document).ready(function ($) {
			config.$gallery = $('#' + config.galleryid);
			config.gallerywidth = config.$gallery.width();
			config.$belt = config.$gallery.find('.' + config.beltclass);
			config.$panels = config.$gallery.find('.' + config.panelclass);
			config.currentpanel = 0
			featureFade.configholder[config.galleryid] = config

			featureFade.alignpanels($, config);
		})
	}
}
