/* create namespace */
var org = org || {};
org.brainwidth = org.brainwidth || {};

(function() {
	var createSlideView = function(containerId) {
		var currentPos = 0;
		var timer;
		var slideContainer;

		var allSlides = [];
		var slidesByName = {};

		var showSlide = function(id) {
			var slide;

			if (isNaN(id)) {
				slide = slidesByName[id];
			} else {
				slide = allSlides[id];
			}

			if (!slide) return;

			var targetPos = slide.position;
			moveTo(currentPos, targetPos-currentPos, 50);
		};

		var findSlides = function(container) {
			var slide;

			var n, domSlide;
			var domSlides = container.getElementsByClassName("slide");
			var pos = 0;

			var computedWidth;

			for (n = 0; n < domSlides.length; n++) {
				domSlide = domSlides[n];
				slide = {
					domElement: domSlide,
					position: pos
				};

				computedWidth = window.getComputedStyle(domSlide, null).width;
				pos = pos + parseInt(computedWidth, 10);

				allSlides.push(slide);
				/* also index by name, if element has an id */
				if (domSlide.id) {
					slide.id = domSlide.id;
					slidesByName[slide.id] = slide;
				}
			}

			/* set size of the container so elements don't wrap */
			container.style.width = pos + "px";
		}

		var moveTo = function(start, pos, d) {
			var scrollTo = function(x) {
				currentPos = x;
				slideContainer.style.left = Math.floor(-x) + "px";
			}

			var cubicEaseInOut = function(t, b, c, d) {
				if ((t/=d/2) < 1) return c/2*t*t*t + b;
				return c/2*((t-=2)*t*t + 2) + b;
			}

			var easingFunc = function(t) {
				return cubicEaseInOut(t, start, pos, d);
			}

			/* we don't want two concurrent timers, i.e.
			 * cancel running animation and start new one  */
			if (timer) {
				clearInterval(timer);
			}

			var t = 0;

			var f = function() {
				scrollTo(easingFunc(t));
				t++;

				if (t == d) {
					/* make sure we are exactly where we wanted to be,
					 * regardless of what the easing function says
					 */
					scrollTo(start+pos);
					clearInterval(timer);
					timer = null;
				}
			}

			timer = setInterval(f, 10);
		};

		slideContainer = document.getElementById(containerId);
		findSlides(slideContainer);

		return {
			showSlide: showSlide,
			allSlides: allSlides
		};
	};

	org.brainwidth.SlideView = {};
	org.brainwidth.SlideView.create = createSlideView;
})();