ImageCaptcha = Class.create({
  initialize: function() {

	this.image = this.down('.captiaImage');


	this.imageX = this.image.cumulativeOffset()[0];
	this.imageWidth = this.image.getHeight();
	this.fullWidth = this.image.getWidth();
//alert(this.fullWidth);

	this.captchaField = this.down('.selection');

	this.hover = this.down('.hover');
	this.hover.style.width = this.imageWidth + 'px';
	this.hover.style.height = this.imageWidth + 'px';
	this.hover.absolutize();
	this.hover.observe('click', this.onClick.bind(this));


	this.selector = this.down('.selector');
	this.selector.style.width = this.imageWidth + 'px';
	this.selector.style.height = this.imageWidth + 'px';
	this.selector.absolutize();


	this.image.observe('mousemove', this.onMouseMove.bind(this));
	this.image.observe('click', this.onClick.bind(this));
	this.image.observe('mouseout', this.onMouseOut.bind(this));
	this.hover.observe('mouseout', this.onMouseOut.bind(this));
	this.hover.observe('click', this.onClick.bind(this));

  },
  onMouseMove: function(event){
 	this.image = this.down('.captiaImage');
	this.imageX = this.image.cumulativeOffset()[0];
	this.imageWidth = this.image.getHeight();
	this.fullWidth = this.image.getWidth();

	  var mx =
		  event.pointerX() - this.imageX;
	  var idx = Math.floor(mx / this.imageWidth);

	  if(((idx+1) * this.imageWidth) > this.fullWidth)
		  idx--;

	  this.hover.show();
	  this.hover.clonePosition(this.image);
	  this.hover.style.width = this.imageWidth + 'px';
	  var sx = this.hover.cumulativeOffset()[0] + (idx * this.imageWidth);
	  this.hover.style.left = sx + 'px';

  }
  ,
  onClick: function(event){
	  if(((idx+1) * this.imageWidth) > this.fullWidth)
		  idx--;

	  var mx = event.pointerX() - this.imageX;
	  var idx = Math.floor(mx / this.imageWidth);

	  this.selector.show();
	  this.selector.clonePosition(this.image);
	  this.selector.style.width = this.imageWidth + 'px';
	  var sx = this.selector.cumulativeOffset()[0] + (idx * this.imageWidth);
	  this.selector.style.left = sx + 'px';
	  this.captchaField.value = idx;
  },
  onMouseOut: function(event){
	 if(event.relatedTarget != this.hover && event.relatedTarget != this.image && event.relatedTarget != this.selector)
		 this.hover.hide();

  }
});