Event.observe(window, 'load', init, false);

function init(){
	makeEditable('photo_title');
	makeEditable('photo_text');
	makeEditable('photo_tags');
}


function makeEditable(id){
	Event.observe(id, 'click', function(){edit($(id))}, false);
	Event.observe(id, 'mouseover', function(){showAsEditable($(id))}, false);
	Event.observe(id, 'mouseout', function(){showAsEditable($(id), true)}, false);
}

function edit(obj){
	Element.hide(obj);

	if (obj.id == 'photo_text') {	
		var textarea = '<div id="'+obj.id+'_editor"><textarea id="'+obj.id+'_edit" name="'+obj.id+'">'+br2nl(obj.innerHTML)+'</textarea>';
		var button	 = '<div><input id="'+obj.id+'_save" type="button" value="SAVE CHANGES" /><input id="'+obj.id+'_cancel" type="button" value="CANCEL" /></div></div>';
	
		new Insertion.After(obj, textarea+button);	
	} else {
		var field = '<div id="'+obj.id+'_editor"><input type="text" id="'+obj.id+'_edit" name="'+br2nl(obj.id)+'" class="input_text" value="'+obj.innerHTML+'">';
                var button       = '<div><input id="'+obj.id+'_save" type="button" value="SAVE CHANGES" /><input id="'+obj.id+'_cancel" type="button" value="CANCEL" /></div></div>';

                new Insertion.After(obj, field+button);
	}

	Event.observe(obj.id+'_save', 'click', function(){saveChanges(obj)}, false);
	Event.observe(obj.id+'_cancel', 'click', function(){cleanUp(obj)}, false);
	
}

function showAsEditable(obj, clear){
	if (!clear){
		Element.addClassName(obj, 'editable');
	}else{
		Element.removeClassName(obj, 'editable');
	}

}

function saveChanges(obj){
	
	var new_content	=  escape($F(obj.id+'_edit'));

	obj.innerHTML	= "Saving...";
	cleanUp(obj, true);

	var success	= function(t){editComplete(t, obj);}
	var failure	= function(t){editFailed(t, obj);}

  var url = document.location.href;

	var pars = 'id='+obj.id+'&content='+new_content+'&is_ajax=1';
	var myAjax = new Ajax.Request(url, {method:'post', postBody:pars, onSuccess:success, onFailure:failure});

}

function cleanUp(obj, keepEditable){
	Element.remove(obj.id+'_editor');
	Element.show(obj);
	if (!keepEditable) showAsEditable(obj, true);
}

function editComplete(t, obj){
	
	obj.innerHTML	= nl2br(t.responseText);
	showAsEditable(obj, true);
}

function editFailed(t, obj){
	obj.innerHTML	= 'Sorry, the update failed.';
	cleanUp(obj);
}

function nl2br( str ) {
	return str.replace(/([^>])\n/g, '$1<br />\n');
}

function br2nl ( str) {
	return str.replace (/\<br ?\/?\>/g, "");
}
