extract common code

apps/files/js/filelist.js

@@ -3,35 +3,92 @@ var FileList={
 	update:function(fileListHtml) {
 		$('#fileList').empty().html(fileListHtml);
 	},
-	addFile:function(name,size,lastModified,loading,hidden){
-		var basename, extension, simpleSize, sizeColor, lastModifiedTime, modifiedColor,
-			img=(loading)?OC.imagePath('core', 'loading.gif'):OC.imagePath('core', 'filetypes/file.png'),
-			html='<tr data-type="file" data-size="'+size+'" data-permissions="'+$('#permissions').val()+'">';
-		if(name.indexOf('.')!=-1){
+	createRow:function(type, name, iconurl, linktarget, size, lastModified, permissions){
+		var td, simpleSize, basename, extension;
+		//containing tr
+		var tr = $('<tr></tr>').attr({
+			"data-type": type,
+			"data-size": size,
+			"data-file": name,
+			"data-permissions": permissions
+		});
+		// filename td
+		td = $('<td></td>').attr({
+			"class": "filename",
+			"style": 'background-image:url('+iconurl+')'
+		});
+		td.append('<input type="checkbox" />');
+		var link_elem = $('<a></a>').attr({
+			"class": "name",
+			"href": linktarget
+		});
+		//split extension from filename for non dirs
+		if (type != 'dir' && name.indexOf('.')!=-1) {
 			basename=name.substr(0,name.lastIndexOf('.'));
 			extension=name.substr(name.lastIndexOf('.'));
-		}else{
+		} else {
 			basename=name;
 			extension=false;
 		}
-		html+='<td class="filename" style="background-image:url('+img+')"><input type="checkbox" />';
-		html+='<a class="name" href="' +OC.Router.generate('download', { file: $('#dir').val()+'/'+name }) +'"><span class="nametext">'+escapeHTML(basename);
+		var name_span=$('<span></span>').addClass('nametext').text(basename);
+		link_elem.append(name_span);
 		if(extension){
-			html+='<span class="extension">'+escapeHTML(extension)+'</span>';
+			name_span.append($('<span></span>').addClass('extension').text(extension));
+		}
+		//dirs can show the number of uploaded files 
+		if (type == 'dir') {
+			link_elem.append($('<span></span>').attr({
+				'class': 'uploadtext',
+				'currentUploads': 0
+			}));
 		}
-		html+='</span></a></td>';
-		if(size!='Pending'){
+		td.append(link_elem);
+		tr.append(td);
+		
+		//size column
+		if(size!=t('files', 'Pending')){
 			simpleSize=simpleFileSize(size);
 		}else{
-			simpleSize='Pending';
+			simpleSize=t('files', 'Pending');
 		}
-		sizeColor = Math.round(200-size/(1024*1024)*2);
-		lastModifiedTime=Math.round(lastModified.getTime() / 1000);
-		modifiedColor=Math.round((Math.round((new Date()).getTime() / 1000)-lastModifiedTime)/60/60/24*14);
-		html+='<td class="filesize" title="'+humanFileSize(size)+'" style="color:rgb('+sizeColor+','+sizeColor+','+sizeColor+')">'+simpleSize+'</td>';
-		html+='<td class="date"><span class="modified" title="'+formatDate(lastModified)+'" style="color:rgb('+modifiedColor+','+modifiedColor+','+modifiedColor+')">'+relative_modified_date(lastModified.getTime() / 1000)+'</span></td>';
-		html+='</tr>';
-		FileList.insertElement(name,'file',$(html).attr('data-file',name));
+		var sizeColor = Math.round(200-Math.pow((size/(1024*1024)),2));
+		var lastModifiedTime = Math.round(lastModified.getTime() / 1000);
+		td = $('<td></td>').attr({
+			"class": "filesize",
+			"title": humanFileSize(size),
+			"style": 'color:rgb('+sizeColor+','+sizeColor+','+sizeColor+')'
+		}).text(simpleSize);
+		tr.append(td);
+		
+		// date column
+		var modifiedColor = Math.round((Math.round((new Date()).getTime() / 1000)-lastModifiedTime)/60/60/24*5);
+		td = $('<td></td>').attr({ "class": "date" });
+		td.append($('<span></span>').attr({
+			"class": "modified",
+			"title": formatDate(lastModified),
+			"style": 'color:rgb('+modifiedColor+','+modifiedColor+','+modifiedColor+')'
+		}).text( relative_modified_date(lastModified.getTime() / 1000) ));
+		tr.append(td);
+		return tr;
+	},
+	addFile:function(name,size,lastModified,loading,hidden){
+		var imgurl;
+		if (loading) {
+			imgurl = OC.imagePath('core', 'loading.gif');
+		} else {
+			imgurl = OC.imagePath('core', 'filetypes/file.png');
+		}
+		var tr = this.createRow(
+			'file',
+			name,
+			imgurl,
+			OC.Router.generate('download', { file: $('#dir').val()+'/'+name }),
+			size,
+			lastModified,
+			$('#permissions').val()
+		);
+			
+		FileList.insertElement(name, 'file', tr.attr('data-file',name));
 		var row = $('tr').filterAttr('data-file',name);
 		if(loading){
 			row.data('loading',true);
@@ -44,30 +101,18 @@ var FileList={
 		FileActions.display(row.find('td.filename'));
 	},
 	addDir:function(name,size,lastModified,hidden){
-		var html, td, link_elem, sizeColor, lastModifiedTime, modifiedColor;
-		html = $('<tr></tr>').attr({ "data-type": "dir", "data-size": size, "data-file": name, "data-permissions": $('#permissions').val()});
-		td = $('<td></td>').attr({"class": "filename", "style": 'background-image:url('+OC.imagePath('core', 'filetypes/folder.png')+')' });
-		td.append('<input type="checkbox" />');
-		link_elem = $('<a></a>').attr({ "class": "name", "href": OC.linkTo('files', 'index.php')+"?dir="+ encodeURIComponent($('#dir').val()+'/'+name).replace(/%2F/g, '/') });
-		link_elem.append($('<span></span>').addClass('nametext').text(name));
-		link_elem.append($('<span></span>').attr({'class': 'uploadtext', 'currentUploads': 0}));
-		td.append(link_elem);
-		html.append(td);
-		if(size!='Pending'){
-			simpleSize=simpleFileSize(size);
-		}else{
-			simpleSize='Pending';
-		}
-		sizeColor = Math.round(200-Math.pow((size/(1024*1024)),2));
-		lastModifiedTime=Math.round(lastModified.getTime() / 1000);
-		modifiedColor=Math.round((Math.round((new Date()).getTime() / 1000)-lastModifiedTime)/60/60/24*5);
-		td = $('<td></td>').attr({ "class": "filesize", "title": humanFileSize(size), "style": 'color:rgb('+sizeColor+','+sizeColor+','+sizeColor+')'}).text(simpleSize);
-		html.append(td);
-
-		td = $('<td></td>').attr({ "class": "date" });
-		td.append($('<span></span>').attr({ "class": "modified", "title": formatDate(lastModified), "style": 'color:rgb('+modifiedColor+','+modifiedColor+','+modifiedColor+')' }).text( relative_modified_date(lastModified.getTime() / 1000) ));
-		html.append(td);
-		FileList.insertElement(name,'dir',html);
+		
+		var tr = this.createRow(
+			'dir',
+			name,
+			OC.imagePath('core', 'filetypes/folder.png'),
+			OC.linkTo('files', 'index.php')+"?dir="+ encodeURIComponent($('#dir').val()+'/'+name).replace(/%2F/g, '/'),
+			size,
+			lastModified,
+			$('#permissions').val()
+		);
+			
+		FileList.insertElement(name,'dir',tr);
 		var row = $('tr').filterAttr('data-file',name);
 		row.find('td.filename').draggable(dragOptions);
 		row.find('td.filename').droppable(folderDropOptions);