From f62b31515937f2687f7543c5c6286252c5812e6d Mon Sep 17 00:00:00 2001
From: Jan-Christoph Borchardt <JanCBorchardt@fsfe.org>
Date: Fri, 12 Aug 2011 11:51:44 +0200
Subject: [PATCH] file hovering now very fancy, CSS fade for row and extension

---
 core/js/js.js        |  2 +-
 files/css/files.css  | 10 ++++++++++
 files/js/filelist.js |  4 ++--
 files/js/files.js    |  2 +-
 4 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/core/js/js.js b/core/js/js.js
index b66f0a559d..8ac999a104 100644
--- a/core/js/js.js
+++ b/core/js/js.js
@@ -290,7 +290,7 @@ $(document).ready(function(){
 		$('#settings #expand+span').fadeToggle();
 	});
 	
-	$('a.file_action').tipsy({gravity:'s', live:true});
+	$('.file_action').tipsy({gravity:'s', live:true});
 	$('.selectedActions a').tipsy({gravity:'n', live:true});
 	$('.selectedActions a.delete').tipsy({gravity: 'ne', live:true});
 });
diff --git a/files/css/files.css b/files/css/files.css
index 7901c3c6a0..262feb3c7f 100644
--- a/files/css/files.css
+++ b/files/css/files.css
@@ -26,10 +26,20 @@
 /* FILE TABLE */
 span#emptyfolder { position:absolute; margin:10em 0 0 10em; font-size:1.5em; font-weight:bold; color:#888; text-shadow:#fff 0 1px 0; }
 table { position:relative; top:37px; width:100%; }
+table tr { -webkit-transition:background-color 100ms ease-in 100ms;
+-moz-transition:background-color 100ms ease-in 100ms;
+-o-transition:background-color 100ms ease-in 100ms;
+transition:background-color 100ms ease-in 100ms; }
 tbody tr:hover, tbody tr:active, tbody tr.selected { background-color:#f8f8f8; height:1em; }
 tbody tr.selected { background-color:#eee; }
 tbody a { color:#000; }
 span.extention, td.date { color:#999; }
+span.extention { opacity:0;
+-webkit-transition:opacity 100ms ease-in 100ms;
+-moz-transition:opacity 100ms ease-in 100ms;
+-o-transition:opacity 100ms ease-in 100ms;
+transition:opacity 100ms ease-in 100ms; }
+tr:hover span.extention { opacity:1; }
 div.crumb { float:left; display:block; background:no-repeat right 0; padding:.75em 1.5em 0 1em; height:2.9em; }
 div.crumb:first-child { padding-left:1.5em; }
 div.crumb:last-child { font-weight:bold; }
diff --git a/files/js/filelist.js b/files/js/filelist.js
index 50a995bf25..b89bc9b57b 100644
--- a/files/js/filelist.js
+++ b/files/js/filelist.js
@@ -3,7 +3,7 @@ FileList={
 		$('#fileList').empty().html(fileListHtml);
 	},
 	addFile:function(name,size,lastModified,loading){
-		var img=(loading)?OC.imagePath('core', 'loading.gif'):OC.imagePath('core', 'filetypes/file.png');
+		var img=(loading)?OC.imagePath('core', 'loading.gif'):OC.imagePath('core', 'filetypes/file');
 		var html='<tr data-file="'+name+'" data-type="file" data-size="'+size+'">';
 		if(name.indexOf('.')!=-1){
 			var basename=name.substr(0,name.indexOf('.'));
@@ -38,7 +38,7 @@ FileList={
 	},
 	addDir:function(name,size,lastModified){
 		var html='<tr data-file="'+name+'" data-type="dir" data-size="'+size+'">';
-		html+='<td class="filename" style="background-image:url(img/folder.png)"><input type="checkbox" /><a class="name" href="index.php?dir='+$('#dir').val()+'/'+name+'">'+name+'</a></td>';
+		html+='<td class="filename" style="background-image:url('+OC.imagePath('core', 'places/folder')+')"><input type="checkbox" /><a class="name" href="index.php?dir='+$('#dir').val()+'/'+name+'">'+name+'</a></td>';
 		if(size!='Pending'){
 			simpleSize=simpleFileSize(size);
 		}else{
diff --git a/files/js/files.js b/files/js/files.js
index e8d2b5d9f5..8b41781cbf 100644
--- a/files/js/files.js
+++ b/files/js/files.js
@@ -423,5 +423,5 @@ function getMimeIcon(mime){
 	if(knownMimes.indexOf(mime)==-1){
 		mime='file';
 	}
-	return OC.imagePath('core','mimetypes/'+mime+'.png');
+	return OC.imagePath('core','filetypes/'+mime);
 }