﻿// Object is used to swap div's and change background of div's
function turnImages(motivatingPanel, start_callback, completed_callback) {
	var mainImg = $("#" + motivatingPanel).find(".main-image");
	var swapImg = $("#" + motivatingPanel).find(".swap-image");
	var default_timeout = 5000;
	var images_timer;
	var image_objs = new Array();
	var currentImgIndex = -1;
	var _start_callback = start_callback;
	var _complete_callback = completed_callback;
	var _enableAnimation = true;
	var _current_timeout = default_timeout;
	var _focused = false;
	/* Public interface */
	this.appendImg = function(imgUrl, preLoad) {
		return _appendImg(imgUrl, preLoad);
	}
	this.showNextImage = function() {
		setTimeout(_showNextImage, 1)
	}
	this.turnImage = function(imgIndex) {
		return _turnImage(imgIndex, default_timeout);
	}
	this.turnImage = function(imgIndex, timeout) {
		return _turnImage(imgIndex, timeout);
	}
	this.disableAnimation = function() {
		_enableAnimation = false;
	}
	/* Private implementation */
	$("#" + motivatingPanel).hover(function() {
		clearTimeout(images_timer);
		_focused = true;
	}, function() {
		if (_enableAnimation) {
			images_timer = setTimeout(_showNextImage, _current_timeout);
		}
		_focused = false;
	});
	$(window).unload(function() {
		// disable animation while unload
		_enableAnimation = false;
		mainImg.clearQueue();
		mainImg.stop();
		clearTimeout(images_timer);
	});
	
	function _appendImg(imgUrl, preLoad) {
		clearTimeout(images_timer);
		var result = new Object();
		result.imgURL = imgUrl;
		if (preLoad) {
			_preLoadImg(result);
		}
		image_objs.push(result);
		if (image_objs.length > 1 && _enableAnimation) {
			clearTimeout(images_timer);
			images_timer = setTimeout(_showNextImage, default_timeout);
		}
		return result;
	}
	function _showNextImage() {
		currentImgIndex = _nextImgIndex();
		_turnImage(currentImgIndex, default_timeout);
	}
	var nextImgIndex;
	function _turnImage(imgIndex, timeout) {
		clearTimeout(images_timer);
		_current_timeout = timeout;
		nextImgIndex = imgIndex;
		var imgURL = "url('" + image_objs[nextImgIndex].imgURL + "')";
		mainImg.clearQueue();
		mainImg.stop();
		mainImg.fadeTo("fast", 1);
		mainImg.queue(function() {
			swapImg.css("background-image", imgURL);
			if (_start_callback != null) {
				_start_callback(image_objs[imgIndex]);
			}
			$(this).dequeue();
		});
		mainImg.fadeTo("slow", 0.1);
		mainImg.queue(function() {
			mainImg.css("background-image", imgURL);
			$(this).dequeue();
		});
		mainImg.fadeTo(1, 1);
		mainImg.queue(function() {
			_preLoadImg(image_objs[_nextImgIndex()]);
			if (_complete_callback != null) {
				_complete_callback(image_objs[imgIndex]);
			}
			if (!_focused && _enableAnimation) {
				images_timer = setTimeout(_showNextImage, timeout);
			}
			$(this).dequeue();
		});

	}
	function _nextImgIndex() {
		var nextIndex = currentImgIndex + 1;
		if (nextIndex >= image_objs.length) {
			nextIndex = 0;
		}
		return nextIndex;
	}
	function _preLoadImg(imgObj) {
		var img = new Image();
		$(img).attr('src', imgObj.imgURL);
		if (img.complete) {
			populateImgData(imgObj, $(img));
		}
		else {
			$(img).load(function() {
				populateImgData(imgObj, $(this));
			});
		}
	}
	function populateImgData(imgObj, imgElement) {
		imgObj.cached = true;
		imgObj.width = imgElement.attr("width");
		imgObj.height = imgElement.attr("height");
		imgElement.detach();
	}
}

function fillImgData(imgObj, description, targetURL) {
	imgObj.description = description;
	imgObj.targetURL = targetURL;
}

