[gnome-shell/wip/paging-release: 11/11] Calculation of responsive grid outside allocation

[Carlos Soriano <csoriano src gnome org>]

commit 958029921c78497366c377cd1b61c7a0d1f954e9
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Fri Aug 2 13:52:13 2013 +0200

    Calculation of responsive grid outside allocation

 js/ui/appDisplay.js    |   26 ++++---------------
 js/ui/iconGrid.js      |   62 ++++++++++++++++++++++-------------------------
 js/ui/searchDisplay.js |    2 +-
 3 files changed, 36 insertions(+), 54 deletions(-)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index c160f61..19620be 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -72,7 +72,10 @@ const AlphabeticalView = new Lang.Class({
     _init: function(gridParams) {
         gridParams = Params.parse(gridParams,  { xAlign: St.Align.MIDDLE,
                                                  columnLimit: MAX_COLUMNS,
-                                                 usePagination: false });
+                                                 minRows: MIN_ROWS,
+                                                 minColumns: MIN_COLUMNS,
+                                                 usePagination: false,
+                                                 useSurroundingSpacing: false });
         this._grid = new IconGrid.IconGrid(gridParams);
         // Standard hack for ClutterBinLayout
         this._grid.actor.x_expand = true;
@@ -128,7 +131,7 @@ const AppPages = new Lang.Class({
     Extends: AlphabeticalView,
    
     _init: function(parent) {
-        this.parent({ usePagination: true});
+        this.parent({ usePagination: true, useSurroundingSpacing: true});
         this.actor = this._grid.actor;
         this._parent = parent;
         this._folderIcons = [];
@@ -194,10 +197,6 @@ const AppPages = new Lang.Class({
         return this._grid.getPagePosition(pageNumber);
     },
     
-    setViewForPageSize: function(view) {
-        this._grid._viewForPageSize= view;
-    },
-    
     addFolderPopup: function(popup) {
         this._parent.addFolderPopup(popup);
     },
@@ -369,7 +368,6 @@ const PaginationScrollView = new Lang.Class({
         this._stack = new St.Widget({ layout_manager: new Clutter.BinLayout() });        
         this._box = new St.BoxLayout({ vertical: true });
         this._pages = new AppPages(this);
-        this._pages.setViewForPageSize(this);
         
         this._stack.add_actor(this._pages.actor);
         this._eventBlocker = new St.Widget({ x_expand: true, y_expand: true });
@@ -1107,16 +1105,7 @@ const FolderView = new Lang.Class({
     Extends: AlphabeticalView,
 
     _init: function() {
-        this.parent({ xAlign: St.Align.MIDDLE});
-
-        /*this._grid = new IconGrid.IconGrid({ xAlign: St.Align.MIDDLE,
-                                             columnLimit: MAX_COLUMNS,
-                                             minRows: MIN_ROWS,
-                                             minColumns: MIN_COLUMNS,
-                                             useSurroundingSpacing: true});*/
-        // If it not expand, the parent doesn't take into account its preferred_width when allocating
-        // the second time it allocates, so we apply the "Standard hack for ClutterBinLayout"
-        this._grid.actor.x_expand = true;
+        this.parent({ useSurroundingSpacing: true });
         
         this.actor = new St.ScrollView({overlay_scrollbars: true});
         this.actor.set_policy(Gtk.PolicyType.NEVER, Gtk.PolicyType.AUTOMATIC);
@@ -1125,9 +1114,6 @@ const FolderView = new Lang.Class({
         this._widget.add_child(this._grid.actor);
         this._box.add_actor(this._widget);
         this.actor.add_actor(this._box);
-        this._items = {};
-        this._allItems = [];
-        
         this._boxPointerOffsets = {};
     },
 
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index 185060b..46585d1 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -209,9 +209,6 @@ const IconGrid = new Lang.Class({
         
         if(this._usePagination) {
             this._nPages = 0;
-            // Set this variable properly pointing to the scrollView containing the grid
-            // before allocate function is called
-            this._viewForPageSize = null;
             this._firstPagesItems = [];
         }
         this.actor = new St.BoxLayout({ style_class: 'icon-grid',
@@ -302,33 +299,6 @@ const IconGrid = new Lang.Class({
         let availHeight = box.y2 - box.y1;
         let spacing = this.getSpacing();
         let [nColumns, usedWidth] = this._computeLayout(availWidth);
-        if(this._usePagination) {
-            // Calculate icongrid box inside the scrollView
-            let parentBox = this._viewForPageSize.allocation;
-            let gridBox = this.actor.get_theme_node().get_content_box(parentBox);
-            let customBox = this._grid.get_theme_node().get_content_box(gridBox);
-            let availHeightPerPage = customBox.y2 - customBox.y1;
-            let nRows;
-            if (nColumns > 0)
-                nRows = Math.ceil(children.length / nColumns);
-            else
-                nRows = 0;
-            if (this._rowLimit)
-                nRows = Math.min(nRows, this._rowLimit);
-            let oldHeightUsedPerPage = this.usedHeightPerPage();
-            let oldNPages = this._nPages;
-            this._calculatePaginationValues(availHeightPerPage, nColumns, nRows);
-            // Take into account when the number of pages changed (then the height of the entire grid 
changed for sure)
-            // and also when the spacing is changed, sure the hegiht per page changed and the entire grid 
height changes, althougt
-            // maybe the number of pages doesn't change
-            if(oldNPages != this._nPages || oldHeightUsedPerPage != this.usedHeightPerPage()) {
-                this.emit('n-pages-changed', this._nPages);
-                Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
-                    this._grid.queue_relayout();
-                    return false;
-                }));
-            }
-        }
         let leftEmptySpace;
         switch(this._xAlign) {
             case St.Align.START:
@@ -387,10 +357,22 @@ const IconGrid = new Lang.Class({
             } else {
                 x += this.getHItemSize() + spacing;
             }
-        }       
+        }
     },
     
-    _calculatePaginationValues: function (availHeightPerPage, nColumns, nRows) {
+    _calculatePaginationValues: function (availWidthPerPage, availHeightPerPage) {
+        let [nColumns, usedWidth] = this._computeLayout(availWidthPerPage);
+        let nRows;
+        let children = this._getVisibleChildren();
+        if (nColumns > 0)
+            nRows = Math.ceil(children.length / nColumns);
+        else
+            nRows = 0;
+        if (this._rowLimit)
+            nRows = Math.min(nRows, this._rowLimit);
+        let oldHeightUsedPerPage = this.usedHeightPerPage();
+        let oldNPages = this._nPages;
+        
         let spacing = this.getSpacing();
         this._spacePerRow = this.getVItemSize() + spacing;
         // We want to contain the grid inside the parent box with padding
@@ -403,6 +385,17 @@ const IconGrid = new Lang.Class({
         this._spaceBetweenPages = availHeightPerPage - (this._rowsPerPage * (this.getVItemSize() + spacing) 
- spacing);
         this._spaceBetweenPagesTotal = this._spaceBetweenPages * (this._nPages);
         this._childrenPerPage = nColumns * this._rowsPerPage;
+   
+        // Take into account when the number of pages changed (then the height of the entire grid changed 
for sure)
+        // and also when the spacing is changed, sure the hegiht per page changed and the entire grid height 
changes, althougt
+        // maybe the number of pages doesn't change
+        if(oldNPages != this._nPages || oldHeightUsedPerPage != this.usedHeightPerPage()) {
+            this.emit('n-pages-changed', this._nPages);
+            /*Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
+                this._grid.queue_relayout();
+                return false;
+            }));*/
+        }
     },
     
     _calculateChildrenBox: function(child, x, y, box) {
@@ -451,7 +444,7 @@ const IconGrid = new Lang.Class({
         this._vItemSize = themeNode.get_length('-shell-grid-vertical-item-size') || ICON_SIZE;
         this._grid.queue_relayout();
     },
-
+    
     columnsForWidth: function(rowWidth) {
         return this._computeLayout(rowWidth)[0];
     },
@@ -602,6 +595,7 @@ const IconGrid = new Lang.Class({
     calculateResponsiveGrid: function(availWidth, availHeight) {
         this._fixedHItemSize = this._hItemSize;
         this._fixedVItemSize = this._vItemSize;
+
         let spacing = this.maxSpacingForWidthHeight(availWidth, availHeight);
         this.setSpacing(spacing);
         if(this._useSurroundingSpacing)
@@ -643,6 +637,8 @@ const IconGrid = new Lang.Class({
         
         let scale = Math.min(this._fixedHItemSize, this._fixedVItemSize) / Math.max(this._hItemSize, 
this._vItemSize);
         this.updateChildrenScale(scale);
+        if(this._usePagination)
+            this._calculatePaginationValues(availWidth, availHeight);
     },
     /**
      * FLORIAN REVIEW
diff --git a/js/ui/searchDisplay.js b/js/ui/searchDisplay.js
index 9875af5..a7a1cde 100644
--- a/js/ui/searchDisplay.js
+++ b/js/ui/searchDisplay.js
@@ -320,7 +320,7 @@ const GridSearchResults = new Lang.Class({
     },
 
     _getMaxDisplayedResults: function() {
-        return this._grid.childrenInRow(this._bin.width) * this._grid.getRowLimit();
+        return this._grid.columnsForWidth(this._bin.width) * this._grid.getRowLimit();
     },
 
     _renderResults: function(metas) {