[gnome-shell/wip/paging-release: 30/90] FolderView adapts spacing. TODO: FolderView -set always the same width, the one of the parent -Fix t
- From: Carlos Soriano <csoriano src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-shell/wip/paging-release: 30/90] FolderView adapts spacing. TODO: FolderView -set always the same width, the one of the parent -Fix t
- Date: Mon, 12 Aug 2013 13:48:32 +0000 (UTC)
commit 8a237576181559f87354b5acc69c95c4563b6ab7
Author: Carlos Soriano <carlos soriano89 gmail com>
Date: Fri Jul 5 16:05:04 2013 +0200
FolderView adapts spacing.
TODO:
FolderView
-set always the same width, the one of the parent
-Fix the Side calculation of the arrow at fodlerView, since now it takes
into account all the grid height. Maybe the best solution is knowing the
parent height, with the updateSpacing(width), but with a
updatedParentSize(width, height) and use that to calculate spacing and
side of the arrow.
js/ui/appDisplay.js | 200 ++++++++++++++++++++++++---------------------------
js/ui/boxpointer.js | 3 +-
js/ui/iconGrid.js | 16 +----
3 files changed, 97 insertions(+), 122 deletions(-)
---
diff --git a/js/ui/appDisplay.js b/js/ui/appDisplay.js
index c7d9d98..7956ecb 100644
--- a/js/ui/appDisplay.js
+++ b/js/ui/appDisplay.js
@@ -33,6 +33,7 @@ const MENU_POPUP_TIMEOUT = 600;
const MAX_COLUMNS = 6;
const INACTIVE_GRID_OPACITY = 77;
+const INACTIVE_GRID_OPACITY_ANIMATION_TIME = 0.15;
const FOLDER_SUBICON_FRACTION = .4;
const MAX_APPS_PAGES = 20;
@@ -136,26 +137,9 @@ 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._items = {};
this._allItems = [];
},
-
- _calculateGridSpacing: function(actor, params) {
- this._grid.setSpacing(this._parentView.getSpacing());
- //this.actor.queue_relayout();
- /*
- if(this._grid.getSpacing() != spacing) {
- this._grid.setSpacing(spacing);
- global.log("Frequent view Diferent");
- global.log("Frequent view spacing " + spacing);
- Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
- this.actor.queue_relayout();
- return false;
- }));
- } else
- global.log("Frequent view NO Diferent " + spacing);*/
- },
_getItemId: function(item) {
return item.get_id();
@@ -240,30 +224,6 @@ const AppPages = new Lang.Class({
this.actor = this._grid.actor;
this._parent = parent;
this._folderIcons = [];
- //this.actor.connect('notify::allocation', Lang.bind(this, this._calculateGridSpacing));
- },
-
- _calculateGridSpacing: function(actor, params) {
-
- let availWidth = actor.allocation.x2 - actor.allocation.x1;
- global.log("All view alloc " + availWidth);
- let itemWidth = this._grid._hItemSize * MAX_COLUMNS;
- let emptyArea = availWidth - itemWidth;
- 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);
- global.log("All view Diferent");
- global.log("All view spacing " + spacing);
- Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
- this.actor.queue_relayout();
- return false;
- }));
- } else
- global.log("All view NO Diferent " + spacing);*/
},
_getItemId: function(item) {
@@ -296,10 +256,20 @@ const AppPages = new Lang.Class({
updateIconOpacities: function(folderOpen) {
for (let id in this._items) {
- if (folderOpen && !this._items[id].actor.checked)
- this._items[id].actor.opacity = INACTIVE_GRID_OPACITY;
- else
- this._items[id].actor.opacity = 255;
+ if (folderOpen && !this._items[id].actor.checked) {
+ let params = { opacity: INACTIVE_GRID_OPACITY,
+ time: INACTIVE_GRID_OPACITY_ANIMATION_TIME,
+ transition: 'easeOutQuad'
+ };
+ Tweener.addTween(this._items[id].actor, params);
+ }
+ else {
+ let params = { opacity: 255,
+ time: INACTIVE_GRID_OPACITY_ANIMATION_TIME,
+ transition: 'easeOutQuad'
+ };
+ Tweener.addTween(this._items[id].actor, params);
+ }
}
},
@@ -336,7 +306,6 @@ const AppPages = new Lang.Class({
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);
}
}
@@ -408,7 +377,6 @@ const PaginationScrollView = new Lang.Class({
let availWidth = box.x2 - box.x1;
let availHeight = box.y2 - box.y1;
let childBox = new Clutter.ActorBox();
- // Get the boxLayout inside scrollView
childBox.x1 = 0;
childBox.y1 = 0;
childBox.x2 = availWidth;
@@ -720,29 +688,6 @@ 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));
- },
-
- _calculateGridSpacing: function(actor, params) {
- let availWidth = actor.allocation.x2 - actor.allocation.x1;
- global.log("frequent view alloc " + availWidth);
- let itemWidth = this._grid._hItemSize * MAX_COLUMNS;
- let emptyArea = availWidth - itemWidth;
- let spacing;
- spacing = Math.max(this._grid._spacing, emptyArea / ( 2 * MAX_COLUMNS));
- spacing = Math.round(spacing);
-
- /*
- if(this._grid.getSpacing() != spacing) {
- this._grid.setSpacing(spacing);
- global.log("Frequent view Diferent");
- global.log("Frequent view spacing " + spacing);
- Meta.later_add(Meta.LaterType.BEFORE_REDRAW, Lang.bind(this, function() {
- this.actor.queue_relayout();
- return false;
- }));
- } else
- global.log("Frequent view NO Diferent " + spacing);*/
},
removeAll: function() {
@@ -804,15 +749,21 @@ const AppDisplayActor = new Lang.Class({
Extends: Clutter.BoxLayout,
vfunc_allocate: function (actor, box, flags) {
- global.log("####~~~~~~~~~~~~~#######");
let availWidth = box.x2 - box.x1;
let availheight = box.y2 - box.y1;
- global.log("Signal to emit " + [availWidth, availheight]);
this.emit('allocated-width-changed', availWidth);
- global.log("Signal emitted " + [availWidth, availheight]);
this.parent(actor, box, flags);
- global.log("ALLOATED " + [availWidth, availheight]);
- global.log("####*****************#######");
+ },
+
+ vfunc_set_container: function(container) {
+ if(this._styleChangedId) {
+ this._container.disconnect(this._styleChangedId);
+ this._styleChangedId = 0;
+ }
+ if(container != null)
+ this._styleChangedId = container.connect('style-changed', Lang.bind(this,
+ function() { this.spacing = this._container.get_theme_node().get_length('spacing'); }));
+ this._container = container;
}
});
Signals.addSignalMethods(AppDisplayActor.prototype);
@@ -976,11 +927,9 @@ const AppDisplay = new Lang.Class({
},
_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..-");
}
});
@@ -1076,45 +1025,87 @@ const FolderIcon = new Lang.Class({
if (!this.actor.mapped && this._popup)
this._popup.popdown();
}));
+ //this.view.actor.connect('notify::allocation', Lang.bind(this, this._updatePopupPosition));
},
_createIcon: function(size) {
return this.view.createFolderIcon(size, this);
},
-
+
+ _updatePopupPosition: function() {
+ if(this._popup) {
+ // Position the popup above or below the source icon
+ if (this._side == St.Side.BOTTOM) {
+ this._popup.actor.show();
+ let closeButtonOffset = -this._popup.closeButton.translation_y;
+ let y = this.actor.y - this._popup.actor.height;
+ let yWithButton = y - closeButtonOffset;
+ this._popup.parentOffset = yWithButton < 0 ? -yWithButton : 0;
+ this._popup.actor.y = Math.max(y, closeButtonOffset);
+ this._popup.actor.hide();
+
+
+ } else {
+ this._popup.actor.y = this.actor.y + this.actor.height;
+ }
+ }
+ },
+
_ensurePopup: function() {
- if (this._popup)
+ if(this._popup){
return;
-
+ }
+ let previousPopUp = this._popup;
let spaceTop = this.actor.y;
let spaceBottom = this._parentView.actor.height - (this.actor.y + this.actor.height);
- let side = spaceTop > spaceBottom ? St.Side.BOTTOM : St.Side.TOP;
-
- this._popup = new AppFolderPopup(this, side);
+ this._side = spaceTop > spaceBottom ? St.Side.BOTTOM : St.Side.TOP;
+ this._popup = new AppFolderPopup(this, this._side);
this._parentView.addFolderPopup(this._popup);
-
- // Position the popup above or below the source icon
- if (side == St.Side.BOTTOM) {
- this._popup.actor.show();
- let closeButtonOffset = -this._popup.closeButton.translation_y;
- let y = this.actor.y - this._popup.actor.height;
- let yWithButton = y - closeButtonOffset;
- this._popup.parentOffset = yWithButton < 0 ? -yWithButton : 0;
- this._popup.actor.y = Math.max(y, closeButtonOffset);
- this._popup.actor.hide();
- } else {
- this._popup.actor.y = this.actor.y + this.actor.height;
- }
-
+ /**
+ * AppDiplay update width for the spacing for all views Allview and
+ * frequent view and folder views calcualte spacing with the items of
+ * icongrid with harcoded values
+ *
+ * Open overview, then iconSizes changes in allview and frequent view
+ * icongrids, which is the actors who are added to the main AppDisplay.
+ * Then a relayout occurs. AppDiplay update width for the spacing for
+ * all views Allview and frequent view and folder views calcualte
+ * spacing with the items of icongrid, which allview and frequetn view
+ * has the new values, but folderview has the hardcoded values, since
+ * folderview icongrid is not still added to the main Actor, and then,
+ * they didn't emitted style changed signal with new valuesw of item
+ * sizes. Then, frequent view and all view has correct spacing and item
+ * size values, and fodler view has incorrect size and spacing values.
+ * Then, we click icon folder, a folderIcon popup is created and added
+ * to the parent actor, then the style changes, and item size changes,
+ * but spacing is the old one. Then, we calculate the position of the
+ * popup, but, the required height is with the old spacing and new item
+ * sizes, so the height is bigger, then the position is bad. Then,
+ * appDisplay allocate all views updating spacing, and set the good
+ * spacing to folder view, then allocate the folder view, but the
+ * positoon of the boxpointer is already calcualted with the old
+ * spacing, so the boxpointer is displaced.
+ *
+ * Solution: ensure style of the grid just after we add it to the parent
+ * and before the calculation of the position.
+ */
+ this.view._grid.actor.ensure_style();
+ this.view.updateSpacing(this._parentWidth);
+ this._updatePopupPosition();
+
this._popup.connect('open-state-changed', Lang.bind(this,
- function(popup, isOpen) {
- if (!isOpen)
- this.actor.checked = false;
- }));
+ function(popup, isOpen) {
+ if (!isOpen)
+ this.actor.checked = false;
+ }));
},
updateFolderViewSpacing: function(width) {
+
this.view.updateSpacing(width);
+ //this.view.actor.ensure_style();
+ this._parentWidth = width;
+ //this._updatePopupPosition();
}
});
@@ -1192,10 +1183,8 @@ const AppFolderPopup = new Lang.Class({
this.actor.show();
this.actor.navigate_focus(null, Gtk.DirectionType.TAB_FORWARD, false);
-
this._boxPointer.setArrowActor(this._source.actor);
- this._boxPointer.show(BoxPointer.PopupAnimation.FADE |
- BoxPointer.PopupAnimation.SLIDE);
+ this._boxPointer.show(BoxPointer.PopupAnimation.FADE);
this._isOpen = true;
this.emit('open-state-changed', true);
@@ -1205,8 +1194,7 @@ const AppFolderPopup = new Lang.Class({
if (!this._isOpen)
return;
- this._boxPointer.hide(BoxPointer.PopupAnimation.FADE |
- BoxPointer.PopupAnimation.SLIDE);
+ this._boxPointer.hide(BoxPointer.PopupAnimation.FADE);
this._isOpen = false;
this.emit('open-state-changed', false);
}
diff --git a/js/ui/boxpointer.js b/js/ui/boxpointer.js
index e1138cd..d6d3f84 100644
--- a/js/ui/boxpointer.js
+++ b/js/ui/boxpointer.js
@@ -219,8 +219,7 @@ const BoxPointer = new Lang.Class({
break;
}
this.bin.allocate(childBox, flags);
-
- //global.log("Box pointer alloc " + [availWidth, availHeight]);
+
if (this._sourceActor && this._sourceActor.mapped) {
this._reposition();
this._updateFlip();
diff --git a/js/ui/iconGrid.js b/js/ui/iconGrid.js
index 98e99b6..5cea9a8 100644
--- a/js/ui/iconGrid.js
+++ b/js/ui/iconGrid.js
@@ -282,7 +282,6 @@ const IconGrid = new Lang.Class({
let children = this._getVisibleChildren();
let availWidth = box.x2 - box.x1;
let availHeight = box.y2 - box.y1;
- global.log("Size " + [availWidth, availHeight]);
let spacing = this._fixedSpacing ? this._fixedSpacing : this._spacing;
let [nColumns, usedWidth] = this._computeLayout(availWidth);
if(this._usePagination) {
@@ -300,18 +299,16 @@ 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");
this.emit('n-pages-changed', this._nPages);
- 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;
- }));
+ }));*/
}
}
- global.log("ICONGRID spacing " + spacing);
let leftPadding;
switch(this._xAlign) {
case St.Align.START:
@@ -339,12 +336,10 @@ const IconGrid = new Lang.Class({
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);
}
@@ -375,18 +370,11 @@ 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);
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
