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

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: Css fixes intersecting with another CL removed. 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
« no previous file with comments | « ui/login/account_picker/user_pod_row.css ('k') | ui/login/login_ui_tools.js » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
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 349 matching lines...) Expand 10 before | Expand all | Expand 10 after
360 360
361 /** 361 /**
362 * Gets user type bubble like multi-profiles policy restriction message. 362 * Gets user type bubble like multi-profiles policy restriction message.
363 * @type {!HTMLDivElement} 363 * @type {!HTMLDivElement}
364 */ 364 */
365 get userTypeBubbleElement() { 365 get userTypeBubbleElement() {
366 return this.querySelector('.user-type-bubble'); 366 return this.querySelector('.user-type-bubble');
367 }, 367 },
368 368
369 /** 369 /**
370 * Gets action box menu.
371 * @type {!HTMLInputElement}
372 */
373 get actionBoxMenu() {
374 return this.querySelector('.action-box-menu');
375 },
376
377 /**
370 * Gets action box menu title, user name item. 378 * Gets action box menu title, user name item.
371 * @type {!HTMLInputElement} 379 * @type {!HTMLInputElement}
372 */ 380 */
373 get actionBoxMenuTitleNameElement() { 381 get actionBoxMenuTitleNameElement() {
374 return this.querySelector('.action-box-menu-title-name'); 382 return this.querySelector('.action-box-menu-title-name');
375 }, 383 },
376 384
377 /** 385 /**
378 * Gets action box menu title, user email item. 386 * Gets action box menu title, user email item.
379 * @type {!HTMLInputElement} 387 * @type {!HTMLInputElement}
(...skipping 188 matching lines...) Expand 10 before | Expand all | Expand 10 after
568 this.parentNode.focusPod(undefined, true); 576 this.parentNode.focusPod(undefined, true);
569 this.actionBoxAreaElement.focus(); 577 this.actionBoxAreaElement.focus();
570 } 578 }
571 579
572 // Hide user-type-bubble. 580 // Hide user-type-bubble.
573 this.userTypeBubbleElement.classList.remove('bubble-shown'); 581 this.userTypeBubbleElement.classList.remove('bubble-shown');
574 582
575 this.actionBoxAreaElement.classList.add('active'); 583 this.actionBoxAreaElement.classList.add('active');
576 } else { 584 } else {
577 this.actionBoxAreaElement.classList.remove('active'); 585 this.actionBoxAreaElement.classList.remove('active');
586 this.actionBoxAreaElement.classList.remove('menu-moved-up');
587 this.actionBoxMenu.classList.remove('menu-moved-up');
578 } 588 }
579 }, 589 },
580 590
581 /** 591 /**
582 * Whether action box button is in hovered state. 592 * Whether action box button is in hovered state.
583 * @type {boolean} 593 * @type {boolean}
584 */ 594 */
585 get isActionBoxMenuHovered() { 595 get isActionBoxMenuHovered() {
586 return this.actionBoxAreaElement.classList.contains('hovered'); 596 return this.actionBoxAreaElement.classList.contains('hovered');
587 }, 597 },
(...skipping 121 matching lines...) Expand 10 before | Expand all | Expand 10 after
709 messageDiv.textContent = 719 messageDiv.textContent =
710 loadTimeData.getString('supervisedUserExpiredTokenWarning'); 720 loadTimeData.getString('supervisedUserExpiredTokenWarning');
711 error.appendChild(messageDiv); 721 error.appendChild(messageDiv);
712 722
713 $('bubble').showContentForElement( 723 $('bubble').showContentForElement(
714 this.signinButtonElement, 724 this.signinButtonElement,
715 cr.ui.Bubble.Attachment.TOP, 725 cr.ui.Bubble.Attachment.TOP,
716 error, 726 error,
717 this.signinButtonElement.offsetWidth / 2, 727 this.signinButtonElement.offsetWidth / 2,
718 4); 728 4);
729 // Move warning bubble up if it overlaps the shelf.
730 var maxHeight =
731 cr.ui.LoginUITools.getMaxHeightBeforeShelfOverlapping($('bubble'));
732 if (maxHeight < $('bubble').offsetHeight) {
733 $('bubble').showContentForElement(
734 this.signinButtonElement,
735 cr.ui.Bubble.Attachment.BOTTOM,
736 error,
737 this.signinButtonElement.offsetWidth / 2,
738 4);
739 }
719 }, 740 },
720 741
721 /** 742 /**
722 * Shows signin UI for this user. 743 * Shows signin UI for this user.
723 */ 744 */
724 showSigninUI: function() { 745 showSigninUI: function() {
725 if (this.user.supervisedUser && !this.user.isDesktopUser) { 746 if (this.user.supervisedUser && !this.user.isDesktopUser) {
726 this.showSupervisedUserSigninWarning(); 747 this.showSupervisedUserSigninWarning();
727 } else { 748 } else {
728 // Special case for multi-profiles sign in. We show users even if they 749 // 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
818 }, 839 },
819 840
820 /** 841 /**
821 * Shows remove user warning. Used for supervised users on CrOS, and for all 842 * Shows remove user warning. Used for supervised users on CrOS, and for all
822 * users on desktop. 843 * users on desktop.
823 */ 844 */
824 showRemoveWarning_: function() { 845 showRemoveWarning_: function() {
825 this.actionBoxMenuRemoveElement.hidden = true; 846 this.actionBoxMenuRemoveElement.hidden = true;
826 this.actionBoxRemoveUserWarningElement.hidden = false; 847 this.actionBoxRemoveUserWarningElement.hidden = false;
827 this.actionBoxRemoveUserWarningButtonElement.focus(); 848 this.actionBoxRemoveUserWarningButtonElement.focus();
849
850 // Move up the menu if it overlaps shelf.
851 var maxHeight = cr.ui.LoginUITools.getMaxHeightBeforeShelfOverlapping(
852 this.actionBoxMenu);
853 var actualHeight = parseInt(
854 window.getComputedStyle(this.actionBoxMenu).height);
855 if (maxHeight < actualHeight) {
856 this.actionBoxMenu.classList.add('menu-moved-up');
857 this.actionBoxAreaElement.classList.add('menu-moved-up');
858 }
828 }, 859 },
829 860
830 /** 861 /**
831 * Handles a click event on remove user confirmation button. 862 * Handles a click event on remove user confirmation button.
832 * @param {Event} e Click event. 863 * @param {Event} e Click event.
833 */ 864 */
834 handleRemoveUserConfirmationClick_: function(e) { 865 handleRemoveUserConfirmationClick_: function(e) {
835 if (this.isActionBoxMenuActive) { 866 if (this.isActionBoxMenuActive) {
836 this.isActionBoxMenuActive = false; 867 this.isActionBoxMenuActive = false;
837 this.removeUser(this.user); 868 this.removeUser(this.user);
(...skipping 1592 matching lines...) Expand 10 before | Expand all | Expand 10 after
2430 if (pod && pod.multiProfilesPolicyApplied) { 2461 if (pod && pod.multiProfilesPolicyApplied) {
2431 pod.userTypeBubbleElement.classList.remove('bubble-shown'); 2462 pod.userTypeBubbleElement.classList.remove('bubble-shown');
2432 } 2463 }
2433 } 2464 }
2434 }; 2465 };
2435 2466
2436 return { 2467 return {
2437 PodRow: PodRow 2468 PodRow: PodRow
2438 }; 2469 };
2439 }); 2470 });
OLDNEW
« no previous file with comments | « ui/login/account_picker/user_pod_row.css ('k') | ui/login/login_ui_tools.js » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698