You can now move files to a parent folder by draging them to an element in the breadcrumb bar
also fixed dragging newly uploaded files and droppin in new folders
This commit is contained in:
Robin Appelman
parent
01a9d916e7
commit
47993fe29a
|
|
@ -249,9 +249,9 @@ table td.delete { background-image:url('../img/delete.png'); }
|
|||
#fileList tr:hover input[type=checkbox] { display:inline; }
|
||||
|
||||
/* NAVIGATION BAR */
|
||||
p.nav { margin:1em 0 0 2em; padding:0.8em; line-height:16px; font-weight:bold; }
|
||||
p.nav a { padding:0.5em 1.5em 0.5em 0.5em; background-position:right center; background-repeat:no-repeat; background-image:url('../img/arrow.png'); text-decoration:none; }
|
||||
p.nav a img { height:16px; vertical-align:text-top; }
|
||||
span.nav { margin:1em 0 0 2em; padding:0.8em; line-height:16px; font-weight:bold; display:block}
|
||||
span.nav a { padding:0.5em 1.5em 0.5em 0.5em; background-position:right center; background-repeat:no-repeat; background-image:url('../img/arrow.png'); text-decoration:none; }
|
||||
span.nav a img { height:16px; vertical-align:text-top; }
|
||||
|
||||
/* ACTIONS BAR */
|
||||
p.actions, div.actions { padding:0; }
|
||||
|
|
|
|||
|
|
@ -114,3 +114,7 @@ table td.filename a
|
|||
span.extention{
|
||||
color:#999;
|
||||
}
|
||||
|
||||
div.crumb{
|
||||
float:left;
|
||||
}
|
||||
|
|
@ -11,6 +11,7 @@ FileList={
|
|||
html+='<td class="fileaction"><a href="" title="+" class="dropArrow"></a></td>';
|
||||
html+='</tr>';
|
||||
FileList.insertElement(name,'file',$(html));
|
||||
$('tr[data-file="'+name+'"] td.filename').draggable(dragOptions);
|
||||
},
|
||||
addDir:function(name,size,lastModified){
|
||||
var html='<tr data-file="'+name+'" data-type="dir">';
|
||||
|
|
@ -22,6 +23,8 @@ FileList={
|
|||
html+='</tr>';
|
||||
|
||||
FileList.insertElement(name,'dir',$(html));
|
||||
$('tr[data-file="'+name+'"] td.filename').draggable(dragOptions);
|
||||
$('tr[data-file="'+name+'"] td.filename').droppable(folderDropOptions);
|
||||
},
|
||||
refresh:function(data) {
|
||||
result = jQuery.parseJSON(data.responseText);
|
||||
|
|
@ -32,6 +35,7 @@ FileList={
|
|||
resetFileActionPanel();
|
||||
},
|
||||
remove:function(name){
|
||||
$('tr[data-file="'+name+'"] td.filename').draggable('destroy');
|
||||
$('tr[data-file="'+name+'"]').remove();
|
||||
},
|
||||
insertElement:function(name,type,element){
|
||||
|
|
|
|||
|
|
@ -1,26 +1,33 @@
|
|||
$(document).ready(function() {
|
||||
$('#file_action_panel').attr('activeAction', false);
|
||||
|
||||
$('#fileList tr td.filename').draggable({
|
||||
distance: 20, revert: true, opacity: 0.7,
|
||||
stop: function(event, ui) {
|
||||
$('#fileList tr td.filename').addClass('ui-draggable');
|
||||
},
|
||||
});
|
||||
$('#fileList tr[data-type="dir"] td.filename').droppable({
|
||||
//drag/drop of files
|
||||
$('#fileList tr td.filename').draggable(dragOptions);
|
||||
$('#fileList tr[data-type="dir"] td.filename').droppable(folderDropOptions);
|
||||
$('div.crumb').droppable({
|
||||
drop: function( event, ui ) {
|
||||
var file=ui.draggable.text().trim();
|
||||
var target=$(this).text().trim();
|
||||
var target=$(this).attr('data-dir');
|
||||
var dir=$('#dir').val();
|
||||
while(dir.substr(0,1)=='/'){//remove extra leading /'s
|
||||
dir=dir.substr(1);
|
||||
}
|
||||
dir='/'+dir;
|
||||
if(dir.substr(-1,1)!='/'){
|
||||
dir=dir+'/';
|
||||
}
|
||||
if(target==dir){
|
||||
return;
|
||||
}
|
||||
$.ajax({
|
||||
url: 'ajax/move.php',
|
||||
data: "dir="+$('#dir').val()+"&file="+file+'&target='+target,
|
||||
data: "dir="+dir+"&file="+file+'&target='+target,
|
||||
complete: function(data){boolOperationFinished(data, function(){
|
||||
var el=$('#fileList tr[data-file="'+file+'"] td.filename');
|
||||
el.draggable('destroy');
|
||||
FileList.remove(file);
|
||||
});}
|
||||
});
|
||||
}
|
||||
},
|
||||
tolerance: 'pointer'
|
||||
});
|
||||
|
||||
// Sets the file-action buttons behaviour :
|
||||
|
|
@ -234,3 +241,28 @@ function formatDate(date){
|
|||
"July", "August", "September", "October", "November", "December" ];
|
||||
return monthNames[date.getMonth()]+' '+date.getDate()+', '+date.getFullYear()+', '+((date.getHours()<10)?'0':'')+date.getHours()+':'+date.getMinutes();
|
||||
}
|
||||
|
||||
|
||||
//options for file drag/dropp
|
||||
var dragOptions={
|
||||
distance: 20, revert: true, opacity: 0.7,
|
||||
stop: function(event, ui) {
|
||||
$('#fileList tr td.filename').addClass('ui-draggable');
|
||||
}
|
||||
};
|
||||
var folderDropOptions={
|
||||
drop: function( event, ui ) {
|
||||
var file=ui.draggable.text().trim();
|
||||
var target=$(this).text().trim();
|
||||
var dir=$('#dir').val();
|
||||
$.ajax({
|
||||
url: 'ajax/move.php',
|
||||
data: "dir="+dir+"&file="+file+'&target='+dir+'/'+target,
|
||||
complete: function(data){boolOperationFinished(data, function(){
|
||||
var el=$('#fileList tr[data-file="'+file+'"] td.filename');
|
||||
el.draggable('destroy');
|
||||
FileList.remove(file);
|
||||
});}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
|
@ -23,9 +23,9 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<p class="nav">
|
||||
<span class="nav">
|
||||
<?php echo($_['breadcrumb']); ?>
|
||||
</p>
|
||||
</span>
|
||||
|
||||
<table cellspacing="0">
|
||||
<thead>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,8 @@
|
|||
<a href="<?php echo link_to("files", "index.php?dir=/"); ?>"><img src="<?php echo image_path("", "actions/go-home.png"); ?>" alt="Root" /></a>
|
||||
<div class='crumb' data-dir='/'>
|
||||
<a href="<?php echo link_to("files", "index.php?dir=/"); ?>"><img src="<?php echo image_path("", "actions/go-home.png"); ?>" alt="Root"/></a>
|
||||
</div>
|
||||
<?php foreach($_["breadcrumb"] as $crumb): ?>
|
||||
<a href="<?php echo link_to("files", "index.php?dir=".$crumb["dir"]); ?>"><?php echo htmlspecialchars($crumb["name"]); ?></a>
|
||||
<div class='crumb' data-dir='<?php echo $crumb["dir"];?>'>
|
||||
<a href="<?php echo link_to("files", "index.php?dir=".$crumb["dir"]); ?>"><?php echo htmlspecialchars($crumb["name"]); ?></a>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
Loading…
Reference in New Issue