Upstream version 10.38.220.0
[platform/framework/web/crosswalk.git] / src / chrome / browser / resources / options / chromeos / internet_detail.js
index 7fc6c6e..bab8786 100644 (file)
@@ -2,27 +2,57 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
+// NOTE(stevenjb): This code is in the process of being converted to be
+// compatible with the networkingPrivate extension API:
+// * The network property dictionaries are being converted to use ONC values.
+// * chrome.send calls will be replaced with an API object that simulates the
+//   networkingPrivate API. See network_config.js.
+// See crbug.com/279351 for more info.
+
 cr.define('options.internet', function() {
-  var OptionsPage = options.OptionsPage;
+  var Page = cr.ui.pageManager.Page;
+  var PageManager = cr.ui.pageManager.PageManager;
   /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
   /** @const */ var IPAddressField = options.internet.IPAddressField;
 
   /**
-   * Network settings constants. These enums must match their C++
-   * counterparts.
+   * Helper function to get the "Active" value of a property from a dictionary
+   * that includes ONC managed properties, e.g. getActiveValue(data, 'Name').
+   * We use (data, key) instead of getActiveValue(data[key]) so that we can
+   * (possibly) add ONC key validation once all properties use ONC.
+   * @param {object} data The properties dictionary.
+   * @param {string} key The property key.
+   * @return {*} the property value or undefined.
    */
-  function Constants() {}
+  function getActiveValue(data, key) {
+    if (!(key in data))
+      return undefined;
+    var property = data[key];
+    if (typeof property != 'object')
+      return property;
+    if ('Active' in property)
+      return property['Active'];
+    if ('Effective' in property) {
+      var effective = property.Effective;
+      if (effective in property)
+        return property[effective];
+    }
+    return undefined;
+  }
 
-  // Network types:
-  Constants.TYPE_UNKNOWN = 'UNKNOWN';
-  Constants.TYPE_ETHERNET = 'ethernet';
-  Constants.TYPE_WIFI = 'wifi';
-  Constants.TYPE_WIMAX = 'wimax';
-  Constants.TYPE_BLUETOOTH = 'bluetooth';
-  Constants.TYPE_CELLULAR = 'cellular';
-  Constants.TYPE_VPN = 'vpn';
+  /**
+   * Helper function for nested ONC properties, e.g. data[WiFi][Strength].
+   * @param {object|string} property The property which must ether be
+   *   a dictionary object or not be present.
+   * @return {*} the property value or undefined.
+   */
+  function getActiveDictionaryValue(data, dict, key) {
+    if (!(dict in data))
+      return undefined;
+    return getActiveValue(data[dict], key);
+  }
 
-  /*
+  /**
    * Helper function to set hidden attribute for elements matching a selector.
    * @param {string} selector CSS selector for extracting a list of elements.
    * @param {bool} hidden New hidden value.
@@ -41,7 +71,7 @@ cr.define('options.internet', function() {
    * @param {object} object containing the updated properties.
    */
   function updateDataObject(data, update) {
-    for (prop in update) {
+    for (var prop in update) {
       if (prop in data)
         data[prop] = update[prop];
     }
@@ -84,6 +114,30 @@ cr.define('options.internet', function() {
       chrome.send(message, [path, checkbox.checked ? 'true' : 'false']);
   }
 
+  /**
+   * Looks up the string to display for 'state' in loadTimeData.
+   * @param {string} state The ONC State property of a network.
+   */
+  function networkOncStateString(state) {
+    if (state == 'NotConnected')
+      return loadTimeData.getString('OncStateNotConnected');
+    else if (state == 'Connecting')
+      return loadTimeData.getString('OncStateConnecting');
+    else if (state == 'Connected')
+      return loadTimeData.getString('OncStateConnected');
+    return loadTimeData.getString('OncStateUnknown');
+  }
+
+  /**
+   * Returns the display name for the network represented by 'data'.
+   * @param {Object} data The network ONC dictionary.
+   */
+  function getNetworkName(data) {
+    if (data.type == 'Ethernet')
+      return loadTimeData.getString('ethernetName');
+    return getActiveValue(data, 'Name');
+  }
+
   /////////////////////////////////////////////////////////////////////////////
   // DetailsInternetPage class:
 
@@ -92,23 +146,17 @@ cr.define('options.internet', function() {
    * @constructor
    */
   function DetailsInternetPage() {
-    OptionsPage.call(this,
-                     'detailsInternetPage',
-                     null,
-                     'details-internet-page');
+    Page.call(this, 'detailsInternetPage', null, 'details-internet-page');
   }
 
   cr.addSingletonGetter(DetailsInternetPage);
 
   DetailsInternetPage.prototype = {
-    __proto__: OptionsPage.prototype,
+    __proto__: Page.prototype,
 
-    /**
-     * Initializes DetailsInternetPage page.
-     * Calls base class implementation to starts preference initialization.
-     */
+    /** @override */
     initializePage: function() {
-      OptionsPage.prototype.initializePage.call(this);
+      Page.prototype.initializePage.call(this);
       var params = parseQueryParams(window.location);
       this.initializePageContents_(params);
       this.showNetworkDetails_(params);
@@ -126,7 +174,6 @@ cr.define('options.internet', function() {
       chrome.send('networkCommand', [networkType, servicePath, 'options']);
     },
 
-
     /**
      * Initializes the contents of the page.
      */
@@ -159,13 +206,13 @@ cr.define('options.internet', function() {
       $('buyplan-details').addEventListener('click', function(event) {
         var data = $('connection-state').data;
         chrome.send('buyDataPlan', [data.servicePath]);
-        OptionsPage.closeOverlay();
+        PageManager.closeOverlay();
       });
 
       $('view-account-details').addEventListener('click', function(event) {
         var data = $('connection-state').data;
         chrome.send('showMorePlanInfo', [data.servicePath]);
-        OptionsPage.closeOverlay();
+        PageManager.closeOverlay();
       });
 
       $('cellular-apn-use-default').addEventListener('click', function(event) {
@@ -391,9 +438,64 @@ cr.define('options.internet', function() {
     },
 
     /**
-     * Update details page controls.
+     * Creates an indicator event for controlled properties using
+     * the same dictionary format as CoreOptionsHandler::CreateValueForPref.
+     * @param {string} name The name for the Event.
+     * @param {Object} data Property dictionary with |value|, |controlledBy|,
+     *  and |recommendedValue| properties set.
      * @private
      */
+    createControlledEvent_: function(name, propData) {
+      var event = new Event(name);
+      event.value = {
+        value: propData.value,
+        controlledBy: propData.controlledBy,
+        recommendedValue: propData.recommendedValue
+      };
+      return event;
+    },
+
+    /**
+     * Creates an indicator event for controlled properties using
+     * the ONC getManagedProperties dictionary format.
+     * @param {string} name The name for the Event.
+     * @param {Object} data ONC managed network property dictionary.
+     * @private
+     */
+    createManagedEvent_: function(name, propData) {
+      var event = new Event(name);
+      event.value = {};
+
+      // Set the current value and recommended value.
+      var activeValue = propData['Active'];
+      var effective = propData['Effective'];
+      if (activeValue == undefined)
+        activeValue = propData[effective];
+      event.value.value = activeValue;
+
+      // If a property is editable then it is not enforced, and 'controlledBy'
+      // is set to 'recommended' unless effective == {User|Shared}Setting, in
+      // which case the value was modifed from the recommended value.
+      // Otherwise if 'Effective' is set to 'UserPolicy' or 'DevicePolicy' then
+      // the set value is mandated by the policy.
+      if (propData['UserEditable']) {
+        if (effective == 'UserPolicy')
+          event.value.controlledBy = 'recommended';
+        event.value.recommendedValue = propData['UserPolicy'];
+      } else if (propData['DeviceEditable']) {
+        if (effective == 'DevicePolicy')
+          event.value.controlledBy = 'recommended';
+        event.value.recommendedValue = propData['DevicePolicy'];
+      } else if (effective == 'UserPolicy' || effective == 'DevicePolicy') {
+        event.value.controlledBy = 'policy';
+      }
+
+      return event;
+    },
+
+    /**
+     * Update details page controls.
+     */
     updateControls: function() {
       // Only show ipconfig section if network is connected OR if nothing on
       // this device is connected. This is so that you can fix the ip configs
@@ -405,27 +507,33 @@ cr.define('options.internet', function() {
         !this.connected && this.deviceConnected;
 
       // Network type related.
-      updateHidden('#details-internet-page .cellular-details', !this.cellular);
-      updateHidden('#details-internet-page .wifi-details', !this.wireless);
-      updateHidden('#details-internet-page .wimax-details', !this.wimax);
-      updateHidden('#details-internet-page .vpn-details', !this.vpn);
+      updateHidden('#details-internet-page .cellular-details',
+                   this.type != 'Cellular');
+      updateHidden('#details-internet-page .wifi-details',
+                   this.type != 'WiFi');
+      updateHidden('#details-internet-page .wimax-details',
+                   this.type != 'Wimax');
+      updateHidden('#details-internet-page .vpn-details', this.type != 'VPN');
       updateHidden('#details-internet-page .proxy-details', !this.showProxy);
+
+      // Cellular
+
       // Conditionally call updateHidden on .gsm-only, so that we don't unhide
       // a previously hidden element.
       if (this.gsm)
         updateHidden('#details-internet-page .cdma-only', true);
       else
         updateHidden('#details-internet-page .gsm-only', true);
-      /* Network information merged into the Wifi tab for wireless networks
-         unless the option is set for enabling a static IP configuration. */
+
+      // Wifi
+
+      // Hide network tab for VPN.
       updateHidden('#details-internet-page .network-details',
-                   (this.wireless && !this.showStaticIPConfig) || this.vpn);
-      updateHidden('#details-internet-page .wifi-network-setting',
-                   this.showStaticIPConfig);
+                   this.type == 'VPN');
 
-      // Wifi - Password and shared.
+      // Password and shared.
       updateHidden('#details-internet-page #password-details',
-                   !this.wireless || !this.password);
+                   this.type != 'WiFi' || !this.hasSecurity);
       updateHidden('#details-internet-page #wifi-shared-network',
           !this.shared);
       updateHidden('#details-internet-page #prefer-network',
@@ -433,7 +541,7 @@ cr.define('options.internet', function() {
 
       // WiMAX.
       updateHidden('#details-internet-page #wimax-shared-network',
-        !this.shared);
+                   !this.shared);
 
       // Proxy
       this.updateProxyBannerVisibility_();
@@ -560,7 +668,7 @@ cr.define('options.internet', function() {
       $('manual-proxy-parms').hidden = !$('manual-proxy').checked;
       chrome.send('coreOptionsUserMetricsAction',
                   ['Options_NetworkManualProxy_Enable']);
-    },
+    }
   };
 
   /**
@@ -577,7 +685,7 @@ cr.define('options.internet', function() {
                   'view-account-details');
 
     for (var i = 0; i < buttonsToDisableList.length; ++i) {
-      button = $(buttonsToDisableList[i]);
+      var button = $(buttonsToDisableList[i]);
       button.disabled = disable;
     }
   };
@@ -621,9 +729,6 @@ cr.define('options.internet', function() {
     $('activate-details').hidden = true;
     $('view-account-details').hidden = true;
     $('web-proxy-auto-discovery').hidden = true;
-    detailsPage.cellular = false;
-    detailsPage.wireless = false;
-    detailsPage.vpn = false;
     detailsPage.showProxy = true;
     updateHidden('#internet-tab', true);
     updateHidden('#details-tab-strip', true);
@@ -648,19 +753,19 @@ cr.define('options.internet', function() {
       if (type == 'cros.session.proxy.singlehttp') {
         proxyHost = 'proxy-host-single-name';
         proxyPort = 'proxy-host-single-port';
-      }else if (type == 'cros.session.proxy.httpurl') {
+      } else if (type == 'cros.session.proxy.httpurl') {
         proxyHost = 'proxy-host-name';
         proxyPort = 'proxy-host-port';
-      }else if (type == 'cros.session.proxy.httpsurl') {
+      } else if (type == 'cros.session.proxy.httpsurl') {
         proxyHost = 'secure-proxy-host-name';
         proxyPort = 'secure-proxy-port';
-      }else if (type == 'cros.session.proxy.ftpurl') {
+      } else if (type == 'cros.session.proxy.ftpurl') {
         proxyHost = 'ftp-proxy';
         proxyPort = 'ftp-proxy-port';
-      }else if (type == 'cros.session.proxy.socks') {
+      } else if (type == 'cros.session.proxy.socks') {
         proxyHost = 'socks-host';
         proxyPort = 'socks-port';
-      }else {
+      } else {
         return;
       }
 
@@ -678,64 +783,50 @@ cr.define('options.internet', function() {
     DetailsInternetPage.showCarrierChangeSpinner(false);
   };
 
-  DetailsInternetPage.updateSecurityTab = function(requirePin) {
-    $('sim-card-lock-enabled').checked = requirePin;
-    $('change-pin').hidden = !requirePin;
-  };
-
   DetailsInternetPage.loginFromDetails = function() {
     var data = $('connection-state').data;
     var servicePath = data.servicePath;
-    chrome.send('networkCommand', [String(data.type),
-                                          servicePath,
-                                          'connect']);
-    OptionsPage.closeOverlay();
+    chrome.send('networkCommand', [data.type, servicePath, 'connect']);
+    PageManager.closeOverlay();
   };
 
   DetailsInternetPage.disconnectNetwork = function() {
     var data = $('connection-state').data;
     var servicePath = data.servicePath;
-    chrome.send('networkCommand', [String(data.type),
-                                          servicePath,
-                                          'disconnect']);
-    OptionsPage.closeOverlay();
+    chrome.send('networkCommand', [data.type, servicePath, 'disconnect']);
+    PageManager.closeOverlay();
   };
 
   DetailsInternetPage.configureNetwork = function() {
     var data = $('connection-state').data;
     var servicePath = data.servicePath;
-    chrome.send('networkCommand', [String(data.type),
-                                          servicePath,
-                                          'configure']);
-    OptionsPage.closeOverlay();
+    chrome.send('networkCommand', [data.type, servicePath, 'configure']);
+    PageManager.closeOverlay();
   };
 
   DetailsInternetPage.activateFromDetails = function() {
     var data = $('connection-state').data;
     var servicePath = data.servicePath;
-    if (data.type == Constants.TYPE_CELLULAR) {
-      chrome.send('networkCommand', [String(data.type),
-                                            servicePath,
-                                            'activate']);
-    }
-    OptionsPage.closeOverlay();
+    if (data.Type == 'Cellular')
+      chrome.send('networkCommand', [data.type, servicePath, 'activate']);
+    PageManager.closeOverlay();
   };
 
   DetailsInternetPage.setDetails = function() {
     var data = $('connection-state').data;
     var servicePath = data.servicePath;
-    if (data.type == Constants.TYPE_WIFI) {
+    if (data.type == 'WiFi') {
       sendCheckedIfEnabled(servicePath, 'setPreferNetwork',
                            $('prefer-network-wifi'));
       sendCheckedIfEnabled(servicePath, 'setAutoConnect',
                            $('auto-connect-network-wifi'));
-    } else if (data.type == Constants.TYPE_WIMAX) {
+    } else if (data.type == 'Wimax') {
       sendCheckedIfEnabled(servicePath, 'setAutoConnect',
                            $('auto-connect-network-wimax'));
-    } else if (data.type == Constants.TYPE_CELLULAR) {
+    } else if (data.type == 'Cellular') {
       sendCheckedIfEnabled(servicePath, 'setAutoConnect',
                            $('auto-connect-network-cellular'));
-    } else if (data.type == Constants.TYPE_VPN) {
+    } else if (data.type == 'VPN') {
       chrome.send('setServerHostname',
                   [servicePath,
                    $('inet-server-hostname').value]);
@@ -772,7 +863,7 @@ cr.define('options.internet', function() {
                  $('ip-gateway').model.value || '',
                  nameServerType,
                  userNameServers]);
-    OptionsPage.closeOverlay();
+    PageManager.closeOverlay();
   };
 
   DetailsInternetPage.updateNameServerDisplay = function(type) {
@@ -808,25 +899,36 @@ cr.define('options.internet', function() {
   };
 
   DetailsInternetPage.updateConnectionButtonVisibilty = function(data) {
-    $('details-internet-login').hidden = data.connected;
-    $('details-internet-login').disabled = data.disableConnectButton;
-
-    if (!data.connected &&
-        ((data.type == Constants.TYPE_WIFI && data.encryption) ||
-          data.type == Constants.TYPE_WIMAX ||
-          data.type == Constants.TYPE_VPN)) {
+    if (data.type == 'Ethernet') {
+      // Ethernet can never be connected or disconnected and can always be
+      // configured (e.g. to set security).
+      $('details-internet-login').hidden = true;
+      $('details-internet-disconnect').hidden = true;
       $('details-internet-configure').hidden = false;
-    } else if (data.type == Constants.TYPE_ETHERNET) {
-      // Ethernet (802.1x) can be configured while connected.
+      return;
+    }
+
+    var connectState = getActiveValue(data, 'ConnectionState');
+    if (connectState == 'NotConnected') {
+      $('details-internet-login').hidden = false;
+      // Connecting to an unconfigured network might trigger certificate
+      // installation UI. Until that gets handled here, always enable the
+      // Connect button.
+      $('details-internet-login').disabled = false;
+      $('details-internet-disconnect').hidden = true;
+    } else {
+      $('details-internet-login').hidden = true;
+      $('details-internet-disconnect').hidden = false;
+    }
+
+    var connectable = getActiveValue(data, 'Connectable');
+    if (connectState != 'Connected' &&
+        (!connectable || this.hasSecurity ||
+        (data.type == 'Wimax' || data.type == 'VPN'))) {
       $('details-internet-configure').hidden = false;
     } else {
       $('details-internet-configure').hidden = true;
     }
-
-    if (data.type == Constants.TYPE_ETHERNET)
-      $('details-internet-disconnect').hidden = true;
-    else
-      $('details-internet-disconnect').hidden = !data.connected;
   };
 
   DetailsInternetPage.updateConnectionData = function(update) {
@@ -844,18 +946,19 @@ cr.define('options.internet', function() {
     // Update our cached data object.
     updateDataObject(data, update);
 
+    var connectionState = getActiveValue(data, 'ConnectionState');
+    var connectionStateString = networkOncStateString(connectionState);
     detailsPage.deviceConnected = data.deviceConnected;
-    detailsPage.connecting = data.connecting;
-    detailsPage.connected = data.connected;
-    $('connection-state').textContent = data.connectionState;
+    detailsPage.connected = connectionState == 'Connected';
+    $('connection-state').textContent = connectionStateString;
 
     this.updateConnectionButtonVisibilty(data);
 
-    if (data.type == Constants.TYPE_WIFI) {
-      $('wifi-connection-state').textContent = data.connectionState;
-    } else if (data.type == Constants.TYPE_WIMAX) {
-      $('wimax-connection-state').textContent = data.connectionState;
-    } else if (data.type == Constants.TYPE_CELLULAR) {
+    if (data.type == 'WiFi') {
+      $('wifi-connection-state').textContent = connectionStateString;
+    } else if (data.type == 'Wimax') {
+      $('wimax-connection-state').textContent = connectionStateString;
+    } else if (data.type == 'Cellular') {
       $('activation-state').textContent = data.activationState;
 
       $('buyplan-details').hidden = !data.showBuyButton;
@@ -864,6 +967,13 @@ cr.define('options.internet', function() {
       $('activate-details').hidden = !data.showActivateButton;
       if (data.showActivateButton)
         $('details-internet-login').hidden = true;
+
+      if (detailsPage.gsm) {
+        // TODO(stevenjb): Use managed properties for policy controlled values.
+        var lockEnabled = data.simCardLockEnabled.value;
+        $('sim-card-lock-enabled').checked = lockEnabled;
+        $('change-pin').hidden = !lockEnabled;
+      }
     }
 
     $('connection-state').data = data;
@@ -872,29 +982,31 @@ cr.define('options.internet', function() {
   DetailsInternetPage.showDetailedInfo = function(data) {
     var detailsPage = DetailsInternetPage.getInstance();
 
+    data.type = getActiveValue(data, 'Type');  // Get Active Type value.
+
     // Populate header
-    $('network-details-title').textContent = data.networkName;
-    var statusKey = data.connected ? 'networkConnected' :
-                                     'networkNotConnected';
-    $('network-details-subtitle-status').textContent =
-        loadTimeData.getString(statusKey);
+    $('network-details-title').textContent = getNetworkName(data);
+    var connectionState = getActiveValue(data, 'ConnectionState');
+    var connectionStateString = networkOncStateString(connectionState);
+    detailsPage.connected = connectionState == 'Connected';
+    $('network-details-subtitle-status').textContent = connectionStateString;
     var typeKey = null;
     switch (data.type) {
-    case Constants.TYPE_ETHERNET:
-      typeKey = 'ethernetTitle';
-      break;
-    case Constants.TYPE_WIFI:
-      typeKey = 'wifiTitle';
-      break;
-    case Constants.TYPE_WIMAX:
-      typeKey = 'wimaxTitle';
-      break;
-    case Constants.TYPE_CELLULAR:
-      typeKey = 'cellularTitle';
-      break;
-    case Constants.TYPE_VPN:
-      typeKey = 'vpnTitle';
-      break;
+      case 'Ethernet':
+        typeKey = 'ethernetTitle';
+        break;
+      case 'WiFi':
+        typeKey = 'wifiTitle';
+        break;
+      case 'Wimax':
+        typeKey = 'wimaxTitle';
+        break;
+      case 'Cellular':
+        typeKey = 'cellularTitle';
+        break;
+      case 'VPN':
+        typeKey = 'vpnTitle';
+        break;
     }
     var typeLabel = $('network-details-subtitle-type');
     var typeSeparator = $('network-details-subtitle-separator');
@@ -907,8 +1019,7 @@ cr.define('options.internet', function() {
       typeSeparator.hidden = true;
     }
 
-    // TODO(chocobo): Is this hack to cache the data here reasonable?
-    // TODO(kevers): Find more appropriate place to cache data.
+    // TODO(stevenjb): Find a more appropriate place to cache data.
     $('connection-state').data = data;
 
     $('buyplan-details').hidden = true;
@@ -920,14 +1031,16 @@ cr.define('options.internet', function() {
     $('web-proxy-auto-discovery').hidden = true;
 
     detailsPage.deviceConnected = data.deviceConnected;
-    detailsPage.connecting = data.connecting;
-    detailsPage.connected = data.connected;
-    detailsPage.showProxy = data.showProxy;
-    if (detailsPage.showProxy)
-      chrome.send('selectNetwork', [data.servicePath]);
+    detailsPage.connected = connectionState == 'Connected';
 
-    detailsPage.showStaticIPConfig = data.showStaticIPConfig;
-    $('connection-state').textContent = data.connectionState;
+    // Only show proxy for remembered networks.
+    if (data.remembered) {
+      detailsPage.showProxy = true;
+      chrome.send('selectNetwork', [data.servicePath]);
+    } else {
+      detailsPage.showProxy = false;
+    }
+    $('connection-state').textContent = connectionStateString;
 
     var ipAutoConfig = data.ipAutoConfig ? 'automatic' : 'user';
     $('ip-automatic-configuration-checkbox').checked = data.ipAutoConfig;
@@ -1017,90 +1130,88 @@ cr.define('options.internet', function() {
 
     DetailsInternetPage.updateNameServerDisplay(data.nameServerType);
 
-    if (data.hardwareAddress) {
-      $('hardware-address').textContent = data.hardwareAddress;
+    var macAddress = getActiveValue(data, 'MacAddress');
+    if (macAddress) {
+      $('hardware-address').textContent = macAddress;
       $('hardware-address-row').style.display = 'table-row';
     } else {
       // This is most likely a device without a hardware address.
       $('hardware-address-row').style.display = 'none';
     }
-    if (data.type == Constants.TYPE_WIFI) {
+
+    var setOrHideParent = function(field, property) {
+      if (property) {
+        $(field).textContent = property;
+        $(field).parentElement.hidden = false;
+      } else {
+        $(field).parentElement.hidden = true;
+      }
+    };
+
+    var networkName = getNetworkName(data);
+
+    // Signal strength as percentage (for WiFi and Wimax).
+    var signalStrength;
+    if (data.type == 'WiFi') {
+      signalStrength =
+          getActiveDictionaryValue(data, data.type, 'SignalStrength');
+    } else if (data.type == 'Wimax') {
+      // Wimax is not yet translated to ONC.
+      signalStrength = data.strength;
+    }
+    if (!signalStrength)
+      signalStrength = 0;
+    var strengthFormat = loadTimeData.getString('inetSignalStrengthFormat');
+    var strengthString = strengthFormat.replace('$1', signalStrength);
+
+    detailsPage.type = data.type;
+    if (data.type == 'WiFi') {
+      assert(data.WiFi, 'WiFi network has no WiFi object: ' + networkName);
       OptionsPage.showTab($('wifi-network-nav-tab'));
-      detailsPage.wireless = true;
-      detailsPage.vpn = false;
-      detailsPage.ethernet = false;
-      detailsPage.cellular = false;
       detailsPage.gsm = false;
-      detailsPage.wimax = false;
       detailsPage.shared = data.shared;
-      $('wifi-connection-state').textContent = data.connectionState;
-      $('wifi-ssid').textContent = data.ssid;
-      if (data.bssid && data.bssid.length > 0) {
-        $('wifi-bssid').textContent = data.bssid;
-        $('wifi-bssid-entry').hidden = false;
-      } else {
-        $('wifi-bssid-entry').hidden = true;
-      }
-      $('wifi-ip-address').textContent = inetAddress.value;
-      $('wifi-netmask').textContent = inetNetmask.value;
-      $('wifi-gateway').textContent = inetGateway.value;
-      $('wifi-name-servers').textContent = inetNameServers;
-      if (data.encryption && data.encryption.length > 0) {
-        $('wifi-security').textContent = data.encryption;
-        $('wifi-security-entry').hidden = false;
-      } else {
-        $('wifi-security-entry').hidden = true;
-      }
+      $('wifi-connection-state').textContent = connectionStateString;
+      var ssid = getActiveDictionaryValue(data, 'WiFi', 'SSID');
+      $('wifi-ssid').textContent = ssid ? ssid : networkName;
+      setOrHideParent('wifi-bssid',
+                      getActiveDictionaryValue(data, 'WiFi', 'BSSID'));
+      var security = getActiveDictionaryValue(data, 'WiFi', 'Security');
+      if (security == 'None')
+        security = undefined;
+      setOrHideParent('wifi-security', security);
       // Frequency is in MHz.
-      var frequency = loadTimeData.getString('inetFrequencyFormat');
-      frequency = frequency.replace('$1', data.frequency);
-      $('wifi-frequency').textContent = frequency;
-      // Signal strength as percentage.
-      var signalStrength = loadTimeData.getString('inetSignalStrengthFormat');
-      signalStrength = signalStrength.replace('$1', data.strength);
-      $('wifi-signal-strength').textContent = signalStrength;
-      if (data.hardwareAddress) {
-        $('wifi-hardware-address').textContent = data.hardwareAddress;
-        $('wifi-hardware-address-entry').hidden = false;
-      } else {
-        $('wifi-hardware-address-entry').hidden = true;
-      }
-      detailsPage.showPreferred = data.showPreferred;
+      var frequency = getActiveDictionaryValue(data, 'WiFi', 'Frequency');
+      if (!frequency)
+        frequency = 0;
+      var frequencyFormat = loadTimeData.getString('inetFrequencyFormat');
+      frequencyFormat = frequencyFormat.replace('$1', frequency);
+      $('wifi-frequency').textContent = frequencyFormat;
+      $('wifi-signal-strength').textContent = strengthString;
+      setOrHideParent('wifi-hardware-address',
+                      getActiveValue(data, 'MacAddress'));
+      detailsPage.showPreferred = data.remembered;
       $('prefer-network-wifi').checked = data.preferred.value;
       $('prefer-network-wifi').disabled = !data.remembered;
-      $('auto-connect-network-wifi').checked = data.autoConnect.value;
+      $('auto-connect-network-wifi').checked =
+          getActiveValue(data, 'AutoConnect');
       $('auto-connect-network-wifi').disabled = !data.remembered;
-      detailsPage.password = data.encrypted;
-    } else if (data.type == Constants.TYPE_WIMAX) {
+      detailsPage.hasSecurity = security != undefined;
+    } else if (data.type == 'Wimax') {
+      // Note: Wimax is not yet translated to ONC.
       OptionsPage.showTab($('wimax-network-nav-tab'));
-      detailsPage.wimax = true;
-      detailsPage.wireless = false;
-      detailsPage.vpn = false;
-      detailsPage.ethernet = false;
-      detailsPage.cellular = false;
       detailsPage.gsm = false;
       detailsPage.shared = data.shared;
-      detailsPage.showPreferred = data.showPreferred;
-      $('wimax-connection-state').textContent = data.connectionState;
-      $('auto-connect-network-wimax').checked = data.autoConnect.value;
+      detailsPage.showPreferred = data.remembered;
+      $('wimax-connection-state').textContent = connectionStateString;
+      $('auto-connect-network-wimax').checked =
+          getActiveValue(data, 'AutoConnect');
       $('auto-connect-network-wimax').disabled = !data.remembered;
-      if (data.identity) {
-        $('wimax-eap-identity').textContent = data.identity;
-        $('wimax-eap-identity-entry').hidden = false;
-      } else {
-        $('wimax-eap-identity-entry').hidden = true;
-      }
-      // Signal strength as percentage.
-      var signalStrength = loadTimeData.getString('inetSignalStrengthFormat');
-      signalStrength = signalStrength.replace('$1', data.strength);
-      $('wimax-signal-strength').textContent = signalStrength;
-    } else if (data.type == Constants.TYPE_CELLULAR) {
+      setOrHideParent('wimax-eap-identity', data.identity);
+      $('wimax-signal-strength').textContent = strengthString;
+    } else if (data.type == 'Cellular') {
+      assert(data.Cellular,
+             'Cellular network has no Cellular object: ' + networkName);
       OptionsPage.showTab($('cellular-conn-nav-tab'));
-      detailsPage.ethernet = false;
-      detailsPage.wireless = false;
-      detailsPage.wimax = false;
-      detailsPage.vpn = false;
-      detailsPage.cellular = true;
       if (data.showCarrierSelect && data.currentCarrierIndex != -1) {
         var carrierSelector = $('select-carrier');
         carrierSelector.onchange = DetailsInternetPage.handleCarrierChanged;
@@ -1112,46 +1223,58 @@ cr.define('options.internet', function() {
         }
         carrierSelector.selectedIndex = data.currentCarrierIndex;
       } else {
-        $('service-name').textContent = data.serviceName;
+        $('service-name').textContent = networkName;
       }
 
-      $('network-technology').textContent = data.networkTechnology;
+      $('network-technology').textContent =
+          getActiveDictionaryValue(data, 'Cellular', 'NetworkTechnology');
       $('activation-state').textContent = data.activationState;
       $('roaming-state').textContent = data.roamingState;
       $('restricted-pool').textContent = data.restrictedPool;
-      $('error-state').textContent = data.errorState;
-      $('manufacturer').textContent = data.cellularManufacturer;
-      $('model-id').textContent = data.modelId;
-      $('firmware-revision').textContent = data.firmwareRevision;
-      $('hardware-revision').textContent = data.hardwareRevision;
-      $('mdn').textContent = data.mdn;
-      $('operator-name').textContent = data.operatorName;
-      $('operator-code').textContent = data.operatorCode;
-
+      $('error-state').textContent = data.errorMessage;
+      $('manufacturer').textContent =
+          getActiveDictionaryValue(data, 'Cellular', 'Manufacturer');
+      $('model-id').textContent =
+          getActiveDictionaryValue(data, 'Cellular', 'ModelID');
+      $('firmware-revision').textContent =
+          getActiveDictionaryValue(data, 'Cellular', 'FirmwareRevision');
+      $('hardware-revision').textContent =
+          getActiveDictionaryValue(data, 'Cellular', 'HardwareRevision');
+      $('mdn').textContent = getActiveDictionaryValue(data, 'Cellular', 'MDN');
+
+      // Show ServingOperator properties only if available.
+      if (data.Cellular.ServingOperator) {
+        $('operator-name').textContent =
+            getActiveValue(data.Cellular.ServingOperator, 'Name');
+        $('operator-code').textContent =
+            getActiveValue(data.Cellular.ServingOperator, 'Code');
+      } else {
+        $('operator-name').parentElement.hidden = true;
+        $('operator-code').parentElement.hidden = true;
+      }
       // Make sure that GSM/CDMA specific properties that shouldn't be hidden
       // are visible.
       updateHidden('#details-internet-page .gsm-only', false);
       updateHidden('#details-internet-page .cdma-only', false);
 
       // Show IMEI/ESN/MEID/MIN/PRL only if they are available.
-      (function() {
-        var setContentOrHide = function(property) {
-          var value = data[property];
-          if (value)
-            $(property).textContent = value;
-          else
-            $(property).parentElement.hidden = true;
-        };
-        setContentOrHide('esn');
-        setContentOrHide('imei');
-        setContentOrHide('meid');
-        setContentOrHide('min');
-        setContentOrHide('prl-version');
-      })();
-      detailsPage.gsm = data.gsm;
-      if (data.gsm) {
-        $('iccid').textContent = stringFromValue(data.iccid);
-        $('imsi').textContent = stringFromValue(data.imsi);
+      setOrHideParent('esn', getActiveDictionaryValue(data, 'Cellular', 'ESN'));
+      setOrHideParent(
+          'imei', getActiveDictionaryValue(data, 'Cellular', 'IMEI'));
+      setOrHideParent(
+          'meid', getActiveDictionaryValue(data, 'Cellular', 'MEID'));
+      setOrHideParent('min', getActiveDictionaryValue(data, 'Cellular', 'MIN'));
+      setOrHideParent(
+          'prl-version',
+          getActiveDictionaryValue(data, 'Cellular', 'PRLVersion'));
+
+      var family = getActiveDictionaryValue(data, 'Cellular', 'Family');
+      detailsPage.gsm = family == 'GSM';
+      if (detailsPage.gsm) {
+        $('iccid').textContent =
+            getActiveDictionaryValue(data, 'Cellular', 'ICCID');
+        $('imsi').textContent =
+            getActiveDictionaryValue(data, 'Cellular', 'IMSI');
 
         var apnSelector = $('select-apn');
         // Clear APN lists, keep only last element that "other".
@@ -1195,9 +1318,13 @@ cr.define('options.internet', function() {
         apnSelector.selectedIndex = data.selectedApn;
         updateHidden('.apn-list-view', false);
         updateHidden('.apn-details-view', true);
-        DetailsInternetPage.updateSecurityTab(data.simCardLockEnabled.value);
+        // TODO(stevenjb): Used managed properties for policy controlled value.
+        var lockEnabled = data.simCardLockEnabled.value;
+        $('sim-card-lock-enabled').checked = lockEnabled;
+        $('change-pin').hidden = !lockEnabled;
       }
-      $('auto-connect-network-cellular').checked = data.autoConnect.value;
+      $('auto-connect-network-cellular').checked =
+          getActiveValue(data, 'AutoConnect');
       $('auto-connect-network-cellular').disabled = false;
 
       $('buyplan-details').hidden = !data.showBuyButton;
@@ -1206,55 +1333,43 @@ cr.define('options.internet', function() {
       if (data.showActivateButton) {
         $('details-internet-login').hidden = true;
       }
-    } else if (data.type == Constants.TYPE_VPN) {
+    } else if (data.type == 'VPN') {
       OptionsPage.showTab($('vpn-nav-tab'));
-      detailsPage.wireless = false;
-      detailsPage.wimax = false;
-      detailsPage.vpn = true;
-      detailsPage.ethernet = false;
-      detailsPage.cellular = false;
       detailsPage.gsm = false;
-      $('inet-service-name').textContent = data.serviceName;
+      $('inet-service-name').textContent = networkName;
       $('inet-provider-type').textContent = data.providerType;
       $('inet-username').textContent = data.username;
       var inetServerHostname = $('inet-server-hostname');
       inetServerHostname.value = data.serverHostname.value;
       inetServerHostname.resetHandler = function() {
-        OptionsPage.hideBubble();
+        PageManager.hideBubble();
         inetServerHostname.value = data.serverHostname.recommendedValue;
       };
-      $('auto-connect-network-vpn').checked = data.autoConnect.value;
+      $('auto-connect-network-vpn').checked =
+          getActiveValue(data, 'AutoConnect');
       $('auto-connect-network-vpn').disabled = false;
     } else {
       OptionsPage.showTab($('internet-nav-tab'));
-      detailsPage.ethernet = true;
-      detailsPage.wireless = false;
-      detailsPage.wimax = false;
-      detailsPage.vpn = false;
-      detailsPage.cellular = false;
-      detailsPage.gsm = false;
     }
 
     // Update controlled option indicators.
-    indicators = cr.doc.querySelectorAll(
+    var indicators = cr.doc.querySelectorAll(
         '#details-internet-page .controlled-setting-indicator');
     for (var i = 0; i < indicators.length; i++) {
-      var propName = indicators[i].getAttribute('data');
+      var attributeName =
+          indicators[i].hasAttribute('managed') ? 'managed' : 'data';
+      var propName = indicators[i].getAttribute(attributeName);
       if (!propName || !data[propName])
         continue;
-      var propData = data[propName];
-      // Create a synthetic pref change event decorated as
-      // CoreOptionsHandler::CreateValueForPref() does.
-      var event = new Event(name);
-      event.value = {
-        value: propData.value,
-        controlledBy: propData.controlledBy,
-        recommendedValue: propData.recommendedValue,
-      };
+      var event;
+      if (attributeName == 'managed')
+        event = detailsPage.createManagedEvent_(propName, data[propName]);
+      else
+        event = detailsPage.createControlledEvent_(propName, data[propName]);
       indicators[i].handlePrefChange(event);
       var forElement = $(indicators[i].getAttribute('for'));
       if (forElement) {
-        if (propData.controlledBy == 'policy')
+        if (event.value.controlledBy == 'policy')
           forElement.disabled = true;
         if (forElement.resetHandler)
           indicators[i].resetHandler = forElement.resetHandler;
@@ -1265,7 +1380,7 @@ cr.define('options.internet', function() {
 
     // Don't show page name in address bar and in history to prevent people
     // navigate here by hand and solve issue with page session restore.
-    OptionsPage.showPageByName('detailsInternetPage', false);
+    PageManager.showPageByName('detailsInternetPage', false);
   };
 
   return {