/*
 * Script: debunote.js - main code for the form
 * Author: Lim Chee Aun
 */

Fx.Style.implement({
	fromColor: function(color) {
		if(window.ie6) return; // stupid IE6 flickering bug
		return this.start(color, this.element.getStyle(this.property));
	}
});

window.addEvent('domready', function(){
	init_prev_next();
	if(initialize_state())
		initialize_events();
});

function init_prev_next(){
	if(!window.ie) { // temporary solution, opacity seems to be problematic on IEs
		var initial_opac = 0.1;
		var pointer_pos;
		var supposed_height = $('debunote-ajax').getSize().size.y;
		var IMG_HEIGHT = 25;
		var bottom_pos_limit = supposed_height - IMG_HEIGHT;

		if($('prev-page-indicator')) {
			var prevpage_effect = new Fx.Style('prev-page-indicator', 'opacity', {duration: 300}).set(initial_opac);

			$('prev-page-indicator').addEvent('mousemove', function(e){
				e = new Event(e);
				pointer_pos = e.page.y - this.getPosition().y - IMG_HEIGHT/2;
				pointer_pos = pointer_pos.limit(0,bottom_pos_limit);

				$('prev-page-indicator').setStyle('background-position','50% ' + pointer_pos + 'px');
				prevpage_effect.start(1);
			}).addEvent('mouseleave', function(){
				prevpage_effect.set(initial_opac);
			});

			$('prev-page-indicator').setStyle('height',supposed_height);
		}

		if($('next-page-indicator')) {
			var nextpage_effect = new Fx.Style('next-page-indicator', 'opacity', {duration: 300}).set(initial_opac);

			$('next-page-indicator').addEvent('mousemove', function(e){
				e = new Event(e);
				pointer_pos = e.page.y - this.getPosition().y - IMG_HEIGHT/2;
				pointer_pos = pointer_pos.limit(0,bottom_pos_limit);

				$('next-page-indicator').setStyle('background-position','50% ' + pointer_pos + 'px');
				nextpage_effect.start(1);
			}).addEvent('mouseleave', function(){
				nextpage_effect.set(initial_opac);
			});

			$('next-page-indicator').setStyle('height',supposed_height);
		}
	}
}

function initialize_state(){
	if($('name-input')){
		$('name-input').setAttribute('autocomplete','off');
		$('cause-input').setAttribute('autocomplete','off');

		$('name-input').value = '';
		$('cause-input').value = '';
		$('details-textarea').value = '';
		$('name-input').focus();

		$('cause-label').setStyle('cursor','pointer');
		$('cause-input').setStyle('width','20px');
		$('details-label').setStyle('cursor','pointer');
		$('details-textarea').setStyles('width: 20px; height: 25px; overflow: hidden');
		$('time').setStyle('color','#444');

//		$('entry-example').setOpacity(0);
//		$('entry-example').setStyles('height: 0; overflow: hidden');
		return true;
	}
	return false;
}

var namelabel_effect, causelabel_effect, causeinput_effect, detailslabel_effect,
	detailstextarea_effect, example_effect, time_effect;

// intervals set-clear states
var causeinterval_cs = 0;
var detailsinterval_cs = 0;

function initialize_events(){
	namelabel_effect = new Fx.Style('name-label', 'color', {duration: 1000});
	causelabel_effect = new Fx.Style('cause-label', 'color', {duration: 1000});
	causeinput_effect = $('cause-input').effects();
	detailslabel_effect = new Fx.Style('details-label', 'color', {duration: 1000});
	detailstextarea_effect = $('details-textarea').effects();
//	example_effect = $('entry-example').effects();
	time_effect = new Fx.Style('time', 'color', {duration: 500});


	$('name-input').addEvent('focus', function(){
		if(!$('name-input').readOnly)
			namelabel_effect.fromColor('f00');
		else if(!$('cause-input').readOnly) {
			if($('cause-input').getStyle('width').toInt() == 20)
				causelabel_effect.fromColor('222');
			else {
				$('name-input').blur();
				$('cause-input').focus();
				causelabel_effect.fromColor('f00');
			}
		}
		else if(!$('details-textarea').readOnly) {
			if($('details-textarea').getStyle('width').toInt() == 20)
				detailslabel_effect.fromColor('222');
			else {
				$('name-input').blur();
				$('details-textarea').focus();
				detailslabel_effect.fromColor('f00');
			}
		}
	});

	$('cause-label').addEvent('mouseover', function(){
		if($('cause-input').getStyle('width').toInt() == 20 && !$('cause-input').readOnly ) {
			causelabel_effect.fromColor('222');
		}
	});

	$('cause-input').addEvent('focus', function(){
		if(!$('name-input').value.length) {
			$('cause-input').blur();
			validateForm();
		}
		else if(!$('cause-input').readOnly) {
			if($('cause-input').getStyle('width').toInt() == 20 ) {
				$('cause-label').setStyle('cursor','default');
				causeinput_effect.start({ 'width': 280 });
			}

			causelabel_effect.fromColor('f00');
			$('name-input').readOnly = true;
			$('name-input').className = 'readonly';

			if( !causeinterval_cs ){
				causeinterval = startcausetime.periodical(1000);
				causeinterval_cs = 1;
			}

			$('error-message').empty();
		}
		else if(!$('details-textarea').readOnly) {
			if($('details-textarea').getStyle('width').toInt() == 20)
				detailslabel_effect.fromColor('222');
			else  {
				$('cause-input').blur();
				$('details-textarea').focus();
				detailslabel_effect.fromColor('f00');
			}

			$('error-message').empty();
		}
	});

	$('details-label').addEvent('mouseover', function(){
		if($('details-textarea').getStyle('width').toInt() == 20 && !$('details-textarea').readOnly)
			detailslabel_effect.fromColor('222');
	});

	$('details-textarea').addEvent('focus', function(){
		if(!$('name-input').value.length) {
			$('details-textarea').blur();
			validateForm();
		}
		else if($('cause-input').value.length < min_cause_len) {
			$('details-textarea').blur();
			validateForm();

			if(!$('cause-input').value.length && !$('cause-input').readOnly ) {
				$('cause-input').focus();
				$('error-message').setHTML('Cause is empty. Cause must be specified before the details.');
			}
		}
		else if(!$('details-textarea').readOnly ) {
			if($('details-textarea').getStyle('width').toInt() == 20 ) {
				$('details-label').setStyle('cursor','default');
				$('details-textarea').setStyle('overflow','auto');

				detailstextarea_effect.start({
					'width': 280,
					'height': 150
				});
			}

			detailslabel_effect.fromColor('f00');
			$('cause-input').readOnly = true;
			$('cause-input').className = 'readonly';

			if( causeinterval_cs ){
				$('time').empty();
				$('time').setStyle('color','#444');
				causeinterval = $clear(causeinterval);
				causeinterval_cs = 0;
			}

			if( !detailsinterval_cs ){
				detailsinterval = startdetailstime.periodical(1000);
				detailsinterval_cs = 1;
			}

			$('error-message').empty();
		}
	});

	$('debunote-form').onsubmit = function() {
		if(validateForm())
			return confirm('Are you sure?');
		return false;
	};

	$('reset-button').addEvent('click', function(e){
		e.preventDefault();

		$('time').empty();
		$('time').setStyle('color','444');

		if(causeinterval_cs) {
			causeinterval = $clear(causeinterval);
			causeinterval_cs = 0;
		}

		if(detailsinterval_cs) {
			detailsinterval = $clear(detailsinterval);
			detailsinterval_cs = 0;
		}

		causetime = 40;
		detailstime = 400;

		if($('cause-input').getStyle('width').toInt() == 280 )
			causeinput_effect.start({ 'width': 20 });

		if($('details-textarea').getStyle('width').toInt() == 280 ) {
			$('details-textarea').setStyle('overflow','hidden');

			detailstextarea_effect.start({
				'width': 20,
				'height': 25
			});
		}

		$('cause-label').setStyle('cursor','pointer');
		$('details-label').setStyle('cursor','pointer');
		$('name-input').readOnly = false;
		$('name-input').className = '';
		$('cause-input').readOnly = false;
		$('cause-input').className = '';
		$('details-textarea').readOnly = false;
		$('details-textarea').className = '';
		$('name-input').value = '';
		$('cause-input').value = '';
		$('details-textarea').value = '';
		$('name-input').focus();
		$('error-message').empty();
	});
/*
	$('entry-example-link').addEvent('click', function(){
		if($('entry-example').getStyle('opacity') == 0 ) {
			example_effect.start({
				'opacity': 1,
				'height': 325
			});
		}
		else {
			example_effect.start({
				'opacity': 0,
				'height': 0
			});
		}
	});
	*/
}

function validateForm() {
	name_len = $('name-input').value.length;
	cause_len = $('cause-input').value.length;
	details_len = $('details-textarea').value.length;

	if(!name_len) {
		$('name-input').focus();
		$('error-message').innerHTML = 'Name field is empty.';
		br_tag_flag = 1;

		return false;
	}
	else if(name_len > max_name_len) {
		$('name-input').focus();
		$('error-message').innerHTML = 'Name is too long, ' + name_len + ' characters (Max: ' + max_name_len + ').';
		br_tag_flag = 1;

		return false;
	}
	else {
		$('error-message').empty();
		br_tag_flag = 0;
	}

	br_tag = (br_tag_flag) ? '<br />' : '';

	if(cause_len && cause_len < min_cause_len) {
		$('cause-input').focus();
		$('cause-input').select();
		$('error-message').innerHTML += br_tag + 'Cause is too short (Min: ' + min_cause_len + ').';

		return false;
	}
	else {
		$('error-message').empty();
		br_tag_flag = 0;
	}

	if( details_len ) {
		if(!cause_len) {
			$('cause-input').focus();
			$('error-message').innerHTML += br_tag + 'Cause is empty. Cause must be specified before the details.';

			return false;
		}
		else if (details_len > max_details_len) {
			$('details-textarea').focus();
			$('details-textarea').select();
			$('error-message').innerHTML += br_tag + 'Details are too long, ' + details_len + ' characters (Max: ' + max_details_len + ').';

			return false;
		}
		else if(details_len < min_details_len) {
			$('details-textarea').focus();
			$('error-message').innerHTML += br_tag + 'Details are too short (Min: ' + min_details_len + ')';

			return false;
		}
	}

	return true;
}

var causetime = 40;
function startcausetime() {
	if( !causetime ) {
		$('time').empty();
		$('time').setStyle('color','#444');

		causeinterval = $clear(causeinterval);
		causeinterval_cs = 0;

		if(!validateForm()){
			if(causeinterval_cs == 0) {
				causeinterval = startcausetime.periodical(1000);
				causeinterval_cs = 1;
				causetime = 40;
			}

			$('error-message').innerHTML += ' Timing restarted.';
		}
		else {
			$('cause-input').readOnly = true;
			$('cause-input').className = 'readonly';

			if(!$('cause-input').value.length) {
				$('details-textarea').readOnly = true;
				$('details-textarea').className = 'readonly';
				$('details-label').setStyle('cursor','default');
				causeinput_effect.start({ 'width': 20 });
				$('add-button').focus();
			}
			else {
				detailsinterval = startdetailstime.periodical(1000);
				detailsinterval_cs = 1;
				detailslabel_effect.fromColor('f00');
			}
		}
	}
	else {
		var s = (causetime>1) ? 's' : '';

		if(causetime == 40) { time_effect.start('444', '666'); }
		else if(causetime == 1) { time_effect.start('666', '444'); }

		$('time').setHTML(causetime + ' second' + s);
		causetime--;
	}
}

var detailstime = 400; // 6 mins 40 secs ( 6*60+40 = 400 )
function startdetailstime() {
	if( !detailstime ) {
		$('time').empty();
		$('time').setStyle('color','#444');

		detailsinterval = $clear(detailsinterval);
		detailsinterval_cs = 0;

		if(!validateForm()){
			detailsinterval = startdetailstime.periodical(1000);
			detailsinterval_cs = 1;
			detailstime = 400;
			$('error-message').innerHTML += ' Timing restarted.';
		}
		else {
			$('details-textarea').readOnly = true;
			$('details-textarea').className = 'readonly';
			$('details-textarea').setStyle('overflow','hidden');

			detailstextarea_effect.start({
				'width': 20,
				'height': 25
			});

			$('add-button').focus();
		}
	}
	else {
		var detailsminute = Math.floor(detailstime / 60);
		var detailssecond = detailstime % 60;
		var ms = (detailsminute>1) ? 's' : '';
		var ss = (detailssecond>1) ? 's' : '';
		var minutetext = ( detailsminute == 0 ) ? '' : detailsminute + ' minute' + ms + ' ';
		var secondtext = ( detailssecond == 0 ) ? '' : detailssecond + ' second' + ss;

		if(detailstime == 400) time_effect.start('444', '666');
		else if(detailstime == 1) time_effect.start('666', '444');

		$('time').setHTML(minutetext + secondtext);
		detailstime--;
	}
}