Add header to network details dialog.

chrome/browser/resources/options2/chromeos/internet_options.js

Index: chrome/browser/resources/options2/chromeos/internet_options.js
diff --git a/chrome/browser/resources/options2/chromeos/internet_options.js b/chrome/browser/resources/options2/chromeos/internet_options.js
index 17424e21aa03babdf82faef6e31fea4a4330050d..b6d9fbc0c1032d1b69d9c221209f1ab16b425888 100644
--- a/chrome/browser/resources/options2/chromeos/internet_options.js
+++ b/chrome/browser/resources/options2/chromeos/internet_options.js
@@ -429,6 +429,15 @@ cr.define('options', function() {
 
   InternetOptions.showDetailedInfo = function(data) {
     var detailsPage = DetailsInternetPage.getInstance();
+
+    // Populate header

[csilv, 2012/02/25 01:31:54]

add something like:
  var pageElement = $('detailsInternetPage');

and then use that in place of $('detailsInternetPage') for this function.

[kevers, 2012/02/29 15:30:16]

Updated header based on UX discussions.

+    var icon = $('detailsInternetPage').querySelector('.network-icon');
+    icon.style.backgroundImage = url(data.iconURL);
+    var title = $('detailsInternetPage').querySelector('.network-title');
+    title.textContent = data.networkName;
+    var subtitle = $('detailsInternetPage').querySelector('.network-subtitle');
+    subtitle.textContent = data.connectionState;
+
     // TODO(chocobo): Is this hack to cache the data here reasonable?
     $('connectionState').data = data;
     $('buyplanDetails').hidden = true;