Added pagination for mediafiles (fixes #3448)

openslides/mediafiles/static/js/mediafiles/list.js

@@ -106,6 +106,15 @@ angular.module('OpenSlidesApp.mediafiles.list', [
              display_name: gettext('Uploaded by')},
         ];
 
+        // pagination
+        $scope.currentPage = 1;
+        $scope.itemsPerPage = 25;
+        $scope.limitBegin = 0;
+        $scope.pageChanged = function() {
+            $scope.limitBegin = ($scope.currentPage - 1) * $scope.itemsPerPage;
+            $scope.gotoTop();
+        };
+
         // open new/edit dialog
         $scope.openDialog = function (mediafile) {
             ngDialog.open(MediafileForm.getDialog(mediafile));

openslides/mediafiles/static/templates/mediafiles/mediafile-list.html

@@ -138,11 +138,18 @@
     </div>
   </div>
 
-  <div class="spacer-top-lg italic">
+  <div class="spacer-top-lg italic row">
+    <div class="col-md-6">
       {{ mediafilesFiltered.length }} /
       {{ mediafiles.length }} {{ "files" | translate }}<span ng-if="(mediafiles|filter:{selected:true}).length > 0">,
       {{(mediafiles|filter:{selected:true}).length}} {{ "selected" | translate }}</span>
     </div>
+    <div class="col-md-6" ng-show="mediafilesFiltered.length > itemsPerPage">
+      <span class="pull-right">
+        <translate>Page</translate> {{ currentPage }} / {{ Math.ceil(mediafilesFiltered.length/itemsPerPage) }}
+      </span>
+    </div>
+  </div>
 
   <div id="mediafile-table" class="os-table container-fluid">
     <div class="row header-row">
@@ -240,7 +247,8 @@
       | osFilter: filter.filterString : filter.getObjectQueryString
       | filter: {filetype: (filter.booleanFilters.isPdf.value ? 'application/pdf' : (filter.booleanFilters.isPdf.value === false ? '!application/pdf' : ''))}
       | filter: {hidden: filter.booleanFilters.isHidden.value}
-      | orderByEmptyLast: sort.column : sort.reverse )">
+      | orderByEmptyLast: sort.column : sort.reverse)
+      | limitTo: itemsPerPage : limitBegin">
 
       <!-- select column -->
       <div ng-show="isSelectMode" os-perms="mediafiles.can_manage" class="col-xs-1 centered">
@@ -358,4 +366,17 @@
 
     </div><!-- end data row -->
   </div><!-- end os-table -->
+
+  <ul uib-pagination
+      ng-show="mediafilesFiltered.length > itemsPerPage"
+      total-items="mediafilesFiltered.length"
+      items-per-page="itemsPerPage"
+      ng-model="currentPage"
+      ng-change="pageChanged()"
+      class="pagination-sm"
+      direction-links="false"
+      boundary-links="true"
+      first-text="&laquo;"
+      last-text="&raquo;">
+  </ul>
 </div>