/**
 * Class: cpscaptcha
 *		Insert captcha popup before form submission
 *
 * Usage:
 *		Include cpscaptcha.css and cpscaptcha.js in this order
 *		Add the class formSubmit to the form submit element
 *		For security reasons remove form's action attribute
 *
 * Example:
 *		Instantiate an object of the cpscaptcha class on domready:
 *		window.addEvent( 'domready', function() {
 *			new captcha( 'form_id', 'form_action' );
 *		});
 *
 *		Insert on the file that handle form submission:
 *		$captcha_code = $_POST['captcha_code'];
 *		include_once( '_tools/cpscaptcha/securimage/securimage.php' );
 *		$securimage = new Securimage();
 *		if( !$securimage->check( $captcha_code ) ) {
 *			// incorrect code
 *		} else {
 *			// correct code
 *		}
 *
 * @name cpscaptcha.js
 * @author Bruno Ferreira
 * @version 0.3.4
 * @date 04-05-2010
*/
var cpscaptcha = new Class({
	// implements
	Implements: [Options],

	options: {
		addEvent: true,
		duration: 300,
		path: '/_tools/cpscaptcha',
		offsetX: 0,
		offsetY: 5,
		width: 206,
		height: 114
	},

	// initialize class
	initialize: function( formid, action, options ) {
		if( !$(formid) ) {
			alert( 'Form not found' );
			return false;
		}
		this.setOptions( options );
		this.form = $(formid);
		this.form.action = action;
		var formSubmit = $$('#'+this.form.get( 'id' )+' .formSubmit')[0];
		if( this.options.addEvent ) {
			formSubmit.addEvent( 'click', function( e ) {
				this.showCaptcha( formSubmit );
			}.bind( this ));
		} else {
			var showCaptchaVar = function() {
				this.showCaptcha( formSubmit );
				clearInterval( interval );
			}.bind( this );
			var interval = window.setInterval( showCaptchaVar, this.options.duration );
		}
	},

	showCaptcha: function( formSubmit ) {
		// obtain left and top coordinates
		var coordsBody = $(document.body).getCoordinates();
		var coordsSubmit = formSubmit.getCoordinates( document.body );
		var bgclass = '';
		if( coordsSubmit.top >= this.options.height + this.options.offsetY ) {
			// top
			bgclass += 't';
			var top = coordsSubmit.top - this.options.height - this.options.offsetY;
		} else {
			// bottom
			bgclass += 'b';
			var top = coordsSubmit.bottom + this.options.offsetY;
		}
		if( coordsBody.right - coordsSubmit.left >= this.options.width + this.options.offsetX ) {
			// after
			bgclass += 'r';
			var left = coordsSubmit.left + this.options.offsetX;
		} else {
			// before
			bgclass += 'l';
			var left = coordsSubmit.right - this.options.width - this.options.offsetX;
		}
		var options = {
			'left': left,
			'top': top
		}

		// create captcha's element
		var wrapper = new Element( 'div', {
			'class': 'cpscaptcha-wrapper '+bgclass,
			'id': this.form.get( 'id' )+'_cpscaptcha',
			'styles': options
		});
		new Element( 'label', {
			'for': this.form.get( 'id' )+'-captcha_code',
			'html': 'confirme o seguinte código'
		}).inject( wrapper );
		new Element( 'img', {
			'class': 'captchaimage',
			'alt': 'CAPTCHA Image',
			'src': this.options.path+'/securimage/securimage_show.php'
		}).inject( wrapper );
		new Element( 'a', {
			'class': 'refresh',
			'href': '#',
			'id': this.form.get( 'id' )+'_refresh',
			'title': 'carregar nova imagem'
		}).inject( wrapper );
		new Element( 'input', {
			'id': this.form.get( 'id' )+'-captcha_code',
			'name': 'captcha_code',
			'maxlength': '4',
			'type': 'text',
			'src': this.options.path+'/securimage/securimage_show.php'
		}).inject( wrapper );
		new Element( 'a', {
			'class': 'submit',
			'href': '#',
			'html': 'confirmar',
			'id': this.form.get( 'id' )+'_confirm',
			'title': ''
		}).inject( wrapper );
		wrapper.inject( document.body );

		// define actions
		$(this.form.get( 'id' )+'_refresh').addEvent( 'click', function( e ) {
			new Event.stop( e );
			$$('#'+this.form.get( 'id' )+'_cpscaptcha .captchaimage').set( 'src', this.options.path+'/securimage/securimage_show.php?'+Math.random() );
		}.bindWithEvent( this ));
		$(this.form.get( 'id' )+'_confirm').addEvent( 'click', function( e ) {
			if( $(this.form.get( 'id' )+'-captcha_code').value.length > 0 ) {
				var input = new Element( 'input', {
					'name': 'captcha_code',
					'value': $$('#'+this.form.get( 'id' )+'_cpscaptcha input')[0].get( 'value' ),
					'type': 'hidden'
				}).inject( $(this.form.get( 'id' )), 'bottom' );
				$(this.form.get( 'id' )).submit();
			}
			return false;
		}.bindWithEvent( this ));
		$$('#'+this.form.get( 'id' )+'_cpscaptcha input')[0].focus();
		$$('#'+this.form.get( 'id' )+'_cpscaptcha input')[0].addEvent( 'keydown', function( e ) {
			if( e.key == 'enter' ) $(this.form.get( 'id' )+'_confirm').fireEvent( 'click' );
		}.bindWithEvent( this ));

		// prevent the creation of another captcha's element
		formSubmit.removeEvents( 'click' );
		formSubmit.addEvent( 'click', function( e ) {
			new Event.stop( e );
		});

		// cancel form submission
		return false;
	}
});
