summaryrefslogtreecommitdiffstats
path: root/chromium/chrome/browser/resources/settings/autofill_page/autofill_section.html
blob: d7814621568823fbbc111c724b2855d15cd1eb4e (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/cr_elements/cr_action_menu/cr_action_menu.html">
<link rel="import" href="chrome://resources/cr_elements/cr_button/cr_button.html">
<link rel="import" href="chrome://resources/cr_elements/cr_icon_button/cr_icon_button.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="../i18n_setup.html">
<link rel="import" href="../settings_shared_css.html">
<link rel="import" href="../controls/extension_controlled_indicator.html">
<link rel="import" href="../controls/settings_toggle_button.html">
<link rel="import" href="../prefs/prefs.html">
<link rel="import" href="address_edit_dialog.html">
<link rel="import" href="passwords_shared_css.html">

<dom-module id="settings-autofill-section">
  <template>
    <style include="settings-shared passwords-shared">
      #addressList .start {
        display: flex;
        overflow: hidden;
      }

      #addressSummary {
        display: flex;
        flex: 1;
        overflow: hidden;
      }
    </style>
    <settings-toggle-button id="autofillProfileToggle"
        class="settings-box first"
        aria-label="$i18n{addressesTitle}" no-extension-indicator
        label="$i18n{enableProfilesLabel}"
        sub-label="$i18n{enableProfilesSublabel}"
        pref="{{prefs.autofill.profile_enabled}}">
    </settings-toggle-button>
    <template is="dom-if" if="[[prefs.autofill.profile_enabled.extensionId]]">
      <div class="settings-box continuation">
        <extension-controlled-indicator class="start"
            id="autofillExtensionIndicator"
            extension-id="[[prefs.autofill.profile_enabled.extensionId]]"
            extension-name="[[prefs.autofill.profile_enabled.controlledByName]]"
            extension-can-be-disabled="[[
                prefs.autofill.profile_enabled.extensionCanBeDisabled]]">
        </extension-controlled-indicator>
      </div>
    </template>
    <div class="settings-box continuation">
      <h2 class="start">$i18n{addresses}</h2>
      <cr-button id="addAddress" class="header-aligned-button"
          on-click="onAddAddressTap_"
          hidden$="[[!prefs.autofill.profile_enabled.value]]">
        $i18n{add}
      </cr-button>
    </div>
    <div class="list-frame">
      <div id="addressList" class="vertical-list">
        <template is="dom-repeat" items="[[addresses]]">
          <div class="list-item">
            <div class="start">
              <span id="addressSummary">
                <span class="ellipses">
                  [[item.metadata.summaryLabel]]
                </span>
                <span class="ellipses">
                  [[item.metadata.summarySublabel]]
                </span>
              </span>
            </div>
            <template is="dom-if" if="[[item.metadata.isLocal]]">
              <cr-icon-button class="icon-more-vert" id="addressMenu"
                  on-click="onAddressMenuTap_" title="$i18n{moreActions}">
              </cr-icon-button>
            </template>
            <template is="dom-if" if="[[!item.metadata.isLocal]]">
              <cr-icon-button actionable class="icon-external"
                  on-click="onRemoteEditAddressTap_"></cr-icon-button>
            </template>
          </div>
        </template>
      </div>
      <div id="noAddressesLabel" class="list-item"
          hidden$="[[hasSome_(addresses)]]">
        $i18n{noAddressesFound}
      </div>
    </div>
    <cr-action-menu id="addressSharedMenu">
      <button id="menuEditAddress" class="dropdown-item"
          on-click="onMenuEditAddressTap_">$i18n{edit}</button>
      <button id="menuRemoveAddress" class="dropdown-item"
          on-click="onMenuRemoveAddressTap_">$i18n{removeAddress}</button>
    </cr-action-menu>
    <template is="dom-if" if="[[showAddressDialog_]]" restamp>
      <settings-address-edit-dialog address="[[activeAddress]]"
          on-close="onAddressDialogClose_">
      </settings-address-edit-dialog>
    </template>
  </template>
  <script src="autofill_section.js"></script>
</dom-module>