visorDatos = function(vPadre, vMiVentana, config){
	Ext.apply(this, config);
	this.config = config;
	// DOM
	this.el = vMiVentana.el;
	// Ventana padre en este caso la ventana de la aplicacion
	this.vPadre = vPadre;
	this.vMiVentana   = vMiVentana;
	
	this.ultimoRegistroVisitado = {id:-1, lnk: ''};
	
	//this.creaTitulo(vMiVentana.title, config)

	var dh = Ext.DomHelper;

	// crea las divisiones para la lista y detalle
	//Registros
	this.miDiv = dh.append(this.el.dom, {tag: 'div'}, true);
	YAHOO.util.Dom.generateId(this.miDiv);
	
		this.divRegistros = dh.append(this.miDiv.dom, {tag: 'div', cls:'listaDatos'}, true);
		YAHOO.util.Dom.generateId(this.divRegistros);
		// prepara el divRegistros para presentar los datos		
		this.crearVistaDatos(this.divRegistros,config);
			
		//Detalle
		this.divDetalle = dh.append(this.miDiv.dom, {tag: 'div', cls:'detalleDatos'}, true);
		YAHOO.util.Dom.generateId(this.divDetalle);
		//Botonera del detalle
			this.divDetalleBotonera = dh.append(this.divDetalle.dom, {tag: 'div'}, true);
			YAHOO.util.Dom.generateId(this.divDetalleBotonera);
			
			//detalle del registro
			this.divDetalleRegistro = dh.append(this.divDetalle.dom, {tag: 'div'}, true);
			YAHOO.util.Dom.generateId(this.divDetalleRegistro);
	
	vPadre.ventana.beginUpdate();
	
	//crea el layout del objeto
	this.layout = new Ext.NestedLayoutPanel(vMiVentana.ventana, config.layout );
	// se subcribe al evento destroy del content
	this.layout.on('destroy', this.destroy ,this, true);	

	// agrega el panel en el centro de la ventana principal 
	vPadre.ventana.add(config.region, this.layout);
		
	//Agrega el panel central de la ventana de trabajo 
	this.panelListaDatos = vMiVentana.ventana.add('center', new Ext.ContentPanel(this.divRegistros.id, {  fitToFrame:true
																			   					,title: config.descripcion} ) );
	// Carga la botonera del visor de datos
	var toolbar =  this.botonera(config.botones);
	
    this.panelDetalleDatos = new Ext.ContentPanel(this.divDetalle.id, {  title: "Detalle."
																			  ,fitToFrame:true
																			  ,resizeEl:this.divDetalleRegistro.id});
   	vMiVentana.ventana.add('south', this.panelDetalleDatos);
	
	//this.recuperar();
	
	vPadre.ventana.restoreState();
   	vPadre.ventana.endUpdate();		

};

visorDatos.prototype =  {

	crearVistaDatos	: function(el, config){
		
		// crea el  Data Store
		this.ds = new Ext.data.Store({
			// setea el proxy del Data Store
			proxy: eval( 'new Ext.data.' + config.proxy.name + '(config.proxy)'),
			// crea el reader 
			reader: eval( 'new Ext.data. ' + config.reader.name + ' (config.reader.meta, config.reader.recordType)'),
		   // indica si existe ordenamiento en el servidor
			remoteSort: config.remoteSort
	    });

		this.ds.setDefaultSort(config.defaultSort.field, config.defaultSort.direction);
		this.ds.baseParams = config.baseParams;
		this.ds.on('load', this.alCargarDatos, this);		
		var tpl = new Ext.DomHelper.Template(config.htmlTemplate);
		//
		var selectedClass = 'selected-listaDatos';
		if (config.selectedClass){
			selectedClass = config.selectedClass;
		}		

		this.view = new Ext.View(el, tpl, {store: this.ds, singleSelect:true, selectedClass:selectedClass});
		// retorna el prepareData segun lo especificado en el config 
		this.view.prepareData = function(data){
			var ret ='';
			for(var campo in  config.prepareData){
				ret = ret + '"' + campo + '" : "' +  eval('data.' + campo).replace(/<\/?[^>]+>/gi, '') + '" ,';
			}
			ret = '{' + ret.substr(0,ret.length-1) + '}';
			return (Ext.util.JSON.decode(ret)); 
		 };

        this.view.on('click', this.verDetalle, this, true);
		
		// anexa el posible objeto adjunto al view para ser reconocido en el evento verDetalle
		if (this.config.objeto){ 
			config.objeto.el = this.divDetalleRegistro; 
		}
	}, 

	alCargarDatos	: function(){
		//Si no retorna datos limpia la seccion de detalle
        if(this.ds.getTotalCount() < 1){
       		this.divDetalleRegistro.update('No se encontraron datos de ' +  this.config.descripcion.toLowerCase());
      	}
		
        // Actualiza el texto en la barra de estado
		this.vPadre.sur().setContent(this.config.descripcion);	
		// Actualiza el tutor
		var um = this.vPadre.este().getEl().getUpdateManager();
		um.setRenderer({
				 	 render : function(el, o){
						 var contenido = o.responseText.htmlDecode();
						 el.update(contenido,true);
				     }
				    });
		// si tiene tutorial lo carga
//		if (this.config.tutorial.url) {
//			um.update(this.config.tutorial.url);
//		}

        this.vPadre.sur().getEl().addClass('done');		
	},
	
	recuperar		: function(){
		// comprueba en que objeto está
		var me = this
		if (!me.vMiVentana){
			me = this.objeto;
		}
		me.vMiVentana.ventana.beginUpdate();
		me.vPadre.sur().setContent('Cargando ' + me.config.webService + '...');
		me.ds.load(me.config.proxy);
		me.divDetalleRegistro.update(' ');
		me.ultimoRegistroVisitado = {id:-1, lnk: ''};
		me.vMiVentana.ventana.restoreState();
        me.vMiVentana.ventana.endUpdate(false);
	},
	
	botonera		: function(){
		 var tb = new Ext.Toolbar(this.divDetalleBotonera.id);
		 for(var boton in this.config.botones){
			if  (!isNaN(boton)) {
				this.config.botones[boton].objeto = this;
				tb.addButton(this.config.botones[boton]);
				tb.addSeparator();
			}
		 }
		 // agrega el boton de ayuda si esta definida en el espacio global
		 if (YAHOO.gestorAST.editaAyuda){
			var botonEditarAyuda = {
								id:YAHOO.util.Dom.generateId().replace(/yui-gen/g,'botonAyuda'), 
								text: '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;',
								cls:'x-btn-text-icon editarAyuda',																			
								tooltip: {text:'Editor de ayuda contextual para ' +  this.config.descripcion.toLowerCase(), title:'Editar ayuda.', autoHide:true},
								handler: gestorAST.editarAyuda,
								objeto : this
							};
			
			tb.addButton(botonEditarAyuda);
			tb.addSeparator();
		}
		 // agrega el boton de ayuda si esta definida en el espacio global
		 if (YAHOO.gestorAST.verAyuda){
			
			var botonVerAyuda = {
									id:YAHOO.util.Dom.generateId().replace(/yui-gen/g,'botonAyuda'), 
									text: '',
									cls:'x-btn-text-icon ayuda',																			
									tooltip: {text:'Ayuda para ' + this.config.descripcion.toLowerCase() , title:'Ayuda.', autoHide:true},
									handler: gestorAST.verAyuda,
									objeto: this
									};
			tb.addButton(botonVerAyuda);
		   }			
		 return tb
	},

	ultimoRegistro	: function(){
		if (this.ultimoRegistroVisitado.id < 0){
			return null;
		}
	 	return this.ultimoRegistroVisitado
	},

	id	: function(){
	 return this.config.id;
	},

    verDetalle		: function(view, indActual){
		
		// carga el detalle del item seleccionado
    	var nodo = this.ds.getAt(indActual);
		var id = nodo.data.id; 
    	var lnk = nodo.data.url;
		
			// almacena el ultimo registro visitado
		this.ultimoRegistroVisitado = {id : id, lnk : lnk };
	
    	this.panelDetalleDatos.setTitle('Detalle de ' + this.config.descripcion.toLowerCase());
		
		// si viene un objeto 
		if(this.config.objeto) { 
					// crea el objeto indicado
					this.config.objeto.padre = this.config.id;
					var objetoEl = this.config.objeto.el;
					var objetoConfig = this.config.objeto.config;
					// informa a la instancia quien es su padre			
					objetoConfig.padre = this.config.id;					
					objetoConfig.key = lnk;
					var objetoClase = this.config.objeto.clase;
					// verifica si se ha creado el objeto
					if (! this.config.objeto.instancia){	
						// crea el objeto
						this.config.objeto.instancia = eval( 'new ' + objetoClase + '( objetoEl,  objetoConfig )' ); 
					}
						else{		
							// muestra el objeto
							this.config.objeto.instancia.mostrar(objetoConfig);
					}
			}
				else {	
					var um = getEl(this.divDetalleRegistro.id).getUpdateManager();
					um.disableCaching = true;
					um.showLoadIndicator = false;	
					um.setRenderer({
								 render : function(el, o){
									 var contenido = o.responseText.htmlDecode();
									 // pasa el id del elemento contenedor a la pagina alojada
		 							 contenido = contenido.replace(/%el%/g,el.id);
									 el.update(contenido, true);
								 }
								});
					um.update(lnk);
			}

    },
	
	getEl			: function (){
		return this.layout.getEl();
	},
	
	activar			: function(){
		this.vPadre.ventana.showPanel(this.layout.getEl().id);
		this.recuperar();
	},
	
	destroy : function(){
		
		if(this.view.objeto) { 
			this.view.objeto.instancia = null;
		}		
//		this.layout.destroy();
//		this.panelListaDatos.destroy();
//		this.panelDetalleDatos.destroy();
		
	}
	
};