Mys.TemplateView = function(config)
{
	Ext.apply(this, config);
	
	this.addEvents({"render" : true, "update" : true, "beforeupdate" : true});
	
	this.cellEl = {};
	this.cellData = {};
};

Ext.extend(Mys.TemplateView, Ext.util.Observable,{
	template : null,
	id : null,
	className : "mys-view",
	bodyClassName : "mys-view-body",
	loadingClassName : "mys-view-loading",
	rendered : false,
	cellEl : null,
	cellData : null,
	
	render : function(el)
	{
		if(!el || this.rendered)
			return false;
		
		this.el = Ext.get(el);
		
		if(!this.el)
			return false;
		
		this.rendered = true;
		
		this.el.addClass(this.className);
		
		this.elTemplate.overwrite(this.el, this);
		
		this.bodyEl = this.el.child("." + this.bodyClassName);
		this.loadingEl = this.el.child("." + this.loadingClassName);
		
		this.fireEvent("render", this);
	},
	
	safeNumber : function(number)
	{
		return parseInt(number) || 0;
	},
	
	safeArray : function(array)
	{
		if(!array)
			var array = [];
		else if(!(array instanceof Array))
			var array = [array];
		
		return array;
	},
	
	safeAmount : function(number)
	{
		return (this.safeNumber(number) + "").comma();
	},
	
	update : function(data)
	{
		if(!data || this.fireEvent("beforeupdate", this, data) === false)
			return false;
		
		this.endLoading();
		
		this.data = data;
		
		this.bodyTemplate.overwrite(this.bodyEl, this.prepareData(data));
		
		this.setEvents(this.bodyEl);
		
		this.fireEvent("update", this, this.data);
	},
	
	prepareData : function(data)
	{
		return data;
	},
	
	setEvents : function(el)
	{
	},
	
	startLoading : function()
	{
		if(!this.rendered)
			return false;
		
		if(this.loadingEl)
			this.loadingEl.dom.style.display = "";
		if(this.bodyEl)
			this.bodyEl.dom.style.display = "none";
	},
	
	endLoading : function()
	{
		if(!this.rendered)
			return false;
		
		if(this.loadingEl)
			this.loadingEl.dom.style.display = "none";
		if(this.bodyEl)
			this.bodyEl.dom.style.display = "";
	}
});