chrome/browser/resources/settings/site_settings/protocol_handlers.html

<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_toggle/cr_toggle.html">
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button-light.html">
<link rel="import" href="../i18n_setup.html">
<link rel="import" href="../settings_shared_css.html">
<link rel="import" href="../site_favicon.html">
<link rel="import" href="site_settings_behavior.html">
<link rel="import" href="site_settings_prefs_browser_proxy.html">

<dom-module id="protocol-handlers">
  <template>
    <style include="settings-shared">
      :host {
        display: block;
      }

      .column-header {
        margin-bottom: 15px;
        margin-inline-start: 20px;
        margin-top: 15px;
      }
    </style>
    <div class="settings-box first two-line">
      <div id="categoryLabel" class="start" on-click="categoryLabelClicked_"
          actionable>
        [[computeHandlersDescription_(categoryEnabled)]]
      </div>
      <cr-toggle id="toggle" checked="{{categoryEnabled}}"
          on-change="onToggleChange_" aria-labelledby="categoryLabel">
      </cr-toggle>
    </div>

    <template is="dom-repeat" items="[[protocols]]" as="protocol">
      <div class="column-header">[[protocol.protocol_display_name]]</div>

      <div class="list-frame menu-content vertical-list">
        <template is="dom-repeat" items="[[protocol.handlers]]">

          <div class="list-item">
            <site-favicon url="[[item.host]]"></site-favicon>
            <div class="middle" >
              <div class="protocol-host">
                <span class="url-directionality">[[item.host]]</span>
              </div>
              <div class="secondary protocol-default"
                  hidden$="[[!item.is_default]]">
                $i18n{handlerIsDefault}
              </div>
            </div>

            <paper-icon-button-light class="icon-more-vert">
              <button on-click="showMenu_" title="$i18n{moreActions}"></button>
            </paper-icon-button-light>
          </div>
        </template>
      </div>
    </template>

    <cr-action-menu>
      <button slot="item" class="dropdown-item" on-click="onDefaultClick_"
          id="defaultButton" hidden$="[[actionMenuModel_.is_default]]">
        $i18n{handlerSetDefault}
      </button>
      <button slot="item" class="dropdown-item" on-click="onRemoveClick_"
          id="removeButton">
        $i18n{handlerRemove}
      </button>
    </cr-action-menu>

    <template is="dom-if" if="[[ignoredProtocols.length]]">
      <div class="column-header">$i18n{siteSettingsBlocked}</div>
      <div class="list-frame menu-content vertical-list">
        <template is="dom-repeat" items="[[ignoredProtocols]]">
          <div class="list-item">
            <site-favicon url="[[item.host]]"></site-favicon>
            <div class="middle" >
              <div class="protocol-host">
                <span class="url-directionality">[[item.host]]</span></div>
              <div class="secondary protocol-protocol">
                [[item.protocol_display_name]]
              </div>
            </div>
            <paper-icon-button-light class="icon-clear">
              <button id="removeIgnoredButton" on-click="onRemoveIgnored_"
                  title="$i18n{handlerRemove}">
              </button>
            </paper-icon-button-light>
          </div>
        </template>
      </div>
    </template>

<if expr="chromeos">
  <template is="dom-if" if="[[settingsAppAvailable_]]">
    <div class="settings-box first"
        on-click="onManageAndroidAppsClick_" actionable>
      <div class="start">
        <div>$i18n{androidAppsManageAppLinks}</div>
      </div>
      <paper-icon-button-light class="icon-external">
        <button></button>
      </paper-icon-button-light>
    </div>
  </template>
</if>
  </template>
  <script src="protocol_handlers.js"></script>
</dom-module>