var _pol;
var _par;

ClubJudge.RightBar = Class.create();
ClubJudge.RightBar.prototype = {
	initialize: function(cattr, tag, par) {
		this.attr = cattr;
		this.tag = tag;
		_par = par;
		
		this.buildObserve();
	},
	
	buildObserve: function() {
		//this.items = $A(document.getElementsByTagName(this.tag[0])).map(Element.extend);
		//this.submit = $A(document.getElementsByTagName(this.tag[1])).map(Element.extend);
		this.poll 	= $$('.' + this.tag[1]);
		this.nl		= $$('.' + this.tag[0]);
		
		Event.observe('nlName', 'focus', function() { this.value = ''; });
		Event.observe('nlName', 'blur', function() { if(this.value == '') { this.value = 'Your name'; } });
		
		Event.observe('nlEmail', 'focus', function() { this.value = ''; });
		Event.observe('nlEmail', 'blur', function() { if(this.value == '') { this.value = 'Your email'; } });
		
		for(var i = 0; i < this.poll.length; i++) {
			if(this.poll[i].getAttribute(this.attr)) {
				Event.observe(this.poll[i], 'click', function(evnt) { this.parseAjax(evnt) }.bind(this), false);
			}
		}
		
		for(var i = 0; i < this.nl.length; i++) {
			if(this.nl[i].getAttribute(this.attr)) {
				Event.observe(this.nl[i], 'click', function(evnt) { this.parseAjax(evnt) }.bind(this), false);
			}
		}
	},
	
	parseAjax: function(evnt) {
		//alert('hoi!');
		this.elem = Event.element(evnt);
		this.item = Event.element(evnt).getAttribute(this.attr);
		_poll = this.item.split('.')[0];
		
		if(_poll == 'pollSubmit') {
			this.option = document.getElementsByName('poll');
			
			for(var i = 0; i < this.option.length; i++) {
				if(this.option[i].checked) {
					this.option = this.option[i].value;
				}
			}
			
			this.item = this.item.split('.');
			this.poll = this.item[0];
			this.pid = this.item[1]
			
			this.param = { 'item': this.poll, 'pid': this.pid, 'option': this.option };
		} else if(_poll == 'poll') {
			this.item = this.item.split('.');
			this.poll = this.item[0];
			this.pid = this.item[1]
			
			this.param = { 'item': this.poll, 'pid': this.pid };
		} else if(_poll == 'nlSubmit') {
			this.poll = 'nl';
			
			if($('nlName').value != 'Your name'){
				if($('nlEmail').value.match(/^(("[\w-\s]+")|([\w-]+(?:\.[\w-]+)*)|("[\w-\s]+")([\w-]+(?:\.[\w-]+)*))(@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$)|(@\[?((25[0-5]\.|2[0-4][0-9]\.|1[0-9]{2}\.|[0-9]{1,2}\.))((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\.){2}(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[0-9]{1,2})\]?$)/i)) {
					this.param = { 'item': 'nl', 'name': $('nlName').value, 'email': $('nlEmail').value };
				} else {
					$('nlEmail').style.border = '1px solid red';
					$('nlEmail').style.padding = '2px';
				}
			} else {
				if($('nlName').value == '' || $('nlName').value == 'Your name') {
					$('nlName').style.border = '1px solid red';
					$('nlName').style.padding = '2px';
				} 
				
				if($('nlEmail').value == '' || $('nlEmail').value == 'Your email') {
					$('nlEmail').style.border = '1px solid red';
					$('nlEmail').style.padding = '2px';
				}
			}
		}
		
		if(this.param != undefined) {
			this.options = {
				asynchronous: false,
				method: 'post',
				parameters: this.param,
				onSuccess: ((this.poll.match('poll')) ? this.buildPoll.bind(this) : this.assignNL.bind(this))
			}
		
			new Ajax.Request('/backbase/php/includes/ajax/right.ajax.php', this.options);
		}
	},
	
	assignNL: function(t) {
		this.par = _par;
		
		if(t.responseText == '1') {
			$(this.par[1]).innerHTML = '';
			$(this.par[1]).innerHTML = 'Je bent nu toegevoegd aan onze lijst!';
		} else {
			$(this.par[1]).innerHTML = '';
			$(this.par[1]).innerHTML = 'Er ging iets fout..';
		}
	},
	
	buildPoll: function(t) {
		this.JSON = t.responseText.evalJSON();
		
		this.poll = _poll;
		this.par = _par;
		
		if(this.JSON != 1) {
			$(this.par[0]).innerHTML = '';
			
			if(this.poll == 'poll') {
				for(var i = 0; i < this.JSON.length; i++) {
					this.result = document.createElement('span');
					this.result.innerHTML = (i + 1) + ') ' + this.JSON[i].option + ' (' + this.JSON[i].result + ')';
					this.result.style.width = '100px';
					
					this.imgCont = document.createElement('div');
					this.imgCont.style.cssText = 'float:left; width:140px; height:14px;margin:2px 0;';
					
					this.img = document.createElement('div');
					this.img.style.cssText = 'height:100%; border: 1px solid #999; background-color:blue; width:' + this.JSON[i].width + '%;';
					
					this.imgCont.appendChild(this.img);
					
					this.clear = document.createElement('div');
					this.clear.className = 'clear';
					
					$(this.par[0]).appendChild(this.result);
					$(this.par[0]).appendChild(this.imgCont);
					$(this.par[0]).appendChild(this.clear);
				}
			} else if(this.poll == 'pollOptions') {
				for(var i = 0; i < this.JSON.length; i++) {
					this.input = document.createElement('input');
					this.input.type = 'radio';
					this.input.name = 'poll';
					this.input.value = i;
					
					this.result = document.createElement('span');
					this.result.innerHTML = this.JSON[i].option;
					this.result.style.width = '100px';
					
					this.clear = document.createElement('div');
					this.clear.className = 'clear';
					
					$(this.par[0]).appendChild(this.input);
					$(this.par[0]).appendChild(this.result);
					$(this.par[0]).appendChild(this.clear);
				}
			}
		} else {
			$(this.par[0]).innerHTML = 'Bedankt voor je stem!';

			this.elem.disabled = true;

			setTimeout(function() { this.getResults(this.pid)}.bind(this), 2000);
		}
		
		if(this.poll == 'poll') {
			this.elem.innerHTML = 'View options';
			this.elem.setAttribute('item', 'pollOptions.' + this.pid);
		} else if(this.poll == 'pollOptions') {
			this.elem.innerHTML = 'View result';
			this.elem.setAttribute('item', 'poll.' + this.pid);
		}
	},
	
	getResults: function(pid) {
		_poll = 'poll';

		this.options = {
			asynchronous: false,
			method: 'post',
			parameters: '?item=poll&pid=' + pid,
			onSuccess: this.buildPoll
		}
		
		new Ajax.Request('/backbase/php/includes/ajax/right.ajax.php', this.options);
	}
}