/*
 * Edit In Place
 * http://josephscott.org/code/js/eip/
 *
 * Version: 0.2.2
 * License: http://josephscott.org/code/js/eip/license.txt
 */

stopObservingEx = function(element, name) {
	if(!Event.observers) {
		return;
	}

	for(var i = 0; i < Event.observers.length; i++) {
		if(Event.observers[i] && Event.observers[i][0] == element){
			alert(Event.observers[i]);
			if(Event.observers[i][1] == name){
				Event.stopObserving.apply(this, Event.observers[i]);
				Event.observers[i] = null;
			}
		}         
	}
};



var EditInPlace = function() { };
EditInPlace.settings = function(set) {
	var settings = {
		id:				false,
		save_url:		false,
		css_class:		'eip_editable',
		savebutton:		'eip_savebutton',
		cancelbutton:	'eip_cancelbutton',
		saving:			'eip_saving',
		empty:			'eip_empty',
		type:			'text',
		is_empty:		false,
		empty_text:		'Click To Edit',
		orig_text:		false,
		options:		{ },
		option_name:	false
	};

	for(var i in set) { settings[i] = set[i]; }

	return($H(settings));
};

EditInPlace.formField = function(set) {
	var field = '';

	if(set['is_empty'] == true) {
		$(set['id']).innerHTML = '';
	}
	set['orig_text'] = $(set['id']).innerHTML;

	if(set['type'] == 'text') {
		var size = set['orig_text'].length + 10;
		if(size >= 100) { size = 100; }
		if(set['size']) { size = set['size']; }

		field = '<span id="' + set['id'] + '_editor"><input id="'
			+ set['id'] + '_edit" class="' + set['css_class'] + '" name="'
			+ set['id'] + '_edit" type="text" size="' + size
			+ '" value="' + set['orig_text'] + '" /><br />';
	}
	else if(set['type'] == 'textarea') {
		var cols = 50;
		if(set['cols']) { cols = set['cols']; }
		var rows = (set['orig_text'].length / cols) + 3;
		if(set['rows']) { rows = set['rows']; }

		field = '<span id="' + set['id'] + '_editor"><textarea id="'
			+ set['id'] + '_edit" class="' + set['css_class'] + '" name="'
			+ set['id'] + '_edit" rows="' + rows + '" cols="'
			+ cols + '">' + set['orig_text'] + '</textarea><br />';
	}
	else if(set['type'] == 'select') {
		field = '<span id="' + set['id'] + '_editor"><select id="'
			+ set['id'] + '_edit" class="' + set['css_class'] + '" name="'
			+ set['id'] + '_edit">';

		for(var i in set['options']) {
			field += '<option id="' + set['id'] + '_option_' + i 
				+ '" name="' + set['id'] + '_option_' + i
				+ '" value="' + i + '"';
			if(set['options'][i] == $(set['id']).innerHTML) {
				field += ' selected="selected"';
			}
			field += '>' + set['options'][i] + '</option>';
		}

		field += '</select>&nbsp;';
	}

	return(field);
};

EditInPlace.formButtons = function(set) {
	return(
		'<span><input id="' + set['id'] + '_save" class="'
		+ set['savebutton'] + '" type="button" value="Save" /> OR '
		+ '<input id="' + set['id'] + '_cancel" class="' 
		+ set['cancelbutton'] + '" type="button" value="Cancel" />'
		+ '</span></span>'
	);
};

EditInPlace.setEvents = function(set) {
	Event.observe(
		set['id'],
		'mouseover',
		function() { Element.addClassName(set['id'], set['css_class']); },
		false
	);
	Event.observe(
		set['id'],
		'mouseout',
		function() { Element.removeClassName(set['id'], set['css_class']); },
		false
	);
	Event.observe(
		set['id'],
		'click',
		function() {
			Element.hide(set['id']);

			var field = EditInPlace.formField(set);
			var button = EditInPlace.formButtons(set);

			new Insertion.After(set['id'], field + button);
			Field.focus(set['id'] + '_edit');

			Event.observe(
				set['id'] + '_save',
				'click',
				function() { EditInPlace.saveChanges(set); },
				false
			);
			Event.observe(
				set['id'] + '_cancel',
				'click',
				function() { EditInPlace.cancelChanges(set); },
				false
			);
		},
		false
	);
};

EditInPlace.saveComplete = function(t, set) {
	if(t.responseText == '') {
		set['is_empty'] = true;
		$(set['id']).innerHTML = '<span class="' + set['empty']
			+ '">' + set['empty_text'] + '</span>';
	}
	else {
		set['is_empty'] = false;
		$(set['id']).innerHTML = t.responseText;
		
	}

	Element.removeClassName(set['id'], set['css_class']);
};

EditInPlace.saveFailed = function(t, set) {
	$(set['id']).innerHTML = set['orig_text'];
	Element.removeClassName(set['id'], set['css_class']);
	alert('Failed to save changes.');
};

EditInPlace.saveChanges = function(set) {
	var new_text = escape($F(set['id'] + '_edit'));

	var saving = '<span id="show_saving" class="' 
		+ set['saving'] + '">Saving ...</span>';
	$(set['id']).innerHTML = saving;

	var params = 'id=' + set['id'] + '&content=' + new_text;
	if(set['type'] == 'select') {
		params += '&option_name=' 
			+ $(set['id'] + '_option_' + new_text).innerHTML;
	}

	Element.remove(set['id'] + '_editor');
	Element.show(set['id']);

	var ajax_req = new Ajax.Request(
		set['save_url'],
		{
			method: 'post',
			postBody: params,
			onSuccess: function(t) { EditInPlace.saveComplete(t, set); },
			onFailure: function(t) { EditInPlace.saveFailed(t, set); }
		}
	);
};

EditInPlace.cancelChanges = function(set) {
	Element.remove(set['id'] + '_editor');
	Element.removeClassName(set['id'], set['css_class']);

	if($(set['id']).innerHTML == '') {
		set['is_empty'] = true;
		$(set['id']).innerHTML = '<span class="' + set['empty']
			+ '">' + set['empty_text'] + '</span>';
	}

	Element.show(set['id']);
}

EditInPlace.makeEditable = function(args) {
	var set = EditInPlace.settings(args);

	if($(set['id']).innerHTML == '') {
		set['is_empty'] = true;
		$(set['id']).innerHTML = '<span class="' + set['empty']
			+ '">' + set['empty_text'] + '</span>';
	}

	EditInPlace.setEvents(set);
}