chrome/browser/resources/settings/internet_page/network_nameservers.js

   1 // Copyright 2015 The Chromium Authors. All rights reserved.
   2 // Use of this source code is governed by a BSD-style license that can be
   3 // found in the LICENSE file.
   4
   5 /**
   6  * @fileoverview Polymer element for displaying network nameserver options.
   7  */
   8 (function() {
   9 'use strict';
  10
  11 Polymer({
  12   is: 'network-nameservers',
  13
  14   properties: {
  15     /**
  16      * The current state containing the IP Config properties to display and
  17      * modify.
  18      * @type {?CrOnc.NetworkStateProperties}
  19      */
  20     networkState: {
  21       type: Object,
  22       value: null,
  23       observer: 'networkStateChanged_'
  24     },
  25
  26     /**
  27      * Whether or not the nameservers can be edited.
  28      */
  29     editable: {
  30       type: Boolean,
  31       value: false
  32     },
  33
  34     /**
  35      * Array of nameserver addresses stored as strings.
  36      * @type {!Array<string>}
  37      */
  38     nameservers: {
  39       type: Array,
  40       value: function() { return []; }
  41     },
  42
  43     /**
  44      * The selected nameserver type.
  45      */
  46     nameserversType: {
  47       type: String,
  48       value: 'automatic'
  49     },
  50
  51     /**
  52      * Array of nameserver types.
  53      */
  54     nameserverTypeNames_: {
  55       type: Array,
  56       value: ['automatic', 'google', 'custom'],
  57       readOnly: true
  58     },
  59   },
  60
  61   /** @const */ GoogleNameservers: ['8.8.4.4', '8.8.8.8'],
  62
  63   /**
  64    * Saved nameservers when switching to 'automatic'.
  65    * @type {!Array<string>}
  66    */
  67   savedNameservers_: [],
  68
  69   /**
  70    * Polymer networkState changed method.
  71    */
  72   networkStateChanged_: function(newValue, oldValue) {
  73     if (!this.networkState)
  74       return;
  75
  76     if (!oldValue || newValue.GUID != oldValue.GUID)
  77       this.savedNameservers_ = [];
  78
  79     // Update the 'nameservers' property.
  80     var nameservers = [];
  81     var ipv4 = CrOnc.getIPConfigForType(this.networkState, CrOnc.IPType.IPV4);
  82     if (ipv4 && ipv4.NameServers)
  83       nameservers = ipv4.NameServers;
  84
  85     // Update the 'nameserversType' property.
  86     var configType =
  87         CrOnc.getActiveValue(this.networkState, 'NameServersConfigType');
  88     var type;
  89     if (configType == CrOnc.IPConfigType.STATIC) {
  90       if (nameservers.join(',') == this.GoogleNameservers.join(','))
  91         type = 'google';
  92       else
  93         type = 'custom';
  94     } else {
  95       type = 'automatic';
  96     }
  97     this.nameserversType = type;
  98     this.$$('#type').selectedIndex = this.getSelectedIndex_(type);
  99
 100     this.nameservers = nameservers;
 101   },
 102
 103   /**
 104    * @param {string} nameserversType The nameservers type.
 105    * @return {number} The selected index for |nameserversType|.
 106    * @private
 107    */
 108   getSelectedIndex_: function(nameserversType) {
 109     var idx = this.nameserverTypeNames_.indexOf(nameserversType);
 110     if (idx != -1)
 111       return idx;
 112     console.error('Unexpected type: ' + nameserversType);
 113     return 0;
 114   },
 115
 116   /**
 117    * @param {string} nameserversType The nameservers type.
 118    * @return {string} The description for |nameserversType|.
 119    * @private
 120    */
 121   nameserverTypeDesc_: function(nameserversType) {
 122     // TODO(stevenjb): Translate.
 123     if (nameserversType == 'custom')
 124       return 'Custom name servers';
 125     if (nameserversType == 'google')
 126       return 'Google name servers';
 127     return 'Automatic name servers';
 128   },
 129
 130   /**
 131    * @param {boolean} editable The editable state.
 132    * @param {string} nameserversType The nameservers type.
 133    * @return {boolean} True if the nameservers are editable.
 134    * @private
 135    */
 136   canEdit_: function(editable, nameserversType) {
 137     return editable && nameserversType == 'custom';
 138   },
 139
 140   /**
 141    * Event triggered when the selected type changes. Updates nameservers and
 142    * sends the change value if necessary.
 143    * @param {Event} event The select node change event.
 144    * @private
 145    */
 146   onTypeChange_: function(event) {
 147     if (this.nameserversType == 'custom')
 148       this.savedNameservers_ = this.nameservers;
 149     var type = this.nameserverTypeNames_[event.target.selectedIndex];
 150     this.nameserversType = type;
 151     if (type == 'custom') {
 152       if (this.savedNameservers_.length == 0)
 153         return;  // Don't change nameservers until onValueChange_().
 154       // Restore the saved nameservers and send them.
 155       this.nameservers = this.savedNameservers_;
 156     }
 157     this.sendNameServers_();
 158   },
 159
 160   /**
 161    * Event triggered when a nameserver value changes.
 162    * @private
 163    */
 164   onValueChange_: function() {
 165     if (this.nameserversType != 'custom') {
 166       // If a user inputs Google nameservers in the custom nameservers fields,
 167       // |nameserversType| will change to 'google' so don't send the values.
 168       return;
 169     }
 170     this.sendNameServers_();
 171   },
 172
 173   /**
 174    * Sends the current nameservers type (for automatic) or value.
 175    * @private
 176    */
 177   sendNameServers_: function() {
 178     var type = this.nameserversType;
 179
 180     var nameservers;
 181     if (type == 'custom') {
 182       nameservers = [];
 183       for (let i = 0; i < 4; ++i) {
 184         let id = 'nameserver' + i;
 185         let nameserver = this.$$('#' + id).value;
 186         if (nameserver)
 187           nameservers.push(nameserver);
 188       }
 189       this.fire('nameservers-change', {
 190         field: 'NameServers',
 191         value: nameservers
 192       });
 193     } else if (type == 'google') {
 194       nameservers = this.GoogleNameservers;
 195       this.fire('nameservers-change', {
 196         field: 'NameServers',
 197         value: nameservers
 198       });
 199     } else {
 200       // automatic
 201       this.fire('nameservers-change', {
 202         field: 'NameServersConfigType',
 203         value: CrOnc.IPConfigType.DHCP
 204       });
 205     }
 206   },
 207 });
 208 })();