var SimpleSlider = function(navigation, container) {
	this.init();
}

var CSS_OPEN = 'open';

SimpleSlider.prototype = {
    constructor: SimpleSlider,


    /**
    * Initializes important settings & nodes
    * @private
    */
    init: function () {
        this.isMobile = ($(window).width() < 640);
        if (this.isMobile) {
            this.mobileTopNavHeight = $('#header-mobile').outerHeight(true);
        }

		var ROOT    = '#nav-page';
		var ARROW_HTML = '<span class="arrow">arrow</span>';

		this.nav         = $('#nav-page');
		this.container   = $(".center_slider");
		this.contentSub  = $(".menu_slider");
		this.ib = $('#information-bar');
		this.dp	 = this.container.parent().parent().parent();
		this.dp.attr('id','diagnostic-path');
		this.article     = this.container.find('.pane-content');
		this.nextBtn     = this.container.find('a.next');
		this.prevBtn     = this.container.find('a.prev');
		this.closeBtn    = this.dp.find('a.close');
		this.startBar    = this.container.find('.dp-trigger').parent();
		this.prevNextbar = this.nextBtn.parent().hide();
		this.overlay     = $("#overlay");

		this.overlay.click(this.overlayClicked.bind(this));
		this.closeBtn.click(this.overlayClicked.bind(this));

		this.itemCount = this.nav.find('li').length;
		this.started   = false;

		var rootUrl = document.location.protocol+'//'+(document.location.hostname||document.location.host);

		this.nav.find('a').each(function() {
			this.href = "#!" + this.href.replace(rootUrl, '');
		});

		$(window).hashchange(this.hashChanged.bind(this));
        if (!this.isMobile) {
            $(window).scroll(this.userScrolled.bind(this));
        }

		if (location.hash.indexOf('#!') > -1) {
			this.hashChanged();
		}
		this.handleScrolling();

		//Collapsable menu
		this.root = $(ROOT);
		this.rootParent = this.root.find('ul:first');
		this.rootParent.find('li:has(ul)').prepend(ARROW_HTML);
		this.rootParent.find('li:has(ul)').addClass(CSS_OPEN);
		$('.arrow', ROOT).bind('click', this.handleArrowClick.bind(this));
    },

	// TODO:
	userScrolled: function(e) {
		clearTimeout(this._scrupdate);

		this._scrupdate = setTimeout(
			this.handleScrolling.bind(this), 200
		);
	},

	handleScrolling: function(e) {
        if (!this.isMobile) {
            var main = this.container;
            var sub = this.contentSub;

            var scrollTop = $(window).scrollTop();
            var min = main.offset().top;
            var space = main.height() - sub.height();

            var pos = Math.max(0, Math.min(space, scrollTop - min));

            sub.animate({top: pos});
        }
	},

	hashChanged: function(e) {
		var hash = window.location.hash;
		if (hash.indexOf("#!") < 0) {
			return;
		}
		this.navigate(hash.split("#!", 2).pop());
	},

	// Collapsable menu

	/**
	 * Handles the click on a item.
	 * @param {Event} e the event
	 */
	handleArrowClick: function(e) {
		this.toggleCollapse(this.getItem(e.target));
	},

	/**
	 * Toggles the item.
	 * @param {jQuery} item the item
	 */
	toggleCollapse: function(item) {
		if (item.hasClass(CSS_OPEN)) {
			this.close(item);
		} else {
			this.open(item);
		}
	},

	/**
	 * Gets the closest item or itself if the node is an 'li'.
	 * @param {Node or jQuery} node the node (e.g. 'a', 'span', 'li')
	 * @return {jQuery} the item ('li')
	 */
	getItem: function(node) {
		var result = $(node);
		if (result.length > 0) {
			if (result.is('li')) {
				return result;
			}
			return result.closest('li');
		}
		return result;
	},

	/**
	 * Closes the item.
	 * @param {jQuery} item the item
	 */
	close: function(item) {
	item.removeClass(CSS_OPEN);
	},

	/**
	 * Opens the item.
	 * @param {jQuery} item the item
	 */
	open: function(item) {
		item.addClass(CSS_OPEN);
	},

	/**
	 *
	 *
	 * @private
	 */
	navigate: function(url) {
		var a = this.nav.find('a[href*="'+url+'"]');
		var li = a.parent();
		this.activateNavItem(li);
		if (!this.started) {
			//this.showOverlay();
			this.started = true;
			this.dp.addClass('started');
			this.prevNextbar.show();
			this.startBar.hide();
		}
		this.loadContentFromUrl(url);
	},

	activateNavItem: function(li) {
		this.nav.find('li.active').removeClass("active");
		li.addClass("active");
	},

	/**
	 *
	 *
	 * @private
	 */
	loadContentFromUrl: function(url) {
		$.get(url, this.contentLoaded.bind(this));
	},

	contentLoaded: function(html) {
		this.article.empty();
		this.article.html(html);
		this.adjustOverlay();
		this.scrollToStart();

		var idx = this.getCurrentIndex();
		if (idx == 0) {
			this.prevBtn.hide();
		} else if (idx == this.itemCount-1) {
			this.nextBtn.hide();
		}
		var activeLI = this.nav.find('li.active:first');
		var next = activeLI.next();
		if (next[0]) {
			this.nextBtn.attr("href", next.find('a')[0].href);
		}
		var prev = activeLI.prev();
		if (prev[0]) {
			this.prevBtn.attr("href", prev.find('a')[0].href);
		}

                EPHARMA.vids.push(new MediaElementPlayer(this.article.find('video')));
	},

	/**
	 *
	 *
	 * @private
	 */
	getCurrentIndex: function() {
		var activeItem = this.nav.find('li.active');
		return this.nav.find('li').index(activeItem);
	},

	/**
	 *
	 *
	 * @public
	 */
	start: function(e) {
		if (e) {
			e.preventDefault();
		}
		if (this.started) {
			return;
		}
		this.showOverlay();
		this.started = true;
		this.dp.addClass("started");
		this.prevNextbar.show();
		this.startBar.hide();
		var a = this.nav.find('li:eq('+1+') a');
		window.location.href = a[0].href;
		this.scrollToStart();
	},

	/**
	 *
	 *
	 * @public
	 */
	stop: function() {
		if (!this.started) {
			return;
		}
		this.started = false;
		this.dp.removeClass("started");
		this.prevNextbar.hide();
		this.startBar.show();
		this.hideOverlay();
	},

	/**
	 *
	 *
	 * @private
	 */
	showOverlay: function() {
		this.dp.css("z-index", 1200);
		this.ib.css({
			"position":'relative',
			"z-index": 99999
			});
		this.adjustOverlay().fadeIn();
	},

	/**
	 *
	 *
	 * @private
	 */
	adjustOverlay: function() {
		return this.overlay.css({height: this.getDocumentHeight() + "px"});
	},

	/**
	 *
	 *
	 * @private
	 */
	hideOverlay: function() {
		this.overlay.hide();
		this.dp.css("z-index", 0);
		this.ib.css("z-index", 0);
	},

	/**
	 *
	 *
	 * @private
	 */
	overlayClicked: function(e) {
		if (e) {
			e.preventDefault();
		}
		this.stop();
	},

	scrollToStart: function() {
        var top = -20;
        if (this.isMobile) {
            top -= this.mobileTopNavHeight;
        }
		$.scrollTo(this.container, 500, {
			offset: {top: top, left: 0}
		});
	},

	/**
	 * Calculates the page's height.
	 * This method is called via toggle, and should not be called manually.
	 * @private
	 */
	getDocumentHeight:function() {
		var height = document.documentElement.scrollHeight || document.body.scrollHeight;
		var winHeight = window.innerHeight || document.documentElement.clientHeight;
		return (height < winHeight)? winHeight : height;
	}

}