Recent = function(opt) {
	this.opt = opt;
	var me = this;
	
	/**
	* This function loads the template file
	* Next, it will load the data
	*/
	this.init = function() {
		if (this.opt.templateUrl != undefined) {
			$.ajax({
				url: this.opt.templateUrl,
				type: 'GET',
				dataType: 'html',
				success: function(data) {
					$('#'+me.opt.div).html(data);
					me.getData();
				}
			});
		} else {
			this.getData();
		}
	}
	
	this.getData = function() {
		$.ajax({
			url: this.opt.url,
			type: 'POST',
			dataType: 'json',
			data: {action: 'get_recent_media', limit: '10'},
			success: function(data) {
				me.displayData(data);
			}
		});
	}
	
	this.displayData = function(data) {
		html = '<ul>';
		$.each(data, function(i, val) {
			//html += '<li class="marquee"> <div class="recent-category">'+val.CatTitle+'</div><div class="recent-album"><a href="?idc='+val.page+'&Id_CatMedia='+val.Id_CatMedia+'#Id_Media:'+val.Id_Media+'">'+val.AlbumTitle+'</a></div><div class="recent-title"><a href="?idc='+val.page+'&Id_CatMedia='+val.Id_CatMedia+'#Id_Media:'+val.Id_Media+'">'+val.MediaTitle+'</a></div><span class="recent-author">الشيخ '+val.FullName+'</div><br/><br/><br/><br/><br/></li>';
			html += '<li class="marquee"> <div class="recent-album"><a href="?idc='+val.page+'&Id_CatMedia='+val.Id_CatMedia+'#Id_Media:'+val.Id_Media+'">'+val.AlbumTitle+'</a></div><div class="recent-title"><a href="?idc='+val.page+'&Id_CatMedia='+val.Id_CatMedia+'#Id_Media:'+val.Id_Media+'">'+val.MediaTitle+'</a></div><span class="recent-author">الشيخ '+val.FullName+'</div><br/><br/><br/><br/><br/></li>';
		});
		html+='</ul>';
		$('#'+this.opt.div+'-contents marquee').html(html);
		$('#'+this.opt.div+'-contents marquee').marquee().mouseover(function () {
				$(this).trigger('stop');
		}).mouseout(function () {
		  $(this).trigger('start');
		}).mousemove(function (event) {
		  if ($(this).data('drag') == true) {
		    this.scrollLeft = $(this).data('scrollX') + ($(this).data('x') - event.clientX);
		  }
		}).mousedown(function (event) {
		  $(this).data('drag', true).data('x', event.clientX).data('scrollX', this.scrollLeft);
		}).mouseup(function () {
		  $(this).data('drag', false);
		});
	}
}