some refactoring of the filebrowsers javascript code
This commit is contained in:
parent
d8ba312679
commit
3892fe5511
|
@ -35,6 +35,7 @@ if( !OC_USER::isLoggedIn()){
|
||||||
// Load the files we need
|
// Load the files we need
|
||||||
OC_UTIL::addStyle( "files", "files" );
|
OC_UTIL::addStyle( "files", "files" );
|
||||||
OC_UTIL::addScript( "files", "files" );
|
OC_UTIL::addScript( "files", "files" );
|
||||||
|
OC_UTIL::addScript( 'files', 'filelist' );
|
||||||
OC_APP::setActiveNavigationEntry( "files_index" );
|
OC_APP::setActiveNavigationEntry( "files_index" );
|
||||||
// Load the files
|
// Load the files
|
||||||
$dir = isset( $_GET['dir'] ) ? $_GET['dir'] : '';
|
$dir = isset( $_GET['dir'] ) ? $_GET['dir'] : '';
|
||||||
|
|
|
@ -0,0 +1,54 @@
|
||||||
|
FileList={
|
||||||
|
update:function(fileListHtml) {
|
||||||
|
$('#fileList').empty().html(fileListHtml);
|
||||||
|
},
|
||||||
|
addFile:function(name,size,lastModified){
|
||||||
|
var html='<tr data-file="'+name+'" data-type="file">';
|
||||||
|
html+='<td class="selection"><input type="checkbox" /></td>';
|
||||||
|
html+='<td class="filename"><a style="background-image:url(img/file.png)" href="download.php?file='+$('#dir').val()+'/'+name+'">'+name+'</a></td>';
|
||||||
|
html+='<td class="filesize">'+size+'</td>';
|
||||||
|
html+='<td class="date">'+lastModified+'</td>';
|
||||||
|
html+='<td class="fileaction"><a href="" title="+" class="dropArrow"></a></td>';
|
||||||
|
html+='</tr>';
|
||||||
|
FileList.insertElement(name,'file',$(html));
|
||||||
|
},
|
||||||
|
addDir:function(name,size,lastModified){
|
||||||
|
var html='<tr data-file="'+name+'" data-type="dir">';
|
||||||
|
html+='<td class="selection"><input type="checkbox" /></td>';
|
||||||
|
html+='<td class="filename"><a style="background-image:url(img/folder.png)" href="index.php?dir='+$('#dir').val()+'/'+name+'">'+name+'</a></td>';
|
||||||
|
html+='<td class="filesize">'+size+'</td>';
|
||||||
|
html+='<td class="date">'+lastModified+'</td>';
|
||||||
|
html+='<td class="fileaction"><a href="" title="+" class="dropArrow"></a></td>';
|
||||||
|
html+='</tr>';
|
||||||
|
|
||||||
|
FileList.insertElement(name,'dir',$(html));
|
||||||
|
},
|
||||||
|
refresh:function(data) {
|
||||||
|
result = jQuery.parseJSON(data.responseText);
|
||||||
|
if(typeof(result.data.breadcrumb) != 'undefined'){
|
||||||
|
updateBreadcrumb(result.data.breadcrumb);
|
||||||
|
}
|
||||||
|
FileList.update(result.data.files);
|
||||||
|
resetFileActionPanel();
|
||||||
|
},
|
||||||
|
remove:function(name){
|
||||||
|
$('tr[data-file="'+name+'"]').remove();
|
||||||
|
},
|
||||||
|
insertElement:function(name,type,element){
|
||||||
|
//find the correct spot to insert the file or folder
|
||||||
|
var fileElements=$('tr[data-file][data-type="'+type+'"]');
|
||||||
|
var pos;
|
||||||
|
if(name.localeCompare($(fileElements[0]).attr('data-file'))<0){
|
||||||
|
pos=0;
|
||||||
|
}else if(name.localeCompare($(fileElements[fileElements.length-1]).attr('data-file'))>0){
|
||||||
|
pos=fileElements.length-1;
|
||||||
|
}else{
|
||||||
|
for(var pos=1;pos<fileElements.length-1;pos++){
|
||||||
|
if(name.localeCompare($(fileElements[pos]).attr('data-file'))>0 && name.localeCompare($(fileElements[pos+1]).attr('data-file'))<0){
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$(fileElements[pos]).after(element);
|
||||||
|
}
|
||||||
|
}
|
|
@ -3,35 +3,34 @@ $(document).ready(function() {
|
||||||
$('#file_newfolder_name').css('width', '14em');
|
$('#file_newfolder_name').css('width', '14em');
|
||||||
$('#file_newfolder_submit').css('width', '3em');
|
$('#file_newfolder_submit').css('width', '3em');
|
||||||
|
|
||||||
// Sets browser table behaviour :
|
// Sets browser table behaviour :
|
||||||
$('.browser tr').hover(
|
$('.browser tr').hover(
|
||||||
function() {
|
function() {
|
||||||
$(this).addClass('mouseOver');
|
$(this).addClass('mouseOver');
|
||||||
},
|
},
|
||||||
function() {
|
function() {
|
||||||
$(this).removeClass('mouseOver');
|
$(this).removeClass('mouseOver');
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
// Sets the file-action buttons behaviour :
|
// Sets the file-action buttons behaviour :
|
||||||
$('td.fileaction a').click(function() {
|
$('td.fileaction a').live('click',function() {
|
||||||
$(this).parent().append($('#file_menu'));
|
$(this).parent().append($('#file_menu'));
|
||||||
$('#file_menu').slideToggle(250);
|
$('#file_menu').slideToggle(250);
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
// Sets the select_all checkbox behaviour :
|
// Sets the select_all checkbox behaviour :
|
||||||
$('#select_all').click(function() {
|
$('#select_all').click(function() {
|
||||||
|
if($(this).attr('checked'))
|
||||||
|
// Check all
|
||||||
|
$('td.selection input:checkbox').attr('checked', true);
|
||||||
|
else
|
||||||
|
// Uncheck all
|
||||||
|
$('td.selection input:checkbox').attr('checked', false);
|
||||||
|
});
|
||||||
|
|
||||||
if($(this).attr('checked'))
|
$('td.selection input:checkbox').live('click',function() {
|
||||||
// Check all
|
|
||||||
$('td.selection input:checkbox').attr('checked', true);
|
|
||||||
else
|
|
||||||
// Uncheck all
|
|
||||||
$('td.selection input:checkbox').attr('checked', false);
|
|
||||||
});
|
|
||||||
|
|
||||||
$('td.selection input:checkbox').click(function() {
|
|
||||||
if(!$(this).attr('checked')){
|
if(!$(this).attr('checked')){
|
||||||
$('#select_all').attr('checked',false);
|
$('#select_all').attr('checked',false);
|
||||||
}else{
|
}else{
|
||||||
|
@ -51,23 +50,29 @@ $(document).ready(function() {
|
||||||
|
|
||||||
// Delete current file
|
// Delete current file
|
||||||
$('#delete_single_file').click(function() {
|
$('#delete_single_file').click(function() {
|
||||||
filename = $('#file_menu').parents('tr:first').find('.filename:first').children('a:first').text();
|
filename = $('#file_menu').parents('tr:first').attr('data-file');
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: 'ajax/delete.php',
|
url: 'ajax/delete.php',
|
||||||
data: "dir="+$('#dir').val()+"&file="+filename,
|
data: "dir="+$('#dir').val()+"&file="+filename,
|
||||||
complete: function(data){
|
complete: function(data){
|
||||||
boolOperationFinished(data, true, $('#file_menu').parents('tr:first'));
|
boolOperationFinished(data, function(){
|
||||||
|
FileList.remove(filename);
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#file_new_dir_submit').click(function() {
|
$('#file_newfolder_submit').click(function() {
|
||||||
$.ajax({
|
$.ajax({
|
||||||
url: 'ajax/newfolder.php',
|
url: 'ajax/newfolder.php',
|
||||||
data: "dir="+$('#dir').val()+"&foldername="+$('#file_new_dir_name').val(),
|
data: "dir="+$('#dir').val()+"&foldername="+$('#file_newfolder_name').val(),
|
||||||
complete: function(data){boolOperationFinished(data, false);}
|
complete: function(data){boolOperationFinished(data, function(){
|
||||||
|
var date=formatDate(new Date());
|
||||||
|
FileList.addDir($('#file_newfolder_name').val(),'0 B',date)
|
||||||
|
});}
|
||||||
});
|
});
|
||||||
|
$('#file_newfolder_submit').fadeOut(250).trigger('vanish');
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#file_newfolder_name').click(function(){
|
$('#file_newfolder_name').click(function(){
|
||||||
|
@ -90,24 +95,10 @@ $(document).ready(function() {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
$('#file_newfolder_submit').click(function() {
|
$('.download').live('click',function(event) {
|
||||||
if($('#file_newfolder_name').val() != '') {
|
|
||||||
$.ajax({
|
|
||||||
url: 'ajax/newfolder.php',
|
|
||||||
data: "dir="+$('#dir').val()+"&foldername="+$('#file_newfolder_name').val(),
|
|
||||||
complete: function(data){
|
|
||||||
boolOperationFinished(data, false);
|
|
||||||
$('#file_newfolder_form')[0].reset();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
$('#file_newfolder_submit').fadeOut(250).trigger('vanish');
|
|
||||||
});
|
|
||||||
|
|
||||||
$('.download').click(function(event) {
|
|
||||||
var files='';
|
var files='';
|
||||||
$('td.selection input:checkbox:checked').parent().parent().children('.filename').each(function(i,element){
|
$('td.selection input:checkbox:checked').parent().parent().each(function(i,element){
|
||||||
files+=';'+$(element).text();
|
files+=';'+$(element).attr('data-file');
|
||||||
});
|
});
|
||||||
files=files.substr(1);//remove leading ;
|
files=files.substr(1);//remove leading ;
|
||||||
|
|
||||||
|
@ -118,10 +109,10 @@ $(document).ready(function() {
|
||||||
return false;
|
return false;
|
||||||
});
|
});
|
||||||
|
|
||||||
$('.delete').click(function(event) {
|
$('.delete').live('click',function(event) {
|
||||||
var files='';
|
var files='';
|
||||||
$('td.selection input:checkbox:checked').parent().parent().children('.filename').each(function(i,element){
|
$('td.selection input:checkbox:checked').parent().parent().each(function(i,element){
|
||||||
files+=';'+$(element).text();
|
files+=';'+$(element).attr('data-file');
|
||||||
});
|
});
|
||||||
files=files.substr(1);//remove leading ;
|
files=files.substr(1);//remove leading ;
|
||||||
|
|
||||||
|
@ -129,7 +120,11 @@ $(document).ready(function() {
|
||||||
url: 'ajax/delete.php',
|
url: 'ajax/delete.php',
|
||||||
data: "dir="+$('#dir').val()+"&files="+files,
|
data: "dir="+$('#dir').val()+"&files="+files,
|
||||||
complete: function(data){
|
complete: function(data){
|
||||||
boolOperationFinished(data, false);
|
boolOperationFinished(data, function(){
|
||||||
|
$('td.selection input:checkbox:checked').parent().parent().each(function(i,element){
|
||||||
|
FileList.remove($(element).attr('data-file'));
|
||||||
|
});
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -152,17 +147,8 @@ $(document).ready(function() {
|
||||||
var size='Pending';
|
var size='Pending';
|
||||||
}
|
}
|
||||||
var date=new Date();
|
var date=new Date();
|
||||||
var monthNames = [ "January", "February", "March", "April", "May", "June",
|
var uploadTime=formatDate(date);
|
||||||
"July", "August", "September", "October", "November", "December" ];
|
FileList.addFile(name,size,uploadTime);
|
||||||
var uploadTime=monthNames[date.getMonth()]+' '+date.getDate()+', '+date.getFullYear()+', '+((date.getHours()<10)?'0':'')+date.getHours()+':'+date.getMinutes();
|
|
||||||
var html='<tr>';
|
|
||||||
html+='<td class="selection"><input type="checkbox" /></td>';
|
|
||||||
html+='<td class="filename"><a style="background-image:url(img/file.png)" href="download.php?file='+$('#dir').val()+'/'+name+'">'+name+'</a></td>';
|
|
||||||
html+='<td class="filesize">'+size+'</td>';
|
|
||||||
html+='<td class="date">'+uploadTime+'</td>';
|
|
||||||
html+='<td class="fileaction"><a href="" title="+" class="dropArrow"></a></td>';
|
|
||||||
html+='</tr>';
|
|
||||||
$('#fileList').append($(html));
|
|
||||||
$('#file_upload_filename').val($('#file_upload_filename').data('upload_text'));
|
$('#file_upload_filename').val($('#file_upload_filename').data('upload_text'));
|
||||||
});
|
});
|
||||||
//save the original upload button text
|
//save the original upload button text
|
||||||
|
@ -193,47 +179,19 @@ function resetFileActionPanel() {
|
||||||
$('#file_action_panel').attr('activeAction', false);
|
$('#file_action_panel').attr('activeAction', false);
|
||||||
}
|
}
|
||||||
|
|
||||||
function boolOperationFinished(data, single, el) {
|
function boolOperationFinished(data, callback) {
|
||||||
result = eval("("+data.responseText+");");
|
result = jQuery.parseJSON(data.responseText);
|
||||||
if(result.status == 'success'){
|
if(result.status == 'success'){
|
||||||
if(single) {
|
callback.call();
|
||||||
$('#file_menu').slideToggle(0);
|
|
||||||
$('body').append($('#file_menu'));
|
|
||||||
$(el).remove();
|
|
||||||
} else {
|
|
||||||
$.ajax({
|
|
||||||
url: 'ajax/list.php',
|
|
||||||
data: "dir="+$('#dir').val(),
|
|
||||||
complete: refreshContents
|
|
||||||
});
|
|
||||||
}
|
|
||||||
} else {
|
} else {
|
||||||
alert(result.data.message);
|
alert(result.data.message);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function refreshContents(data) {
|
|
||||||
result = eval("("+data.responseText+");");
|
|
||||||
if(typeof(result.data.breadcrumb) != 'undefined'){
|
|
||||||
updateBreadcrumb(result.data.breadcrumb);
|
|
||||||
}
|
|
||||||
updateFileList(result.data.files);
|
|
||||||
$('td.fileaction a').click(function() {
|
|
||||||
$(this).parent().append($('#file_menu'));
|
|
||||||
$('#file_menu').slideToggle(250);
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
resetFileActionPanel();
|
|
||||||
}
|
|
||||||
|
|
||||||
function updateBreadcrumb(breadcrumbHtml) {
|
function updateBreadcrumb(breadcrumbHtml) {
|
||||||
$('p.nav').empty().html(breadcrumbHtml);
|
$('p.nav').empty().html(breadcrumbHtml);
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateFileList(fileListHtml) {
|
|
||||||
$('#fileList').empty().html(fileListHtml);
|
|
||||||
}
|
|
||||||
|
|
||||||
function humanFileSize(bytes){
|
function humanFileSize(bytes){
|
||||||
if( bytes < 1024 ){
|
if( bytes < 1024 ){
|
||||||
return bytes+' B';
|
return bytes+' B';
|
||||||
|
@ -251,3 +209,9 @@ function humanFileSize(bytes){
|
||||||
bytes = Math.round( bytes / 1024, 1 );
|
bytes = Math.round( bytes / 1024, 1 );
|
||||||
return bytes+' GB';
|
return bytes+' GB';
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function formatDate(date){
|
||||||
|
var monthNames = [ "January", "February", "March", "April", "May", "June",
|
||||||
|
"July", "August", "September", "October", "November", "December" ];
|
||||||
|
return monthNames[date.getMonth()]+' '+date.getDate()+', '+date.getFullYear()+', '+((date.getHours()<10)?'0':'')+date.getHours()+':'+date.getMinutes();
|
||||||
|
}
|
|
@ -1,5 +1,5 @@
|
||||||
<?php foreach($_["files"] as $file): ?>
|
<?php foreach($_["files"] as $file): ?>
|
||||||
<tr>
|
<tr data-file='<?php echo $file['name'];?>' data-type='<?php echo ($file["type"] == "dir")?'dir':'file'?>'>
|
||||||
<td class="selection"><input type="checkbox" /></td>
|
<td class="selection"><input type="checkbox" /></td>
|
||||||
<td class="filename"><a style="background-image:url(<?php if($file["type"] == "dir") echo mimetype_icon("dir"); else echo mimetype_icon($file["mime"]); ?>)" href="<?php if($file["type"] == "dir") echo link_to("files", "index.php?dir=".$file["directory"]."/".$file["name"]); else echo link_to("files", "download.php?file=".$file["directory"]."/".$file["name"]); ?>" title=""><?php echo htmlspecialchars($file["name"]); ?></a></td>
|
<td class="filename"><a style="background-image:url(<?php if($file["type"] == "dir") echo mimetype_icon("dir"); else echo mimetype_icon($file["mime"]); ?>)" href="<?php if($file["type"] == "dir") echo link_to("files", "index.php?dir=".$file["directory"]."/".$file["name"]); else echo link_to("files", "download.php?file=".$file["directory"]."/".$file["name"]); ?>" title=""><?php echo htmlspecialchars($file["name"]); ?></a></td>
|
||||||
<td class="filesize"><?php echo human_file_size($file["size"]); ?></td>
|
<td class="filesize"><?php echo human_file_size($file["size"]); ?></td>
|
||||||
|
|
Loading…
Reference in New Issue