Namespace.register('aegoncz.funds');

/* FundViewTable Class
------------------------------------------------------------*/
aegoncz.funds.FundViewTable = new Class({
	
	Extends:aegoncz.funds.FundViewBase,
	
	table:null,
	header:null,
	body:null,
	offset:null,
	cap:null,
	today:null,
	tabs:null,
	loader:null,
	fetchId:null,
	
	rows:[],
	data:[],
	
	initialize:function(container,colors) {
		
		this.parent(container,colors);
		
		// get time of today
		this.today = new Date().getTime();
		
		// create tab element container
		this.tabs = new Element('ul',{'class':'navigation-tabs screen'});
		
		// create table elements
		this.table = new Element('table');
		this.header = new Element('thead');
		this.body = new Element('tbody');
		this.table.adopt(this.header,this.body);
		
		// adopt elements
		this.container.adopt(this.tabs,new Element('hr',{'class':'screen'}),this.table);
		
		// build loader
		this.loader = new Element('div',{'class':'loading'});
		
		// add loader
		this.container.adopt(this.loader);
		
	}
	
});

aegoncz.funds.FundViewTable.implement({
	
	showLoading:function() {
		
		this.loader.setStyle('display','');
		
	},
	
	hideLoading:function() {
		
		this.loader.setStyle('display','none');
		
	},
	
	setData:function(data) {
		
		this.showLoading();
		
		// build new table header if it is not yet set
		if (!this.header.getElement('tr')) {
			
			var colorIndex = 0;
			var timespan;
			
			// define row
			var row = new Element('tr');
				row.adopt(new Element('th',{'text':'Date'}));
				row.adopt(new Element('th',{'html':'<span class="legend-color" style="background-color:#000"></span> Average'}));
			
			// render table header
			for(var i=0;data.funds[i]!=undefined;i++) {
				
				// don't render average header again
				if (data.funds[i].average) {
					continue;
				}
				
				row.adopt(new Element('th',{'html':'<span class="legend-color" style="background-color:' + this.colors[colorIndex] + '"></span>' + data.funds[i].id}));
				
				// get table offset
				if (this.offset == null || data.funds[i].offset < this.offset) {
					this.offset = data.funds[i].offset;
				}
				
				// get table cap
				timespan = data.funds[i].offset + (data.funds[i].data.length * this.day)
				
				if (this.cap == null || data.funds[i].offset > this.cap) {
					this.cap = timespan;
				}
				
				colorIndex++;
			}
			
			this.header.adopt(row);
			
			// offset has been defined, lets create tab elements
			var year = new Date(this.offset).get('year');
			var yearNow = new Date(this.today).get('year');
			while (year <= yearNow) {
				
				var anchor = new Element('a',{'text':year,'href':'#'});
					anchor.addEvent('click',this.pickYear.bind(this));
				
				var tab = new Element('li');
					tab.adopt(anchor);
					tab.inject(this.tabs,'top');
				
				year++;
			}
		}
		
		
		// lets fill table content
		var val,date,diff,index = null;
		this.data = [];
		
		// get timestamp end
		for (var ts=this.offset;ts<this.cap;ts+=this.day) {
			
			// define new data row
			var row = {
				date:new Date(ts),
				average:null,
				values:[]
			};
			
			// find matching funds values
			for(var i=0;data.funds[i]!=undefined;i++) {
				
				val = null;
				
				if (data.funds[i].offset <= ts) {
					diff = ts - data.funds[i].offset;
					index = Math.floor(diff/this.day);
					val = data.funds[i].data[index];
				}
				
				if (data.funds[i].average) {
					row.average = val;
				}
				else {
					row.values.push(val);
				}
			}
			
			this.data.push(row);
		}
	},
	
	setPeriod:function(from,to) {
		
		clearTimeout(this.fetchId);
		this.rows = [];
		
		this.period.from = from;
		this.period.to = to;
		
		if (this.data.length > 0) {
			
			// hide body
			this.body.setStyle('display','none');
			
			// remove old body content
			this.body.set('html','');
			this.addDaysWithOffset(this.period.from);
			
			// show body
			this.body.setStyle('display','');
			
		}
	},
	
	addDaysWithOffset:function(from) {
		
		this.showLoading();
		
		var row = null;
		var i = 0;
		var ts = 0;
		var dataLength = this.data.length;
		
		// set new body content
		while (i < dataLength) {
			
			// get timestamp of data entry
			ts = this.data[i].date.getTime();
			
			// if in range
			if (ts > from && ts < this.period.to) {
				
				// add data object
				this.rows.push(this.data[i]);
			}
			
			i++;
		}
		
		// start fetching rows
		if (this.rows.length > 0) {
			this.fetchRow(0);
		}
		
		if (this.rows.length == 0) {
			this.hideLoading();
		}
	},
	
	fetchRow:function(index) {
		
		// get data object
		var data = this.rows[index];
		
		// define row element
		var row = new Element('tr');
			row.adopt(new Element('td',{'text':data.date.format('date')}));
			row.adopt(new Element('td',{'text':data.average}));
		
		// add values
		for (var i=0;i<data.values.length;i++) {
			row.adopt(new Element('td',{'text':data.values[i]}));
		}
		
		if (index%2==0) {
			row.addClass('alt');
		}
		
		this.body.adopt(row);
		
		if (index < this.rows.length-1) {
			clearTimeout(this.fetchId);
			this.fetchId = this.fetchRow.delay(1,this,++index);
		}
		else {
			this.hideLoading();
			this.rows = [];
		}
	},
	
	pickYear:function(e) {
		
		e.stop();
		
		var target = $(e.target);
		var year = parseInt(target.get('text'),10);
		
		var from = new Date(year,0,1);
		var to = new Date(year+1,0,1);
		
		this.fireEvent(mirabeau.events.Event.CHANGED,[from.getTime(),to.getTime()]);
		
		return false;
	}
});