| <link rel="import" href="chrome://resources/html/polymer.html"> |
| |
| <link rel="import" href="chrome://resources/cr_elements/chromeos/cr_picture/cr_png_behavior.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_icon_button/cr_icon_button.html"> |
| <link rel="import" href="chrome://resources/cr_elements/cr_link_row/cr_link_row.html"> |
| <link rel="import" href="chrome://resources/cr_elements/icons.html"> |
| <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html"> |
| <link rel="import" href="chrome://resources/html/assert.html"> |
| <link rel="import" href="chrome://resources/html/cr/ui/focus_without_ink.html"> |
| <link rel="import" href="chrome://resources/html/i18n_behavior.html"> |
| <link rel="import" href="chrome://resources/html/icon.html"> |
| <link rel="import" href="chrome://resources/html/util.html"> |
| <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html"> |
| <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout-classes.html"> |
| <link rel="import" href="../../controls/settings_toggle_button.html"> |
| <link rel="import" href="../../icons.html"> |
| <link rel="import" href="../../people_page/account_manager.html"> |
| <link rel="import" href="../../people_page/change_picture.html"> |
| <link rel="import" href="../../people_page/fingerprint_list.html"> |
| <link rel="import" href="../../people_page/kerberos_accounts.html"> |
| <link rel="import" href="../../people_page/lock_screen.html"> |
| <link rel="import" href="../../people_page/lock_state_behavior.html"> |
| <link rel="import" href="../../people_page/profile_info_browser_proxy.html"> |
| <link rel="import" href="../../people_page/signout_dialog.html"> |
| <link rel="import" href="../../people_page/sync_browser_proxy.html"> |
| <link rel="import" href="../../people_page/sync_controls.html"> |
| <link rel="import" href="../../people_page/sync_page.html"> |
| <link rel="import" href="../../people_page/users_page.html"> |
| <link rel="import" href="../../route.html"> |
| <link rel="import" href="../../settings_page/settings_animated_pages.html"> |
| <link rel="import" href="../../settings_page/settings_subpage.html"> |
| <link rel="import" href="../../settings_shared_css.html"> |
| |
| <dom-module id="os-settings-people-page"> |
| <template> |
| <style include="settings-shared iron-flex"> |
| setting-box.middle { |
| /* Per spec, middle text is indented 20px in this section. */ |
| margin-inline-start: 20px; |
| } |
| |
| #profile-icon { |
| background: center / cover no-repeat; |
| border-radius: 20px; |
| flex-shrink: 0; |
| height: 40px; |
| width: 40px; |
| } |
| |
| iron-icon[icon='cr:sync'] { |
| --iron-icon-fill-color: var(--google-green-refresh-700); |
| } |
| |
| :host-context([dark]) iron-icon[icon='cr:sync'] { |
| --iron-icon-fill-color: var(--google-green-refresh-300); |
| } |
| |
| #sync-status[actionable] iron-icon[icon='settings:sync-problem'] { |
| --iron-icon-fill-color: var(--settings-error-color); |
| } |
| |
| #sync-status[actionable].auth-error |
| iron-icon[icon='settings:sync-disabled'] { |
| --iron-icon-fill-color: var(--google-blue-500); |
| } |
| |
| :host-context([dark]) #sync-status[actionable].auth-error |
| iron-icon[icon='settings:sync-disabled'] { |
| --iron-icon-fill-color: var(--google-blue-refresh-300); |
| } |
| |
| #sync-status:not([actionable]) .subpage-arrow { |
| display: none; |
| } |
| |
| cr-link-row { |
| --cr-link-row-icon-width: 40px; |
| border-top: var(--cr-separator-line); |
| } |
| |
| .settings-box[actionable].sync-error #syncSecondary { |
| color: var(--settings-error-color); |
| } |
| |
| .icon-container { |
| display: flex; |
| flex-shrink: 0; |
| justify-content: center; |
| width: 40px; |
| } |
| |
| </style> |
| <settings-animated-pages id="pages" section="people" |
| focus-config="[[focusConfig_]]"> |
| <div route-path="default"> |
| <div id="picture-subpage-trigger" class="settings-box first two-line"> |
| <template is="dom-if" if="[[syncStatus]]"> |
| <div id="profile-icon" on-click="onProfileTap_" actionable |
| style="background-image: [[getIconImageSet_( |
| profileIconUrl_)]]"> |
| </div> |
| <div class="middle two-line no-min-width" on-click="onProfileTap_" |
| actionable> |
| <div class="flex text-elide settings-box-text"> |
| <span id="profile-name">[[profileName_]]</span> |
| <div class="secondary" hidden="[[!syncStatus.signedIn]]"> |
| [[syncStatus.signedInUsername]] |
| </div> |
| </div> |
| <cr-icon-button class="subpage-arrow" |
| aria-label="$i18n{changePictureTitle}" |
| aria-describedby="profile-name"></cr-icon-button> |
| </div> |
| </template> |
| </div> |
| |
| <template is="dom-if" if="[[!syncStatus.signedIn]]"> |
| <div class="settings-box two-line" id="sync-overview" |
| hidden="[[!syncStatus.signinAllowed]]"> |
| <div class="start settings-box-text"> |
| $i18n{syncOverview} |
| <a target="_blank" href="$i18n{syncLearnMoreUrl}"> |
| $i18n{learnMore} |
| </a> |
| </div> |
| </div> |
| </template> |
| |
| <template is="dom-if" |
| if="[[isPreUnifiedConsentAdvancedSyncSettingsVisible_( |
| syncStatus, unifiedConsentEnabled_)]]"> |
| <div class$="settings-box two-line |
| [[getSyncStatusClass_(syncStatus)]]" |
| on-click="onSyncTap_" id="sync-status" |
| actionable$="[[isSyncStatusActionable_(syncStatus)]]"> |
| <div class="icon-container"> |
| <iron-icon id="sync-icon" icon$="[[getSyncIcon_(syncStatus)]]"> |
| </iron-icon> |
| </div> |
| <div class="middle settings-box-text"> |
| $i18n{sync} |
| <div class="secondary" id="syncSecondary"> |
| [[syncStatus.statusText]] |
| </div> |
| </div> |
| <cr-icon-button class="subpage-arrow" aria-label="$i18n{sync}" |
| aria-describedby="syncSecondary"></cr-icon-button> |
| </div> |
| </template> |
| |
| <template is="dom-if" if="[[unifiedConsentEnabled_]]"> |
| <cr-link-row id="sync-setup" |
| label="$i18n{syncAndNonPersonalizedServices}" |
| on-click="onSyncTap_"></cr-link-row> |
| </template> |
| |
| <cr-link-row id="lock-screen-subpage-trigger" class="hr" |
| on-click="onConfigureLockTap_" |
| label="[[selectLockScreenTitleString(hasPinLogin)]]" |
| sub-label="[[getPasswordState_(hasPin, |
| prefs.settings.enable_screen_lock.value)]]"></cr-link-row> |
| |
| <template is="dom-if" if="[[isAccountManagerEnabled_]]"> |
| <cr-link-row id="account-manager-subpage-trigger" class="hr" |
| on-click="onAccountManagerTap_" |
| label="$i18n{accountManagerSubMenuLabel}"></cr-link-row> |
| </template> |
| |
| <template is="dom-if" if="[[isKerberosEnabled_]]"> |
| <cr-link-row id="kerberos-accounts-subpage-trigger" class="hr" |
| on-click="onKerberosAccountsTap_" |
| label="$i18n{kerberosAccountsSubMenuLabel}"></cr-link-row> |
| </template> |
| |
| <cr-link-row id="manage-other-people-subpage-trigger" |
| label="$i18n{manageOtherPeople}" on-click="onManageOtherPeople_"> |
| </cr-link-row> |
| |
| </div> |
| <template is="dom-if" route-path="/syncSetup" |
| no-search="[[!isAdvancedSyncSettingsSearchable_( |
| syncStatus, unifiedConsentEnabled_)]]"> |
| <settings-subpage |
| associated-control="[[getAdvancedSyncSettingsAssociatedControl_( |
| unifiedConsentEnabled_)]]" |
| page-title="$i18n{syncPageTitle}" |
| learn-more-url="$i18n{syncAndGoogleServicesLearnMoreURL}" |
| no-search$="[[!isAdvancedSyncSettingsSearchable_(syncStatus, |
| unifiedConsentEnabled_)]]"> |
| <settings-sync-page |
| unified-consent-enabled="[[unifiedConsentEnabled_]]" |
| sync-status="[[syncStatus]]" prefs="{{prefs}}" |
| page-visibility="[[pageVisibility.privacy]]"> |
| </settings-sync-page> |
| </settings-subpage> |
| </template> |
| |
| <template is="dom-if" if="[[unifiedConsentEnabled_]]"> |
| <template is="dom-if" route-path="/syncSetup/advanced"> |
| <settings-subpage page-title="$i18n{syncAdvancedPageTitle}" |
| associated-control="[[$$('#sync-setup')]]" |
| learn-more-url="$i18n{syncAndGoogleServicesLearnMoreURL}"> |
| <settings-sync-controls sync-status="[[syncStatus]]"> |
| </settings-sync-controls> |
| </settings-subpage> |
| </template> |
| </template> |
| |
| <template is="dom-if" route-path="/lockScreen"> |
| <settings-subpage |
| page-title="[[selectLockScreenTitleString(hasPinLogin)]]" |
| associated-control="[[$$('#lock-screen-subpage-trigger')]]"> |
| <settings-lock-screen |
| prefs="{{prefs}}" auth-token="{{authToken_}}"> |
| </settings-lock-screen> |
| </settings-subpage> |
| </template> |
| <template is="dom-if" if="[[fingerprintUnlockEnabled_]]"> |
| <template is="dom-if" route-path="/lockScreen/fingerprint" no-search> |
| <settings-subpage page-title="$i18n{lockScreenFingerprintTitle}"> |
| <settings-fingerprint-list auth-token="[[authToken_]]"> |
| </settings-fingerprint-list> |
| </settings-subpage> |
| </template> |
| </template> |
| <template is="dom-if" route-path="/accounts"> |
| <settings-subpage |
| associated-control="[[$$('#manage-other-people-subpage-trigger')]]" |
| page-title="$i18n{manageOtherPeople}"> |
| <settings-users-page prefs="{{prefs}}"> |
| </settings-users-page> |
| </settings-subpage> |
| </template> |
| <template is="dom-if" route-path="/changePicture"> |
| <settings-subpage |
| associated-control="[[$$('#picture-subpage-trigger')]]" |
| page-title="$i18n{changePictureTitle}"> |
| <settings-change-picture></settings-change-picture> |
| </settings-subpage> |
| </template> |
| <template is="dom-if" if="[[isAccountManagerEnabled_]]"> |
| <template is="dom-if" route-path="/accountManager"> |
| <settings-subpage |
| associated-control="[[$$('#account-manager-subpage-trigger')]]" |
| page-title="$i18n{accountManagerPageTitle}"> |
| <settings-account-manager></settings-account-manager> |
| </settings-subpage> |
| </template> |
| </template> |
| <template is="dom-if" if="[[isKerberosEnabled_]]"> |
| <template is="dom-if" route-path="/kerberosAccounts"> |
| <settings-subpage |
| associated-control="[[$$('#kerberos-accounts-subpage-trigger')]]" |
| page-title="$i18n{kerberosAccountsPageTitle}"> |
| <settings-kerberos-accounts></settings-kerberos-accounts> |
| </settings-subpage> |
| </template> |
| </template> |
| </settings-animated-pages> |
| |
| <template is="dom-if" if="[[showSignoutDialog_]]" restamp> |
| <settings-signout-dialog sync-status="[[syncStatus]]" |
| on-close="onDisconnectDialogClosed_"> |
| </settings-signout-dialog> |
| </template> |
| |
| </template> |
| <script src="os_people_page.js"></script> |
| </dom-module> |
