Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(190)

Side by Side Diff: ui/login/account_picker/user_pod_row.js

Issue 399613002: Anti-shelf-overlapping fixes for several menus. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src
Patch Set: Rebase. Created 6 years, 4 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
OLDNEW
1 // Copyright 2014 The Chromium Authors. All rights reserved. 1 // Copyright 2014 The Chromium Authors. All rights reserved.
2 // Use of this source code is governed by a BSD-style license that can be 2 // Use of this source code is governed by a BSD-style license that can be
3 // found in the LICENSE file. 3 // found in the LICENSE file.
4 4
5 /** 5 /**
6 * @fileoverview User pod row implementation. 6 * @fileoverview User pod row implementation.
7 */ 7 */
8 8
9 cr.define('login', function() { 9 cr.define('login', function() {
10 /** 10 /**
(...skipping 356 matching lines...) Expand 10 before | Expand all | Expand 10 after
367 367
368 /** 368 /**
369 * Gets user type bubble like multi-profiles policy restriction message. 369 * Gets user type bubble like multi-profiles policy restriction message.
370 * @type {!HTMLDivElement} 370 * @type {!HTMLDivElement}
371 */ 371 */
372 get userTypeBubbleElement() { 372 get userTypeBubbleElement() {
373 return this.querySelector('.user-type-bubble'); 373 return this.querySelector('.user-type-bubble');
374 }, 374 },
375 375
376 /** 376 /**
377 * Gets action box menu.
378 * @type {!HTMLInputElement}
379 */
380 get actionBoxMenu() {
381 return this.querySelector('.action-box-menu');
382 },
383
384 /**
377 * Gets action box menu title, user name item. 385 * Gets action box menu title, user name item.
378 * @type {!HTMLInputElement} 386 * @type {!HTMLInputElement}
379 */ 387 */
380 get actionBoxMenuTitleNameElement() { 388 get actionBoxMenuTitleNameElement() {
381 return this.querySelector('.action-box-menu-title-name'); 389 return this.querySelector('.action-box-menu-title-name');
382 }, 390 },
383 391
384 /** 392 /**
385 * Gets action box menu title, user email item. 393 * Gets action box menu title, user email item.
386 * @type {!HTMLInputElement} 394 * @type {!HTMLInputElement}
(...skipping 189 matching lines...) Expand 10 before | Expand all | Expand 10 after
576 this.parentNode.focusPod(undefined, true); 584 this.parentNode.focusPod(undefined, true);
577 this.actionBoxAreaElement.focus(); 585 this.actionBoxAreaElement.focus();
578 } 586 }
579 587
580 // Hide user-type-bubble. 588 // Hide user-type-bubble.
581 this.userTypeBubbleElement.classList.remove('bubble-shown'); 589 this.userTypeBubbleElement.classList.remove('bubble-shown');
582 590
583 this.actionBoxAreaElement.classList.add('active'); 591 this.actionBoxAreaElement.classList.add('active');
584 } else { 592 } else {
585 this.actionBoxAreaElement.classList.remove('active'); 593 this.actionBoxAreaElement.classList.remove('active');
594 this.actionBoxAreaElement.classList.remove('menu-moved-up');
595 this.actionBoxMenu.classList.remove('menu-moved-up');
586 } 596 }
587 }, 597 },
588 598
589 /** 599 /**
590 * Whether action box button is in hovered state. 600 * Whether action box button is in hovered state.
591 * @type {boolean} 601 * @type {boolean}
592 */ 602 */
593 get isActionBoxMenuHovered() { 603 get isActionBoxMenuHovered() {
594 return this.actionBoxAreaElement.classList.contains('hovered'); 604 return this.actionBoxAreaElement.classList.contains('hovered');
595 }, 605 },
(...skipping 121 matching lines...) Expand 10 before | Expand all | Expand 10 after
717 messageDiv.textContent = 727 messageDiv.textContent =
718 loadTimeData.getString('supervisedUserExpiredTokenWarning'); 728 loadTimeData.getString('supervisedUserExpiredTokenWarning');
719 error.appendChild(messageDiv); 729 error.appendChild(messageDiv);
720 730
721 $('bubble').showContentForElement( 731 $('bubble').showContentForElement(
722 this.signinButtonElement, 732 this.signinButtonElement,
723 cr.ui.Bubble.Attachment.TOP, 733 cr.ui.Bubble.Attachment.TOP,
724 error, 734 error,
725 this.signinButtonElement.offsetWidth / 2, 735 this.signinButtonElement.offsetWidth / 2,
726 4); 736 4);
737 // Move warning bubble up if it overlaps the shelf.
738 var maxHeight = Oobe.getMaxHeightBeforeShelfOverlapping($('bubble'));
739 if (maxHeight < $('bubble').offsetHeight) {
740 $('bubble').showContentForElement(
741 this.signinButtonElement,
742 cr.ui.Bubble.Attachment.BOTTOM,
743 error,
744 this.signinButtonElement.offsetWidth / 2,
745 4);
746 }
727 }, 747 },
728 748
729 /** 749 /**
730 * Shows signin UI for this user. 750 * Shows signin UI for this user.
731 */ 751 */
732 showSigninUI: function() { 752 showSigninUI: function() {
733 if (this.user.locallyManagedUser && !this.user.isDesktopUser) { 753 if (this.user.locallyManagedUser && !this.user.isDesktopUser) {
734 this.showSupervisedUserSigninWarning(); 754 this.showSupervisedUserSigninWarning();
735 } else { 755 } else {
736 // Special case for multi-profiles sign in. We show users even if they 756 // Special case for multi-profiles sign in. We show users even if they
(...skipping 89 matching lines...) Expand 10 before | Expand all | Expand 10 after
826 }, 846 },
827 847
828 /** 848 /**
829 * Shows remove user warning. Used for supervised users on CrOS, and for all 849 * Shows remove user warning. Used for supervised users on CrOS, and for all
830 * users on desktop. 850 * users on desktop.
831 */ 851 */
832 showRemoveWarning_: function() { 852 showRemoveWarning_: function() {
833 this.actionBoxMenuRemoveElement.hidden = true; 853 this.actionBoxMenuRemoveElement.hidden = true;
834 this.actionBoxRemoveUserWarningElement.hidden = false; 854 this.actionBoxRemoveUserWarningElement.hidden = false;
835 this.actionBoxRemoveUserWarningButtonElement.focus(); 855 this.actionBoxRemoveUserWarningButtonElement.focus();
856
857 // Move up the menu if it overlaps shelf.
858 var maxHeight = Oobe.getMaxHeightBeforeShelfOverlapping(
859 this.actionBoxMenu);
860 var actualHeight = parseInt(
861 window.getComputedStyle(this.actionBoxMenu).height);
862 if (maxHeight < actualHeight) {
863 this.actionBoxMenu.classList.add('menu-moved-up');
864 this.actionBoxAreaElement.classList.add('menu-moved-up');
865 }
836 }, 866 },
837 867
838 /** 868 /**
839 * Handles a click event on remove user confirmation button. 869 * Handles a click event on remove user confirmation button.
840 * @param {Event} e Click event. 870 * @param {Event} e Click event.
841 */ 871 */
842 handleRemoveUserConfirmationClick_: function(e) { 872 handleRemoveUserConfirmationClick_: function(e) {
843 if (this.isActionBoxMenuActive) { 873 if (this.isActionBoxMenuActive) {
844 this.isActionBoxMenuActive = false; 874 this.isActionBoxMenuActive = false;
845 this.removeUser(this.user); 875 this.removeUser(this.user);
(...skipping 1544 matching lines...) Expand 10 before | Expand all | Expand 10 after
2390 if (this.podsWithPendingImages_.length == 0) { 2420 if (this.podsWithPendingImages_.length == 0) {
2391 this.classList.remove('images-loading'); 2421 this.classList.remove('images-loading');
2392 } 2422 }
2393 } 2423 }
2394 }; 2424 };
2395 2425
2396 return { 2426 return {
2397 PodRow: PodRow 2427 PodRow: PodRow
2398 }; 2428 };
2399 }); 2429 });
OLDNEW
« ui/login/account_picker/user_pod_row.css ('K') | « ui/login/account_picker/user_pod_row.css ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698