webstaff: Teach the grid some new tricks
authorMike Rylander <mrylander@gmail.com>
Mon, 17 Aug 2015 20:14:10 +0000 (16:14 -0400)
committerJason Stephenson <jstephenson@mvlc.org>
Wed, 19 Aug 2015 17:39:20 +0000 (13:39 -0400)
Signed-off-by: Mike Rylander <mrylander@gmail.com>
Signed-off-by: Galen Charlton <gmc@esilibrary.com>
Signed-off-by: Jason Stephenson <jstephenson@mvlc.org>
Open-ILS/src/templates/staff/share/t_autogrid.tt2
Open-ILS/web/js/ui/default/staff/services/grid.js

index 36c5da2..7a85f51 100644 (file)
@@ -9,7 +9,7 @@
   <div class="eg-grid-primary-label">{{mainLabel}}</div>
 
   <div class="btn-group" 
-    is-open="gridMenuIsOpen" ng-if="menuLabel" dropdown>
+    is-open="gridMenuIsOpen" ng-if="menuLabel && showMenu" dropdown>
     <button type="button" class="btn btn-default dropdown-toggle eg-grid-menu-item">
       {{menuLabel}}<span class="caret"></span>
     </button>
@@ -28,7 +28,7 @@
 
   <!-- if no menu label is present, present menu-items as a 
        horizontal row of buttons -->
-  <div class="btn-group" ng-if="!menuLabel">
+  <div class="btn-group" ng-if="!menuLabel && showMenu">
     <button ng-if="!item.checkbox && !item.hidden()"
       class="btn btn-default eg-grid-menu-item"
       ng-repeat="item in menuItems"
   <div class="flex-cell"></div>
 
   <!-- column picker, pager, etc. -->
-  <div class="btn-group column-picker">
+  <div class="btn-group column-picker" ng-show="showPagination || showActions || showPicker">
 
     <!-- first page -->
     <button type="button" class="btn btn-default" 
+      ng-show="showPagination"
       ng-class="{disabled : onFirstPage()}" 
       ng-click="offset(0);collect()"
       title="[% l('Start') %]">
@@ -66,6 +67,7 @@
 
     <!-- previous page -->
     <button type="button" class="btn btn-default" 
+      ng-show="showPagination"
       ng-class="{disabled : onFirstPage()}"
       ng-click="decrementPage()"
       title="[% l('Previous Page') %]">
@@ -75,6 +77,7 @@
     <!-- next page -->
     <!-- todo: paging needs a total count value to be fully functional -->
     <button type="button" class="btn btn-default" 
+      ng-show="showPagination"
       ng-class="{disabled : !hasNextPage()}"
       ng-click="incrementPage()"
       title="[% l('Next Page') %]">
@@ -82,7 +85,7 @@
     </button>
 
     <!-- actions drop-down menu -->
-    <div class="btn-group" ng-if="actionGroups.length > 1 || actionGroups[0].actions.length" dropdown>                                                  
+    <div class="btn-group" ng-show="showActions" ng-if="actionGroups.length > 1 || actionGroups[0].actions.length" dropdown>                                                  
       <button type="button" class="btn btn-default dropdown-toggle">
         [% l('Actions') %] <span class="caret"></span>                       
       </button>                                                              
       </ul>
     </div>
 
-    <div class="btn-group" dropdown is-open="gridRowCountIsOpen">
+    <div class="btn-group" dropdown is-open="gridRowCountIsOpen" ng-show="showPagination">
       <button type="button" title="[% ('Select Row Count') %]"
         class="btn btn-default dropdown-toggle">
         [% l('Rows [_1]', '{{limit()}}') %]
       </ul>
     </div>
 
-    <div class="btn-group" dropdown is-open="gridPageSelectIsOpen">
+    <div class="btn-group" dropdown is-open="gridPageSelectIsOpen" ng-show="showPagination">
       <button type="button" title="[% ('Select Page') %]"
         class="btn btn-default dropdown-toggle">
         [% l('Page [_1]', '{{page()}}') %]
       </ul>
     </div>
 
-    <div class="btn-group" dropdown is-open="gridColumnPickerIsOpen">
+    <div class="btn-group" dropdown is-open="gridColumnPickerIsOpen" ng-show="showPicker">
       <button type="button" 
         class="btn btn-default dropdown-toggle">
         <span class="caret"></span>
   <div ng-transclude></div>
 
   <div class="eg-grid-row eg-grid-header-row">
-    <div class="eg-grid-cell eg-grid-cell-stock">
+    <div class="eg-grid-cell eg-grid-cell-stock" ng-show="showIndex">
       <div title="[% l('Row Number Column') %]">[% l('#') %]</div>
     </div>
     <div class="eg-grid-cell eg-grid-cell-stock" ng-show="canMultiSelect">
         ng-repeat="item in items"
         ng-show="items.length > 0"
         ng-class="{'eg-grid-row-selected' : selected[indexValue(item)]}">
-      <div class="eg-grid-cell eg-grid-cell-stock"
+      <div class="eg-grid-cell eg-grid-cell-stock" ng-show="showIndex"
         ng-click="handleRowClick($event, item)" title="[% l('Row Index') %]">
         <a href ng-show="gridControls.activateItem" 
           ng-click="gridControls.activateItem(item)" style="font-weight:bold">
index 1418106..c93bca2 100644 (file)
@@ -31,6 +31,14 @@ angular.module('egGridMod',
 
             // comma-separated list of supported or disabled grid features
             // supported features:
+            //  startSelected : init the grid with all rows selected by default
+            //  -menu : don't show any menu buttons (or use space for them)
+            //  -picker : don't show the column picker
+            //  -pagination : don't show any pagination elements, and set
+            //                the limit to 1000
+            //  -actions : don't show the actions dropdown
+            //  -index : don't show the row index column (can't use "index"
+            //           as the idField in this case)
             //  -display : columns are hidden by default
             //  -sort    : columns are unsortable by default 
             //  -multisort : sort priorities config disabled by default
@@ -112,6 +120,15 @@ angular.module('egGridMod',
                 $scope.actionGroups = [{actions:[]}]; // Grouped actions for selected items
                 $scope.menuItems = []; // global actions
 
+                $scope.showIndex = ($scope.features.indexOf('-index') == -1);
+
+                $scope.startSelected = $scope.selectAll = ($scope.features.indexOf('startSelected') > -1);
+                $scope.showActions = ($scope.features.indexOf('-actions') == -1);
+                $scope.showPagination = ($scope.features.indexOf('-pagination') == -1);
+                $scope.showPicker = ($scope.features.indexOf('-picker') == -1);
+
+                $scope.showMenu = ($scope.features.indexOf('-menu') == -1);
+
                 // remove some unneeded values from the scope to reduce bloat
 
                 grid.idlClass = $scope.idlClass;
@@ -121,11 +138,16 @@ angular.module('egGridMod',
                 delete $scope.persistKey;
 
                 var stored_limit = 0;
-                if (grid.persistKey) {
-                    var stored_limit = Number(
-                        egCore.hatch.getLocalItem('eg.grid.' + grid.persistKey + '.limit')
-                    );
+                if ($scope.showPagination) {
+                    if (grid.persistKey) {
+                        var stored_limit = Number(
+                            egCore.hatch.getLocalItem('eg.grid.' + grid.persistKey + '.limit')
+                        );
+                    }
+                } else {
+                    stored_limit = 10000; // maybe support "Inf"?
                 }
+
                 grid.limit = Number(stored_limit) || Number($scope.pageSize) || 25;
 
                 grid.indexField = $scope.idField;
@@ -933,6 +955,8 @@ angular.module('egGridMod',
                         $scope.items.push(item)
                         if (grid.controls.itemRetrieved)
                             grid.controls.itemRetrieved(item);
+                        if ($scope.selectAll)
+                            $scope.selected[grid.indexValue(item)] = true
                     }
                 }).finally(function() { 
                     console.debug('egGrid.collect() complete');