show fileactions inline on hover

nextcloud · Jul 21, 2011 · d9a79c0 · d9a79c0
1 parent aa335f5
commit d9a79c0
Show file tree

Hide file tree

Showing 5 changed files with 35 additions and 38 deletions.
diff --git a/apps/media/css/jplayer.css b/apps/media/css/jplayer.css
@@ -45,7 +45,7 @@ div.jp-interface {
 	z-index:100;
 	width:25em;
 	left:201px;
-	top:-10px;
+	top:-20px;
 }
 div.jp-type-playlist{
 	width:100%;

diff --git a/files/css/files.css b/files/css/files.css
@@ -2,22 +2,17 @@
 
 #file_menu
 {
-    display: none;
-    position: absolute;
 	right:0px;
-    background-color: #EEE;
-}
-
-#file_menu ul
-{
-    list-style-type: none;
+	position:absolute;
+	top:0;
 }
 
-#file_menu li a
+#file_menu a
 {
-    display: block;
-    padding: 0.5em 5em 0.5em 2em;
-    text-decoration: none;
+	display:block;
+	float:left;
+	background-image:none;
+	text-decoration: none;
 }
 
 .file_upload_form, #file_newfolder_form {
@@ -36,12 +31,12 @@
 }
 
 .file_upload_filename {
-	background-image:url(../img/file.png); font-weight:bold;
+	background-image:url("../img/file.png"); font-weight:bold;
 }
 .file_upload_start {opacity:0;filter: alpha(opacity = 0);}
 
 #file_newfolder_name {
-	background-image:url(../img/folder.png); font-weight:bold; 
+	background-image:url("../img/folder.png"); font-weight:bold;
 	width: 14em;
 }
 
@@ -102,11 +97,8 @@ table td.selection, table th.selection, table td.fileaction
     text-align: center;
 }
 
-table td.filename a
-{
-    display: block;
-    background-image: url(../img/file.png);
-    text-decoration: none;
+td.filename{
+	position:relative;
 }
 
 .dropArrow{

diff --git a/files/js/fileactions.js b/files/js/fileactions.js
@@ -49,33 +49,39 @@ FileActions={
 		return actions[name];
 	},
 	display:function(parent){
-		$('#file_menu ul').empty();
+		$('#file_menu').empty();
 		parent.append($('#file_menu'));
 		var actions=FileActions.get(FileActions.getCurrentMimeType(),FileActions.getCurrentType());
 		for(name in actions){
-			var html='<li><a href="" alt="'+name+'">'+name+'</a></li>';
+			var html='<a href="#" alt="'+name+'">'+name+'</a>';
 			var element=$(html);
 			element.data('action',name);
 			element.click(function(event){
+				event.stopPropagation();
 				event.preventDefault();
-				$('#file_menu').slideToggle(250);
 				var action=actions[$(this).data('action')];
-				$('#file_menu ul').empty();
-				action(FileActions.getCurrentFile());
+				var currentFile=FileActions.getCurrentFile();
+				FileActions.hide();
+				action(currentFile);
 			});
-			$('#file_menu>ul').append(element);
+			$('#file_menu').append(element);
 		}
-		$('#file_menu').slideToggle(250);
+		$('#file_menu').show();
 		return false;
 	},
+	hide:function(){
+		$('#file_menu').hide();
+		$('#file_menu').empty();
+		$('body').append($('#file_menu'));
+	},
 	getCurrentFile:function(){
-		return $('#file_menu').parents('tr:first').attr('data-file');
+		return $('#file_menu').parent().parent().attr('data-file');
 	},
 	getCurrentMimeType:function(){
-		return $('#file_menu').parents('tr:first').attr('data-mime');
+		return $('#file_menu').parent().parent().attr('data-mime');
 	},
 	getCurrentType:function(){
-		return $('#file_menu').parents('tr:first').attr('data-type');
+		return $('#file_menu').parent().parent().attr('data-type');
 	}
 }
 

diff --git a/files/js/files.js b/files/js/files.js
@@ -31,11 +31,13 @@ $(document).ready(function() {
 	});
 
 	// Sets the file-action buttons behaviour :
-	$('td.fileaction a').live('click',function(event) {
-		event.preventDefault();
-		FileActions.display($(this).parent());
+	$('tr').live('mouseenter',function(event) {
+		FileActions.display($(this).children('td.filename'));
 	});
-
+	$('tr').live('mouseleave',function(event) {
+		FileActions.hide();
+	});
+
 	// Sets the file link behaviour :
 	$('td.filename a').live('click',function(event) {
 		event.preventDefault();

diff --git a/files/templates/index.php b/files/templates/index.php
@@ -43,7 +43,4 @@
 	</tbody>
 </table>
 
-<div id="file_menu">
-	<ul>
-	</ul>
-</div>
+<span id="file_menu"/>