/*
	MooIPE - MooTools InPlace Editor
	By: SilverTab(Jean-Nicolas Jolivet), www.silverscripting.com
	
	Licensed under MIT License, Copyright (c) 2008 Jean-Nicolas Jolivet
	For More info: http://www.opensource.org/licenses/mit-license.php
*/
var mooipe = new Class({
	
	Implements: Options,

	options: {
		hlColor: "#BEFFEF",
		restoreColor: "#FFFFFF",
		rows: 1,
		cols: 20,
		okText: 'save',
		cancelText: 'cancel',
		savingText: 'saving...'
	},

	initialize: function(el,trig, trigb, url, options, ajaxOptions) {
		//alert(trigb);
		this.el = ($type(el) == "string" ? $(el) : el);
		this.trig = ($type(trig) == "string" ? $(trig) : trig);
		this.trigb = ($type(trigb) == "string" ? $(trigb) : trigb);
		this.elid = el;
		this.trigId = trig;
		this.dataType = el;
		this.url = url;
		this.setOptions(options)
		
		this.ajaxOptions = {
			url: this.url,
			method: 'get',
			update: this.el,
			onFailure: this.ipeFailure.bind(this),
			data: ''
		};
		
		$extend(this.ajaxOptions, ajaxOptions || {});
		
		this.displayStyle = this.el.getStyle('display');
		
		
		this.hlEffect = new Fx.Tween(this.el, 'background-color', {duration: 800});
		
		//Add the mouseover event to my element
		this.el.addEvents({
			'mouseenter': function() {
				this.el.setStyle('background-color', this.options.hlColor);
			}.bind(this),
			
			'mouseleave': function() {
				this.hlEffect.start(this.options.hlColor, this.options.restoreColor);
			}.bind(this),
			
			'click': this.enterEditMode.bind(this)
		});
		
		this.trig.addEvents({
			'mouseenter': function() {
				this.el.setStyle('background-color', this.options.hlColor);
			}.bind(this),
			
			'mouseleave': function() {
				this.hlEffect.start(this.options.hlColor, this.options.restoreColor);
			}.bind(this),
			
			'click': this.enterEditMode.bind(this)
		});		
			
		this.trigb.addEvents({
			'mouseenter': function() {
				this.el.setStyle('background-color', this.options.hlColor);
			}.bind(this),
			
			'mouseleave': function() {
				this.hlEffect.start(this.options.hlColor, this.options.restoreColor);
			}.bind(this),
			
			'click': this.enterEditMode.bind(this)
		});
		
		this.editForm = new Element('form', {
			'name': this.elid + '-form',
			'events': {
				'submit': function(e) {
					this.exitEditMode(true);
					e.preventDefault();
				}.bind(this)
			}
		});
		
		if(this.options.rows != 1) {
			this.editField = new Element('textarea', {
				'name': 'fieldValue',
				'value': this.el.get('html'),
				'cols': this.options.cols,
				'rows': this.options.rows
			});
		}
		else {
			this.editField = new Element('input', {
				'type': 'text',
				'name': 'fieldValue',
				'value': this.el.get('html'),
				'size': this.options.cols
			});
		}
		
		this.okButton = new Element('input', {
			'type': 'button', 
			'value': this.options.okText,
			'events' : {
				'click': this.exitEditMode.bind(this, true)
			}
		});
		this.cancelButton = new Element('input', {
			'id': this.elid + '-cancel',
			'type': 'button',
			'value': this.options.cancelText,
			'events': {
				'click': this.exitEditMode.bind(this)
			}
		});
		this.editField.inject(this.editForm, 'bottom');
		if(this.options.rows > 1) {
			lb = new Element('br');
			lb.inject(this.editForm, 'bottom');
		}
		this.okButton.inject(this.editForm, 'bottom');
		this.cancelButton.inject(this.editForm, 'bottom');
	},
	
	enterEditMode: function() {
		this.el.setStyle('display', 'none');
		this.editField.value = this.el.get('html');
		this.editForm.inject(this.el, 'after');
		this.editField.focus();
		this.editField.select();

	},
	
	exitEditMode: function(save) {

		var save = save == null || save == "" || $type(save) != 'boolean' ? false : true;
		if(save) {
			
			this.ajaxOptions.data = "str=" + this.editForm.fieldValue.value;
			ipeRequest = new Request.HTML(this.ajaxOptions).send();
			
			
			this.editForm.remove();
			this.el.setStyle('display', this.displayStyle);
			this.el.set('html', this.options.savingText);
		}
		else {
			this.editForm.remove();
			this.el.setStyle('display', this.displayStyle);
		}
	},
	
	ipeFailure: function(resp) {
		this.el.set('html', "Error! Code: " + resp.status + " Text: " + resp.statusText);
	}
	
});