Update offline page on ChromeOS to match standard error page.

BUG=263913
R=dpolukhin@chromium.org, thakis@chromium.org, xiyuan@chromium.org

Review URL: https://codereview.chromium.org/23513067

git-svn-id: svn://svn.chromium.org/chrome/trunk/src@225084 0039d316-1c4b-4281-b951-d872f2087c98

13 files changed, 460 insertions, 222 deletions

diff --git a/chrome/app/generated_resources.grd b/chrome/app/generated_resources.grd
index 4e80692..bfa72d6 100644
--- a/chrome/app/generated_resources.grd
+++ b/chrome/app/generated_resources.grd
@@ -11150,22 +11150,6 @@ Would you like to start <ph name="CONTROL_PANEL_APPLET_NAME">$1<ex>Add/Remove Pr
         Add more apps
       </message>
 
-      <!-- Offline page  -->
-      <if expr="pp_ifdef('chromeos')">
-        <message name="IDS_SITE_OFFLINE_LOAD_HEADLINE" desc="Offline Page HTML headline for a site.">
-          This page is not available offline.
-        </message>
-        <message name="IDS_APP_OFFLINE_LOAD_HEADLINE" desc="Offline Page HTML headline for an app.">
-          This app is not available offline.
-        </message>
-        <message name="IDS_OFFLINE_LOAD_DESCRIPTION" desc="Description for the offline page.">
-          Please reconnect to a network.
-        </message>
-        <message name="IDS_OFFLINE_NETWORK_SETTINGS">
-          Network settings
-        </message>
-      </if>
-
       <!-- Multi-profile -->
       <message name="IDS_PROFILES_OPTIONS_GROUP_NAME" desc="The name of the sync group in the options dialog.">
         Users
diff --git a/chrome/browser/browser_resources.grd b/chrome/browser/browser_resources.grd
index 82e17f8..8a6a8f2 100644
--- a/chrome/browser/browser_resources.grd
+++ b/chrome/browser/browser_resources.grd
@@ -314,7 +314,8 @@
         <include name="IDR_NETWORK_MENU_JS" file="resources\chromeos\network_menu.js" flattenhtml="true" type="BINDATA" />
         <include name="IDR_NOTIFICATION_ICON_LINK_HTML" file="resources\chromeos\notification_icon_link.html" type="BINDATA" />
         <include name="IDR_ECHO_MANIFEST" file="resources\chromeos\echo\manifest.json" type="BINDATA" />
-        <include name="IDR_OFFLINE_LOAD_HTML" file="resources\chromeos\offline_load.html" flattenhtml="true" type="BINDATA" />
+        <include name="IDR_OFFLINE_APP_LOAD_HTML" file="resources\chromeos\offline_app_load.html" flattenhtml="true" type="BINDATA" />
+        <include name="IDR_OFFLINE_NET_LOAD_HTML" file="resources\chromeos\offline_net_load.html" flattenhtml="true" type="BINDATA" />
         <include name="IDR_MERGE_SESSION_LOAD_HTML" file="resources\chromeos\merge_session_load.html" flattenhtml="true" type="BINDATA" />
         <include name="IDR_OS_CREDITS_HTML" file="resources\chromeos\about_os_credits.html" flattenhtml="true" type="BINDATA" />
         <include name="IDR_PROXY_SETTINGS_HTML" file="resources\chromeos\proxy_settings.html" flattenhtml="true" type="BINDATA" />
diff --git a/chrome/browser/chromeos/offline/offline_load_page.cc b/chrome/browser/chromeos/offline/offline_load_page.cc
index cc7f5f7..603f610 100644
--- a/chrome/browser/chromeos/offline/offline_load_page.cc
+++ b/chrome/browser/chromeos/offline/offline_load_page.cc
@@ -13,6 +13,7 @@
 #include "base/strings/stringprintf.h"
 #include "base/strings/utf_string_conversions.h"
 #include "base/values.h"
+#include "chrome/browser/browser_process.h"
 #include "chrome/browser/chrome_notification_types.h"
 #include "chrome/browser/extensions/extension_service.h"
 #include "chrome/browser/extensions/extension_system.h"
@@ -23,6 +24,7 @@
 #include "chrome/common/extensions/extension_constants.h"
 #include "chrome/common/extensions/extension_icon_set.h"
 #include "chrome/common/extensions/manifest_handlers/icons_handler.h"
+#include "chrome/common/localized_error.h"
 #include "chrome/common/url_constants.h"
 #include "content/public/browser/browser_thread.h"
 #include "content/public/browser/interstitial_page.h"
@@ -34,6 +36,7 @@
 #include "grit/google_chrome_strings.h"
 #include "grit/theme_resources.h"
 #include "net/base/escape.h"
+#include "net/base/net_errors.h"
 #include "ui/base/l10n/l10n_util.h"
 #include "ui/base/resource/resource_bundle.h"
 #include "ui/webui/jstemplate_builder.h"
@@ -78,27 +81,9 @@ void OfflineLoadPage::Show() {
 }
 
 std::string OfflineLoadPage::GetHTMLContents() {
-  DictionaryValue strings;
-  int64 time_to_wait = kMaxBlankPeriod;
-  // Set the timeout to show the page.
-  strings.SetInteger("time_to_wait", static_cast<int>(time_to_wait));
-
-  // Button labels
-  SetString(&strings, "msg", IDS_OFFLINE_LOAD_DESCRIPTION);
-  SetString(&strings, "network_settings", IDS_OFFLINE_NETWORK_SETTINGS);
-  SetString(&strings, "product_name", IDS_SHORT_PRODUCT_NAME_LOWER);
-
-  // Get the Chromium/Chrome icon, we can't access the icon via chrome://theme
-  // on the webpage since the interstitial page isn't a webui and doesn't have
-  // access to chrome:// URL's.
-  strings.SetString("icon",
-                    webui::GetBitmapDataUrlFromResource(IDR_PRODUCT_LOGO_32));
-
-  webui::SetFontAndTextDirection(&strings);
-  string16 failed_url(ASCIIToUTF16(url_.spec()));
-  if (base::i18n::IsRTL())
-    base::i18n::WrapStringWithLTRFormatting(&failed_url);
-  strings.SetString("url", failed_url);
+  // Use a local error page.
+  int resource_id;
+  base::DictionaryValue error_strings;
 
   // The offline page for app has icons and slightly different message.
   Profile* profile = Profile::FromBrowserContext(
@@ -107,19 +92,27 @@ std::string OfflineLoadPage::GetHTMLContents() {
   const extensions::Extension* extension = NULL;
   ExtensionService* extensions_service =
       extensions::ExtensionSystem::Get(profile)->extension_service();
+
   // Extension service does not exist in test.
   if (extensions_service)
     extension = extensions_service->extensions()->GetHostedAppByURL(url_);
 
-  if (extension)
-    GetAppOfflineStrings(extension, &strings);
-  else
-    GetNormalOfflineStrings(&strings);
+  if (extension && !extension->from_bookmark()) {
+    LocalizedError::GetAppErrorStrings(url_, extension, &error_strings);
+    resource_id = IDR_OFFLINE_APP_LOAD_HTML;
+  } else {
+    const std::string locale = g_browser_process->GetApplicationLocale();
+    LocalizedError::GetStrings(net::ERR_INTERNET_DISCONNECTED,
+                               net::kErrorDomain, url_, false, locale,
+                               &error_strings);
+    resource_id = IDR_OFFLINE_NET_LOAD_HTML;
+  }
 
-  base::StringPiece html(
+  const base::StringPiece template_html(
       ResourceBundle::GetSharedInstance().GetRawDataResource(
-          IDR_OFFLINE_LOAD_HTML));
-  return webui::GetI18nTemplateHtml(html, &strings);
+          resource_id));
+  // "t" is the id of the templates root node.
+  return webui::GetTemplatesHtml(template_html, &error_strings, "t");
 }
 
  void OfflineLoadPage::OverrideRendererPrefs(
@@ -143,20 +136,6 @@ void OfflineLoadPage::OnDontProceed() {
   NotifyBlockingPageComplete(false);
 }
 
-void OfflineLoadPage::GetAppOfflineStrings(
-    const extensions::Extension* app,
-    DictionaryValue* strings) const {
-  strings->SetString("title", app->name());
-  strings->SetString(
-      "heading", l10n_util::GetStringUTF16(IDS_APP_OFFLINE_LOAD_HEADLINE));
-}
-
-void OfflineLoadPage::GetNormalOfflineStrings(DictionaryValue* strings) const {
-  strings->SetString("title", web_contents_->GetTitle());
-  strings->SetString(
-      "heading", l10n_util::GetStringUTF16(IDS_SITE_OFFLINE_LOAD_HEADLINE));
-}
-
 void OfflineLoadPage::CommandReceived(const std::string& cmd) {
   std::string command(cmd);
   // The Jasonified response has quotes, remove them.
diff --git a/chrome/browser/chromeos/offline/offline_load_page.h b/chrome/browser/chromeos/offline/offline_load_page.h
index 8fdab58..2ff53bb 100644
--- a/chrome/browser/chromeos/offline/offline_load_page.h
+++ b/chrome/browser/chromeos/offline/offline_load_page.h
@@ -68,12 +68,6 @@ class OfflineLoadPage
   virtual void OnConnectionTypeChanged(
       net::NetworkChangeNotifier::ConnectionType type) OVERRIDE;
 
-  // Retrieves template strings of the offline page for app and
-  // normal site.
-  void GetAppOfflineStrings(const extensions::Extension* app,
-                            base::DictionaryValue* strings) const;
-  void GetNormalOfflineStrings(base::DictionaryValue* strings) const;
-
   CompletionCallback callback_;
 
   // True if the proceed is chosen.
diff --git a/chrome/browser/resources/chromeos/neterror.css b/chrome/browser/resources/chromeos/neterror.css
new file mode 100644
index 0000000..4c6557e
--- /dev/null
+++ b/chrome/browser/resources/chromeos/neterror.css
@@ -0,0 +1,258 @@
+/* Copyright 2013 The Chromium Authors. All rights reserved.
+ * Use of this source code is governed by a BSD-style license that can be
+ * found in the LICENSE file. */
+
+body {
+  background-color: #E6E6E6;
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 10pt;
+  margin: 50px 40px 20px 40px;
+  text-align: center;
+}
+
+#main-frame-error {
+  margin: auto;
+  max-width: 540px;
+  min-width: 200px;
+}
+
+/* Don't use the main frame div when the error is in a subframe. */
+html[subframe] #main-frame-error {
+  display: none;
+}
+
+/* Don't use the subframe error div when the error is in a main frame. */
+html:not([subframe]) #sub-frame-error {
+  display: none;
+}
+
+#box {
+  background-color: #fbfbfb;
+  border: 1px solid #AAA;
+  border-bottom: 1px solid #888;
+  border-radius: 3px;
+  box-shadow: 0 2px 2px #AAA;
+  color: black;
+}
+
+#diagnose-button {
+  -webkit-margin-start: 0;
+  margin-bottom: 10px;
+  margin-top: 20px;
+}
+
+h1 {
+  color: #666;
+  font-size: 1.5em;
+  font-weight: normal;
+  margin: 10px 0 25px 0;
+}
+
+a {
+  color: rgb(17, 85, 204);
+  text-decoration: none;
+}
+
+.icon {
+  -webkit-user-select: none;
+}
+
+.icon-generic {
+  /**
+   * Can't access chrome://theme/IDR_ERROR_NETWORK_GENERIC from an untrusted
+   * renderer process, so embed the resource manually.
+   */
+  content: -webkit-image-set(
+      url('../../../app/theme/default_100_percent/common/error_network_generic.png') 1x,
+      url('../../../app/theme/default_200_percent/common/error_network_generic.png') 2x);
+}
+
+.icon-offline {
+  content: -webkit-image-set(
+      url('../../../app/theme/default_100_percent/common/error_network_offline.png') 1x,
+      url('../../../app/theme/default_200_percent/common/error_network_offline.png') 2x);
+}
+
+#content-top {
+  margin: 20px 20px 20px 25px;
+}
+
+#help-box-outer {
+  -webkit-transition: height ease-in 218ms;
+  overflow: hidden;
+}
+
+#help-box-inner {
+  background-color: #f9f9f9;
+  border-top: 1px solid #EEE;
+  color: #444;
+  padding: 25px 20px;
+  text-align: start;
+}
+
+#suggestions {
+  margin-top: 15px;
+}
+
+#sub-frame-error-details {
+  color: #8F8F8F;
+  text-shadow: 0 1px 0 rgba(255,255,255,0.3);
+}
+
+[jscontent=failedUrl] {
+  overflow-wrap: break-word;
+}
+
+button {
+  -webkit-user-select: none;
+  background-image: -webkit-linear-gradient(#ededed, #ededed 38%, #dedede);
+  border: 1px solid rgba(0, 0, 0, 0.25);
+  border-radius: 2px;
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08),
+              inset 0 1px 2px rgba(255, 255, 255, 0.75);
+  color: #444;
+  margin: 0 5px;
+  min-height: 29px;
+  min-width: 65px;
+  padding: 8px 13px;
+  text-shadow: 0 1px 0 rgb(240, 240, 240);
+}
+
+button:hover {
+  background-image: -webkit-linear-gradient(#f0f0f0, #f0f0f0 38%, #e0e0e0);
+  border: 1px solid rgba(0, 0, 0, 0.3);
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.12),
+              inset 0 1px 2px rgba(255, 255, 255, 0.95);
+  color: #000;
+}
+
+button:active {
+  background-image: -webkit-linear-gradient(#e7e7e7, #e7e7e7 38%, #d7d7d7);
+  border: 1px solid rgba(0, 0, 0, 0.3);
+  box-shadow: none;
+  color: #444;
+}
+
+#reload-button {
+  background-image: -webkit-linear-gradient(rgb(93, 154, 255),
+                                            rgb(93, 154, 255),
+                                            rgb(88, 145, 240));
+  border: 1px solid rgba(45, 102, 195, 1);
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15),
+              inset 0 1px 2px rgba(255, 255, 255, 0.2);
+  color: #fff;
+  text-shadow: 0 1px 0 rgba(0,0,0,0.5);
+}
+
+#reload-button:hover {
+  background-image: -webkit-linear-gradient(rgb(101, 158, 253),
+                                            rgb(101, 158, 253),
+                                            rgb(96, 151, 241));
+  border: 1px solid rgba(45, 102, 195, 1);
+  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25),
+              inset 0 1px 2px rgba(255, 255, 255, 0.2);
+}
+
+#reload-button:active {
+  background-image: -webkit-linear-gradient(rgb(96, 149, 237),
+                                            rgb(96, 149, 237),
+                                            rgb(96, 149, 237));
+  border: 1px solid rgb(38, 84, 160);
+  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
+}
+
+.hidden {
+  display: none;
+}
+
+.suggestions {
+  margin-top: 18px;
+}
+
+.suggestion-header {
+  font-weight: bold;
+  margin-bottom: 4px;
+}
+
+.suggestion-body {
+  color: #777;
+}
+
+.error-code {
+  color: #A0A0A0;
+  margin-top: 15px;
+}
+
+/* Increase line height at higher resolutions. */
+@media (min-width: 641px) and (min-height: 641px) {
+  #help-box-inner {
+    line-height: 18px;
+  }
+}
+
+/* Decrease padding at low sizes. */
+@media (max-width: 640px),
+       (max-height: 640px) {
+  body {
+    margin: 15px;
+  }
+  h1 {
+    margin: 10px 0 15px 0;
+  }
+  #content-top {
+    margin: 15px;
+  }
+  #help-box-inner {
+    padding: 20px;
+  }
+  .suggestions {
+    margin-top: 10px;
+  }
+  .suggestion-header {
+    margin-bottom: 0;
+  }
+  .error-code {
+    margin-top: 10px;
+  }
+}
+
+/* Don't allow overflow when in a subframe. */
+html[subframe] body {
+  overflow: hidden;
+}
+
+#sub-frame-error {
+  -webkit-align-items: center;
+  -webkit-flex-flow: column;
+  -webkit-justify-content: center;
+  background-color: #DDD;
+  display: -webkit-flex;
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}
+
+#sub-frame-error:hover {
+  background-color: #EEE;
+}
+
+#sub-frame-error-details {
+  margin: 0 10px;
+  visibility: hidden;
+}
+
+/* Show details only when hovering. */
+#sub-frame-error:hover #sub-frame-error-details {
+  visibility: visible;
+}
+
+/* If the iframe is too small, always hide the error code. */
+/* TODO(mmenke): See if overflow: no-display works better, once supported. */
+@media (max-width: 200px),
+       (max-height: 95px) {
+  #sub-frame-error-details {
+    display: none;
+  }
+}
diff --git a/chrome/browser/resources/chromeos/neterror.js b/chrome/browser/resources/chromeos/neterror.js
new file mode 100644
index 0000000..0c8fcc0
--- /dev/null
+++ b/chrome/browser/resources/chromeos/neterror.js
@@ -0,0 +1,54 @@
+// Copyright 2013 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+function toggleHelpBox() {
+  var helpBoxOuter = $('help-box-outer');
+  helpBoxOuter.classList.toggle('hidden');
+  var moreLessButton = $('more-less-button');
+  if (helpBoxOuter.classList.contains('hidden')) {
+    moreLessButton.innerText = moreLessButton.moreText;
+  } else {
+    moreLessButton.innerText = moreLessButton.lessText;
+  }
+}
+
+function diagnoseErrors() {
+  var extensionId = 'idddmepepmjcgiedknnmlbadcokidhoa';
+  var diagnoseFrame = $('diagnose-frame');
+  diagnoseFrame.innerHTML =
+      '<iframe src="chrome-extension://' + extensionId +
+      '/index.html"></iframe>';
+}
+
+// Subframes use a different layout but the same html file.  This is to make it
+// easier to support platforms that load the error page via different
+// mechanisms (Currently just iOS).
+if (window.top.location != window.location)
+  document.documentElement.setAttribute('subframe', '');
+
+// Re-renders the error page using |strings| as the dictionary of values.
+// Used by NetErrorTabHelper to update DNS error pages with probe results.
+function updateForDnsProbe(strings) {
+  i18nTemplate.process(document, strings);
+  var context = new JsEvalContext(strings);
+  jstProcess(context, $('t'));
+}
+
+// Given the classList property of an element, adds an icon class to the list
+// and removes the previously-
+function updateIconClass(classList, newClass) {
+  var oldClass;
+
+  if (classList.hasOwnProperty('last_icon_class')) {
+    oldClass = classList['last_icon_class'];
+    if (oldClass == newClass)
+      return;
+  }
+
+  classList.add(newClass);
+  if (oldClass !== undefined)
+    classList.remove(oldClass);
+
+  classList['last_icon_class'] = newClass;
+}
diff --git a/chrome/browser/resources/chromeos/offline_app_load.html b/chrome/browser/resources/chromeos/offline_app_load.html
new file mode 100644
index 0000000..028548a
--- /dev/null
+++ b/chrome/browser/resources/chromeos/offline_app_load.html
@@ -0,0 +1,51 @@
+<!DOCTYPE html>
+<html i18n-values="dir:textdirection">
+<head>
+<title i18n-content="title">
+</title>
+<style>
+html {
+  height: 100%;
+}
+body {
+  color: #000;
+  font-family: Helvetica, Arial, sans-serif;
+  background-image: -webkit-linear-gradient(rgb(255, 255, 255) 50%,
+                                            rgb(236, 244, 255));
+  height: 100%;
+  padding: 0px;
+  margin: 0px;
+}
+#error {
+  position: absolute;
+  left: 180px;
+  top: 150px;
+  font-size: 24px;
+}
+#error img {
+  margin-right: 10px;
+  vertical-align: middle;
+}
+#name  {
+  font-weight: bold;
+}
+#msg {
+}
+</style>
+</head>
+
+<body id="t">
+
+<div id="error" jsvalues=".title:url">
+<img jsvalues=".src:icon" width="96"  height="96">
+<div style="display:inline-block; vertical-align: middle;">
+<div id="name" jsvalues=".innerText:name"></div>
+<div id="msg" jsvalues=".innerText:msg"></div>
+<div id="suggestions" jsselect="suggestionsLearnMore">
+  <span jsvalues=".innerHTML:msg"></span>
+</div>
+</div>
+</div>
+
+</body>
+</html>
diff --git a/chrome/browser/resources/chromeos/offline_load.html b/chrome/browser/resources/chromeos/offline_load.html
deleted file mode 100644
index bab14d9..0000000
--- a/chrome/browser/resources/chromeos/offline_load.html
+++ /dev/null
@@ -1,138 +0,0 @@
-<!DOCTYPE html>
-<html id="template_root" i18n-values="dir:textdirection">
-<head>
-<title i18n-content="title">
-</title>
-<style>
-html {
-  height: 100%;
-}
-body {
-  -webkit-box-pack: center;
-  -webkit-user-select: none;
-  background-image: -webkit-linear-gradient(white 50%, rgb(236, 244, 255));
-  color: #000;
-  display: -webkit-box;
-  height: 100%;
-  margin: 0;
-  padding: 0;
-  visibility: hidden;
-  width: 100%;
-}
-
-#mainview {
-  display: -webkit-box;
-  padding-top: 100px;
-}
-
-#right {
-  -webkit-margin-start: 70px;
-}
-
-.upper {
-  position: relative;
-  width: 100%;
-  -webkit-box-flex: 0.8;
-}
-
-#logo-container {
-  display: -webkit-box;
-}
-
-#product-name {
-  -webkit-margin-start: 5px;
-  color: grey;
-  font-size: 160%;
-}
-
-#heading {
-  font-size: 15px;
-  padding-top: 20px;
-}
-
-#message {
-  font-size: 12px;
-  padding-top: 5px;
-}
-
-#button {
-  padding-top: 30px;
-}
-
-.offline_message {
-  position: absolute;
-  width: 600px;
-  height: 49%;
-}
-
-.activation_message {
-  position: absolute;
-  width: 500px;
-  top: 0;
-  margin-top: 0;
-  left: 50%;
-  margin-left: -250px;
-  min-height: 380px;
-}
-
-#carrierPage {
-  padding-top: 10px;
-  width: 500px;
-  height: 380px;
-  overflow-x: none;
-  overflow-y: none;
-}
-
-.hidden {
-  display: none;
-}
-
-.splitter {
-  border-top: 1px solid #DDD;
-  height: 1px;
-}
-</style>
-<script src="../../../../ui/webui/resources/js/local_strings.js"></script>
-
-<script>
-var localStrings = new LocalStrings();
-
-function sendCommand(cmd) {
-  window.domAutomationController.setAutomationId(1);
-  window.domAutomationController.send(cmd);
-}
-
-// Show the offline page.
-function showPage() {
-  document.body.style.visibility = 'visible';
-}
-
-document.addEventListener('DOMContentLoaded', function() {
-  var timeToWait = localStrings.getString('time_to_wait');
-  window.setTimeout(showPage, timeToWait);
-});
-</script>
-
-<body oncontextmenu="return false;"
-  i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">
-  <div id="mainview">
-    <div id="left">
-      <div class="upper">
-        <div id="logo-container">
-          <img i18n-values=".src:icon">
-          <div id="product-name" i18n-content="product_name"></div>
-        </div>
-        <div id="heading" i18n-content="heading"></div>
-        <div id="message" i18n-content="msg"></div>
-        <div id="button">
-          <button onclick="sendCommand('open_network_settings')"
-             i18n-content="network_settings"></button>
-        </div>
-      </div>
-    </div>
-    <div id="right">
-      <img src="images/broken_robot.png">
-    </div>
-  </div>
-</body>
-</html>
diff --git a/chrome/browser/resources/chromeos/offline_net_load.html b/chrome/browser/resources/chromeos/offline_net_load.html
new file mode 100644
index 0000000..2ee8f9a
--- /dev/null
+++ b/chrome/browser/resources/chromeos/offline_net_load.html
@@ -0,0 +1,55 @@
+<!DOCTYPE html>
+<html i18n-values="dir:textdirection">
+<head>
+  <meta name="viewport" content="width=device-width, initial-scale=1.0,
+                                 maximum-scale=1.0, user-scalable=no">
+  <title i18n-content="title"></title>
+  <link rel="stylesheet" href="neterror.css">
+  <script src="../../../../ui/webui/resources/js/util.js"></script>
+  <script src="neterror.js"></script>
+</head>
+<body id="t">
+  <div id="main-frame-error">
+    <div id="box">
+      <div id="content-top">
+        <h1>
+          <div>
+            <img class="icon"
+                jseval="updateIconClass(this.classList, iconClass)">
+          </div>
+          <span i18n-content="heading"></span>
+        </h1>
+         <button id="reload-button" onclick="location = this.url"
+            jsselect="reload" jsvalues=".url:reloadUrl"
+            jscontent="msg"></button>
+        <button id="more-less-button" onclick="toggleHelpBox()" jsdisplay="more"
+            jsvalues=".moreText:more; .lessText:less;"
+            jscontent="more"></button>
+      </div>
+       <!-- Outer and inner divs are needed both for margins and sizing. -->
+      <div id="help-box-outer" class="hidden">
+        <div id="help-box-inner">
+          <div jsselect="summary">
+            <span jsvalues=".innerHTML:msg"></span>
+          </div>
+          <div class="suggestions" jsselect="suggestions">
+            <div class="suggestion-header" jsvalues=".innerHTML:header"></div>
+            <div class="suggestion-body" jsvalues=".innerHTML:body"></div>
+          </div>
+          <button id="diagnose-button" onclick="diagnoseErrors()"
+            jscontent="diagnose" jsdisplay="diagnose"></button>
+          <div id="diagnose-frame" class="hidden"></div>
+          <div class="error-code" jscontent="errorCode"></div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div id="sub-frame-error">
+    <!-- Show details when hovering over the icon, in case the details are
+         hidden because they're too large. -->
+    <img class="icon" jseval="updateIconClass(this.classList, iconClass)"
+        jsvalues=".title:errorDetails">
+    <div id="sub-frame-error-details" jsvalues=".innerHTML:errorDetails"></div>
+  </div>
+</body>
+</html>
diff --git a/chrome/common/localized_error.cc b/chrome/common/localized_error.cc
index 893e379..c9d774c 100644
--- a/chrome/common/localized_error.cc
+++ b/chrome/common/localized_error.cc
@@ -491,7 +491,9 @@ const char* GetIconClassForError(const std::string& error_domain,
 
 const char LocalizedError::kHttpErrorDomain[] = "http";
 
-void LocalizedError::GetStrings(const WebKit::WebURLError& error,
+void LocalizedError::GetStrings(int error_code,
+                                const std::string& error_domain,
+                                const GURL& failed_url,
                                 bool is_post,
                                 const std::string& locale,
                                 base::DictionaryValue* error_strings) {
@@ -509,15 +511,11 @@ void LocalizedError::GetStrings(const WebKit::WebURLError& error,
     SUGGEST_NONE,
   };
 
-  const std::string error_domain = error.domain.utf8();
-  int error_code = error.reason;
   const LocalizedErrorMap* error_map = LookupErrorMap(error_domain, error_code,
                                                       is_post);
   if (error_map)
     options = *error_map;
 
-  const GURL failed_url = error.unreachableURL;
-
   // If we got "access denied" but the url was a file URL, then we say it was a
   // file instead of just using the "not available" default message. Just adding
   // ERR_ACCESS_DENIED to the map isn't sufficient, since that message may be
@@ -788,7 +786,6 @@ bool LocalizedError::HasStrings(const std::string& error_domain,
 }
 
 void LocalizedError::GetAppErrorStrings(
-    const WebURLError& error,
     const GURL& display_url,
     const extensions::Extension* app,
     base::DictionaryValue* error_strings) {
diff --git a/chrome/common/localized_error.h b/chrome/common/localized_error.h
index 3fb8b28..7323c59 100644
--- a/chrome/common/localized_error.h
+++ b/chrome/common/localized_error.h
@@ -28,7 +28,9 @@ class LocalizedError {
  public:
   // Fills |error_strings| with values to be used to build an error page used
   // on HTTP errors, like 404 or connection reset.
-  static void GetStrings(const WebKit::WebURLError& error,
+  static void GetStrings(int error_code,
+                         const std::string& error_domain,
+                         const GURL& failed_url,
                          bool is_post,
                          const std::string& locale,
                          base::DictionaryValue* strings);
@@ -44,8 +46,7 @@ class LocalizedError {
   // on HTTP errors, like 404 or connection reset, but using information from
   // the associated |app| in order to make the error page look like it's more
   // part of the app.
-  static void GetAppErrorStrings(const WebKit::WebURLError& error,
-                                 const GURL& display_url,
+  static void GetAppErrorStrings(const GURL& display_url,
                                  const extensions::Extension* app,
                                  base::DictionaryValue* error_strings);
 
diff --git a/chrome/renderer/chrome_content_renderer_client.cc b/chrome/renderer/chrome_content_renderer_client.cc
index e4b718b..b466ccb 100644
--- a/chrome/renderer/chrome_content_renderer_client.cc
+++ b/chrome/renderer/chrome_content_renderer_client.cc
@@ -883,8 +883,7 @@ void ChromeContentRendererClient::GetNavigationErrorStrings(
     int resource_id;
     base::DictionaryValue error_strings;
     if (extension && !extension->from_bookmark()) {
-      LocalizedError::GetAppErrorStrings(error, failed_url, extension,
-                                         &error_strings);
+      LocalizedError::GetAppErrorStrings(failed_url, extension, &error_strings);
 
       // TODO(erikkay): Should we use a different template for different
       // error messages?
@@ -895,7 +894,9 @@ void ChromeContentRendererClient::GetNavigationErrorStrings(
               frame, error, is_post, locale, &error_strings)) {
         // In most cases, the NetErrorHelper won't provide DNS-probe-specific
         // error pages, so fall back to LocalizedError.
-        LocalizedError::GetStrings(error, is_post, locale, &error_strings);
+        LocalizedError::GetStrings(error.reason, error.domain.utf8(),
+                                   error.unreachableURL, is_post, locale,
+                                   &error_strings);
       }
       resource_id = IDR_NET_ERROR_HTML;
     }
diff --git a/chrome/renderer/net/net_error_helper.cc b/chrome/renderer/net/net_error_helper.cc
index 364ff93..618d43b 100644
--- a/chrome/renderer/net/net_error_helper.cc
+++ b/chrome/renderer/net/net_error_helper.cc
@@ -182,13 +182,11 @@ bool NetErrorHelper::GetErrorStringsForDnsProbe(
     return false;
 
   // Get the strings for a fake "DNS probe possible" error.
-  WebKit::WebURLError fake_error;
-  fake_error.domain = WebKit::WebString::fromUTF8(
-      chrome_common_net::kDnsProbeErrorDomain);
-  fake_error.reason = chrome_common_net::DNS_PROBE_POSSIBLE;
-  fake_error.unreachableURL = error.unreachableURL;
   LocalizedError::GetStrings(
-      fake_error, is_failed_post, locale, error_strings);
+      chrome_common_net::DNS_PROBE_POSSIBLE,
+      chrome_common_net::kDnsProbeErrorDomain,
+      error.unreachableURL,
+      is_failed_post, locale, error_strings);
   return true;
 }
 
@@ -214,8 +212,11 @@ void NetErrorHelper::OnNetErrorInfo(int status_num) {
 void NetErrorHelper::UpdateErrorPage() {
   DCHECK(forwarding_probe_results_);
 
+  WebKit::WebURLError error = GetUpdatedError();
   base::DictionaryValue error_strings;
-  LocalizedError::GetStrings(GetUpdatedError(),
+  LocalizedError::GetStrings(error.reason,
+                             error.domain.utf8(),
+                             error.unreachableURL,
                              is_failed_post_,
                              RenderThread::Get()->GetLocale(),
                              &error_strings);