[gnome-documents] embed: make ErrorBox an actor
- From: Cosimo Cecchi <cosimoc src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gnome-documents] embed: make ErrorBox an actor
- Date: Tue, 26 Jun 2012 17:44:53 +0000 (UTC)
commit 4c9fda75c5cf7995a549de437abec68663e73557
Author: Cosimo Cecchi <cosimoc gnome org>
Date: Fri Jun 22 22:10:00 2012 -0400
embed: make ErrorBox an actor
This allows for more cleanups, with the goal to clean-up the preview
and the embed code.
Also, this makes the errorbox actor nicer, adding some transitions on
fade-in and fade-out.
src/embed.js | 149 ++++++++++++++++++-----------------------------------
src/errorBox.js | 36 ++++++++++++-
src/preview.js | 75 +++++++++++++++++---------
src/selections.js | 31 +++++++++++-
4 files changed, 164 insertions(+), 127 deletions(-)
---
diff --git a/src/embed.js b/src/embed.js
index e018b74..962df96 100644
--- a/src/embed.js
+++ b/src/embed.js
@@ -53,9 +53,6 @@ const ViewEmbed = new Lang.Class({
this._queryErrorId = 0;
this._scrollbarVisibleId = 0;
- this._scrolledWinView = null;
- this._scrolledWinPreview = null;
-
// the embed is a vertical ClutterBox
this._overlayLayout = new Clutter.BinLayout();
this.actor = new Clutter.Box({ layout_manager: this._overlayLayout });
@@ -88,6 +85,10 @@ const ViewEmbed = new Lang.Class({
this._viewLayout.add(this._spinnerBox.actor, Clutter.BinAlignment.FILL, Clutter.BinAlignment.FILL);
this._spinnerBox.actor.lower_bottom();
+ this._errorBox = new ErrorBox.ErrorBox();
+ this._viewLayout.add(this._errorBox.actor, Clutter.BinAlignment.FILL, Clutter.BinAlignment.FILL);
+ this._errorBox.actor.lower_bottom();
+
// also pack a white background to use for spotlights between window modes
this._background =
new Clutter.Rectangle({ color: new Clutter.Color ({ red: 255,
@@ -106,33 +107,7 @@ const ViewEmbed = new Lang.Class({
coordinate: Clutter.BindCoordinate.Y }));
// create the OSD toolbar for selected items, it's hidden by default
- this._selectionToolbar = new Selections.SelectionToolbar();
- let widthConstraint =
- new Clutter.BindConstraint({ source: this._contentsActor,
- coordinate: Clutter.BindCoordinate.WIDTH,
- offset: - 300 });
- this._selectionToolbar.actor.add_constraint(widthConstraint);
- this._selectionToolbar.actor.connect('notify::width', Lang.bind(this,
- function() {
- let width = this._contentsActor.width;
- let offset = 300;
-
- if (width > 1000)
- offset += (width - 1000);
- else if (width < 600)
- offset -= (600 - width);
-
- widthConstraint.offset = - offset;
- }));
-
- this._selectionToolbar.actor.add_constraint(
- new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.X_AXIS,
- source: this._contentsActor,
- factor: 0.50 }));
- this._selectionToolbar.actor.add_constraint(
- new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.Y_AXIS,
- source: this._contentsActor,
- factor: 0.95 }));
+ this._selectionToolbar = new Selections.SelectionToolbar(this._contentsActor);
this._overlayLayout.add(this._selectionToolbar.actor,
Clutter.BinAlignment.FIXED, Clutter.BinAlignment.FIXED);
@@ -158,16 +133,17 @@ const ViewEmbed = new Lang.Class({
_onQueryStatusChanged: function() {
let queryStatus = Global.trackerController.getQueryStatus();
- if (queryStatus)
+ if (queryStatus) {
+ this._errorBox.moveOut();
this._spinnerBox.moveIn();
- else
+ } else {
this._spinnerBox.moveOut();
+ }
},
_onFullscreenChanged: function(controller, fullscreen) {
if (fullscreen) {
- this._previewEmbed = new Preview.PreviewEmbed(this._docModel,
- this._overlayLayout, this._contentsActor, this._scrolledWinPreview);
+ this._previewEmbed = new Preview.PreviewEmbed(this._preview, this._overlayLayout, this._contentsActor);
} else {
this._previewEmbed.destroy();
this._previewEmbed = null;
@@ -204,37 +180,13 @@ const ViewEmbed = new Lang.Class({
this._windowModeChangeFlash();
},
- _destroyScrollPreviewChild: function() {
- let child = this._scrolledWinPreview.get_child();
- if (child)
- child.destroy();
- },
-
- _destroyPreview: function() {
- if (this._loaderCancellable) {
- this._loaderCancellable.cancel();
- this._loaderCancellable = null;
- }
-
- if (this._preview) {
- this._preview.destroy();
- this._preview = null;
- }
-
- this._spinnerBox.moveOut();
- this._docModel = null;
- },
-
_onActiveItemChanged: function() {
let doc = Global.documentManager.getActiveItem();
if (!doc)
return;
- this._destroyPreview();
-
let collection = Global.collectionManager.getItemById(doc.id);
-
if (collection) {
Global.collectionManager.setActiveItem(collection);
Global.modeController.setWindowMode(WindowMode.WindowMode.OVERVIEW);
@@ -258,31 +210,34 @@ const ViewEmbed = new Lang.Class({
return;
}
- this._docModel = EvView.DocumentModel.new_with_document(evDoc);
- this._toolbar.setModel(this._docModel);
+ let docModel = EvView.DocumentModel.new_with_document(evDoc);
+
+ this._toolbar.setModel(docModel);
+ this._preview.setModel(docModel);
+ this._preview.widget.grab_focus();
this._spinnerBox.moveOut();
Global.modeController.setCanFullscreen(true);
- this._preview = new Preview.PreviewView(this._docModel);
-
- this._scrolledWinPreview.add(this._preview.widget);
- this._preview.widget.grab_focus();
},
_prepareForOverview: function() {
- this._destroyPreview();
-
Global.documentManager.setActiveItem(null);
- this._queryErrorId =
- Global.errorHandler.connect('query-error',
- Lang.bind(this, this._onQueryError));
+ if (this._loaderCancellable) {
+ this._loaderCancellable.cancel();
+ this._loaderCancellable = null;
+ }
- if (!this._scrolledWinView) {
+ this._spinnerBox.moveOut();
+ this._errorBox.moveOut();
+
+ if (this._preview)
+ this._preview.setModel(null);
+
+ if (!this._view) {
let grid = new Gtk.Grid({ orientation: Gtk.Orientation.VERTICAL });
this._view = new View.View();
- this._scrolledWinView = this._view.widget;
- grid.add(this._scrolledWinView);
+ grid.add(this._view.widget);
this._loadMore = new LoadMore.LoadMoreButton();
grid.add(this._loadMore.widget);
@@ -291,23 +246,26 @@ const ViewEmbed = new Lang.Class({
this._viewPage = this._notebook.append_page(grid, null);
}
+ this._queryErrorId =
+ Global.errorHandler.connect('query-error',
+ Lang.bind(this, this._onQueryError));
this._adjustmentValueId =
- this._scrolledWinView.vadjustment.connect('value-changed',
- Lang.bind(this, this._onScrolledWinChange));
+ this._view.widget.vadjustment.connect('value-changed',
+ Lang.bind(this, this._onScrolledWinChange));
this._adjustmentChangedId =
- this._scrolledWinView.vadjustment.connect('changed',
- Lang.bind(this, this._onScrolledWinChange));
+ this._view.widget.vadjustment.connect('changed',
+ Lang.bind(this, this._onScrolledWinChange));
this._scrollbarVisibleId =
- this._scrolledWinView.get_vscrollbar().connect('notify::visible',
- Lang.bind(this, this._onScrolledWinChange));
+ this._view.widget.get_vscrollbar().connect('notify::visible',
+ Lang.bind(this, this._onScrolledWinChange));
this._onScrolledWinChange();
this._notebook.set_current_page(this._viewPage);
},
_onScrolledWinChange: function() {
- let vScrollbar = this._scrolledWinView.get_vscrollbar();
- let adjustment = this._scrolledWinView.vadjustment;
+ let vScrollbar = this._view.widget.get_vscrollbar();
+ let adjustment = this._view.widget.vadjustment;
let revealAreaHeight = 32;
// if there's no vscrollbar, or if it's not visible, hide the button
@@ -333,10 +291,7 @@ const ViewEmbed = new Lang.Class({
},
_onQueryError: function(manager, message, exception) {
- this._prepareForPreview();
-
- let errorBox = new ErrorBox.ErrorBox(message, exception.message);
- this._scrolledWinPreview.add_with_viewport(errorBox.widget);
+ this._setError(message, exception.message);
},
_prepareForPreview: function() {
@@ -346,37 +301,35 @@ const ViewEmbed = new Lang.Class({
}
if (this._adjustmentValueId != 0) {
- this._scrolledWinView.vadjustment.disconnect(this._adjustmentValueId);
+ this._view.widget.vadjustment.disconnect(this._adjustmentValueId);
this._adjustmentValueId = 0;
}
if (this._adjustmentChangedId != 0) {
- this._scrolledWinView.vadjustment.disconnect(this._adjustmentChangedId);
+ this._view.widget.vadjustment.disconnect(this._adjustmentChangedId);
this._adjustmentChangedId = 0;
}
if (this._scrollbarVisibleId != 0) {
- this._scrolledWinView.get_vscrollbar().disconnect(this._scrollbarVisibleId);
+ this._view.widget.get_vscrollbar().disconnect(this._scrollbarVisibleId);
this._scrollbarVisibleId = 0;
}
- if (!this._scrolledWinPreview) {
- this._scrolledWinPreview = new Gtk.ScrolledWindow({ hexpand: true,
- vexpand: true,
- shadow_type: Gtk.ShadowType.IN });
- this._scrolledWinPreview.get_style_context().add_class('documents-scrolledwin');
- this._scrolledWinPreview.show();
- this._previewPage = this._notebook.append_page(this._scrolledWinPreview, null);
- } else {
- this._destroyScrollPreviewChild();
+ if (!this._preview) {
+ this._preview = new Preview.PreviewView();
+ this._previewPage = this._notebook.append_page(this._preview.widget, null);
}
this._notebook.set_current_page(this._previewPage);
},
+ _setError: function(primary, secondary) {
+ this._errorBox.update(primary, secondary);
+ this._errorBox.moveIn();
+ },
+
_onLoadError: function(manager, message, exception) {
this._loaderCancellable = null;
this._spinnerBox.moveOut();
- let errorBox = new ErrorBox.ErrorBox(message, exception.message);
- this._scrolledWinPreview.add_with_viewport(errorBox.widget);
+ this._setError(message, exception.message);
}
});
diff --git a/src/errorBox.js b/src/errorBox.js
index 7dc64ba..5aa1d44 100644
--- a/src/errorBox.js
+++ b/src/errorBox.js
@@ -21,7 +21,10 @@
const GLib = imports.gi.GLib;
const Gtk = imports.gi.Gtk;
+const GtkClutter = imports.gi.GtkClutter;
+
const Lang = imports.lang;
+const Tweener = imports.util.tweener;
const _ICON_SIZE = 128;
@@ -44,19 +47,48 @@ const ErrorBox = new Lang.Class({
this.widget.add(this._image);
this._primaryLabel =
- new Gtk.Label({ label: '<big><b>' + GLib.markup_escape_text(primary, -1) + '</b></big>',
+ new Gtk.Label({ label: '',
use_markup: true,
halign: Gtk.Align.CENTER,
valign: Gtk.Align.CENTER });
this.widget.add(this._primaryLabel);
this._secondaryLabel =
- new Gtk.Label({ label: GLib.markup_escape_text(secondary, -1),
+ new Gtk.Label({ label: '',
use_markup: true,
halign: Gtk.Align.CENTER,
valign: Gtk.Align.CENTER });
this.widget.add(this._secondaryLabel);
this.widget.show_all();
+
+ this.actor = new GtkClutter.Actor({ contents: this.widget,
+ opacity: 255 });
+ },
+
+ update: function(primary, secondary) {
+ let primaryMarkup = '<big><b>' + GLib.markup_escape_text(primary, -1) + '</b></big>';
+ let secondaryMarkup = GLib.markup_escape_text(secondary, -1);
+
+ this._primaryLabel.label = primaryMarkup;
+ this._secondaryLabel.label = secondaryMarkup;
+ },
+
+ moveIn: function() {
+ this.actor.raise_top();
+
+ Tweener.addTween(this.actor, { opacity: 255,
+ time: 0.30,
+ transition: 'easeOutQuad' });
+ },
+
+ moveOut: function() {
+ Tweener.addTween(this.actor, { opacity: 0,
+ time: 0.30,
+ transition: 'easeOutQuad',
+ onComplete: function () {
+ this.actor.lower_bottom();
+ },
+ onCompleteScope: this });
}
});
diff --git a/src/preview.js b/src/preview.js
index 646820d..62783a8 100644
--- a/src/preview.js
+++ b/src/preview.js
@@ -39,18 +39,28 @@ const _FULLSCREEN_TOOLBAR_TIMEOUT = 2; // seconds
const PreviewView = new Lang.Class({
Name: 'PreviewView',
- _init: function(model) {
- this._model = model;
+ _init: function() {
+ this._model = null;
+
+ this.widget = new Gtk.ScrolledWindow({ hexpand: true,
+ vexpand: true,
+ shadow_type: Gtk.ShadowType.IN });
+ this.widget.get_style_context().add_class('documents-scrolledwin');
+
+ this._createView();
+ this.widget.show_all();
+ },
- this.widget = EvView.View.new();
- this.widget.set_model(this._model);
- this.widget.show();
+ _createView: function() {
+ this.view = EvView.View.new();
+ this.widget.add(this.view);
+ this.view.show();
- this.widget.connect('button-press-event',
+ this.view.connect('button-press-event',
Lang.bind(this, this._onButtonPressEvent));
- this.widget.connect('button-release-event',
+ this.view.connect('button-release-event',
Lang.bind(this, this._onButtonReleaseEvent));
- this.widget.connect('key-press-event',
+ this.view.connect('key-press-event',
Lang.bind(this, this._onKeyPressEvent));
},
@@ -60,24 +70,24 @@ const PreviewView = new Lang.Class({
if ((keyval == Gdk.KEY_Page_Up) &&
((state & Gdk.ModifierType.CONTROL_MASK) != 0)) {
- this.widget.previous_page();
+ this.view.previous_page();
return true;
}
if ((keyval == Gdk.KEY_Page_Down) &&
((state & Gdk.ModifierType.CONTROL_MASK) != 0)) {
- this.widget.next_page();
+ this.view.next_page();
return true;
}
if (keyval == Gdk.KEY_Page_Up) {
- this.widget.scroll(Gtk.ScrollType.PAGE_BACKWARD, false);
+ this.view.scroll(Gtk.ScrollType.PAGE_BACKWARD, false);
return true;
}
if (keyval == Gdk.KEY_space ||
keyval == Gdk.KEY_Page_Down) {
- this.widget.scroll(Gtk.ScrollType.PAGE_FORWARD, false);
+ this.view.scroll(Gtk.ScrollType.PAGE_FORWARD, false);
return true;
}
@@ -111,8 +121,22 @@ const PreviewView = new Lang.Class({
return false;
},
- destroy: function() {
- this.widget.destroy();
+ setModel: function(model) {
+ if (this._model == model)
+ return;
+
+ if (this.view)
+ this.view.destroy();
+
+ this._createView();
+ this._model = model;
+
+ if (this._model)
+ this.view.set_model(this._model);
+ },
+
+ getModel: function() {
+ return this._model;
}
});
@@ -152,12 +176,11 @@ const PreviewThumbnails = new Lang.Class({
const PreviewEmbed = new Lang.Class({
Name: 'PreviewEmbed',
- _init: function(model, layout, parentActor, scrolledWindow) {
- this._layout = layout;
- this._parentActor = parentActor;
- this._previewScrolledWindow = scrolledWindow;
+ _init: function(previewView, layout, parentActor) {
this._motionTimeoutId = 0;
+ let model = previewView.getModel();
+
this._filter = new Gd.FullscreenFilter();
this._filter.connect('motion-event', Lang.bind(this, this._fullscreenMotionHandler));
this._filter.start();
@@ -165,17 +188,17 @@ const PreviewEmbed = new Lang.Class({
// create thumb bar
this._thumbBar = new PreviewThumbnails(model);
- this._layout.add(this._thumbBar.actor,
+ layout.add(this._thumbBar.actor,
Clutter.BinAlignment.FIXED, Clutter.BinAlignment.FIXED);
let widthConstraint =
- new Clutter.BindConstraint({ source: this._parentActor,
+ new Clutter.BindConstraint({ source: parentActor,
coordinate: Clutter.BindCoordinate.WIDTH,
offset: - 300 });
this._thumbBar.actor.add_constraint(widthConstraint);
this._thumbBar.actor.connect('notify::width', Lang.bind(this,
function() {
- let width = this._parentActor.width;
+ let width = parentActor.width;
let offset = 300;
if (width > 1000)
@@ -188,25 +211,25 @@ const PreviewEmbed = new Lang.Class({
this._thumbBar.actor.add_constraint(
new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.X_AXIS,
- source: this._parentActor,
+ source: parentActor,
factor: 0.50 }));
this._thumbBar.actor.add_constraint(
new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.Y_AXIS,
- source: this._parentActor,
+ source: parentActor,
factor: 0.95 }));
// create toolbar
this._fsToolbar = new MainToolbar.PreviewToolbar();
this._fsToolbar.setModel(model);
- this._layout.add(this._fsToolbar.actor,
+ layout.add(this._fsToolbar.actor,
Clutter.BinAlignment.FIXED, Clutter.BinAlignment.FIXED);
- let vScrollbar = this._previewScrolledWindow.get_vscrollbar();
+ let vScrollbar = previewView.widget.get_vscrollbar();
let sizeConstraint = new Clutter.BindConstraint
({ coordinate: Clutter.BindCoordinate.WIDTH,
- source: this._parentActor,
+ source: parentActor,
offset: (vScrollbar.get_visible() ?
(- (vScrollbar.get_preferred_width()[1])) : 0 ) });
diff --git a/src/selections.js b/src/selections.js
index 4c38b27..50abf89 100644
--- a/src/selections.js
+++ b/src/selections.js
@@ -19,6 +19,7 @@
*
*/
+const Clutter = imports.gi.Clutter;
const EvView = imports.gi.EvinceView;
const Gd = imports.gi.Gd;
const Gdk = imports.gi.Gdk;
@@ -717,9 +718,10 @@ Signals.addSignalMethods(SelectionController.prototype);
const SelectionToolbar = new Lang.Class({
Name: 'SelectionToolbar',
- _init: function() {
+ _init: function(parentActor) {
this._itemListeners = {};
this._insideRefresh = false;
+ this._parentActor = parentActor;
this.widget = new Gtk.Toolbar({ show_arrow: false,
icon_size: Gtk.IconSize.LARGE_TOOLBAR });
@@ -730,6 +732,33 @@ const SelectionToolbar = new Lang.Class({
opacity: 0 });
Utils.alphaGtkWidget(this.actor.get_widget());
+ let widthConstraint =
+ new Clutter.BindConstraint({ source: this._parentActor,
+ coordinate: Clutter.BindCoordinate.WIDTH,
+ offset: - 300 });
+ this.actor.add_constraint(widthConstraint);
+ this.actor.connect('notify::width', Lang.bind(this,
+ function() {
+ let width = this._parentActor.width;
+ let offset = 300;
+
+ if (width > 1000)
+ offset += (width - 1000);
+ else if (width < 600)
+ offset -= (600 - width);
+
+ widthConstraint.offset = - offset;
+ }));
+
+ this.actor.add_constraint(
+ new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.X_AXIS,
+ source: this._parentActor,
+ factor: 0.50 }));
+ this.actor.add_constraint(
+ new Clutter.AlignConstraint({ align_axis: Clutter.AlignAxis.Y_AXIS,
+ source: this._parentActor,
+ factor: 0.95 }));
+
this._leftBox = new Gtk.Box({ orientation: Gtk.Orientation.HORIZONTAL });
this._leftGroup = new Gtk.ToolItem({ child: this._leftBox });
this.widget.insert(this._leftGroup, -1);
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
