document.observe("dom:loaded", function() {
	
	var items = $$('#scroll-box div.items')[0];
	var itemHeight = $$('div.items .item')[0].getHeight();
	
	var distanceFromStart = 0;
	
	loadEffects();
	
	var scrollers = $$('div.items .item .item-inner .toggle-scroll');
	scrollers.each(function(scroller) {
		scroller.observe('click', doScroll);
	});
	
	var doShowContact = $("show-contact");
	doShowContact.observe('click', showContact);
	
	var resets = $$('div.items .item .do-reset');
	resets.each(function(reset) {
		reset.observe('click', doReset);
	});
	
	var contactForm = $('contact-form');
	contactForm.observe('submit', submitContactForm);
	
	function doScroll(event) {
		if (event) { event.stop(); }
		new Effect.Move(items, { x: 0, y: -itemHeight, mode: 'relative' });
		distanceFromStart += itemHeight;
	}
	
	function doReset(event) {
		if (event) { event.stop(); }
		if ( distanceFromStart !== 0 ) {
			new Effect.Move(items, { x: 0, y: distanceFromStart, mode: 'relative' });
			distanceFromStart = 0;
		}
		return true;
	}
	
	function showContact(event) {
		if (event) { event.stop(); }
		if (distanceFromStart === itemHeight) {
			$('contact-form').shake();
			return false;
		} else {
			if (doReset() === true) {
				doScroll();
			}
		}
		return true;
	}
	
	function submitContactForm(event) {
		if (event) { event.stop(); }
		var form = Event.element(event);
		form.request({
			method: 'post',
			onSuccess: function(transport) {
				var response = transport.headerJSON;
				if (response.result) {
					var message = new Element('p', { 'class': 'success', 'title': 'Thank you' } ).update(response.message);
					message.hide();
					form.replace(message);
					$$('div.items .item .do-reset')[0].hide();
					message.appear();
					return true;
				} else {
					$$('div.items .item .do-reset')[0].hide();
					form.replace(response.form);
					var contactForm = $('contact-form');
					contactForm.hide();
					contactForm.observe('submit', submitContactForm);
					contactForm.appear();
					return false;
				}
			},
			onFailure: function() {
			}
		});
	}

	function loadEffects() {
		items.hide();
		items.appear({ duration: 1.0 });
	}
});