From 3892fe55110ce86d742cabcf1422d96115590c5b Mon Sep 17 00:00:00 2001 From: Robin Appelman Date: Sat, 4 Jun 2011 18:44:14 +0200 Subject: [PATCH] some refactoring of the filebrowsers javascript code --- files/index.php | 1 + files/js/filelist.js | 54 ++++++++++++ files/js/files.js | 152 +++++++++++++--------------------- files/templates/part.list.php | 2 +- 4 files changed, 114 insertions(+), 95 deletions(-) create mode 100644 files/js/filelist.js diff --git a/files/index.php b/files/index.php index 7ac3bce6051..79f8b677018 100644 --- a/files/index.php +++ b/files/index.php @@ -35,6 +35,7 @@ if( !OC_USER::isLoggedIn()){ // Load the files we need OC_UTIL::addStyle( "files", "files" ); OC_UTIL::addScript( "files", "files" ); +OC_UTIL::addScript( 'files', 'filelist' ); OC_APP::setActiveNavigationEntry( "files_index" ); // Load the files $dir = isset( $_GET['dir'] ) ? $_GET['dir'] : ''; diff --git a/files/js/filelist.js b/files/js/filelist.js new file mode 100644 index 00000000000..14cce8a3897 --- /dev/null +++ b/files/js/filelist.js @@ -0,0 +1,54 @@ +FileList={ + update:function(fileListHtml) { + $('#fileList').empty().html(fileListHtml); + }, + addFile:function(name,size,lastModified){ + var html=''; + html+=''; + html+=''+name+''; + html+=''+size+''; + html+=''+lastModified+''; + html+=''; + html+=''; + FileList.insertElement(name,'file',$(html)); + }, + addDir:function(name,size,lastModified){ + var html=''; + html+=''; + html+=''+name+''; + html+=''+size+''; + html+=''+lastModified+''; + html+=''; + html+=''; + + 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;pos0 && name.localeCompare($(fileElements[pos+1]).attr('data-file'))<0){ + break; + } + } + } + $(fileElements[pos]).after(element); + } +} \ No newline at end of file diff --git a/files/js/files.js b/files/js/files.js index b8bfb02b2bc..2c595ee4457 100644 --- a/files/js/files.js +++ b/files/js/files.js @@ -3,35 +3,34 @@ $(document).ready(function() { $('#file_newfolder_name').css('width', '14em'); $('#file_newfolder_submit').css('width', '3em'); - // Sets browser table behaviour : - $('.browser tr').hover( - function() { - $(this).addClass('mouseOver'); - }, - function() { - $(this).removeClass('mouseOver'); - } - ); - - // Sets the file-action buttons behaviour : - $('td.fileaction a').click(function() { - $(this).parent().append($('#file_menu')); - $('#file_menu').slideToggle(250); - return false; - }); + // Sets browser table behaviour : + $('.browser tr').hover( + function() { + $(this).addClass('mouseOver'); + }, + function() { + $(this).removeClass('mouseOver'); + } + ); - // Sets the select_all checkbox behaviour : - $('#select_all').click(function() { + // Sets the file-action buttons behaviour : + $('td.fileaction a').live('click',function() { + $(this).parent().append($('#file_menu')); + $('#file_menu').slideToggle(250); + return false; + }); - if($(this).attr('checked')) - // Check all - $('td.selection input:checkbox').attr('checked', true); - else - // Uncheck all - $('td.selection input:checkbox').attr('checked', false); - }); + // Sets the select_all checkbox behaviour : + $('#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); + }); - $('td.selection input:checkbox').click(function() { + $('td.selection input:checkbox').live('click',function() { if(!$(this).attr('checked')){ $('#select_all').attr('checked',false); }else{ @@ -51,23 +50,29 @@ $(document).ready(function() { // Delete current file $('#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({ url: 'ajax/delete.php', data: "dir="+$('#dir').val()+"&file="+filename, complete: function(data){ - boolOperationFinished(data, true, $('#file_menu').parents('tr:first')); + boolOperationFinished(data, function(){ + FileList.remove(filename); + }); } }); return false; }); - $('#file_new_dir_submit').click(function() { + $('#file_newfolder_submit').click(function() { $.ajax({ url: 'ajax/newfolder.php', - data: "dir="+$('#dir').val()+"&foldername="+$('#file_new_dir_name').val(), - complete: function(data){boolOperationFinished(data, false);} + data: "dir="+$('#dir').val()+"&foldername="+$('#file_newfolder_name').val(), + 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(){ @@ -90,24 +95,10 @@ $(document).ready(function() { } }); - $('#file_newfolder_submit').click(function() { - 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) { + $('.download').live('click',function(event) { var files=''; - $('td.selection input:checkbox:checked').parent().parent().children('.filename').each(function(i,element){ - files+=';'+$(element).text(); + $('td.selection input:checkbox:checked').parent().parent().each(function(i,element){ + files+=';'+$(element).attr('data-file'); }); files=files.substr(1);//remove leading ; @@ -118,10 +109,10 @@ $(document).ready(function() { return false; }); - $('.delete').click(function(event) { + $('.delete').live('click',function(event) { var files=''; - $('td.selection input:checkbox:checked').parent().parent().children('.filename').each(function(i,element){ - files+=';'+$(element).text(); + $('td.selection input:checkbox:checked').parent().parent().each(function(i,element){ + files+=';'+$(element).attr('data-file'); }); files=files.substr(1);//remove leading ; @@ -129,7 +120,11 @@ $(document).ready(function() { url: 'ajax/delete.php', data: "dir="+$('#dir').val()+"&files="+files, 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 date=new Date(); - var monthNames = [ "January", "February", "March", "April", "May", "June", - "July", "August", "September", "October", "November", "December" ]; - var uploadTime=monthNames[date.getMonth()]+' '+date.getDate()+', '+date.getFullYear()+', '+((date.getHours()<10)?'0':'')+date.getHours()+':'+date.getMinutes(); - var html=''; - html+=''; - html+=''+name+''; - html+=''+size+''; - html+=''+uploadTime+''; - html+=''; - html+=''; - $('#fileList').append($(html)); + var uploadTime=formatDate(date); + FileList.addFile(name,size,uploadTime); $('#file_upload_filename').val($('#file_upload_filename').data('upload_text')); }); //save the original upload button text @@ -193,47 +179,19 @@ function resetFileActionPanel() { $('#file_action_panel').attr('activeAction', false); } -function boolOperationFinished(data, single, el) { - result = eval("("+data.responseText+");"); +function boolOperationFinished(data, callback) { + result = jQuery.parseJSON(data.responseText); if(result.status == 'success'){ - if(single) { - $('#file_menu').slideToggle(0); - $('body').append($('#file_menu')); - $(el).remove(); - } else { - $.ajax({ - url: 'ajax/list.php', - data: "dir="+$('#dir').val(), - complete: refreshContents - }); - } + callback.call(); } else { 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) { $('p.nav').empty().html(breadcrumbHtml); } -function updateFileList(fileListHtml) { - $('#fileList').empty().html(fileListHtml); -} - function humanFileSize(bytes){ if( bytes < 1024 ){ return bytes+' B'; @@ -250,4 +208,10 @@ function humanFileSize(bytes){ // Wow, heavy duty for owncloud bytes = Math.round( bytes / 1024, 1 ); 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(); } \ No newline at end of file diff --git a/files/templates/part.list.php b/files/templates/part.list.php index 0d3355678c3..f99cd87be24 100644 --- a/files/templates/part.list.php +++ b/files/templates/part.list.php @@ -1,5 +1,5 @@ - + ' data-type=''> )" href="" title="">