(function ($) {

	$(document).ready(function () {
		$('#employeePage').append('<div id="tSliderLoader"></div><ul id="tSlider"></ul>');
		$('#singleEmployee').remove();
	});

	$.tSlider = function (options) {
		/* Variables
		-------------------- */
		var slider = '#tSlider',
			base = this,
			mousemove = null,
			shareIcons = $("<div class='employeeShareThis'> "
								+ "<span class='st_twitter'></span><span class='st_facebook'></span><span class='st_email'></span><span class='st_sharethis'>"
							+ "</span></div>");
		base.$slider = $(slider);
		base.slider = slider;
		vars = $.tSlider.vars;

		base.$slider.data('tSlider', base);
		api = base.$slider.data('tSlider');

		var isHandHeld = (navigator.userAgent.match(/((iphone)|(ipod)|(ipad)|(android)|(windows ce)|(windows phone)|(blackberry)|(symbian))/gi) != null);
		var isMSIE = (navigator.userAgent.match(/(MSIE)/gi) != null);

		base.addMouseListener = function () {

			$('<div id="rightNav"></div>')
				.css({
					position: 'fixed',
					zIndex: 900,
					top: 0,
					right: 0,
					width: (base.$slider.width() * 0.075) + 'px',
					height: base.$slider.height() + 'px'
				})
				.hover(function () {
					base.mouseMoveEvent('rightNav');
				},
				function () {
					base.resetMouse('rightNav');
				})
				.bind('click', base.nextSlide)
				.prependTo(base.$slider);

			$('<div id="leftNav"></div>')
				.css({
					position: 'fixed',
					zIndex: 900,
					top: 0,
					left: 0,
					width: (base.$slider.width() * 0.075) + 'px',
					height: base.$slider.height() + 'px'
				})
				.hover(function () {
					base.mouseMoveEvent('leftNav');
				},
				function () {
					base.resetMouse('leftNav');
				})
				.bind('click', base.prevSlide)
				.prependTo(base.$slider);
		};

		base.init = function () {
			$.tSlider.vars.options = $.extend({}, $.tSlider.defaultOptions, options);
			base.options = $.tSlider.vars.options;

			vars.employeeIdList = base.options.IDList;

			base._build();


		};

		base._build = function () {
			var startingSlides = '',
				thisSlide = 0,
				slide = '',
				classCurrentSlide = '',
				infoBox = '';
			vars.currentSlide = 2;

			for (var i = 0; i < 5; i++) {

				infoBox = '<div class="vCard infoBox"><h1 class="fn"></h1><h2 class="title"></h2><h2 class="phone"></h2></div>';

				switch (thisSlide) {
					case 1:
						classCurrentSlide = 'prevSlide';
						break;
					case 2:
						classCurrentSlide = 'currentSlide';
						break;
					case 3:
						classCurrentSlide = 'nextSlide';
						break;
					default:
						classCurrentSlide = '';
						break;
				}

				slide = '<li class="slide-' + thisSlide + ' ' + classCurrentSlide + '">' + infoBox + '</li>';
				startingSlides = startingSlides + slide;
				thisSlide++;
			}

			$('body')
				.hide()
				.fadeIn('slow', function () {
					if (!isHandHeld) {
						base.addMouseListener();
					}
				});
			$(startingSlides).appendTo(base.$slider);

			if (isHandHeld) {
				//touch navigation
				var downX, upX;
				document.ontouchmove = function (e) {
					e.preventDefault();
				}
				$(window).bind('touchstart', function (e) {
					downX = e.originalEvent.touches[0].pageX;
				});
				$(window).bind('touchmove', function (e) {
					upX = e.originalEvent.touches[0].pageX;
				});
				$(window).bind('touchend', function (e) {
					if ((downX - upX) > 50) {
						base.nextSlide();
					} else if (upX - downX > 50) {
						base.prevSlide();
					}
				});
			}
			base._start();
		};

		base._start = function () {
			var startingSlides = '',
				thisSlide,
				classCurrentSlide = '',
				infoBox = '';
			vars.currentSlide = 2;

			$.getJSON(
				'/Templates/DearFriends/Handlers/GetEmployeeInfo.ashx',
				{
					employeePageID: base.options.currentEmployee,
					before: 2,
					after: 2,
					date: new Date().getTime() + Math.random()
				},
				function (respons) {
					for (var i = 0; i < respons.length; i++) {
						var img = $('<img src="' + respons[i].EmployeeImageUrl + '" alt="' + respons[i].Name + '" />');
						thisSlide = $(base.slider + ' li:eq(' + i + ')');

						thisSlide
							.data({
								EmployeeUrl: respons[i].EmployeeUrl,
								Name: respons[i].Name
							})
							.find('.fn')
								.text(respons[i].Name)
							.end()
							.find('.title')
								.text(respons[i].Title)
                            .end()
                            .find('.phone')
								.text(respons[i].PhoneNumber);

						img
							.appendTo(thisSlide)
							.load(function () {
								$(this).data('origWidth', $(this).width()).data('origHeight', $(this).height());
								base.resizeNow(0);
							});


					}
				}
			);

			var employeeIdListIndex = vars.employeeIdList.indexOf(base.options.currentEmployee.toString());
			vars.nextId = vars.employeeIdList[((employeeIdListIndex + 2 > (vars.employeeIdList.length - 1)) ? employeeIdListIndex + 2 - (vars.employeeIdList.length - 1) : employeeIdListIndex + 2)];
			vars.prevId = vars.employeeIdList[((employeeIdListIndex - 2 < 0) ? (employeeIdListIndex - 2) + vars.employeeIdList.length : employeeIdListIndex - 2)];

			$(document.documentElement).keyup(function (event) {

				if ($('.currentSlide', base.$slider).hasClass('inAnimation')) return false; 	// Abort if currently animating

				// Left Arrow or Down Arrow
				if ((event.keyCode == 37) || (event.keyCode == 40)) {
					base.prevSlide(base.$slider.width() / 2);

					// Right Arrow or Up Arrow
				} else if ((event.keyCode == 39) || (event.keyCode == 38)) {
					base.nextSlide(base.$slider.width() / 2);
				}

			});

			$(window).resize(function () {
				base.resizeNow(0);
			});
		};

		base.resizeNow = function (offset) {

			try {
				$('#rightNav', base.$slider)
					.height(base.$slider.height())
					.width(base.$slider.width() * 0.15);
				$('#leftNav', base.$slider)
					.height(base.$slider.height())
					.width(base.$slider.width() * 0.15);
			}
			catch (err) {
				console.log('Failed with navigation element resize: ' + err.description);
			}

			//  Resize each image seperately
			$('img', base.slider).each(function () {

				thisSlide = $(this);
				var ratio = (thisSlide.data('origHeight') / thisSlide.data('origWidth')).toFixed(2); // Define image ratio
				// Gather browser size
				var browserwidth = base.$slider.width(),
					browserheight = base.$slider.height();

				if ((browserheight / browserwidth) > ratio) {
					ratio < 1 ? resizeHeight() : resizeWidth();
				} else {
					ratio >= 1 ? resizeHeight() : resizeWidth();
				}

				function resizeWidth() {
					thisSlide
						.width(browserwidth)
						.height(browserwidth * ratio);
				}

				function resizeHeight() {
					thisSlide
						.height(browserheight)
						.width(browserheight / ratio);
				}

				// Horizontally Center
				if (base.options.horizontalCenter) {
					$(this).css('left', (browserwidth - $(this).width()) / 2);
					$('.currentSlide', base.$slider)
						.css('left', 0 + offset);
					$('.nextSlide', base.$slider)
						.css('left', base.$slider.width() + offset);
					$('.prevSlide', base.$slider)
						.css('left', -base.$slider.width() + offset);
				}

				// Vertically Center
				if (base.options.verticalCenter) {
					$(this).css('top', (browserheight - $(this).height()) / 2);
				}

			});

			return false;
		};

		base.prevSlide = function (mousePositionX) {

			if ($('.currentSlide', base.$slider).hasClass('inAnimation')) return false;
			if (!isHandHeld) {

				if (mousePositionX != null) {
					mousemove = mousePositionX;
				}
				base.$slider.bind('mousemove', function (e) {
					if (e.pageX != null)
						mousemove = e.pageX;
				});

			}
			$('.prevSlide', base.$slider).addClass('inAnimation');

			vars.currentSlide = (vars.currentSlide == 0) ? $(base.slider + ' li').last().index() : vars.currentSlide--;
			var prevSlide = $(base.slider + ' li:eq(' + vars.currentSlide + ')');
			//var employeeIdToSend = $(base.slider + ' li').first().data('EmployeeID');
			var employeeIdToSend = vars.prevId;
			var prevIdIndex = vars.employeeIdList.indexOf(vars.prevId.toString());
			vars.prevId = vars.employeeIdList[(prevIdIndex - 1 < 0) ? (prevIdIndex - 1) + (vars.employeeIdList.length - 1) : prevIdIndex - 1];
			var nextIdIndex = vars.employeeIdList.indexOf(vars.nextId.toString());
			vars.nextId = vars.employeeIdList[(nextIdIndex - 1 < 0) ? (nextIdIndex - 1) + (vars.employeeIdList.length - 1) : nextIdIndex - 1];
			console.log("preev: " + vars.prevId);
			var slideToMove = $(base.slider + ' li').last();

			slideToMove
				.addClass('slideToLoad')
				.removeData()
				.prependTo(base.$slider)
				.find('img')
					.remove();

			base.animateSlide('leftToRight', function () {
				$.getJSON(
					'/Templates/DearFriends/Handlers/GetEmployeeInfo.ashx',
					{
						employeePageID: employeeIdToSend,
						before: 1,
						date: new Date().getTime() + Math.random()
					},
					function (respons) {
						slideToMove
							.data({
								EmployeeUrl: respons[0].EmployeeUrl,
								Name: respons[0].Name
							})
							.find('.fn')
								.text(respons[0].Name)
							.end()
							.find('.title')
								.text(respons[0].Title)
                            .end()
                            .find('.phone')
							    .text(respons[0].PhoneNumber);

						var img = $('<img src="' + respons[0].EmployeeImageUrl + '" alt="' + respons[0].Name + '" />');

						img
							.appendTo(slideToMove)
							.load(function () {
								$(this).data('origWidth', $(this).width()).data('origHeight', $(this).height());
							});

						slideToMove
							.removeClass('slideToLoad');
					}
				);
				$('.currentSlide', base.$slider)
					.removeClass('inAnimation');



				if (!isHandHeld) {
					var offset = base.$slider.width() * 0.075;
					if (mousemove > (base.$slider.width() - offset)) {
						base.mouseMoveEvent('rightNav');
					} else if (mousemove < offset || mousemove == null || mousemove == 'undefined') {
						base.mouseMoveEvent('leftNav');
					}
					base.$slider.unbind('mousemove');
				}
			});
			return false;
		};

		base.nextSlide = function (mousePositionX) {

			if ($('.currentSlide', base.$slider).hasClass('inAnimation')) return false;
			if (!isHandHeld) {
				if (mousePositionX != null) {
					mousemove = mousePositionX;
				}
				base.$slider.bind('mousemove', function (e) {
					if (e.pageX != null)
						mousemove = e.pageX;
				});
			}
			$('.nextSlide', base.$slider).addClass('inAnimation');

			vars.currentSlide = (vars.currentSlide == $(base.slider + ' li').last().index()) ? 0 : vars.currentSlide++;
			var nextSlide = $(base.slider + ' li:eq(' + vars.currentSlide + ')');
			//var employeeIdToSend = $(base.slider + ' li').last().data('EmployeeID');
			console.log(vars.nextId);
			var employeeIdToSend = vars.nextId;
			var nextIdIndex = vars.employeeIdList.indexOf(vars.nextId.toString());
			vars.nextId = vars.employeeIdList[(nextIdIndex + 1 > (vars.employeeIdList.length - 1)) ? (nextIdIndex + 1) - (vars.employeeIdList.length - 1) : nextIdIndex + 1];
			var prevIdIndex = vars.employeeIdList.indexOf(vars.prevId.toString());
			vars.prevId = vars.employeeIdList[(prevIdIndex + 1 > (vars.employeeIdList.length - 1)) ? (prevIdIndex + 1) - (vars.employeeIdList.length - 1) : prevIdIndex + 1];
			var slideToMove = $(base.slider + ' li').first();

			slideToMove
				.addClass('slideToLoad')
				.removeData()
				.appendTo(base.$slider)
				.find('img')
					.remove();

			base.animateSlide('rightToLeft', function () {

				$.getJSON(
					'/Templates/DearFriends/Handlers/GetEmployeeInfo.ashx',
					{
						employeePageID: employeeIdToSend,
						after: 1,
						date: new Date().getTime() + Math.random()
					},
					function (respons) {
						slideToMove
							.data({
								EmployeeUrl: respons[0].EmployeeUrl,
								Name: respons[0].Name
							})
							.find('.fn')
								.text(respons[0].Name)
							.end()
							.find('.title')
								.text(respons[0].Title)
                            .end()
                            .find('.phone')
								.text(respons[0].PhoneNumber);

						var img = $('<img src="' + respons[0].EmployeeImageUrl + '" alt="' + respons[0].Name + '" />');

						img
							.appendTo(slideToMove)
							.load(function () {
								$(this).data('origWidth', $(this).width()).data('origHeight', $(this).height());
							});

						slideToMove
							.removeClass('slideToLoad');
					}
				);

				$('.currentSlide', base.$slider).removeClass('inAnimation');
				console.log(mousemove);
				if (!isHandHeld) {
					var offset = base.$slider.width() * 0.075;
					if (mousemove > (base.$slider.width() - offset) || mousemove == null) {
						base.mouseMoveEvent('rightNav');
					} else if (mousemove < offset) {
						base.mouseMoveEvent('leftNav');
					}
					base.$slider.unbind('mousemove');
				}
			});
			return false;
		};

		base.animateSlide = function (direction, callbackFunction) {
			var newCurrentSlide = $(base.slider + ' li:eq(' + vars.currentSlide + ')'),
				newPrevSlide = (vars.currentSlide - 1 < 0) ? 5 : vars.currentSlide - 1,
				newNextSlide = (vars.currentSlide + 1 > 5) ? 0 : vars.currentSlide + 1;

			var oldCurrentSlide = $('.currentSlide', base.$slider),
				oldPrevSlide = $('.prevSlide', base.$slider),
				oldNextSlide = $('.nextSlide', base.$slider);

			newPrevSlide = $(base.slider + ' li:eq(' + newPrevSlide + ')');
			newNextSlide = $(base.slider + ' li:eq(' + newNextSlide + ')');

			if (history.pushState) {
				history.pushState({ empUrl: newCurrentSlide.data('EmployeeUrl') }, newCurrentSlide.data('Name') + ' - Dear Friends', '/employees/' + newCurrentSlide.data('EmployeeUrl') + '/');
				$('title').text(newCurrentSlide.data('Name') + ' - Dear Friends');
			}

			var offset = 0;
			if ($('#rightNav', base.$slider).hasClass('activeNav')) {
				offset = base.$slider.width() * -0.075;
			}
			if ($('#leftNav', base.$slider).hasClass('activeNav')) {
				offset = base.$slider.width() * 0.075;
			}
			base.resizeNow(offset);
			offset = 0;

			if (direction == 'rightToLeft') {

				newCurrentSlide
					.addClass('currentSlide')
					.animate({ left: 0 + offset }, base.options.sliderAnimationTime, base.options.sliderEasing, function () {


					});

				newPrevSlide
					.addClass('prevSlide')
					.animate({ left: -base.$slider.width() + offset }, base.options.sliderAnimationTime + 150, base.options.sliderEasing, function () {

						oldCurrentSlide
							.removeClass('currentSlide');
						oldNextSlide
							.removeClass('nextSlide');
						oldPrevSlide
							.removeClass('prevSlide');
						if (typeof callbackFunction == 'function') {
							callbackFunction.call(this);
						}
					});

				newNextSlide
					.css('left', (base.$slider.width() * 2 + offset))
					.addClass('nextSlide')
					.animate({ left: base.$slider.width() + offset }, base.options.sliderAnimationTime, base.options.sliderEasing, function () {


					});


			} else if (direction == 'leftToRight') {



				newCurrentSlide
					.addClass('currentSlide')
					.animate({ left: 0 + offset }, base.options.sliderAnimationTime, base.options.sliderEasing, function () {


					});

				newNextSlide
					.addClass('nextSlide').css('zIndex', 20)
					.animate({ left: base.$slider.width() + offset }, base.options.sliderAnimationTime + 150, base.options.sliderEasing, function () {

						oldCurrentSlide
							.removeClass('currentSlide');
						oldPrevSlide
							.removeClass('prevSlide');
						newNextSlide.css('zIndex', '');
						oldNextSlide
							.removeClass('nextSlide');
						if (typeof callbackFunction == 'function') {
							callbackFunction.call(this);
						}
					});

				newPrevSlide
					.css('left', (-base.$slider.width() * 2 + offset))
					.addClass('prevSlide')
					.animate({ left: -base.$slider.width() + offset }, base.options.sliderAnimationTime, base.options.sliderEasing, function () {


					});
			}

			// Modify URL on navigation arrow
			$('a.left', '#navbuttons').attr('href', "/employee/" + newPrevSlide.data('EmployeeUrl') + "/");
			$('a.right', '#navbuttons').attr('href', "/employee/" + newNextSlide.data('EmployeeUrl') + "/");

		};

		base.mouseMoveEvent = function (element) {
			var currentSlide = $('.currentSlide', base.$slider);
			$('#' + element, base.$slider).addClass('activeNav');
			if (currentSlide.hasClass('inAnimation')) return false;

			var clickArea = (base.$slider.width() * 0.075),
				nextSlide = $('.nextSlide', base.$slider),
				prevSlide = $('.prevSlide', base.$slider);


			if (element == 'rightNav') {

				currentSlide
					.stop()
					.animate({ left: -clickArea }, { duration: base.options.hoverAnimationTime + 50, queue: false, easing: base.options.hoverEasing });
				nextSlide
					.stop()
					.animate({ left: base.$slider.width() - clickArea }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });


			} else if (element == 'leftNav') {

				prevSlide
					.stop()
					.animate({ left: clickArea - base.$slider.width() }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });
				currentSlide
					.stop()
					.animate({ left: clickArea }, { duration: base.options.hoverAnimationTime + 50, queue: false, easing: base.options.hoverEasing });
			}
		};

		base.resetMouse = function (element) {
			var currentSlide = $('.currentSlide', base.$slider);
			$('#' + element, base.$slider).removeClass('activeNav');
			if (currentSlide.hasClass('inAnimation')) return false;

			var nextSlide = $('.nextSlide', base.$slider),
				prevSlide = $('.prevSlide', base.$slider);


			if (element == 'rightNav') {

				nextSlide
					.stop()
					.animate({ left: base.$slider.width() }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });
				currentSlide
					.stop()
					.animate({ left: 0 }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });

			} else if (element == 'leftNav') {

				prevSlide
					.stop()
					.animate({ left: -base.$slider.width() }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });
				currentSlide
					.stop()
					.animate({ left: 0 }, { duration: base.options.hoverAnimationTime, queue: false, easing: base.options.hoverEasing });
			}
		};

		base.swipe = function () {
		};

		base.init();
	};

	$.tSlider.vars = {
		currentSlide: 0,
		loadedSlides: [],
		inAnimation: false,
		employeeIdList: new Array(),
		nextId: '',
		prevId: '',
		options: {}

	};

	$.tSlider.defaultOptions = {
		horizontalCenter: 1,
		verticalCenter: 1,
		sliderEasing: 'easeOutExpo',
		sliderAnimationTime: 1300,
		hoverEasing: 'easeOutExpo',
		hoverAnimationTime: 400
	};

	$.fn.tSlider = function (options) {
		return this.each(function () {
			(new $.tSlider(options));
		});
	};

})(jQuery);