Reimplement filesummary in JS

Fix #993

diff --git a/apps/files/css/files.css b/apps/files/css/files.css
index 7d5fe6445b7d04456a5b456b5d40d9d452606ba9..a9b93dc2deefd87418b6ea1d51e2bde7c7342221 100644 (file)
--- a/apps/files/css/files.css
+++ b/apps/files/css/files.css
@@ -170,7 +170,20 @@ a.action>img { max-height:16px; max-width:16px; vertical-align:text-bottom; }
 }
 
 .summary {
-       opacity: .5;
+       -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
+       filter: alpha(opacity=30);
+       opacity: .3;
+       height: 70px;
+}
+
+.summary:hover, .summary, table tr.summary td {
+       background-color: transparent;
+}
+
+.summary td {
+       padding-top: 8px;
+       padding-bottom: 8px;
+       border-bottom: none;
 }
 
 .summary .info {

diff --git a/apps/files/js/filelist.js b/apps/files/js/filelist.js
index 10801af3eadd7fffd28d021d2c6b5bd1dd35b7bf..e11cc70802bb38ae079931d516dbe7acb5159394 100644 (file)
--- a/apps/files/js/filelist.js
+++ b/apps/files/js/filelist.js
@@ -144,6 +144,7 @@ var FileList={
        remove:function(name){
                $('tr').filterAttr('data-file',name).find('td.filename').draggable('destroy');
                $('tr').filterAttr('data-file',name).remove();
+               FileList.updateFileSummary();
                if($('tr[data-file]').length==0){
                        $('#emptyfolder').show();
                }
@@ -176,6 +177,7 @@ var FileList={
                        $('#fileList').append(element);
                }
                $('#emptyfolder').hide();
+               FileList.updateFileSummary();
        },
        loadingDone:function(name, id){
                var mime, tr=$('tr').filterAttr('data-file',name);
@@ -391,6 +393,7 @@ var FileList={
                                                });
                                                procesSelection();
                                                checkTrashStatus();
+                                               FileList.updateFileSummary();
                                        } else {
                                                $.each(files,function(index,file) {
                                                        var deleteAction = $('tr').filterAttr('data-file',files[i]).children("td.date").children(".action.delete");
@@ -398,6 +401,111 @@ var FileList={
                                                });
                                        }
                                });
+       },
+       createFileSummary: function() {
+               if( $('#fileList tr').length > 0 ) {
+                       var totalDirs = 0;
+                       var totalFiles = 0;
+                       var totalSize = 0;
+
+                       // Count types and filesize
+                       $.each($('tr[data-file]'), function(index, value) {
+                               if ($(value).data('type') === 'dir') {
+                                       totalDirs++;
+                               } else if ($(value).data('type') === 'file') {
+                                       totalFiles++;
+                               }
+                               totalSize += parseInt($(value).data('size'));
+                       });
+
+                       // Get translations
+                       var directoryInfo = n('files', '%n folder', '%n folders', totalDirs);
+                       var fileInfo = n('files', '%n file', '%n files', totalFiles);
+
+                       var infoVars = {
+                               dirs: '<span class="dirinfo">'+directoryInfo+'</span><span class="connector">',
+                               files: '</span><span class="fileinfo">'+fileInfo+'</span>'
+                       }
+
+                       var info = t('files', '{dirs} and {files}', infoVars);
+
+                       // don't show the filesize column, if filesize is NaN (e.g. in trashbin)
+                       if (isNaN(totalSize)) {
+                               var fileSize = '';
+                       } else {
+                               var fileSize = '<td class="filesize">'+humanFileSize(totalSize)+'</td>';
+                       }
+
+                       $('#fileList').append('<tr class="summary"><td><span class="info">'+info+'</span></td>'+fileSize+'<td></td></tr>');
+
+                       var $dirInfo = $('.summary .dirinfo');
+                       var $fileInfo = $('.summary .fileinfo');
+                       var $connector = $('.summary .connector');
+
+                       // Show only what's necessary, e.g.: no files: don't show "0 files"
+                       if ($dirInfo.html().charAt(0) === "0") {
+                               $dirInfo.hide();
+                               $connector.hide();
+                       }
+                       if ($fileInfo.html().charAt(0) === "0") {
+                               $fileInfo.hide();
+                               $connector.hide();
+                       }
+               }
+       },
+       updateFileSummary: function() {
+               var $summary = $('.summary');
+
+               // Check if we should remove the summary to show "Upload something"
+               if ($('#fileList tr').length === 1 && $summary.length === 1) {
+                       $summary.remove();
+               }
+               // If there's no summary create one (createFileSummary checks if there's data)
+               else if ($summary.length === 0) {
+                       FileList.createFileSummary();
+               }
+               // There's a summary and data -> Update the summary
+               else if ($('#fileList tr').length > 1 && $summary.length === 1) {
+                       var totalDirs = 0;
+                       var totalFiles = 0;
+                       var totalSize = 0;
+                       $.each($('tr[data-file]'), function(index, value) {
+                               if ($(value).data('type') === 'dir') {
+                                       totalDirs++;
+                               } else if ($(value).data('type') === 'file') {
+                                       totalFiles++;
+                               }
+                               if ($(value).data('size') !== undefined) {
+                                       totalSize += parseInt($(value).data('size'));
+                               }
+                       });
+
+                       var $dirInfo = $('.summary .dirinfo');
+                       var $fileInfo = $('.summary .fileinfo');
+                       var $connector = $('.summary .connector');
+
+                       // Substitute old content with new translations
+                       $dirInfo.html(n('files', '%n folder', '%n folders', totalDirs));
+                       $fileInfo.html(n('files', '%n file', '%n files', totalFiles));
+                       $('.summary .filesize').html(humanFileSize(totalSize));
+
+                       // Show only what's necessary (may be hidden)
+                       if ($dirInfo.html().charAt(0) === "0") {
+                               $dirInfo.hide();
+                               $connector.hide();
+                       } else {
+                               $dirInfo.show();
+                       }
+                       if ($fileInfo.html().charAt(0) === "0") {
+                               $fileInfo.hide();
+                               $connector.hide();
+                       } else {
+                               $fileInfo.show();
+                       }
+                       if ($dirInfo.html().charAt(0) !== "0" && $fileInfo.html().charAt(0) !== "0") {
+                               $connector.show();
+                       }
+               }
        }
 };
 
@@ -599,4 +707,6 @@ $(document).ready(function(){
        $(window).unload(function (){
                $(window).trigger('beforeunload');
        });
+
+       FileList.createFileSummary();
 });

diff --git a/apps/files/templates/part.list.php b/apps/files/templates/part.list.php
index 0c7d6936697fb5ce09222a47896710307ce15308..3e6f619868de068416d79819c7853beba6fb3174 100644 (file)
--- a/apps/files/templates/part.list.php
+++ b/apps/files/templates/part.list.php
@@ -1,14 +1,5 @@
 <input type="hidden" id="disableSharing" data-status="<?php p($_['disableSharing']); ?>">
-<?php $totalfiles = 0;
-$totaldirs = 0;
-$totalsize = 0; ?>
 <?php foreach($_['files'] as $file):
-       $totalsize += $file['size'];
-       if ($file['type'] === 'dir') {
-               $totaldirs++;
-       } else {
-               $totalfiles++;
-       }
        // the bigger the file, the darker the shade of grey; megabytes*2
        $simple_size_color = intval(160-$file['size']/(1024*1024)*2);
        if($simple_size_color<0) $simple_size_color = 0;
@@ -64,33 +55,4 @@ $totalsize = 0; ?>
                        </span>
                </td>
        </tr>
-<?php endforeach; ?>
-       <?php if ($totaldirs !== 0 || $totalfiles !== 0): ?>
-       <tr class="summary">
-               <td><span class="info">
-                       <?php if ($totaldirs !== 0) {
-                               p($totaldirs.' ');
-                               if ($totaldirs === 1) {
-                                       p($l->t('directory'));
-                               } else {
-                                       p($l->t('directories'));
-                               }
-                       }
-                       if ($totaldirs !== 0 && $totalfiles !== 0) {
-                               p(' & ');
-                       }
-                       if ($totalfiles !== 0) {
-                               p($totalfiles.' ');
-                               if ($totalfiles === 1) {
-                                       p($l->t('file'));
-                               } else {
-                                       p($l->t('files'));
-                               }
-                       } ?>
-               </span></td>
-               <td class="filesize">
-               <?php print_unescaped(OCP\human_file_size($totalsize)); ?>
-               </td>
-               <td></td>
-       </tr>
-       <?php endif;
+<?php endforeach;

diff --git a/apps/files_trashbin/js/trash.js b/apps/files_trashbin/js/trash.js
index b14a7240cbe5d0c211b9665492d302136b8e6428..40c0bdb382945b3d611a20e16c04516f60d02c3e 100644 (file)
--- a/apps/files_trashbin/js/trash.js
+++ b/apps/files_trashbin/js/trash.js
@@ -20,6 +20,7 @@ $(document).ready(function() {
                                                OC.dialogs.alert(result.data.message, t('core', 'Error'));
                                        }
                                        enableActions();
+                                       FileList.updateFileSummary();
                                });
 
                        });
@@ -48,6 +49,7 @@ $(document).ready(function() {
                                                OC.dialogs.alert(result.data.message, t('core', 'Error'));
                                        }
                                        enableActions();
+                                       FileList.updateFileSummary();
                                });
 
                        });