Fixes to allow widgets to be initially collapsed

This commit is contained in:
Dan Winship 2009-06-29 12:11:52 -04:00
parent 3852176e80
commit ae779c7f20
3 changed files with 73 additions and 41 deletions

View File

@ -76,7 +76,7 @@ Sidebar.prototype = {
addWidget: function(widget) {
let widgetBox;
try {
widgetBox = new WidgetBox.WidgetBox(widget);
widgetBox = new WidgetBox.WidgetBox(widget, this.expanded);
} catch(e) {
logError(e, "Failed to add widget '" + widget + "'");
return;

View File

@ -31,12 +31,22 @@ function Widget() {
Widget.prototype = {
// _init():
//
// Your widget constructor. Receives no arguments. Must define a
// field named "actor" containing the Clutter.Actor to show in
// expanded mode. This actor will be clipped to
// Widget.EXPANDED_WIDTH. Most widgets will also define a field
// named "title" containing the title string to show above the
// widget in the sidebar.
// Your widget constructor. Your constructor function should look
// like:
//
// function MyWidgetType() {
// this._init.apply(this, arguments);
// }
//
// and your _init method should start by doing:
//
// Widget.Widget.prototype._init.apply(this, arguments);
//
// The _init method must define a field named "actor" containing
// the Clutter.Actor to show in expanded mode. This actor will be
// clipped to Widget.EXPANDED_WIDTH. Most widgets will also define
// a field named "title" containing the title string to show above
// the widget in the sidebar.
//
// If you want to have a separate collapsed view, you can define a
// field "collapsedActor" containing the Clutter.Actor to show in
@ -51,6 +61,9 @@ Widget.prototype = {
// the sidebar is collapsed, the widget's expanded view will pop
// out of the sidebar until either the cursor moves out of it,
// or else the widget calls this.activated() on itself.
_init: function (initialState) {
this.state = initialState;
},
// destroy():
//
@ -81,23 +94,22 @@ Widget.prototype = {
// state:
//
// A field set on your widget by the sidebar. Will contain one of
// the Widget.STATE_* values. (Eg, Widget.STATE_EXPANDED). Note
// that this will not be set until *after* _init() is called, so
// you cannot rely on it being set at that point. The widget will
// always initially be in STATE_EXPANDED.
// the Widget.STATE_* values. (Eg, Widget.STATE_EXPANDED).
};
Signals.addSignalMethods(Widget.prototype);
function ClockWidget() {
this._init();
this._init.apply(this, arguments);
}
ClockWidget.prototype = {
__proto__ : Widget.prototype,
_init: function() {
Widget.prototype._init.apply(this, arguments);
this.actor = new Clutter.Text({ font_name: "Sans Bold 16px",
text: "",
// Give an explicit height to ensure
@ -168,7 +180,7 @@ const ITEM_NAME_COLOR = new Clutter.Color();
ITEM_NAME_COLOR.from_pixel(0x000000ff);
function LauncherWidget() {
this._init();
this._init.apply(this, arguments);
}
LauncherWidget.prototype = {
@ -273,13 +285,15 @@ LauncherWidget.prototype = {
};
function AppsWidget() {
this._init();
this._init.apply(this, arguments);
}
AppsWidget.prototype = {
__proto__ : LauncherWidget.prototype,
_init : function() {
Widget.prototype._init.apply(this, arguments);
this.title = "Applications";
this.actor = new Big.Box({ spacing: 2 });
this.collapsedActor = new Big.Box({ spacing: 2});
@ -291,13 +305,15 @@ AppsWidget.prototype = {
};
function DocsWidget() {
this._init();
this._init.apply(this, arguments);
}
DocsWidget.prototype = {
__proto__ : LauncherWidget.prototype,
_init : function() {
Widget.prototype._init.apply(this, arguments);
this.title = "Recent Docs";
this.actor = new Big.Box({ spacing: 2 });

View File

@ -19,17 +19,20 @@ const WIDGETBOX_PADDING = 2;
const ANIMATION_TIME = 0.5;
const POP_IN_LAG = 250; /* milliseconds */
function WidgetBox(widget) {
this._init(widget);
function WidgetBox(widget, expanded) {
this._init(widget, expanded);
}
WidgetBox.prototype = {
_init: function(widget) {
if (widget instanceof Widget.Widget)
_init: function(widget, expanded) {
this.state = expanded ? Widget.STATE_EXPANDED : Widget.STATE_COLLAPSED;
if (widget instanceof Widget.Widget) {
this._widget = widget;
else {
this._widget.state = this.state;
} else {
let ctor = this._ctorFromName(widget);
this._widget = new ctor();
this._widget = new ctor(this.state);
}
if (!this._widget.actor)
@ -37,7 +40,7 @@ WidgetBox.prototype = {
else if (!this._widget.title && !this._widget.collapsedActor)
throw new Error("widget has neither title nor collapsedActor");
this.state = this._widget.state = Widget.STATE_EXPANDED;
this.state = expanded ? Widget.STATE_EXPANDED : Widget.STATE_COLLAPSED;
// The structure of a WidgetBox:
//
@ -128,7 +131,6 @@ WidgetBox.prototype = {
this._activationHandler = this._widget.connect('activated',
Lang.bind(this, this._activationHandler));
}
this._cgroup.hide();
this._egroup = new Clutter.Group({ clip_to_allocation: true });
this._hbox.append(this._egroup, Big.BoxPackFlags.NONE);
@ -148,6 +150,11 @@ WidgetBox.prototype = {
}
this._ebox.append(this._widget.actor, Big.BoxPackFlags.NONE);
if (expanded)
this._setWidgetExpanded();
else
this._setWidgetCollapsed();
},
// Given a name like "imports.ui.widget.ClockWidget", turn that
@ -184,16 +191,25 @@ WidgetBox.prototype = {
this.state = this._widget.state = Widget.STATE_EXPANDING;
},
_expandPart1Complete: function() {
_setWidgetExpanded: function() {
this._cgroup.hide();
this._cbox.x = 0;
this._egroup.show();
if (this._singleActor) {
log(this._widget.actor);
this._widget.actor.unparent();
this._ebox.append(this._widget.actor, Big.BoxPackFlags.NONE);
}
if (this._htitle) {
this._htitle.show();
this._hline.show();
}
},
_expandPart1Complete: function() {
this._cbox.x = 0;
this._setWidgetExpanded();
if (this._widget.expand) {
try {
this._widget.expand();
@ -202,11 +218,6 @@ WidgetBox.prototype = {
}
}
this._egroup.show();
if (this._htitle) {
this._htitle.show();
this._hline.show();
}
this._ebox.x = -Widget.EXPANDED_WIDTH;
Tweener.addTween(this._ebox, { x: 0,
time: ANIMATION_TIME / 2,
@ -228,19 +239,27 @@ WidgetBox.prototype = {
this.state = this._widget.state = Widget.STATE_COLLAPSING;
},
_collapsePart1Complete: function() {
_setWidgetCollapsed: function() {
this._egroup.hide();
this._ebox.x = 0;
this._cgroup.show();
if (this._singleActor) {
this._widget.actor.unparent();
this._cbox.append(this._widget.actor, Big.BoxPackFlags.NONE);
}
if (this._htitle) {
this._htitle.hide();
this._hline.hide();
}
if (this._singleActor) {
log(this._widget.actor);
this._widget.actor.unparent();
this._cbox.append(this._widget.actor, Big.BoxPackFlags.NONE);
}
if (this._vtitle)
this._cbox.height = this._ebox.height;
},
_collapsePart1Complete: function() {
this._ebox.x = 0;
this._setWidgetCollapsed();
if (this._widget.collapse) {
try {
@ -250,10 +269,7 @@ WidgetBox.prototype = {
}
}
this._cgroup.show();
this._cbox.x = -Widget.COLLAPSED_WIDTH;
if (this._vtitle)
this._cbox.height = this._ebox.height;
Tweener.addTween(this._cbox, { x: 0,
time: ANIMATION_TIME / 2,
transition: "easeOutQuad",