function makeEditable(id){
	Event.observe(id, 'dblclick', 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);
	
	/*
	var textarea = '<span id="'+obj.id+'_editor"><textarea id="'+obj.id+'_edit" name="'+obj.id+'" rows="0" cols="10">'+obj.innerHTML+'</textarea></span>';
	//var button	 = '<div><input id="'+obj.id+'_save" type="button" value="SAVE" /> OR <input id="'+obj.id+'_cancel" type="button" value="CANCEL" /></div>';//</div>';
	
	new Insertion.After(obj, textarea);//+button);	
	*/
    var textfield = '<span id="'+obj.id+'_editor"><input type="text" id="'+obj.id+'_edit" maxlength="10" size="10" value="'+obj.innerHTML+'" /></span>';	
	
    new Insertion.After(obj, textfield);
    
    Event.observe(obj.id+'_edit', 'keyup', function(e){saveName_enter(obj,e)}, false);
    Event.observe(obj.id+'_edit', 'blur', function(e){saveName_blur(obj,e)}, false);
    //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 saveName_enter(obj,e){
    
    if(e)
    {
        e = e;
    } 
    else 
    {
        e = window.event;
    }

    if(e.which)
    {
        var keycode = e.which;
    } 
    else 
    {
        var keycode = e.keyCode;
    }
    
    if(keycode == 13) 
    {
        var new_content	=  $F(obj.id+'_edit');
        //alert(new_content);
        obj.innerHTML = new_content;
        
        //Element.show(obj);
        //alert(obj.value);
        
        cleanUp(obj, true);
    }   

}

function saveName_blur(obj,e){
        
    var new_content	=  $F(obj.id+'_edit');
    //alert(new_content);
    obj.innerHTML = new_content;
    
    //Element.show(obj);
    //alert(obj.value);
    
    cleanUp(obj, true);
       

}

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

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

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

  	/*
    var url = 'edit.php';
	var pars = 'id='+obj.id+'&content='+new_content;
	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	= t.responseText;
	showAsEditable(obj, true);
}

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

// JavaScript Document