[gnome-shell/wip/paging] spacing calculated on AppDisplay

[Carlos Soriano <csoriano src gnome org>]

commit 0d048612d9c5bd0b637a3fae43957ccf7cd6210b
Author: Carlos Soriano <carlos soriano89 gmail com>
Date:   Thu Jul 4 17:54:47 2013 +0200

    spacing calculated on AppDisplay

 js/ui/appDisplay.js |  102 +++++++++++++++++++++++++++++++++++++++++++--------
 js/ui/iconGrid.js   |   19 ++++++++-
 2 files changed, 102 insertions(+), 19 deletions(-)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index afc38e4..8fa9d6d 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -136,7 +136,7 @@ const FolderView = new Lang.Class({
         this._widget.add_actor(this._grid.actor);
         this._box.add(this._widget, { expand: true });
         this.actor.add_actor(this._box);
-        this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
+        //this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
         this._items = {};
         this._allItems = [];
     },
@@ -219,6 +219,15 @@ const FolderView = new Lang.Class({
                 continue;
             this._grid.addItem(this._items[id].actor);
         }
+    },
+    
+    updateSpacing: function(width) {
+        let itemWidth = this._grid._hItemSize * MAX_COLUMNS;
+        let emptyArea = width - itemWidth;
+        let spacing;
+        spacing = Math.max(this._grid._spacing, emptyArea / ( 2 *  MAX_COLUMNS));
+        spacing = Math.round(spacing);
+        this._grid.setSpacing(spacing);
     }
 });
 
@@ -230,7 +239,8 @@ const AppPages = new Lang.Class({
         this.parent();
         this.actor = this._grid.actor;
         this._parent = parent;
-        this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
+        this._folderIcons = [];
+        //this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
     },
     
     _calculateGridSpacing: function(actor, params) {
@@ -268,9 +278,11 @@ const AppPages = new Lang.Class({
     _createItemIcon: function(item) {
         if (item instanceof Shell.App)
             return new AppIcon(item);
-        else if (item instanceof GMenu.TreeDirectory)
-            return new FolderIcon(item, this);
-        else
+        else if (item instanceof GMenu.TreeDirectory) {
+            let folderIcon = new FolderIcon(item, this);
+            this._folderIcons.push(folderIcon);
+            return folderIcon;
+        } else
             return null;
     },
 
@@ -282,10 +294,6 @@ const AppPages = new Lang.Class({
         return (nameA > nameB) ? 1 : (nameA < nameB ? -1 : 0);
     },
     
-    getSpacing: function() {
-        return this._grid.getSpacing()
-    },
-    
     updateIconOpacities: function(folderOpen) {
         for (let id in this._items) {
             if (folderOpen && !this._items[id].actor.checked)
@@ -313,6 +321,24 @@ const AppPages = new Lang.Class({
     
     addFolderPopup: function(popup) {
         this._parent.addFolderPopup(popup);
+    },
+    
+    removeAll: function() {
+        this._folderIcons = [];
+        this.parent();
+    },
+    
+    updateSpacing: function(width) {
+        let itemWidth = this._grid._hItemSize * MAX_COLUMNS;
+        let emptyArea = width - itemWidth;
+        let spacing;
+        spacing = Math.max(this._grid._spacing, emptyArea / ( 2 *  MAX_COLUMNS));
+        spacing = Math.round(spacing);
+        this._grid.setSpacing(spacing);
+        for(let id in this._folderIcons) {
+            global.log("FOLDER ICON " + this._folderIcons[id]);
+            this._folderIcons[id].updateFolderViewSpacing(width);
+        }
     }
 });
 
@@ -368,7 +394,7 @@ const PaginationScrollView = new Lang.Class({
         this._eventBlocker.add_action(this._clickAction);
     },
     
-   vfunc_get_preferred_height: function (forWidht) {
+    vfunc_get_preferred_height: function (forWidht) {
         return [0, 0];
     },
 
@@ -505,6 +531,10 @@ const PaginationScrollView = new Lang.Class({
             }
         } else
             this._parent.goToPage(this._currentPage, action);
+    },
+    
+    updateSpacing: function(width) {
+        this._pages.updateSpacing(width);
     }
     
 });
@@ -671,6 +701,10 @@ const AllView = new Lang.Class({
         this._paginationIndicator.get_child_at_index(this._paginationView.currentPage()).set_checked(false);
         this._paginationView.goToPage(index, action);
         this._paginationIndicator.get_child_at_index(this._paginationView.currentPage()).set_checked(true);
+    },
+    
+    updateSpacing: function(width) {
+        this._paginationView.updateSpacing(width);
     }
 });
 
@@ -686,7 +720,7 @@ const FrequentView = new Lang.Class({
         this.actor.add_actor(this._grid.actor);
 
         this._usage = Shell.AppUsage.get_default();
-        this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
+        //this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
     },
     
     _calculateGridSpacing: function(actor, params) {
@@ -697,7 +731,7 @@ const FrequentView = new Lang.Class({
         let spacing;
         spacing = Math.max(this._grid._spacing, emptyArea / ( 2 *  MAX_COLUMNS));
         spacing = Math.round(spacing);
-        this._grid.setSpacing(spacing);
+        
         /*
         if(this._grid.getSpacing() != spacing) {
             this._grid.setSpacing(spacing);
@@ -723,6 +757,15 @@ const FrequentView = new Lang.Class({
             let appIcon = new AppIcon(mostUsed[i]);
             this._grid.addItem(appIcon.actor, -1);
         }
+    },
+    
+    updateSpacing: function(width) {
+        let itemWidth = this._grid._hItemSize * MAX_COLUMNS;
+        let emptyArea = width - itemWidth;
+        let spacing;
+        spacing = Math.max(this._grid._spacing, emptyArea / ( 2 *  MAX_COLUMNS));
+        spacing = Math.round(spacing);
+        this._grid.setSpacing(spacing);
     }
 });
 
@@ -767,6 +810,20 @@ const ControlsBoxLayout = Lang.Class({
     }
 });
 
+const AppDisplayActor = new Lang.Class({
+    Name: 'AppDisplayActor',
+    Extends: St.BoxLayout,
+    
+    vfunc_allocate: function (box, flags) {
+        let availWidth = box.x2 - box.x1;
+        global.log("Signal to emit " + availWidth);
+        this.emit('allocated-width-changed', availWidth);
+        global.log("Signal emitted " + availWidth);
+        this.parent(box, flags);
+    }
+});
+Signals.addSignalMethods(AppDisplayActor.prototype);
+
 const AppDisplay = new Lang.Class({
     Name: 'AppDisplay',
 
@@ -802,9 +859,10 @@ const AppDisplay = new Lang.Class({
                                  x_expand: true });
         this._views[Views.ALL] = { 'view': view, 'control': button };
 
-        this.actor = new St.BoxLayout({ style_class: 'app-display',
+        this.actor = new AppDisplayActor({ style_class: 'app-display',
                                         vertical: true,
                                         x_expand: true, y_expand: true });
+        this.actor.connect('allocated-width-changed', Lang.bind(this, this._updateViewsSpacing));
 
         this._viewStack = new St.Widget({ layout_manager: new Clutter.BinLayout(),
                                           x_expand: true, y_expand: true });
@@ -914,6 +972,14 @@ const AppDisplay = new Lang.Class({
             if (focused)
                 this.actor.navigate_focus(null, Gtk.DirectionType.TAB_FORWARD, false);
         }
+    },
+    
+    _updateViewsSpacing: function(actor, width) {
+        global.log("AppDsplay updating..-");
+        for (let i = 0; i < this._views.length; i++) {
+            this._views[i].view.updateSpacing(width);
+        }
+        global.log("AppDsplay End updating..-");
     }
 });
 
@@ -978,7 +1044,6 @@ const FolderIcon = new Lang.Class({
 
     _init: function(dir, parentView) {
         this._dir = dir;
-        this._parentView = parentView;
 
         this.actor = new St.Button({ style_class: 'app-well-app app-folder',
                                      button_mask: St.ButtonMask.ONE,
@@ -987,6 +1052,7 @@ const FolderIcon = new Lang.Class({
                                      x_fill: true,
                                      y_fill: true });
         this.actor._delegate = this;
+        this._parentView = parentView;
 
         let label = this._dir.get_name();
         this.icon = new IconGrid.BaseIcon(label,
@@ -994,7 +1060,7 @@ const FolderIcon = new Lang.Class({
         this.actor.set_child(this.icon.actor);
         this.actor.label_actor = this.icon.label;
 
-        this.view = new FolderView(parentView);
+        this.view = new FolderView();
         this.view.actor.reactive = false;
         _loadCategory(dir, this.view);
         this.view.loadGrid();
@@ -1012,7 +1078,7 @@ const FolderIcon = new Lang.Class({
     },
 
     _createIcon: function(size) {
-        return this.view.createFolderIcon(size);
+        return this.view.createFolderIcon(size, this);
     },
 
     _ensurePopup: function() {
@@ -1045,6 +1111,10 @@ const FolderIcon = new Lang.Class({
                     this.actor.checked = false;
             }));
     },
+    
+    updateFolderViewSpacing: function(width) {
+        this.view.updateSpacing(width);
+    }
 });
 
 const AppFolderPopup = new Lang.Class({
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index 030f976..a3332e0 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -300,6 +300,7 @@ const IconGrid = new Lang.Class({
             if (this._rowLimit)
                 nRows = Math.min(nRows, this._rowLimit);
             let oldNPages = this._nPages;
+            global.log("NPAGES!!! " + this._nPages);
             this._calculatePaginationValues(availHeightPerPage, nColumns, nRows);
             if(oldNPages != this._nPages) {
                 global.log("Next relayout");
@@ -335,13 +336,15 @@ const IconGrid = new Lang.Class({
             let childBox = this._calculateChildrenBox(children[i], x, y);
             if(!this._usePagination) {
                 if (this._rowLimit && rowIndex >= this._rowLimit ||
-                        this._fillParent && childBox.y2 > availHeight) {
+                        this._fillParent && childBox.y2 >= availHeight) {
                     this._grid.set_skip_paint(children[i], true);
                 } else {
+                    global.log("childBox.y2 "+ [childBox.y1, childBox.y2, availHeight]);
                     children[i].allocate(childBox, flags);
                     this._grid.set_skip_paint(children[i], false);
                 }
             } else {
+                global.log("PAginatio childBox.y2 "+ [childBox.y1, childBox.y2, availHeight]);
                 children[i].allocate(childBox, flags);
                 this._grid.set_skip_paint(children[i], false);
             }
@@ -372,8 +375,18 @@ const IconGrid = new Lang.Class({
     
     _calculatePaginationValues: function (availHeightPerPage, nColumns, nRows) {
         let spacing = this._fixedSpacing ? this._fixedSpacing : this._spacing;
+        global.log("### CALCULATING PAGES ###");
+        global.log("availHeightPerPage "+ availHeightPerPage);
+        global.log("nColumns "+ nColumns);
+        global.log("nRows "+ nRows);
+        global.log("spacing "+ spacing);
         this._spacePerRow = this._vItemSize + spacing;
+        global.log("this._spacePerRow "+ this._spacePerRow);
         this._rowsPerPage = Math.floor(availHeightPerPage / this._spacePerRow);
+        // Check if deleting spacing from bottom there's enough space for another row
+        let spaceWithOneMoreRow = (this._rowsPerPage + 1) * this._spacePerRow - spacing;
+        this._rowsPerPage = spaceWithOneMoreRow <= availHeightPerPage? this._rowsPerPage + 1 : 
this._rowsPerPage;
+        global.log("this._rowsPerPage "+ this._rowsPerPage);
         this._nPages = Math.ceil(nRows / this._rowsPerPage);
         this._spaceBetweenPages = availHeightPerPage - (this._rowsPerPage * (this._vItemSize + spacing));
         this._spaceBetweenPagesTotal = this._spaceBetweenPages * (this._nPages);
@@ -472,10 +485,10 @@ const IconGrid = new Lang.Class({
     setSpacing: function(spacing) {
         if(this._fixedSpacing != spacing) {
             this._fixedSpacing = spacing;
-            Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
+            /*Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
                 this._grid.queue_relayout();
                 return false;
-            }));
+            }));*/
         }
         
     },