chrome/browser/resources/chromeos/emulator/bluetooth_settings.html

   1 <link rel="import" href="chrome://resources/polymer/v1_0/polymer/polymer.html">
   2 <link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/iron-flex-layout.html">
   3 <link rel="import" href="chrome://resources/polymer/v1_0/iron-icons/device-icons.html">
   4 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
   5 <link rel="import" href="chrome://resources/polymer/v1_0/paper-dialog/paper-dialog.html">
   6 <link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
   7 <link rel="import" href="chrome://resources/polymer/v1_0/paper-input/paper-input.html">
   8
   9 <dom-module id="bluetooth-settings">
  10   <link rel="import" type="css" href="bluetooth_settings.css">
  11   <template>
  12     <paper-dialog on-iron-overlay-opened="editDialogOpened" modal
  13         id="editModal">
  14       <div class="element-label">[[currentEditableObject.alias]]</div>
  15       <div>
  16         <form>
  17           <div class="form-field-section">
  18             <paper-input value="{{currentEditableObject.alias}}"
  19                 label="Alias"></paper-input>
  20             <paper-input on-input="validatePath"
  21                 id="devicePathInput"
  22                 value="{{currentEditableObject.path}}"
  23                 label="Path" on-input="validatePath"></paper-input>
  24             <paper-input value="{{currentEditableObject.name}}"
  25                 label="Name"></paper-input>
  26             <paper-input id="deviceAddressInput" on-input="handleAddressInput"
  27                 value="{{currentEditableObject.address}}"
  28                 label="Address (xx:xx:xx:xx:xx:xx)"
  29                 maxlength="17"></paper-input>
  30           </div>
  31           <div class="form-field-section">
  32             <span class="toggle-button-label">Trusted</span>
  33             <paper-checkbox
  34                 checked="{{currentEditableObject.isTrusted}}"></paper-checkbox>
  35           </div>
  36           <div class="form-field-section">
  37             <span class="toggle-button-label">Incoming Connnection</span>
  38             <paper-checkbox
  39                 checked="{{currentEditableObject.incoming}}"></paper-checkbox>
  40           </div>
  41           <div class="form-field-section">
  42             <div class="form-label">Class</div>
  43             <paper-radio-group class="device-class-group"
  44                 selected="{{currentEditableObject.class}}">
  45               <template is="dom-repeat"
  46                   items="[[deviceClassOptions]]" as="option">
  47                 <paper-radio-button name="[[option.text]]"
  48                     >[[option.text]]</paper-radio-button>
  49               </template>
  50             </paper-radio-group>
  51           </div>
  52           <div class="form-field-section">
  53             <label>
  54               <span class="form-label">Pair Authentication</span>
  55               <paper-radio-group
  56                   selected="{{currentEditableObject.pairingMethod}}">
  57                 <template is="dom-repeat"
  58                     items="[[deviceAuthenticationMethods]]" as="method">
  59                   <paper-radio-button name="[[method]]"
  60                       >[[method]]</paper-radio-button>
  61                 </template>
  62               </paper-radio-group>
  63             </label>
  64           </div>
  65           <div>
  66               <div class="form-field-section"
  67                   hidden$=
  68                       "[[!showAuthToken(currentEditableObject.pairingMethod)]]"
  69                       >
  70                 <paper-input value="{{currentEditableObject.pairingAuthToken}}"
  71                     label="Code"></paper-input>
  72               </div>
  73             <div class="form-field-section">
  74               <label>
  75                 <span class="form-label">Pairing Action</span>
  76                 <paper-radio-group
  77                     selected="{{currentEditableObject.pairingAction}}">
  78                   <template is="dom-repeat"
  79                       items="[[deviceAuthenticationActions]]">
  80                     <paper-radio-button name="[[item]]"
  81                         >[[item]]</paper-radio-button>
  82                   </template>
  83                 </paper-radio-group>
  84               </label>
  85             </div>
  86           </div>
  87         </form>
  88       </div>
  89       <div class="buttons">
  90         <paper-button dialog-dismiss>Close</paper-button>
  91       </div>
  92     </paper-dialog>
  93
  94     <div class="layout vertical">
  95       <div class="element-label">
  96         <paper-icon-button icon="device:bluetooth"></paper-icon-button>
  97         <span>[[title]]</span>
  98       </div>
  99       <table class="devices-table">
 100         <tbody>
 101           <tr class="table-section-header">
 102             <td colspan="2">Presets</td>
 103             <td class="centered-cell-label">Discoverable</td>
 104             <td class="centered-cell-label">Paired</td>
 105           </tr>
 106           <template is="dom-repeat" items="[[predefinedDevices]]">
 107             <tr>
 108               <td class="alias-cell">[[item.alias]]</td>
 109               <td class="icon-cell">
 110                 <paper-icon-button icon="content-copy"
 111                     on-click="copyDevice" data-predefined="true">
 112                 </paper-icon-button>
 113                 <paper-icon-button disabled icon="settings"></paper-icon-button>
 114                 <paper-icon-button disabled icon="delete"></paper-icon-button>
 115               </td>
 116               <td class="control-cell">
 117                 <paper-checkbox checked="{{item.discoverable}}"
 118                     data-predefined="true"
 119                     on-change="discoverDevice"></paper-checkbox>
 120               </td>
 121               <td class="control-cell">
 122                 <paper-checkbox on-change="pairDevice" data-predefined="true"
 123                     checked="{{item.paired}}"></paper-checkbox>
 124               </td>
 125             </tr>
 126           </template>
 127         </tbody>
 128         <tbody>
 129           <tr class="table-section-header">
 130             <td colspan="4">Custom</td>
 131           </tr>
 132           <template is="dom-repeat" items="[[devices]]">
 133             <tr>
 134               <td class="alias-cell">[[item.alias]]</td>
 135               <td class="icon-cell">
 136                 <paper-icon-button icon="content-copy" data-predefined="false"
 137                     on-click="copyDevice"></paper-icon-button>
 138                 <paper-icon-button icon="settings" on-click="showEditModal"
 139                     ></paper-icon-button>
 140                 <paper-icon-button icon="delete" on-click="deleteDevice"
 141                     ></paper-icon-button>
 142               </td>
 143               <td class="control-cell">
 144                 <paper-checkbox checked="{{item.discoverable}}"
 145                     data-predefined="false"
 146                     on-change="discoverDevice"></paper-checkbox>
 147               </td>
 148               <td class="control-cell">
 149                 <paper-checkbox checked="{{item.paired}}"
 150                     data-predefined="false"
 151                     on-change="pairDevice"></paper-checkbox>
 152               </td>
 153             </tr>
 154           </template>
 155         </tbody>
 156       </table>
 157       <div class="add-device-container">
 158         <paper-button on-click="appendNewDevice">
 159           Add Device
 160         </paper-button>
 161       </div>
 162     </div>
 163   </template>
 164   <script src="bluetooth_settings.js"></script>
 165 </dom-module>