Refresh UI of public session pods for new login screen

Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
we can either place pods behind the scene or postpone placement until
the pod collapses. The former method is used, because postponing pod
placement may further complicate things. 

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
Review-Url: https://codereview.chromium.org/2926003002
Cr-Commit-Position: refs/heads/master@{#478013}
Committed: https://chromium.googlesource.com/chromium/src/+/12ab698854b581200db8cc4a68f75bd99e38f0c8

[Wenzhao (Colin) Zang, 2017-06-07 04:14:37]

Description was changed from

==========
Refresh UI of public session pods for new login screen

BUG=718159
==========

to

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's observed that a
single click event may be handled twice by two different click handlers. We have
to disallow click event handling by handlers other than the public session pod
itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
pod placement should be done behind the scene.

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

[Wenzhao (Colin) Zang, 2017-06-07 04:14:37]

wzang@chromium.org changed reviewers:
+ jdufault@chromium.org, xiyuan@chromium.org

[Wenzhao (Colin) Zang, 2017-06-07 04:15:06]

Description was changed from

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's observed that a
single click event may be handled twice by two different click handlers. We have
to disallow click event handling by handlers other than the public session pod
itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
pod placement should be done behind the scene.

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

to

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
pod placement should be done behind the scene.

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

[Wenzhao (Colin) Zang, 2017-06-07 04:17:28]

Description was changed from

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
pod placement should be done behind the scene.

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

to

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
we can either place pods behind the scene or postpone placement until
the pod collapses. The former method is used, because postponing pod
placement may further complicate things. 

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

[jdufault, 2017-06-07 17:29:31]

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
File ui/login/account_picker/md_user_pod_row.css (right):

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
ui/login/account_picker/md_user_pod_row.css:228: .input-line {
Are these display: none css additions permanently hiding the elements? It might
make sense to just remove them from the dom tree in that case.

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
File ui/login/account_picker/md_user_pod_row.js (right):

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
ui/login/account_picker/md_user_pod_row.js:3951: centerPublicSessionPod_:
function(pod) {
FYI, this can be more general:

  centerPod_: function(pod, podWidth, podHeight) {
    // ...
  }

[Wenzhao (Colin) Zang, 2017-06-07 21:12:45]

Addressed comments and made minor changes on positioning to handle edge cases,
as a follow-up to the previous CL.

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
File ui/login/account_picker/md_user_pod_row.css (right):

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
ui/login/account_picker/md_user_pod_row.css:228: .input-line {
On 2017/06/07 17:29:31, jdufault wrote:
> Are these display: none css additions permanently hiding the elements? It
might
> make sense to just remove them from the dom tree in that case.

This one needs to be displayed conditionally. I've removed those which are
permanently hidden from the dom tree.

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
File ui/login/account_picker/md_user_pod_row.js (right):

https://codereview.chromium.org/2926003002/diff/1/ui/login/account_picker/md_...
ui/login/account_picker/md_user_pod_row.js:3951: centerPublicSessionPod_:
function(pod) {
On 2017/06/07 17:29:31, jdufault wrote:
> FYI, this can be more general:
> 
>   centerPod_: function(pod, podWidth, podHeight) {
>     // ...
>   }

I changed it. Thanks.

[jdufault, 2017-06-08 00:49:37]

lgtm after comment

https://codereview.chromium.org/2926003002/diff/20001/ui/login/account_picker...
File ui/login/account_picker/md_user_pod_row.js (right):

https://codereview.chromium.org/2926003002/diff/20001/ui/login/account_picker...
ui/login/account_picker/md_user_pod_row.js:2194: lastPosition_: {left: 'unset',
top: 'unset'},
Just set/get the variable directly without a wrapper function?

[Wenzhao (Colin) Zang, 2017-06-08 01:14:50]

https://codereview.chromium.org/2926003002/diff/20001/ui/login/account_picker...
File ui/login/account_picker/md_user_pod_row.js (right):

https://codereview.chromium.org/2926003002/diff/20001/ui/login/account_picker...
ui/login/account_picker/md_user_pod_row.js:2194: lastPosition_: {left: 'unset',
top: 'unset'},
On 2017/06/08 00:49:37, jdufault wrote:
> Just set/get the variable directly without a wrapper function?

Done.

[xiyuan, 2017-06-08 14:57:02]

lgtm

[Wenzhao (Colin) Zang, 2017-06-08 17:17:15]

The CQ bit was checked by wzang@chromium.org

[Wenzhao (Colin) Zang, 2017-06-08 17:17:16]

The patchset sent to the CQ was uploaded after l-g-t-m from
jdufault@chromium.org
Link to the patchset: https://codereview.chromium.org/2926003002/#ps40001
(title: "Removed getter and setter of lastPosition")

[commit-bot: I haz the power, 2017-06-08 17:17:43]

CQ is trying da patch.

Follow status at:
https://chromium-cq-status.appspot.com/v2/patch-status/codereview.chromium.or...

[commit-bot: I haz the power, 2017-06-08 17:32:32]

CQ is committing da patch.

Bot data: {"patchset_id": 40001, "attempt_start_ts": 1496942235491150,
"parent_rev": "cf4bec1883e142b264db8e65108afdaf993bdea4", "commit_rev":
"12ab698854b581200db8cc4a68f75bd99e38f0c8"}

[commit-bot: I haz the power, 2017-06-08 17:32:44]

Description was changed from

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
we can either place pods behind the scene or postpone placement until
the pod collapses. The former method is used, because postponing pod
placement may further complicate things. 

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159
==========

to

==========
Refresh UI of public session pods for new login screen

Main differences with the old implementation are:

1) There're two types of click events on public session pods: switching
between large and small pods, and pod expansion / collapse. It's
observed that a single click event may be handled twice by two
different click handlers. We have to disallow click event handling by
handlers other than the public session pod itself.

2) When the pod is expanded, all other elements in the account picker
must be hidden. If there's a window resize event when it's expanded,
we can either place pods behind the scene or postpone placement until
the pod collapses. The former method is used, because postponing pod
placement may further complicate things. 

A known issue not covered: the resetTabOrder() function needs to be
modified.

BUG=718159

Review-Url: https://codereview.chromium.org/2926003002
Cr-Commit-Position: refs/heads/master@{#478013}
Committed:
https://chromium.googlesource.com/chromium/src/+/12ab698854b581200db8cc4a68f7...
==========

[commit-bot: I haz the power, 2017-06-08 17:32:45]

Committed patchset #3 (id:40001) as
https://chromium.googlesource.com/chromium/src/+/12ab698854b581200db8cc4a68f7...