chrome/browser/resources/settings/multidevice_page/multidevice_subpage.html

<link rel="import" href="chrome://resources/html/polymer.html">

<link rel="import" href="chrome://resources/cr_elements/chromeos/network/cr_network_listener_behavior.html">
<link rel="import" href="chrome://resources/cr_elements/cr_button/cr_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/shared_vars_css.html">
<link rel="import" href="chrome://resources/html/cr.html">
<link rel="import" href="chrome://resources/html/i18n_behavior.html">
<link rel="import" href="../i18n_setup.html">
<link rel="import" href="../route.html">
<link rel="import" href="../settings_shared_css.html">
<link rel="import" href="../settings_vars_css.html">
<link rel="import" href="multidevice_constants.html">
<link rel="import" href="multidevice_feature_behavior.html">
<link rel="import" href="multidevice_feature_item.html">
<link rel="import" href="multidevice_feature_toggle.html">
<link rel="import" href="multidevice_tether_item.html">

<dom-module id="settings-multidevice-subpage">
  <template>
    <style include="settings-shared iron-flex">
      settings-multidevice-feature-item,
      settings-multidevice-tether-item {
        --feature-item-row-padding: 0;
      }

      settings-multidevice-feature-item:first-of-type {
        --feature-item-border-top-style: none;
      }

      #feature-items-container {
        @apply --settings-list-frame-padding;
      }
    </style>
    <div class="settings-box first">
      <div id="status-text-container"
          class="start"
          enabled$="[[isSuiteOn(pageContentData)]]"
          inner-h-t-m-l="[[getStatusInnerHtml_(pageContentData)]]">
      </div>
        <template is="dom-if" if="[[shouldShowVerifyButton_(pageContentData)]]"
            restamp>
          <cr-button on-click="handleVerifyButtonClick_">
            $i18n{multideviceVerifyButton}
          </cr-button>
        </template>
        <template is="dom-if" if="[[shouldShowSuiteToggle_(pageContentData)]]"
            restamp>
          <settings-multidevice-feature-toggle
              feature="[[MultiDeviceFeature.BETTER_TOGETHER_SUITE]]"
              page-content-data="[[pageContentData]]">
          </settings-multidevice-feature-toggle>
        </template>
    </div>
    <template is="dom-if"
        if="[[shouldShowIndividualFeatures_(pageContentData)]]"
        restamp>
      <div id="feature-items-container">
        <template is="dom-if"
            if="[[isFeatureSupported(
                MultiDeviceFeature.SMART_LOCK, pageContentData)]]"
            restamp>
          <settings-multidevice-feature-item id="smartLockItem"
              feature="[[MultiDeviceFeature.SMART_LOCK]]"
              page-content-data="[[pageContentData]]"
              subpage-route="[[routes.SMART_LOCK]]">
          </settings-multidevice-feature-item>
        </template>
        <template is="dom-if"
            if="[[isFeatureSupported(
                MultiDeviceFeature.INSTANT_TETHERING, pageContentData)]]"
            restamp>
          <settings-multidevice-tether-item id="instantTetheringItem"
              page-content-data="[[pageContentData]]">
          </settings-multidevice-tether-item>
        </template>
        <template is="dom-if"
            if="[[isFeatureSupported(
                MultiDeviceFeature.MESSAGES, pageContentData)]]"
            restamp>
          <settings-multidevice-feature-item id="messagesItem"
              feature="[[MultiDeviceFeature.MESSAGES]]"
              page-content-data="[[pageContentData]]">
            <template is="dom-if"
                if="[[doesAndroidMessagesRequireSetUp_(pageContentData)]]"
                restamp>
              <cr-button disabled$="[[isAndroidMessagesSetupButtonDisabled_(
                                       pageContentData)]]"
                on-click="handleAndroidMessagesButtonClick_"
                  slot="feature-controller">
                $i18n{multideviceSetupButton}
              </cr-button>
            </template>
          </settings-multidevice-feature-item>
        </template>
      </div>
    </template>
    <div class="settings-box two-line">
        <div id="forget-device-label" class="start">
            $i18n{multideviceForgetDevice}
            <div class="secondary">
                $i18n{multideviceForgetDeviceSummary}
            </div>
        </div>
        <cr-button on-click="handleForgetDeviceClick_"
          aria-labelledby="forgetDeviceLabel">
           $i18n{multideviceForgetDeviceDisconnect}
        </cr-button>
    </div>
    <cr-dialog id="forgetDeviceDialog">
      <div slot="title">$i18n{multideviceForgetDevice}</div>
      <div slot="body">
        <div class="first">
          $i18n{multideviceForgetDeviceDialogMessage}
        </div>
      </div>
      <div slot="button-container">
        <cr-button class="cancel-button"
            on-click="onForgetDeviceDialogCancelClick_">
          $i18n{cancel}
        </cr-button>
        <cr-button id="confirmButton"
            class="action-button"
            on-click="onForgetDeviceDialogConfirmClick_">
          $i18n{multideviceForgetDeviceDisconnect}
        </cr-button>
      </div>
    </cr-dialog>
  </template>
  <script src="multidevice_subpage.js"></script>
</dom-module>