/**
 * @author mikezaschka
 */

var IScroll = new Class({
	options: {
		onComplete: function(el){
			// not implemented yet
		},
		className: 'iscrollframe',
		idName: 'iscrollframe',
		top: 'navTop',
		bottom: 'navEnd',
		topLink: 'toTop',
		bottomLink: 'toBottom'
	},

	initialize: function(element, options){
		this.setOptions(options);


		/* --- Modify HTML --- */
		if(!$($(element).parentNode).hasClass(this.options.className) && $(element).parentNode.id != this.options.idName){
			this.draggable = $(element).clone();

			var width = $(element).getSize().size.x;

			this.frame = new Element('div',{
				'class': this.options.className,
				'id': this.options.idName,
				'styles': {
					'width': width+'px'
				}
			});

			$(element).replaceWith($(this.frame));
			this.draggable.injectInside($(this.frame));

			var toBottomLink = '<a id="'+this.options.bottomLink+'" href="#"><img src="/fileadmin/templates/alexgastro/images/locationfinder/btn_down.gif" alt="nach unten" widht="173" height="28" /></a>';
			var toTopLink = '<a id="'+this.options.topLink+'" href="#"><img src="/fileadmin/templates/alexgastro/images/locationfinder/btn_up.gif" alt="nach oben" widht="173" height="28" /></a>';
			var naviTop = new Element('div',{
				'class': 'naviTop',
				'styles': {
					'width': '173px'
				}
			});
			var naviBottom = new Element('div',{
				'class': 'naviBottom',
				'styles': {
					'width': '173px'
				}
			});

			naviTop.setHTML(toTopLink);
			naviBottom.setHTML(toBottomLink);

			naviBottom.injectAfter($(this.frame));
			naviTop.injectBefore($(this.frame));

		} else {
			this.draggable = $(element);
			this.frame = $(element).parentNode;
		}

		/* --- Variables --- */
		this.scrollPosition = 0;
		this.scrollStep = 100;

		this.scroll = new Fx.Scroll(this.options.idName, {
			wait: false,
			duration: 500,
			offset: {'x': 0, 'y': 0},
			transition: Fx.Transitions.Quad.easeInOut
		});

		/* -- Scroll down if cookie is set -- */
		if(Cookie.get(this.options.idName) == 'bottom'){
			this.scrollPosition = this.draggable.getSize().size.y-this.frame.getSize().size.y;
			$(this.options.bottomLink).setStyles({
				'opacity': '0.2',
				'cursor':'default'
			});
			$(this.options.topLink).setStyles({
				'opacity': '1',
				'cursor':'pointer'
			});
		} else {


			$(this.options.bottomLink).setStyles({
				'opacity': '1',
				'cursor':'pointer'
			});
			$(this.options.topLink).setStyles({
				'opacity': '0.2',
				'cursor':'default'
			});

		}

		// Add events
		$(this.options.topLink).addEvent('click', this.scrollUp.bind(this));
		$(this.options.bottomLink).addEvent('click', this.scrollDown.bind(this));

	},
	scrollDown: function(event) {
		event = new Event(event).stop();

		this.scrollPosition += this.scrollStep;
		if (this.draggable.getSize().size.y-this.frame.getSize().size.y-this.scrollPosition > 0) {
			this.scroll.scrollTo(0, this.scrollPosition);
		} else {
			this.scroll.toElement(this.options.bottom);
			this.scrollPosition = this.draggable.getSize().size.y-this.frame.getSize().size.y;
			Cookie.set(this.options.idName,'bottom');
			$(this.options.bottomLink).setStyles({
				'opacity':'0.2',
				'cursor':'default'
			});
		}

		$(this.options.topLink).setStyles({
			'opacity':'1',
			'cursor':'pointer'
		});
	},
	scrollUp: function(event) {
		event = new Event(event).stop();
			this.scrollPosition -= this.scrollStep;
			if (this.scrollPosition >= 0) {
				this.scroll.scrollTo(0, this.scrollPosition);
			} else {
				this.scroll.toElement(this.options.top);
				Cookie.remove(this.options.idName);
				this.scrollPosition = 0;
				$(this.options.topLink).setStyles({
					'opacity': '0.2',
					'cursor':'default'
				});
			}

			$(this.options.bottomLink).setStyles({
				'opacity': '1',
				'cursor':'pointer'
			});
	}


});

IScroll.implement(new Options());

var theScroller = {
	init: function() {
		if($('outletScrollbarMask').getSize().size.y > 469){
			var jsLintIScroll = new IScroll($('outletScrollbar'),{
				top: 'OutletNavTop',
				bottom: 'OutletNavBottom',
				topLink: 'OutletToTop',
				bottomLink: 'OutletToBottom',
				idName: 'outletFrame'
			});
		}

		var scrollbar = $('detailsScrollbar');
		if(scrollbar.getSize().size.y > 469){
			var jsLintIScroll2 = new IScroll($('detailsScrollbar'),{
				top: 'DetailsNavTop',
				bottom: 'DetailsNavBottom',
				topLink: 'DetailsToTop',
				bottomLink: 'DetailsToBottom',
				idName: 'detailsFrame'
			});
		} else {
			scrollbar.setStyle('margin-top','20px');
		}
	}
};