var ADMIN_META_EDIT = Class.create({
	initialize:function(){
			var anchor = $(arguments[0]);
			this._admin_info = readAdminInfo( ggetCookie( 'secure_admin_level' ) );
			this._sess = ggetCookie('gmpsess');

			
			if ( this._admin_info.admin_level == 1 ) {
				this._ADMIN_USER = true;	
			} else {
				return;  //suicide?
			}
			
			if ( ! anchor.readAttribute('alt') || ! anchor.up('.details').readAttribute('opt_id') ) {
				return; //suicide? suicide?
			}
		
			this._optionID = anchor.up('.details').readAttribute('opt_id');
			this._optionKey = anchor.readAttribute('alt');
			this._adminEditableClassName = 'admin_editable';
			this._adminEditableLabelClassName = 'admin_editable-tag';
			
			anchor.previous('.'+this._adminEditableLabelClassName).setStyle({	background:'url(/images/mini_edit.png) 0 0 no-repeat',
																				paddingLeft:'18px'	});
			
			this._formElementPayload = anchor.next('input[name='+this._optionKey+'-editable]'); //what if the displayed data is not geared to editing?  then instead, pull in formdata
			this._optionVal =  this._formElementPayload ? $F(this._formElementPayload) : anchor.innerHTML;
			
			this.dispatch = this._dispatch.bindAsEventListener(this);
			this.close = this._close.bindAsEventListener(this);
			this.save = this._save.bindAsEventListener(this);
			
			Event.observe( anchor.previous('.'+this._adminEditableLabelClassName), 'click', this.dispatch )
	},
	_dispatch:function(e) {
		var thar_tag = Event.element(e);
		var thar = thar_tag.next('.'+this._adminEditableClassName);
		
		var obj = this;

		this._editSave = new Element( 'div', { 'className':'custom_option_savebutton'}).update('[+]');
		this._editCancel = new Element( 'div', { 'className':'custom_option_cancelbutton'}).update('[x]');

		var pos = thar.positionedOffset();

		var edit_panel = 
			new Element( 'div', { 	
									'className':'custom_option_pane' , 
									style:'display:none; font-weight:normal; position:absolute; left:'+(pos.left-10)+'px; top:'+(pos.top-3)+'px;'
					} ). insert(
							new Element('div', {
													'className':'custom_option_buttons'
									} ).insert( this._editSave ).insert( this._editCancel )
					);


		this._editInput = new Element( 'input', { value:this._optionVal ,style:'width:210px;display:none; position:absolute; left:'+(pos.left-4)+'px; top:'+(pos.top-1)+'px;',name:'custom_option-'+this._optionID });
		// then register save,cancel.

		this._editPanelForm = new Element('form', { 'onsubmit':'return false;' } ).insert(edit_panel).insert(this._editInput);
		
		this._editPanelWrapper  = new Element('div').update(this._editPanelForm);

		thar.replace( this._editPanelWrapper );  	// / STUFF IS NOW IN PAGE, CAN ATTACH, APPEAR // ETC
		
		Event.observe( this._editCancel, 'click', this.close );
		Event.observe( this._editPanelForm, 'submit', this.save );
		Event.observe( this._editSave, 'click', this.save );
		//Event.observe( this._editInput, 'blur', this.close );

		Effect.Appear(edit_panel, {'duration':0.5, from:0.2, to:0.55});
		Effect.Appear(obj._editInput,{'duration':0.5, from:0.2, to:0.55,afterFinish:function(){ 
					obj._editInput.setOpacity(1.0);
					obj._editInput.focus();
					obj._editInput.select();
				} } );


	},
	_close:function(e){
		this._isCancelled = true;
		
		Effect.Fade(this._editPanelWrapper , {'duration':0.5, from:0.55, to:0});
		[this._editInput, this._editCancel, this._editPanelForm, this._editSave ].invoke('stopObserving');
		var origRecons = new Element('span',{ 'class':this._adminEditableClassName, 'alt':this._optionKey }).update(this._optionVal);
		this._editPanelWrapper.replace( origRecons );
		//Event.observe( origRecons.previous('.'+this._adminEditableLabelClassName), 'click', this.dispatch );		  //rebind ourselves 
	},
	_save:function(e){
		
		var obj = this;

		var finalValue = $F(this._editInput);
		
		if ( finalValue.match(/^\s*~\s*$/g) )
			finalValue = '';  //replace placeholder...
		
		var finalID = this._optionID;
		var finalKey = this._optionKey;
		
		var url = '/API/'+this._sess+'/Admin/set_base_meta/'+finalID+'/'+finalKey+','+finalValue+'.json';
		
		// ///SAVEIT
		new Ajax.Request(url, {
			method:'POST',
			onSuccess: function(trans) {
				Effect.Fade(obj._editPanelWrapper, {'duration':0.5, from:0.55, to:0});
				[obj._editInput, obj._editCancel, obj._editPanelForm, obj._editSave ].invoke('stopObserving');
				var origRecons = new Element('span',{ 'className':obj._adminEditableClassName, 'alt':finalKey  }).update(finalValue);
				obj._editPanelWrapper.replace(origRecons);
				obj._optionVal = finalValue;
				if ( this._formElementPayload )
					this._formElementPayload.value = finalValue;
				//Event.observe( origRecons.previous('.'+this._adminEditableLabelClassName), 'click', obj.dispatch ); //rebind for next round
			}
		});		
	}
});



Event.observe(window,'load', function() {
	$$('.admin_editable').each(function(spval) {
				new ADMIN_META_EDIT(spval);
		});
});