gdm: Adjust timed-login indicator

Until the recent style changes, the same element was used to indicate
both item focus and progress for timed logins. As focus is now indicated
by the item's background style, rename the indicator from focusBin to
timedLoginIndicator and make some minor adjustments to better fit the
new style:
  - move it next to the icon below the text
  - give it a white color and a shadow
  - update animation to grow from the left instead of the center

https://bugzilla.gnome.org/show_bug.cgi?id=660913
This commit is contained in:
Florian Müllner 2012-07-14 00:43:58 +02:00
parent bfea41b771
commit 6a615f30dc
2 changed files with 33 additions and 33 deletions

View File

@ -2083,17 +2083,17 @@ StButton.popup-menu-item:insensitive {
background-color: rgba(255,255,255,0.33);
}
.login-dialog-user-list-item-vertical-layout {
spacing: 2px;
.login-dialog-user-list-item-text-box {
padding: 0 0.5em;
}
.login-dialog-user-list-item .login-dialog-user-list-item-focus-bin {
.login-dialog-user-list-item .login-dialog-timed-login-indicator {
background-color: rgba(0,0,0,0.0);
height: 2px;
}
.login-dialog-user-list-item:focus .login-dialog-user-list-item-focus-bin {
background-color: #666666;
.login-dialog-user-list-item:focus .login-dialog-timed-login-indicator {
background-color: #8b8b8b;
}
.login-dialog-user-list-item-icon {

View File

@ -88,42 +88,34 @@ const UserListItem = new Lang.Class({
this._userChangedId = this.user.connect('changed',
Lang.bind(this, this._onUserChanged));
this._verticalBox = new St.BoxLayout({ style_class: 'login-dialog-user-list-item-vertical-layout',
vertical: true });
let layout = new St.BoxLayout({ vertical: false });
this.actor = new St.Button({ style_class: 'login-dialog-user-list-item',
can_focus: true,
child: this._verticalBox,
child: layout,
reactive: true,
x_align: St.Align.START,
x_fill: true });
let layout = new St.BoxLayout({ vertical: false });
this._verticalBox.add(layout,
{ y_fill: true,
x_fill: true,
expand: true });
this._focusBin = new St.Bin({ style_class: 'login-dialog-user-list-item-focus-bin' });
this._focusBin.scale_gravity = Clutter.Gravity.CENTER;
this._verticalBox.add(this._focusBin,
{ x_fill: true,
x_align: St.Align.MIDDLE,
y_fill: false,
expand: true });
this._iconBin = new St.Bin();
layout.add(this._iconBin);
let textLayout = new St.BoxLayout({ style_class: 'login-dialog-user-list-item-text-box',
vertical: true });
layout.add(textLayout,
{ y_fill: false,
y_align: St.Align.MIDDLE,
expand: true });
layout.add(textLayout, { expand: true });
this._nameLabel = new St.Label({ text: this.user.get_real_name(),
style_class: 'login-dialog-user-list-item-name' });
textLayout.add(this._nameLabel);
textLayout.add(this._nameLabel,
{ y_fill: false,
y_align: St.Align.MIDDLE,
expand: true });
this._timedLoginIndicator = new St.Bin({ style_class: 'login-dialog-timed-login-indicator',
scale_x: 0 });
textLayout.add(this._timedLoginIndicator,
{ x_fill: true,
x_align: St.Align.MIDDLE,
y_fill: false,
y_align: St.Align.END });
this._updateIcon();
@ -199,12 +191,11 @@ const UserListItem = new Lang.Class({
return GdmUtil.fadeInActor(this._nameLabel);
},
showFocusAnimation: function(time) {
showTimedLoginIndicator: function(time) {
let hold = new Batch.Hold();
Tweener.removeTweens(this._focusBin);
this._focusBin.scale_x = 0.;
Tweener.addTween(this._focusBin,
this.hideTimedLoginIndicator();
Tweener.addTween(this._timedLoginIndicator,
{ scale_x: 1.,
time: time,
transition: 'linear',
@ -214,6 +205,11 @@ const UserListItem = new Lang.Class({
onCompleteScope: this
});
return hold;
},
hideTimedLoginIndicator: function() {
Tweener.removeTweens(this._timedLoginIndicator);
this._timedLoginIndicator.scale_x = 0.;
}
});
Signals.addSignalMethods(UserListItem.prototype);
@ -310,6 +306,7 @@ const UserList = new Lang.Class({
item.actor.reactive = false;
item.actor.can_focus = false;
item.syncStyleClasses();
item._timedLoginIndicator.scale_x = 0.;
if (item != exception)
tasks.push(function() {
return GdmUtil.fadeOutActor(item.actor);
@ -1019,7 +1016,7 @@ const LoginDialog = new Lang.Class({
_showTimedLoginAnimation: function() {
this._timedLoginItem.actor.grab_key_focus();
return this._timedLoginItem.showFocusAnimation(this._timedLoginAnimationTime);
return this._timedLoginItem.showTimedLoginIndicator(this._timedLoginAnimationTime);
},
_blockTimedLoginUntilIdle: function() {
@ -1087,6 +1084,9 @@ const LoginDialog = new Lang.Class({
this._timedLoginBatch = null;
}
if (this._timedLoginItem)
this._timedLoginItem.hideTimedLoginIndicator();
let userName = this._timedLoginItem.user.get_user_name();
if (userName)