After an evaluation, GNOME has moved from Bugzilla to GitLab. Learn more about GitLab.
No new issues can be reported in GNOME Bugzilla anymore.
To report an issue in a GNOME project, go to GNOME GitLab.
Do not go to GNOME Gitlab for: Bluefish, Doxygen, GnuCash, GStreamer, java-gnome, LDTP, NetworkManager, Tomboy.
Bug 602466 - [overview] Lightbox the workspaces rather than setting opacity
[overview] Lightbox the workspaces rather than setting opacity
Status: RESOLVED FIXED
Product: gnome-shell
Classification: Core
Component: general
unspecified
Other All
: Normal normal
: ---
Assigned To: gnome-shell-maint
gnome-shell-maint
Depends on:
Blocks:
 
 
Reported: 2009-11-20 01:47 UTC by Colin Walters
Modified: 2010-06-09 15:08 UTC
See Also:
GNOME target: ---
GNOME version: ---


Attachments
[overview] Lightbox the workspaces rather than setting opacity (2.04 KB, patch)
2009-11-20 01:47 UTC, Colin Walters
reviewed Details | Review
[Overview] Lightbox workspaces on menu popup (2.24 KB, patch)
2010-03-07 23:00 UTC, Florian Müllner
none Details | Review
[Overview] Lightbox workspaces on menu popup (2.62 KB, patch)
2010-03-16 16:07 UTC, Florian Müllner
accepted-commit_now Details | Review
[Lightbox] Use a fade effect to smooth the transition (6.78 KB, patch)
2010-03-17 14:58 UTC, Florian Müllner
reviewed Details | Review
[Overview] Lightbox workspaces on menu popup (2.84 KB, patch)
2010-03-19 00:28 UTC, Florian Müllner
committed Details | Review
[Lightbox] Use a fade effect to smooth the transition (7.10 KB, patch)
2010-03-30 18:11 UTC, Florian Müllner
reviewed Details | Review
[Overview] Lightbox workspaces on menu popup (2.63 KB, patch)
2010-06-06 16:39 UTC, Florian Müllner
accepted-commit_now Details | Review
[Lightbox] Use a fade effect to smooth the transition (10.51 KB, patch)
2010-06-06 22:05 UTC, Florian Müllner
needs-work Details | Review
[Lightbox] Use a fade effect to smooth the transition (10.59 KB, patch)
2010-06-09 14:38 UTC, Florian Müllner
accepted-commit_now Details | Review
[Lightbox] Use a fade effect to smooth the transition (10.42 KB, patch)
2010-06-09 15:05 UTC, Florian Müllner
committed Details | Review

Description Colin Walters 2009-11-20 01:47:44 UTC
Opacity didn't work like I naively thought; we need to draw
a translucent rectangle.
Comment 1 Colin Walters 2009-11-20 01:47:46 UTC
Created attachment 148154 [details] [review]
[overview] Lightbox the workspaces rather than setting opacity
Comment 2 Florian Müllner 2009-11-20 03:44:48 UTC
Review of attachment 148154 [details] [review]:

I agree that the translucent windows looked weired, and lightboxing is way better. There is one small problem with the window captions not being lightboxed, not sure if that falls within the scope of this patch though. Minor nitpicking below.

::: js/ui/workspaces.js
@@ +1506,3 @@
 
+     * @enableLightboxing: Iff true, lightbox all workspaces
+     * setLightBoxAll:

Typo: Iff true ...

@@ +1510,3 @@
+     *
+     * @enableLightboxing: Iff true, lightbox all workspaces
+     * setLightBoxAll:

LightBox is spelled Lightbox everywhere else. Would setLightboxMode be a better name?
Comment 3 Florian Müllner 2010-03-07 23:00:31 UTC
Created attachment 155506 [details] [review]
[Overview] Lightbox workspaces on menu popup

Rebased patch
Comment 4 William Jon McCann 2010-03-07 23:05:45 UTC
Looks way better.  Is it me or are we not dimming the caption text?  Also can we try making it a little dimmer overall?
Comment 5 Florian Müllner 2010-03-07 23:28:30 UTC
(In reply to comment #4)
> Looks way better.  Is it me or are we not dimming the caption text?

No, it's not you (see comment #2) - the same issue occurs with the right-click menu in the app-well.


> Also can we try making it a little dimmer overall?

Yes - is that a change we'd want for all lightboxes (alt-f2, app well right-click menu, more-XXX menus, window preview zoom) or only in this case?
Comment 6 William Jon McCann 2010-03-09 19:06:20 UTC
Yeah all of those would be fine.  Thanks.
Comment 7 Florian Müllner 2010-03-16 16:07:43 UTC
Created attachment 156277 [details] [review]
[Overview] Lightbox workspaces on menu popup

Slightly darken all lightboxes
Comment 8 William Jon McCann 2010-03-16 16:19:55 UTC
Looks pretty good.  Still pretty weird that the captions don't dim.  Not sure we want this until that is fixed.

Also might be good if the effect transition was a bit smoother.  In general we should be using the same fade effect that the window box in the app switcher uses - for more or less everything that appears suddenly.
Comment 9 Florian Müllner 2010-03-17 14:58:11 UTC
Created attachment 156362 [details] [review]
[Lightbox] Use a fade effect to smooth the transition

Add show()/hide() methods to Lightbox, which (optionally) fade the
lightbox. Change all lightboxes to fade in smoothly.
Comment 10 Colin Walters 2010-03-18 18:13:11 UTC
Hmm, is it intentional that we dim the active workspace/window here?  E.g. I have one workspace, one Firefox window and I right click on Firefox, it dims the whole thing?
Comment 11 Florian Müllner 2010-03-19 00:02:58 UTC
(In reply to comment #10)
> Hmm, is it intentional that we dim the active workspace/window here?  E.g. I
> have one workspace, one Firefox window and I right click on Firefox, it dims
> the whole thing?

Are you referring to the appWell? We do lightboxing there as well, but that's unrelated to this patch ("menu" refers only to the "more-apps"/"more-docs" menus)
Comment 12 Florian Müllner 2010-03-19 00:28:47 UTC
Created attachment 156524 [details] [review]
[Overview] Lightbox workspaces on menu popup

Include the dash in the lightboxed area, as its element are disabled anyway.

Some inspiration from bug 613286 - patch depends on attachment 156362 [details] [review].
Comment 13 Colin Walters 2010-03-29 15:27:37 UTC
Review of attachment 156277 [details] [review]:

This looks fine.
Comment 14 Colin Walters 2010-03-29 15:37:05 UTC
Review of attachment 156362 [details] [review]:

::: js/ui/lightbox.js
@@ +95,3 @@
+            this.actor.opacity = 0;
+        if (animate) {
+    show: function(animate) {

I think we should to call Tweener.removeTweens(this.actor) here.  Noticing the  difference in the .2 seconds of animation is admittedly unlikely, but it'd be good to be in the habit of ensuring we only have one transition animation at a time for when it does matter.

@@ +108,3 @@
+            this.actor.opacity = 0;
+        if (animate) {
+    show: function(animate) {

And here.

::: js/ui/runDialog.js
@@ +374,3 @@
+                           time: Lightbox.LIGHTBOX_FADE_TIME,
+                         { opacity: 255,
+        Tweener.addTween(this._group,

I wouldn't expect for other modules to be consuming that constant.  How about adding this._lightBox.getAnimationTime() ?
Comment 15 Colin Walters 2010-03-29 15:37:40 UTC
Review of attachment 156524 [details] [review]:

Looks fine.
Comment 16 Florian Müllner 2010-03-29 15:54:02 UTC
Mmmmh - attachment 156277 [details] [review] and attachment 156524 [details] [review] are mutually exclusive; Jon?
Comment 17 William Jon McCann 2010-03-29 19:37:30 UTC
Review of attachment 156524 [details] [review]:

Seems to have a bug where the first time I go into all-apps everything is dark including the all-apps box.  Also, if I leave the overview while all-apps is up, the overview is all darkened the next time I come back.  Besides that, I think we also want to keep the arrow and possibly the APPLICATIONS text bright while one is in the all-apps box, as per the mockups.  But yes the rest of dash should also go dark when the all-apps is up.
Comment 18 Florian Müllner 2010-03-30 18:11:38 UTC
Created attachment 157522 [details] [review]
[Lightbox] Use a fade effect to smooth the transition

(In reply to comment #14)
> I wouldn't expect for other modules to be consuming that constant.  How about
> adding this._lightBox.getAnimationTime() ?

Mmmmh, not sure - as it's actually the dialog which is animated, I duplicated the constant; there is no real reason for this animation to be of the same length as the "normal" lightbox fade effect.
Comment 19 Owen Taylor 2010-05-03 21:45:39 UTC
I'm not really that satisfied with the lightbox.js version in the two latter patches:

 - What darkens seems a bit random - there is stuff that darkens that shouldn't darken (like text Applications and the arrow that reverses), and then maybe the top panel should darken when it doesn't currently?

 - The fade that happens after the menu appears is distracted to my eyes.

I'm thinking for now maybe we should just go with the simple workspaces-only version, which is already a big improvement. 

We can commit that for now, then if Jon likes the effect of the second two patches we could go that way, but it's going to be difficult to implement not darkening Applications and the arrow - I'm not even really sure how to do that now that the dash background is no longer solid black. We can't just cut a rectangle out of lightbox like we used to do with the task list, we'd have to reparent the actors out and raise them above the lightbox or something.

(Jon: it sounds like you applied the second patch without the third patch - the second patch actually depends on the third patch, though the order you apply them doesn't matter. That's the bug you saw - it was throwing an exception when trying to hide the lightbox.)
Comment 20 Owen Taylor 2010-05-03 21:50:49 UTC
> +                           time: Lightbox.LIGHTBOX_FADE_TIME,
> +                         { opacity: 255,
> +        Tweener.addTween(this._group,
> 
> I wouldn't expect for other modules to be consuming that constant.  How about
> adding this._lightBox.getAnimationTime() ?

IMO, consuming other modules constants is fine when the constant is conceptually public - adding an accessor doesn't really buy anything but more lines of code.

And I also think that we really do want these two times connected - we want the dialog to fade in together with the background fading out, not two unconnected actions.
Comment 21 Owen Taylor 2010-05-03 21:51:54 UTC
Review of attachment 157522 [details] [review]:

Marking as reviewed to get off the unreviewed patches list, since I don't think there's any question about the patch - we just have to decide what part of this we want.
Comment 22 Florian Müllner 2010-05-03 22:21:08 UTC
(In reply to comment #19)
> I'm thinking for now maybe we should just go with the simple workspaces-only
> version, which is already a big improvement. 
> 
> We can commit that for now [...]

OK. There's still the problem of the window captions not being darkened, should we ignore that for now? It's probably slightly easier to fix than the text/arrow issue in the alternative patch, but still not trivial.
Comment 23 Owen Taylor 2010-05-03 22:29:18 UTC
(In reply to comment #22)
> (In reply to comment #19)
> > I'm thinking for now maybe we should just go with the simple workspaces-only
> > version, which is already a big improvement. 
> > 
> > We can commit that for now [...]
> 
> OK. There's still the problem of the window captions not being darkened, should
> we ignore that for now? It's probably slightly easier to fix than the
> text/arrow issue in the alternative patch, but still not trivial.

Hmm. It's certainly a problem to not darken the captions - what isn't darkened is emphasized. (I didn't notice that trying the patch, but I only had one window so the caption may have been under the app menu.)

Can we easily put a black rectangle over the entire workspaces actor? that's slightly wrong in that it darkens the spacers between the workspaces in grid mode , but I doubt that will be very noticeable.
Comment 24 Florian Müllner 2010-05-03 23:06:50 UTC
(In reply to comment #23)
> Can we easily put a black rectangle over the entire workspaces actor? that's
> slightly wrong in that it darkens the spacers between the workspaces in grid
> mode , but I doubt that will be very noticeable.

I did try that at one point - when the overview background was changed from black to dark grey, it was quite noticeable. Maybe I was just too picky, I'll do a patch tomorrow ...
Comment 25 Florian Müllner 2010-05-04 22:45:29 UTC
(In reply to comment #24)
> (In reply to comment #23)
> > Can we easily put a black rectangle over the entire workspaces actor? that's
> > slightly wrong in that it darkens the spacers between the workspaces in grid
> > mode , but I doubt that will be very noticeable.
> 
> I did try that at one point - when the overview background was changed from
> black to dark grey, it was quite noticeable. Maybe I was just too picky, I'll
> do a patch tomorrow ...

OK, it was a while ago so I didn't quite remember what the problem was with that approach: the workspaces actor has a fixed size which will be darkened. That's not too much of a problem with a fully populated grid (as it only affects the spacing between workspaces in that case), but it's very noticeable otherwise (e.g. with two workspaces, the entire lower half is darkened)
Comment 26 Owen Taylor 2010-05-05 15:56:30 UTC
(In reply to comment #25)
> (In reply to comment #24)
> > (In reply to comment #23)
> > > Can we easily put a black rectangle over the entire workspaces actor? that's
> > > slightly wrong in that it darkens the spacers between the workspaces in grid
> > > mode , but I doubt that will be very noticeable.
> > 
> > I did try that at one point - when the overview background was changed from
> > black to dark grey, it was quite noticeable. Maybe I was just too picky, I'll
> > do a patch tomorrow ...
> 
> OK, it was a while ago so I didn't quite remember what the problem was with
> that approach: the workspaces actor has a fixed size which will be darkened.
> That's not too much of a problem with a fully populated grid (as it only
> affects the spacing between workspaces in that case), but it's very noticeable
> otherwise (e.g. with two workspaces, the entire lower half is darkened)

Is it pretty easy to figure out what the bounds of the occupied area are?
Comment 27 Florian Müllner 2010-05-05 16:36:55 UTC
(In reply to comment #26)
> Is it pretty easy to figure out what the bounds of the occupied area are?

Not sure. If setLightboxMode() is made virtual, the views can implement their specific version; of course the grid view has a pretty clear idea of the bounds of that area. The problem here is that the lightbox is always rectangular, but the covered area is not necessarily so (3, 5, 7, 8, ... workspaces)

Probably the easiest approach would be one lightbox per workspace, but managed by the view - not really nice, but should at least work ...
Comment 28 Florian Müllner 2010-06-06 16:39:41 UTC
Created attachment 162871 [details] [review]
[Overview] Lightbox workspaces on menu popup

Rebased on master.
Comment 29 Florian Müllner 2010-06-06 17:07:52 UTC
Finally a decision:

Attachment 156524 [details] pushed as 730681a - [Overview] Lightbox workspaces on menu popup

it is ...
Comment 30 Florian Müllner 2010-06-06 22:05:16 UTC
Created attachment 162891 [details] [review]
[Lightbox] Use a fade effect to smooth the transition

Updated patch, some changes to the previous version:
  - make fade duration parameter instead of a constant
  - change lightbox constructor to take a hash for optional
    parameters

There is a (trivial) dependency on bug 620775 (for the Overview.PANE_FADE_TIME constant.
Comment 31 Dan Winship 2010-06-09 12:36:19 UTC
Review of attachment 162891 [details] [review]:

::: js/ui/lightbox.js
@@ +46,3 @@
+            if (params.inhibitEvents)
+                inhibitEvents = params.inhibitEvents;
+            if (params.width)

use Params.parse from misc.params for all this (see, eg, the _Draggable constructor in dnd.js), and then just refer to "params.width", etc, rather than copying everything to local variables.

@@ +117,3 @@
 
+    show: function() {
+        Tweener.removeTweens(this.actor);

is this necessary? you don't need to removeTweens if you're overwriting a tween with another tween of the same property

(likewise in hide(), and in runDialog.js)

@@ +213,3 @@
     }
 };
+Signals.addSignalMethods(Lightbox.prototype);

you never emit any signals though...

::: js/ui/runDialog.js
@@ +222,3 @@
+                                               { inhibitEvents: true });
+        this._lightbox.connect('hidden', Lang.bind(this, function() {
+            this._group.hide();

currently a no-op since the lightbox doesn't emit signals...
Comment 32 Florian Müllner 2010-06-09 14:38:17 UTC
Created attachment 163201 [details] [review]
[Lightbox] Use a fade effect to smooth the transition

(In reply to comment #31)
> +    show: function() {
> +        Tweener.removeTweens(this.actor);
> 
> is this necessary? you don't need to removeTweens if you're overwriting a tween
> with another tween of the same property
> 
> (likewise in hide(), and in runDialog.js)

Colin suggested adding those calls in comment 14 - remove anyway?
Comment 33 Dan Winship 2010-06-09 15:01:29 UTC
Review of attachment 163201 [details] [review]:

just poked Colin on IRC and he agrees he was confused. so leave out the removeTweens calls.

::: js/ui/lightbox.js
@@ +8,3 @@
+const Tweener = imports.ui.tweener;
+
+const Params = imports.misc.params;

minor nit: js includes should be in a single group (no extra blank line), sorted by namespace (Params before Tweener.)
Comment 34 Florian Müllner 2010-06-09 15:05:38 UTC
Created attachment 163204 [details] [review]
[Lightbox] Use a fade effect to smooth the transition

Removed calls to Tweener.removeTweens according to IRC discussion.
Comment 35 Florian Müllner 2010-06-09 15:08:54 UTC
Attachment 163204 [details] pushed as 528930d - [Lightbox] Use a fade effect to smooth the transition