// Commentbox by Dominic Kroiher, Audiovisuelle Medienproduktionen
// www.dominic-kroiher.de


var TTip = {
	
	init:function() {
		
		var ttip = new Tips($$('.ttip'), {
			hideDelay:0,
			initialize:function(){
				this.fxShow = new Fx.Style(this.toolTip, 'opacity', {duration: 500, wait: true}).set(0);
				this.fxHide = new Fx.Style(this.toolTip, 'opacity', {duration: 150, wait: true}).set(0);
			},
			onShow: function(toolTip) {
				this.fxHide.stop();
				this.fxShow.start(0.95);
			},
			onHide: function(toolTip) {
				this.fxShow.stop();
				this.fxHide.start(0);				
			}
		});	
	}
}

var Commentbox = {

	init: function(){
		
		$each(document.images, function(el){
			if (el.alt && (el.alt.test('Kommentar schreiben') || el.alt.test('Kommentar editieren'))){
				el.onclick = this.click.pass(el, this);
			}
		}, this);		
		
		this.eventPosition = this.position.bind(this);
		
		this.overlay = new Element('div', {'id': 'cbOverlay'}).injectInside(document.body);
		this.overlay.onclick=this.close.bind(this);
		
		this.cbForm = new Element('form', {'id': 'cbForm', 'action': 'js/commentbox.php?mode=add', 'method': 'get'}).injectInside(document.body);
		this.cbContent = new Element('div', {'id': 'cbContent'}).injectInside(this.cbForm);
			this.cbResponse = new Element('div', {'id': 'cbResponse'}).injectInside(this.cbContent);
			this.cbContentHeader = new Element('div', {'id': 'cbContentHeader'}).injectInside(this.cbContent);
				this.cbContentTitle = new Element('div', {'id': 'cbContentTitle'}).injectInside(this.cbContentHeader);
				this.cbContentBtns = new Element('div', {'id': 'cbContentBtns'}).injectInside(this.cbContentHeader);
					this.cbContentBtn1 = new Element('a', {'id': 'cbContentBtn1'}).injectInside(this.cbContentBtns);
						this.cbContentBtn1Img = new Element('img', {'id': 'cbContentBtn1Img', 'src': 'img/btn_discard.png', 'title': 'Kommentar verwerfen!', 'class':'ttip' }).injectInside(this.cbContentBtn1);
					this.cbContentBtn2 = new Element('a', {'id': 'cbContentBtn2'}).injectInside(this.cbContentBtns);
						this.cbContentBtn2Img = new Element('img', {'id': 'cbContentBtn2Img', 'src': 'img/btn_nosubmit.png', 'title': '(Kommentar abschicken!)::Bitte geben Sie alle Daten vollstaendig ein.', 'class':'ttip' }).injectInside(this.cbContentBtn2);
				this.cbContentSubtitle = new Element('div', {'id': 'cbContentSubtitle'}).injectInside(this.cbContentHeader);
			this.cbContentBody = new Element('div', {'id': 'cbContentBody'}).injectInside(this.cbContent);
				this.cbContentEmail = new Element('div', {'id': 'cbContentEmail'}).injectInside(this.cbContentBody);
					this.cbContentEmailTitle = new Element('div', {'id': 'cbContentEmailTitle'}).injectInside(this.cbContentEmail);
						this.cbContentEmailTitleText = new Element('span', {'id': 'cbContentEmailTitleText'}).injectInside(this.cbContentEmail);
						this.cbContentEmailInput = new Element('input', {'id': 'cbContentEmailInput', 'name': 'email'}).injectInside(this.cbContentEmail);
						this.cbContentEmailNote = new Element('span', {'id': 'cbContentEmailNote'}).injectInside(this.cbContentEmail);						
				this.cbContentName = new Element('div', {'id': 'cbContentName'}).injectInside(this.cbContentBody);
					this.cbContentNameTitle = new Element('span', {'id': 'cbContentNameTitle'}).injectInside(this.cbContentName);
					this.cbContentNameInput = new Element('input', {'id': 'cbContentNameInput', 'name': 'name'}).injectInside(this.cbContentName);
				this.cbContentText = new Element('div', {'id': 'cbContentText'}).injectInside(this.cbContentBody);
					this.cbContentTextTitle = new Element('div', {'id': 'cbContentTextTitle'}).injectInside(this.cbContentText);
					this.cbContentTextInput = new Element('textarea', {'id': 'cbContentTextInput', 'name': 'text'}).injectInside(this.cbContentText);
					this.cbContentCmntCatInput = new Element('input', {'id': 'cbContentCmntCatInput', 'type': 'hidden', 'name': 'cmntcat'}).injectInside(this.cbContentText);
		
		this.cbContentBtn1.onclick=this.close.bind(this);
		$('cbForm').setStyle('display', 'none');
		
		$('cbContentSubtitle').appendText('Kommentare koennen noch 10 Minuten lang bearbeitet werden.');
		$('cbContentEmailTitleText').appendText('Email-Adresse:');
		$('cbContentEmailNote').appendText('(wird nicht angezeigt)');
		$('cbContentNameTitle').appendText('Name:');
		$('cbContentTextTitle').appendText('Kommentar-Text:');
		
		$('cbContentEmailInput').addEvent('keyup', this.checkMail.bindWithEvent($('cbContentEmailInput')));
			$('cbContentEmailInput').addEvent('change', this.checkMail.bindWithEvent($('cbContentEmailInput')));
			$('cbContentEmailInput').addEvent('blur', this.checkMail.bindWithEvent($('cbContentEmailInput')));
		$('cbContentNameInput').addEvent('keyup', this.checkName.bindWithEvent($('cbContentNameInput')));
			$('cbContentNameInput').addEvent('change', this.checkName.bindWithEvent($('cbContentNameInput')));
			$('cbContentNameInput').addEvent('blur', this.checkName.bindWithEvent($('cbContentNameInput')));
		$('cbContentTextInput').addEvent('keyup', this.checkText.bindWithEvent($('cbContentTextInput')));
			$('cbContentTextInput').addEvent('change', this.checkText.bindWithEvent($('cbContentTextInput')));
			$('cbContentTextInput').addEvent('blur', this.checkText.bindWithEvent($('cbContentTextInput')));
		
		$('cbForm').addEvent('submit', function(e) {
			
			new Event(e).stop();
		 	
			$('cbContentCmntCatInput').setProperty('value',Commentbox.cmntcat);
			if(Commentbox.cmntcat=='edit') $('cbForm').setProperty('action','js/commentbox.php?mode=editit&cid='+Commentbox.cid.substr(5));
			
			$('cbContentTitle').setStyle('visibility', 'hidden');
			if($chk($('cbContentBtn2'))) $('cbContentBtn2').setStyle('display', 'none');
				else $('cbContentBtn2Submit').setStyle('display', 'none');
			$('cbContentSubtitle').setStyle('visibility', 'hidden');
			$('cbContentBody').setStyle('visibility', 'hidden');
			
			var log = $('cbResponse').addClass('ajax-loading');
			
			this.send({
				update: log,
				onComplete: function() {
					log.removeClass('ajax-loading');
					
					Commentbox.updateComments();
					if($chk($('cbContentBtn2'))) $('cbContentBtn2').setStyle('display', 'none');
						else $('cbContentBtn2Submit').setStyle('display', 'none');
					
					$('cbContentTextInput').setProperty('value','');
					
					setTimeout( function(){$('cbContentTextInput').setStyle('border-color','#AA0000');}, 300);
				}
			});
		});
		
		this.fx = { overlay: this.overlay.effect('opacity', {duration: 500}).hide(),
					cbContent: this.cbContent.effect('opacity', {duration: 500}).hide(),
					inputMail: this.cbContentEmailInput.effect('border-color', {duration: 300, transition: Fx.Transitions.Quad.easeInOut}),
					inputName: this.cbContentNameInput.effect('border-color', {duration: 300, transition: Fx.Transitions.Quad.easeInOut}),
					inputText: this.cbContentTextInput.effect('border-color', {duration: 300, transition: Fx.Transitions.Quad.easeInOut}) };
					
		new Asset.images(['images/ttback.png', 'images/btn_submit.png']);
	},
	
	click: function(el){
		$('cbContentTextInput').setProperty('value','');
		this.checkAll();
		this.cmntcat= el.getProperty('name').replace(/\d+/g, '');
		
		if($chk(el.getProperty('id'))) this.cid=el.getProperty('id');
		if(el.getProperty('name')=='edit') this.isedit=true;
		else this.isedit=false;
		
		this.position();
		this.setup(true);
		this.fx.overlay.start(0.7);
		this.fx.cbContent.start(0.9);
	},

	close: function(){
		this.fx.overlay.start(0);
		this.fx.cbContent.start(0); 
		setTimeout(function(){$('cbForm').setStyle('display', 'none')},600);
	},
	
	position: function(){
		this.overlay.setStyles({'top': window.getScrollTop(), 'height': window.getHeight()});
		this.cbContent.setStyles({'top': window.getScrollTop()+window.getHeight()/2-150, 'left': window.getWidth()/2-250 });
	},

	setup: function(open){
		var fn = open ? 'addEvent' : 'removeEvent';
		window[fn]('scroll', this.eventPosition)[fn]('resize', this.eventPosition);
		
		$('cbForm').setStyle('display', 'block');
		
		$('cbContentTitle').setStyle('visibility', 'visible');
		if($chk($('cbContentBtn2'))) $('cbContentBtn2').setStyle('display', 'inline');
			else $('cbContentBtn2Submit').setStyle('display', 'inline');
		$('cbContentSubtitle').setStyle('visibility', 'visible');
		$('cbContentBody').setStyle('visibility', 'visible');
		$('cbResponse').empty();
		
		$('cbContentTitle').empty();
		if(!this.isedit) $('cbContentTitle').appendText('Kommentar schreiben');
		else 
		{
			$('cbContentTitle').appendText('Kommentar bearbeiten');
			
			$('cbResponse').addClass('ajax-loading');
			
			new Ajax( ('js/commentbox.php?mode=edit&cid='+this.cid.substr(5)) , {
				method: 'post',
				onComplete: function(){
						$('cbResponse').removeClass('ajax-loading'); 
						this.cbResponseObj=Json.evaluate(this.response.text.replace(/\r/g, '\\r').replace(/\n/g, '\\n'), true)
						
						if(this.cbResponseObj.error) 
						{
							$('cbContentTitle').setStyle('visibility', 'hidden');
							if($chk($('cbContentBtn2'))) $('cbContentBtn2').setStyle('display', 'none');
								else $('cbContentBtn2Submit').setStyle('display', 'none');
							$('cbContentSubtitle').setStyle('visibility', 'hidden');
							$('cbContentBody').setStyle('visibility', 'hidden');
							
							$('cbResponse').appendText(this.cbResponseObj.error);
						}
						
						else
						{
							$('cbContentEmailInput').setProperty('value',this.cbResponseObj.email);
							$('cbContentNameInput').setProperty('value',this.cbResponseObj.name);
							$('cbContentTextInput').setProperty('value',this.cbResponseObj.text);
							
							$('cbContentSubtitle').empty();
							$('cbContentSubtitle').appendText('Dieser Kommentar kann noch '+this.cbResponseObj.time+' Minuten lang bearbeitet werden.');
						}
						Commentbox.checkAll();
				}, 
				evalScripts: false
			}).request();
		}
	},
	
	loadEditData: function(){
		
		log.removeClass('ajax-loading');	
	},
	
	checkMail: function(event){
		var ctiColor=$('cbContentEmailInput').getStyle('border-top-color');
		
		if( $('cbContentEmailInput').value.contains('@') && $('cbContentEmailInput').value.contains('.') ) Commentbox.fx.inputMail.start(ctiColor,'#00AA00');
		else Commentbox.fx.inputMail.start(ctiColor,'#AA0000');
		
		Commentbox.checkSubmit();
	},
	
	checkName: function(event){
		var ctiColor=$('cbContentNameInput').getStyle('border-top-color');			
		
		if($chk($('cbContentNameInput').value)) Commentbox.fx.inputName.start(ctiColor,'#00AA00');
		else Commentbox.fx.inputName.start(ctiColor,'#AA0000');
		
		Commentbox.checkSubmit();
	},
	
	checkText: function(event){
		var ctiColor=$('cbContentTextInput').getStyle('border-top-color');			
		
		if($chk($('cbContentTextInput').value)) Commentbox.fx.inputText.start(ctiColor,'#00AA00');
		else Commentbox.fx.inputText.start(ctiColor,'#AA0000');
		
		Commentbox.checkSubmit();
	},
	
	checkAll: function(){
		if( $('cbContentEmailInput').value.contains('@') && $('cbContentEmailInput').value.contains('.') ) $('cbContentEmailInput').setStyle('border-color','#00AA00');
		else $('cbContentEmailInput').setStyle('border-color','#AA0000');
		
		if($chk($('cbContentNameInput').value)) $('cbContentNameInput').setStyle('border-color','#00AA00');
		else $('cbContentNameInput').setStyle('border-color','#AA0000');
		
		if($chk($('cbContentTextInput').value)) $('cbContentTextInput').setStyle('border-color','#00AA00');
		else $('cbContentTextInput').setStyle('border-color','#AA0000');
		
		if($chk($('cbContentBtn2Submit')) || $chk($('cbContentBtn2'))) Commentbox.checkSubmit();
	},
	
	checkSubmit: function(){
		if( $('cbContentEmailInput').value.contains('@') && $('cbContentEmailInput').value.contains('.') && $chk($('cbContentNameInput').value) && $chk($('cbContentTextInput').value)) {
			if($chk($('cbContentBtn2'))) $('cbContentBtn2').remove();
			if(!$chk($('cbContentBtn2Submit')))
			{
				this.cbContentBtn2Submit = new Element('input', {'id': 'cbContentBtn2Submit', 'type': 'image', 'src': 'img/btn_submit.png', 'alt': 'abschicken', 'class':'ttip', 'title':'Kommentar abschicken!'}).injectInside(this.cbContentBtns);
				this.submitTip = new Tips($('cbContentBtn2Submit'));
			}
		}
		else {
			if($chk($('cbContentBtn2Submit'))) $('cbContentBtn2Submit').remove();
			if(!$chk($('cbContentBtn2')))
			{
				this.cbContentBtn2 = new Element('a', {'id': 'cbContentBtn2'}).injectInside(this.cbContentBtns);
				this.cbContentBtn2Img = new Element('img', {'id': 'cbContentBtn2Img', 'src': 'img/btn_nosubmit.png', 'title': '(Kommentar abschicken!)::Bitte geben Sie alle Daten vollstaendig ein.', 'class':'ttip' }).injectInside(this.cbContentBtn2);
				this.noSubmitTip = new Tips($('cbContentBtn2Img'));
			}
		}
	},
	
	updateComments: function(){
		
		new Ajax( ('js/commentbox.php?mode=updateComments') , {
			method: 'post',
			onComplete: function(){
					//$('comments').empty();
					$('comments').setHTML(this.response.text);
					
					$each(document.images, function(el){
						if (el.alt && (el.alt.test('Kommentar schreiben') || el.alt.test('Kommentar editieren'))){
							el.onclick = this.click.pass(el, Commentbox);
						}
					}, Commentbox);
			}, 
			evalScripts: false
		}).request();	
	}					
}

window.addEvent('domready', Commentbox.init.bind(Commentbox));
window.addEvent('domready', TTip.init.bind(TTip));