Grid = function(opt) {
	this.opt = opt;
	this.filter = {column: '', val: ''};
	var html = ''; 
	var me;
	
	this.render = function(filter) {
		html = '';
		me = this;
		if (filter == undefined) {
			filter = [{column: '', val: ''}];

			if (this.opt.noInitialData && this.opt.uri.getUri() == '') {
				this.displayData([]);
				return;
			}
		}
		this.filter = filter;
		this.getData();
	}
	
	this.getData = function() {
		this.displayLoadingIcon();
		$.ajax({
			url:this.opt.url,
			type: 'POST',
			data: { action: this.opt.action, uri: this.opt.uri.getUri(), page: this.opt.page, category: this.opt.category, filter: this.getFilterString()},
			dataType: 'json',
			success: function(data) {
				me.displayData(data);								
			}
		});
	}
	
	this.displayData = function(data) {
		if (data.length == 0) {
			this.displayEmptyData();
			return;
		}
		selectedId = undefined;
		this.selected = me.opt.uri.get('Id_Media');
		totalMedia = data.length;
		$.each(data, function(i, val){
			className = "media-row";
			if (val.Id_Media == me.selected) {
				className += " media-click";
				selectedId = i;
			}
			html+='<tr id="'+i+'" class="'+className+'">';
			html+='<td><div title="'+val.MediaTitle+'" class="media-title" id="'+val.Id_Media+'"><span class="media-number">'+getMediaNumber(val.Number, totalMedia)+' - </span>'+getTitleVisiblePart(val.MediaTitle)+'</div></td>';
			html+='<td width="40">'+val.Duration+'</td>';
			//html+='<td width="20"><a href="/upload/get.php?Id_Media='+val.Id_Media+'"><img border="0" src="'+me.opt.downloadIcon+'"/></a></td>';
			html+='<td width="30"><a href="'+val.Link+'"><img border="0" src="'+me.opt.downloadIcon+'"/></a></td>';
			html+='</tr>';
		});
		
		if (this.selected != undefined) {
			this.opt.player.render(this.selected);
		}
		this.selected = undefined;
		$('#'+this.opt.div).html('<table class="grid" width="100%" cellspacing="0" cellpadding="0">'+html+'</table>');
		
		if (selectedId != undefined) {
			//$('.grid tr')[selectedId].scrollIntoView();
		}
		
		me = this;
		$('.media-title').click(function(){
			me.opt.player.render(this.id);
		});
		
		$(".grid tr").mouseover(function() {
			$(this).addClass("media-over");
		}).mouseout(function() {
			$(this).removeClass("media-over");
		}).click(function() {
			if (!$(this).hasClass("media-click")) {
				$('#'+me.opt.div+' *.media-click').removeClass("media-click");
				$(this).addClass("media-click");
			}
		});
		
	}
	
	this.displayEmptyData = function() {
		$('#'+this.opt.div).html('<div style="margin:50px;">&nbsp;</div>');
	}
	
	this.getFilterString = function() {
		ret = [];
		$.each(this.filter, function(i, v) {
			if (v.column != '') {
				ret.push(v.column+'='+v.val);
			}
		});
		return ret.join('|');
	}
	
	this.displayLoadingIcon = function() {
		$('#'+this.opt.div).html('<div style="text-align: center;vertical-align: bottom;position: relative;top: 40%;"><img src="/_images/loading_2.gif"/></div>');
	}
	
	
	/**
	 * This function returns the substring of s unitl the first blank before the 75th char
	 */
	function getTitleVisiblePart(s) {
		var a_s = s.toString();
		if (a_s.length <= 70) {
			return a_s;
		}
		lastSpaceIndex = 0;
		for(i=0;i<a_s.length;i++) {
			if (i>65) {
				break;
			}
			if (a_s.charAt(i) == ' ') {
				lastSpaceIndex = i;
			}
		}
		return a_s.substr(0,lastSpaceIndex)+" ...";
	}

	/**
	 * This function returns the number of the media with additional zeros, depending on the total number of digits
	 */
	function getMediaNumber(n, total) {
		nbDigits = total.toString().length;
		if (nbDigits <= 1) {
			nbDigits = 2;
		}
		ret = n.toString();
		for(i=0;i<nbDigits-n.toString().length;i++) {
			ret = '0'+ret;
		}
		return ret;
	}
}