App = {
	activateParallax: function() {
		Event.observe(window, 'scroll', function(event) {
			var offset = document.viewport.getScrollOffsets().top;
			Element.extend(document.body).setStyle({backgroundPosition: "0 " + (Math.floor((offset | 0) / 3) - 70) + "px"}); 
		});
	},
	addPrintLink: function() {
		if (!window.print || !$('lyrics')) {
			return;
		}		
		var li = new Element('li');
		var span = new Element('span', {className: 'button_print'}).update('Print Lyrics');
		li.appendChild(span);
		span.observe('click', function() {
			window.print();	 
		});
		$$('#lyrics .buttons')[0].insert({bottom: li});
	}
};

document.observe('dom:loaded', function() {
	//App.activateParallax();
	App.addPrintLink();
	if ($('recommend')) {
		new App.Recommend();
	}
	if ($('send')) {
		new App.Recommend();
	}
	if ($$('#lyrics .stars')[0]) {
		new App.Vote();
	}
});

App.Recommend = Class.create({
	initialize: function(element) {
		this.form = $('recommend') || $('send');
		this.source = this.form.message.getValue();
		this.friendsName = null;
		this.yourName = null;
		this.changed = false;
		this.form.friendsName.observe('change', this.change.bindAsEventListener(this, 'friendsName'));
		this.form.yourName.observe('change', this.change.bindAsEventListener(this, 'yourName'));
		this.form.message.observe('change', function(event) {
			this.changed = true;
		}.bindAsEventListener(this));
	},
	change: function(event, name) {
		this[name] = this.form[name].getValue();
		if (!this.changed) {
			var message = this.source;
			if (this.friendsName) {
				message = 'Hi ' + this.friendsName + ',' + "\n" + message;
			}
			if (this.yourName) {
				message = message + "\n\n" + this.yourName;
			}
			this.form.message.setValue(message);
		}
	}
});

App.Vote = Class.create({
	initialize: function() {
		this.list = $$('#lyrics .stars')[0];
		this.stars = $A(this.list.select('li'));
		this.stars.each(function(star, i) {
			star.observe('mouseover', this.over.bindAsEventListener(this, i))
				.observe('mouseout', this.out.bindAsEventListener(this));
			$(star.getElementsByTagName('a')[0])
				.observe('click', this.vote.bindAsEventListener(this));
		}.bind(this));
		this.wait = new Element('span', {className: 'wait'});
		this.message = $$('#lyrics .message')[0];
		this.text = this.message.innerHTML;
	},
	vote: function(event) {
		event.stop();
		this.setMessage(this.text);
		var url = event.findElement('a').href;
		this.showWait();		
		this.out();
		new Ajax.Request(url, {
			method: 'get',
			onSuccess: this.success.bind(this),
			onFailure: this.failure.bind(this)
		});
	},
	success: function(transport, json) {
		if (json.status == 'success') {
			this.setMessage('Thank You');
			this.text = 'Votes: ' + json.votes;
			this.stars.each(function(star, i) {
				star.removeClassName('star_full')
					.removeClassName('star_half');
				if (json.stars[i + 1]) {
					star.addClassName('star_' + json.stars[i + 1]);
				}
			});
		} else {
			this.setMessage('You may only vote once');
		}
		this.showStars();
		setTimeout(this.setMessage.bind(this, this.text), 2000);
	},
	failure: function() {
		alert('Sorry, an error occured, please try again.');
		this.showThumbs();		
	},
	showWait: function() {
		this.hideStars();
		this.message.insert({before: this.wait});
		this.setMessage('Please wait…');
	},
	showStars: function() {
		this.hideWait();
		this.message.insert({before: this.list});
	},
	hideWait: function() {
		this.wait.remove();
	},
	hideStars: function() {
		this.list.remove();
	},
	setMessage: function(message) {
		this.message.update(message);
	},
	over: function(event, number) {
		this.stars.each(function(star, i) {
			if (i <= number) {
				star.addClassName('star_vote');
			} else {
				star.addClassName('star_blank');
			}
		});
	},
	out: function(event) {
		this.stars.each(function(star, i) {
			star.removeClassName('star_vote')
				.removeClassName('star_blank');
		});
	}
});