UI Revamp + several fixes.

.) UI matched to the Chrome settings DOM UI
.) User-mail is now unchangeable
.) Changed the screenshot input to a nicer toggle system
.) Saved screenshots are only now loaded when the user choses to see them
.) Check boxes for everything
.) Privacy policy added
.) Text changed around as per request by Chrome OS marketing

BUG=chromium-os:8836,chromium:61847
TEST=Ran the new UI, checking and unchecking various boxes, trying different screenshots and submitting. More tests being done by the feedback team.

Review URL: http://codereview.chromium.org/5271007

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

4 files changed, 499 insertions, 287 deletions

diff --git a/chrome/browser/dom_ui/bug_report_ui.cc b/chrome/browser/dom_ui/bug_report_ui.cc
index 2be4fba..d3e2797 100644..100755
--- a/chrome/browser/dom_ui/bug_report_ui.cc
+++ b/chrome/browser/dom_ui/bug_report_ui.cc
@@ -54,16 +54,19 @@
 #include "chrome/browser/chromeos/login/user_manager.h"
 #endif
 
-static const char kScreenshotBaseUrl[] = "chrome://screenshots/";
-static const char kCurrentScreenshotUrl[] = "chrome://screenshots/current";
+namespace {
+
+const char kScreenshotBaseUrl[] = "chrome://screenshots/";
+const char kCurrentScreenshotUrl[] = "chrome://screenshots/current";
 #if defined(OS_CHROMEOS)
-static const char kSavedScreenshotsUrl[] = "chrome://screenshots/saved/";
+const char kSavedScreenshotsUrl[] = "chrome://screenshots/saved/";
+
+const char kScreenshotPattern[] = "*.png";
+const char kScreenshotsRelativePath[] = "/Screenshots";
 
-static const char kScreenshotPattern[] = "*.png";
-static const char kScreenshotsRelativePath[] = "/Screenshots";
+const size_t kMaxSavedScreenshots = 2;
 #endif
 
-namespace {
 #if defined(OS_CHROMEOS)
 
 void GetSavedScreenshots(std::vector<std::string>* saved_screenshots,
@@ -88,6 +91,9 @@ void GetSavedScreenshots(std::vector<std::string>* saved_screenshots,
   while (!screenshot.empty()) {
     saved_screenshots->push_back(std::string(kSavedScreenshotsUrl) +
                                  screenshot.BaseName().value());
+    if (saved_screenshots->size() >= kMaxSavedScreenshots)
+      break;
+
     screenshot = screenshots.Next();
   }
   done->Signal();
@@ -190,7 +196,10 @@ class BugReportHandler : public DOMMessageHandler,
 
  private:
   void HandleGetDialogDefaults(const ListValue* args);
-  void HandleRefreshScreenshots(const ListValue* args);
+  void HandleRefreshCurrentScreenshot(const ListValue* args);
+#if defined(OS_CHROMEOS)
+  void HandleRefreshSavedScreenshots(const ListValue* args);
+#endif
   void HandleSendReport(const ListValue* args);
   void HandleCancel(const ListValue* args);
   void HandleOpenSystemTab(const ListValue* args);
@@ -233,24 +242,36 @@ void BugReportUIHTMLSource::StartDataRequest(const std::string& path,
   DictionaryValue localized_strings;
   localized_strings.SetString(std::string("title"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_TITLE));
+  localized_strings.SetString(std::string("page-title"),
+      l10n_util::GetStringUTF8(IDS_BUGREPORT_REPORT_PAGE_TITLE));
   localized_strings.SetString(std::string("issue-with"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_ISSUE_WITH));
   localized_strings.SetString(std::string("page-url"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_REPORT_URL_LABEL));
   localized_strings.SetString(std::string("description"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_DESCRIPTION_LABEL));
-  localized_strings.SetString(std::string("screenshot"),
+  localized_strings.SetString(std::string("current-screenshot"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_SCREENSHOT_LABEL));
+  localized_strings.SetString(std::string("saved-screenshot"),
+      l10n_util::GetStringUTF8(IDS_BUGREPORT_SAVED_SCREENSHOT_LABEL));
 #if defined(OS_CHROMEOS)
   localized_strings.SetString(std::string("user-email"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_USER_EMAIL_LABEL));
+  localized_strings.SetString(std::string("sysinfo"),
+      l10n_util::GetStringUTF8(
+          IDS_BUGREPORT_INCLUDE_SYSTEM_INFORMATION_CHKBOX));
+
   localized_strings.SetString(std::string("currentscreenshots"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_CURRENT_SCREENSHOTS));
   localized_strings.SetString(std::string("savedscreenshots"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_SAVED_SCREENSHOTS));
-  localized_strings.SetString(std::string("sysinfo"),
+
+  localized_strings.SetString(std::string("choose-different-screenshot"),
       l10n_util::GetStringUTF8(
-          IDS_BUGREPORT_INCLUDE_SYSTEM_INFORMATION_CHKBOX));
+          IDS_BUGREPORT_CHOOSE_DIFFERENT_SCREENSHOT));
+  localized_strings.SetString(std::string("choose-original-screenshot"),
+      l10n_util::GetStringUTF8(
+          IDS_BUGREPORT_CHOOSE_ORIGINAL_SCREENSHOT));
 #else
   localized_strings.SetString(std::string("currentscreenshots"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_INCLUDE_NEW_SCREEN_IMAGE));
@@ -270,6 +291,14 @@ void BugReportUIHTMLSource::StartDataRequest(const std::string& path,
   localized_strings.SetString(std::string("no-issue-selected"),
       l10n_util::GetStringUTF8(IDS_BUGREPORT_NO_ISSUE_SELECTED));
 
+  localized_strings.SetString(std::string("no-description"),
+      l10n_util::GetStringUTF8(IDS_BUGREPORT_NO_DESCRIPTION));
+
+  localized_strings.SetString(std::string("no-saved-screenshots"),
+      l10n_util::GetStringUTF8(IDS_BUGREPORT_NO_SAVED_SCREENSHOTS_HELP));
+
+  localized_strings.SetString(std::string("privacy-note"),
+      l10n_util::GetStringUTF8(IDS_BUGREPORT_PRIVACY_NOTE));
 
   // TODO(rkc): Find some way to ensure this order of dropdowns is in sync
   // with the order in the userfeedback ChromeData proto buffer
@@ -500,8 +529,12 @@ base::StringPiece BugReportHandler::Init() {
 void BugReportHandler::RegisterMessages() {
   dom_ui_->RegisterMessageCallback("getDialogDefaults",
       NewCallback(this, &BugReportHandler::HandleGetDialogDefaults));
-  dom_ui_->RegisterMessageCallback("refreshScreenshots",
-      NewCallback(this, &BugReportHandler::HandleRefreshScreenshots));
+  dom_ui_->RegisterMessageCallback("refreshCurrentScreenshot",
+      NewCallback(this, &BugReportHandler::HandleRefreshCurrentScreenshot));
+#if defined(OS_CHROMEOS)
+  dom_ui_->RegisterMessageCallback("refreshSavedScreenshots",
+      NewCallback(this, &BugReportHandler::HandleRefreshSavedScreenshots));
+#endif
   dom_ui_->RegisterMessageCallback("sendReport",
       NewCallback(this, &BugReportHandler::HandleSendReport));
   dom_ui_->RegisterMessageCallback("cancel",
@@ -540,22 +573,25 @@ void BugReportHandler::HandleGetDialogDefaults(const ListValue*) {
   dom_ui_->CallJavascriptFunction(L"setupDialogDefaults", dialog_defaults);
 }
 
-void BugReportHandler::HandleRefreshScreenshots(const ListValue*) {
-  ListValue screenshots;
-  screenshots.Append(new StringValue(std::string(kCurrentScreenshotUrl)));
+void BugReportHandler::HandleRefreshCurrentScreenshot(const ListValue*) {
+  std::string current_screenshot(kCurrentScreenshotUrl);
+  StringValue screenshot(current_screenshot);
+  dom_ui_->CallJavascriptFunction(L"setupCurrentScreenshot", screenshot);
+}
 
 
 #if defined(OS_CHROMEOS)
+void BugReportHandler::HandleRefreshSavedScreenshots(const ListValue*) {
   std::vector<std::string> saved_screenshots;
   GetScreenshotUrls(&saved_screenshots);
 
-  ListValue* saved_screenshot_list = new ListValue();
+  ListValue screenshots_list;
   for (size_t i = 0; i < saved_screenshots.size(); ++i)
-    saved_screenshot_list->Append(new StringValue(saved_screenshots[i]));
-  screenshots.Append(saved_screenshot_list);
-#endif
-  dom_ui_->CallJavascriptFunction(L"setupScreenshots", screenshots);
+    screenshots_list.Append(new StringValue(saved_screenshots[i]));
+  dom_ui_->CallJavascriptFunction(L"setupSavedScreenshots", screenshots_list);
 }
+#endif
+
 
 void BugReportHandler::HandleSendReport(const ListValue* list_value) {
   ListValue::const_iterator i = list_value->begin();
diff --git a/chrome/browser/resources/bug_report.css b/chrome/browser/resources/bug_report.css
index 6366a51..07210b0 100644..100755
--- a/chrome/browser/resources/bug_report.css
+++ b/chrome/browser/resources/bug_report.css
@@ -1,15 +1,35 @@
 .bug-report-label {
   text-align: start;
   vertical-align: text-top;
+  font-weight: 300;
 }
 
 .bug-report-text {
   width: 40em;
-  resize: none;
+}
+
+.bug-report-dropdown {
+  width: 15em;
+}
+
+.bug-report-table {
+  width: 40em;
+  border-spacing: 0px;
+}
+
+.bug-report-field {
+  width: 22em;
+  border-style: solid;
+  border-width: 1px;
+}
+
+.bug-report-fieldlabel {
+  width: 13em;
+  font-weight: 300;
 }
 
 .bug-report-button {
-  width: 8em;
+  
 }
 
 hr {
@@ -18,7 +38,7 @@ hr {
   background: #cccccc;
   margin-top: 10px;
   margin-bottom: 10px;
-  width: 33.5em;
+  width: 40em;
 }
 
 .thumbnail-list {
@@ -70,18 +90,18 @@ hr {
 
 .image-thumbnail img {
   display: block;
-  width: 75px;
+  width: 200px;
 }
 
 .image-thumbnail:hover div {
-    display: block;
-    position: absolute;
-    top: 130%;
-    left:0;
-    padding: 1px;
-    border: 1px dashed blue;
-    background-color: transparent;
-    text-align: center
+  display: block;
+  position: absolute;
+  top: 130%;
+  left: 0;
+  padding: 1px;
+  border: 1px dashed blue;
+  background-color: transparent;
+  text-align: center
 }
 
 .image-thumbnail:hover div img {
@@ -89,19 +109,76 @@ hr {
   width: 400px;
 }
 
-th {
-  padding-top: 10px;
-  color: #233478;
+.image-thumbnail-current {
+  position: relative;
+  z-index: 1;
+  display: inline-block;
+  padding: 0px;
+  border: 2px solid white;
+}
+
+.image-thumbnail-current:hover {
+  z-index: 2;
 }
 
-#main-panel {
-  display: -webkit-box;
+.image-thumbnail-current div {
+  display: none;
+}
+
+.image-thumbnail-current img {
+  display: block;
+  width: 200px;
+}
+
+.image-thumbnail-current:hover div {
+  display: block;
+  position: absolute;
+  top: 130%;
+  left: 0;
+  padding: 1px;
+  border: 1px dashed blue;
+  background-color: transparent;
+  text-align: center
+}
+
+.image-thumbnail-current:hover div img {
+  position: absolute;
+  width: 400px;
+  padding: 2px;
+  border: 1px dashed blue;
+}
+
+th {
+  padding-top: 10px;
+  font-weight: normal;
 }
 
 .formpane {
   margin-right: 20px;
 }
 
-body {
-  -webkit-user-select: none;
+.bug-report-input {
+  border-style: solid;
+  border-width: 1px;
+}
+
+#user-email-text {
+  border: none;
+}
+
+#buttons-pane {
+  padding: 0px 0px;
+}
+
+#privacy-note {
+  -webkit-padding-start: 24px;
+  -webkit-padding-end: 24px;
+  padding-top: 24px;
+  padding-bottom: 34px;
+  text-align: start;
+  font-size: 70%;
+  font-weight: normal;
+  color: #53627d;
+  margin: 0;
+  width: 47em;
 }
diff --git a/chrome/browser/resources/bug_report.html b/chrome/browser/resources/bug_report.html
index 6192960..623d505 100644..100755
--- a/chrome/browser/resources/bug_report.html
+++ b/chrome/browser/resources/bug_report.html
@@ -1,220 +1,290 @@
-<!DOCTYPE HTML>
-<html i18n-values="dir:textdirection;">
-<head>
-<meta charset="utf-8"/>
-<title i18n-content="title"></title>
-<link rel="stylesheet" href="bug_report.css"/>
-
-<script src="shared/js/local_strings.js"></script>
-<script src="shared/js/util.js"></script>
-<script src="bug_report.js"></script>
-<script>
-
-///////////////////////////////////////////////////////////////////////////////
-// Document Functions:
-/**
- * Window onload handler, sets up the page.
- */
-function load() {
-  $('sysinfo-url').onclick = function(event) {
-    chrome.send('openSystemTab');
-  };
-
-  // textContent on description-text textarea seems to default
-  // to several spaces, this resets it to empty.
-  $('description-text').textContent = '';
-  $('send-report-button').disabled = true;
-
-  $('issue-with-combo').addEventListener('change', function(e) {
-    $('send-report-button').disabled =
-        this.selectedIndex <= 0 || $('description-text').value.length == 0;
-  });
-
-  $('description-text').addEventListener('keyup', function(e) {
-    $('send-report-button').disabled =
-        $('issue-with-combo').selectedIndex <= 0 || this.value.length == 0;
-  });
-
-  $('current-screenshot').nextSibling.textContent =
-      localStrings.getString('currentscreenshots');
-<if expr="pp_ifdef('chromeos')">
-  $('saved-screenshot').nextSibling.textContent =
-      localStrings.getString('savedscreenshots');
-</if>
-  $('no-screenshot').nextSibling.textContent =
-      localStrings.getString('noscreenshot');
-
-  // Get a list of issues that we allow the user to select from.
-  // Note, the order and the issues types themselves are different
-  // between Chromium and Chromium OS, so this code needs to be
-  // maintained individually between the bug_report.html and
-  // bug_report_cros.html files.
-  var issueTypeText = [];
-  issueTypeText[0] = localStrings.getString('issue-choose');
-<if expr="not pp_ifdef('chromeos')">
-  issueTypeText[1] = localStrings.getString('issue-page-formatting');
-  issueTypeText[2] = localStrings.getString('issue-page-load');
-  issueTypeText[3] = localStrings.getString('issue-plugins');
-  issueTypeText[4] = localStrings.getString('issue-tabs');
-  issueTypeText[5] = localStrings.getString('issue-sync');
-  issueTypeText[6] = localStrings.getString('issue-crashes');
-  issueTypeText[7] = localStrings.getString('issue-extensions');
-  issueTypeText[8] = localStrings.getString('issue-phishing');
-  issueTypeText[9] = localStrings.getString('issue-other');
-</if>
-<if expr="pp_ifdef('chromeos')">
-  issueTypeText[1] = localStrings.getString('issue-connectivity');
-  issueTypeText[2] = localStrings.getString('issue-sync');
-  issueTypeText[3] = localStrings.getString('issue-crashes');
-  issueTypeText[4] = localStrings.getString('issue-page-formatting');
-  issueTypeText[5] = localStrings.getString('issue-extensions');
-  issueTypeText[6] = localStrings.getString('issue-standby');
-  issueTypeText[7] = localStrings.getString('issue-phishing');
-  issueTypeText[8] = localStrings.getString('issue-other');
-</if>
-  // Add all the issues to the selection box.
-  for (var i = 0; i < issueTypeText.length; i++) {
-    var option = document.createElement('option');
-    option.className = 'bug-report-text';
-    option.textContent = issueTypeText[i];
-    $('issue-with-combo').add(option);
-  }
-
-  chrome.send('getDialogDefaults', []);
-  chrome.send('refreshScreenshots', []);
-};
-
-function setupScreenshots(screenshots) {
-  if (screenshots.length == 1) {
-    addScreenshot('current-screenshots', screenshots[0]);
-  } else {
-    // We're in Chromium OS.
-    currentScreenshot = screenshots[0];
-    addScreenshot('current-screenshots', currentScreenshot);
-
-    savedScreenshots = screenshots[1];
-    if (savedScreenshots.length == 0) {
-      $('saved-screenshots').disabled = true;
-      return;
-    }
-    for (i = 0; i < savedScreenshots.length; ++i)
-      addScreenshot('saved-screenshots', savedScreenshots[i]);
-  }
-}
-
-function setupDialogDefaults(defaults) {
-  if (defaults.length > 0) {
-    $('page-url-text').value = defaults[0];
-    if (defaults.length > 2) {
-      // We're in Chromium OS.
-      $('user-email-text').value = defaults[2];
-    }
-  }
-}
-
-window.addEventListener('DOMContentLoaded', load);
-</script>
-</head>
-<body>
-<div>
-  <div id="main-panel">
-    <div class="formpane">
-      <table>
-        <!--  Issue type dropdown -->
-        <tr>
-          <th id="issue-with" class="bug-report-label" i18n-content="issue-with">
-          </th>
-        </tr>
-        <tr>
-          <td>
-            <select id="issue-with-combo" class="bug-report-text">
-            </select>
-          </td>
-        </tr>
-        <!--  Page URL text box -->
-        <tr>
-          <th colspan="2" id="page-url" class="bug-report-label"
-              i18n-content="page-url">
-          </th>
-        </tr>
-        <tr>
-          <td colspan="2">
-            <input id='page-url-text' maxlength=200 class="bug-report-text">
-          </td>
-        </tr>
-        <!--  Description -->
-        <tr>
-          <th id="description" colspan="2" class="bug-report-label"
-              i18n-content="description">
-          </th>
-        </tr>
-        <tr>
-          <td colspan="2">
-            <textarea id='description-text' rows="10" class="bug-report-text">
-            </textarea>
-          </td>
-        </tr>
-      </table>
-    </div>
-    <div class="formpane">
-      <table>
-<if expr="pp_ifdef('chromeos')">
-        <!--  Page URL text box -->
-        <tr>
-          <th id="user-email" class="bug-report-label" i18n-content="user-email">
-          </th>
-        </tr>
-        <tr>
-          <td>
-            <input id='user-email-text' maxlength=200 class="bug-report-text">
-          </td>
-        </tr>
-        <!--  System Information checkbox -->
-        <tr>
-          <td>
-            <input id="sys-info-checkbox" type="checkbox" value="sysinfo" checked>
-            <span id="sysinfo-label"></span>
-            <a id="sysinfo-url" href="#" >
-              <span i18n-content="sysinfo"></span>
-            </a>
-          </td>
-        </tr>
-</if>
-        <!--  Screenshot radio buttons -->
-        <tr>
-          <th id="screenshot" class="bug-report-label" i18n-content="screenshot">
-          </th>
-        </tr>
-        <tr>
-          <td>
-            <input id="no-screenshot" type="radio" name="screenshot-group"
-                   value="none" onclick="noneSelected()">
-            <br>
-<if expr="pp_ifdef('chromeos')">
-            <input id="saved-screenshot" type="radio" name="screenshot-group"
-                   value="saved" onclick="savedSelected()">
-            <br>
-            <div id="saved-screenshots" style="display: none;"
-                 class="thumbnail-list">
-            </div>
-</if>
-            <input id="current-screenshot" type="radio" name="screenshot-group"
-                   value="current" checked onclick="currentSelected()">
-            <br>
-            <div id="current-screenshots" class="thumbnail-list">
-            </div>
-          </td>
-        </tr>
-      </table>
-    </div>
-  </div>
-</div>
-<div id="buttons">
-    <!--  Buttons -->
-    <input id='send-report-button' type="submit" class="bug-report-button"
-          i18n-values="value:send-report" onclick="sendReport()">
-    <input id='cancel-button' type="submit" class="bug-report-button"
-           i18n-values="value:cancel" onclick="cancel()">
-</div>
-</body>
-</html>
+<!DOCTYPE HTML>

+<html i18n-values="dir:textdirection;">

+<head>

+<meta charset="utf-8"/>

+<title i18n-content="page-title"></title>

+<!-- We want to keep our style in sync with the options page. -->

+<link rel="stylesheet" href="dom_ui.css">
+<link rel="stylesheet" href="options/options_page.css">
+<link rel="stylesheet" href="bug_report.css">

+

+<script src="shared/js/local_strings.js"></script>

+<script src="shared/js/util.js"></script>

+<script src="bug_report.js"></script>

+<script>

+

+///////////////////////////////////////////////////////////////////////////////

+// Document Functions:

+/**

+ * Window onload handler, sets up the page.

+ */

+function load() {

+  $('sysinfo-url').onclick = function(event) {

+    chrome.send('openSystemTab');

+  };

+  

+  var menuOffPattern = /(^\?|&)menu=off($|&)/;
+  var menuDisabled = menuOffPattern.test(window.location.search);
+  document.documentElement.setAttribute('hide-menu', menuDisabled);
+  

+

+  // textContent on description-text textarea seems to default

+  // to several spaces, this resets it to empty.

+  $('description-text').textContent = '';

+

+  // Get a list of issues that we allow the user to select from.

+  // Note, the order and the issues types themselves are different

+  // between Chromium and Chromium OS, so this code needs to be

+  // maintained individually between in these two sections.

+  var issueTypeText = [];

+  issueTypeText[0] = localStrings.getString('issue-choose');

+<if expr="not pp_ifdef('chromeos')">

+  issueTypeText[1] = localStrings.getString('issue-page-formatting');

+  issueTypeText[2] = localStrings.getString('issue-page-load');

+  issueTypeText[3] = localStrings.getString('issue-plugins');

+  issueTypeText[4] = localStrings.getString('issue-tabs');

+  issueTypeText[5] = localStrings.getString('issue-sync');

+  issueTypeText[6] = localStrings.getString('issue-crashes');

+  issueTypeText[7] = localStrings.getString('issue-extensions');

+  issueTypeText[8] = localStrings.getString('issue-phishing');

+  issueTypeText[9] = localStrings.getString('issue-other');

+</if>

+<if expr="pp_ifdef('chromeos')">

+  issueTypeText[1] = localStrings.getString('issue-connectivity');

+  issueTypeText[2] = localStrings.getString('issue-sync');

+  issueTypeText[3] = localStrings.getString('issue-crashes');

+  issueTypeText[4] = localStrings.getString('issue-page-formatting');

+  issueTypeText[5] = localStrings.getString('issue-extensions');

+  issueTypeText[6] = localStrings.getString('issue-standby');

+  issueTypeText[7] = localStrings.getString('issue-phishing');

+  issueTypeText[8] = localStrings.getString('issue-other');

+</if>

+  // Add all the issues to the selection box.

+  for (var i = 0; i < issueTypeText.length; i++) {

+    var option = document.createElement('option');

+    option.className = 'bug-report-text';

+    option.textContent = issueTypeText[i];

+    $('issue-with-combo').add(option);

+  }

+

+  chrome.send('getDialogDefaults', []);

+  chrome.send('refreshCurrentScreenshot', []);

+};

+

+function setupCurrentScreenshot(screenshot) {

+  addScreenshot('current-screenshots', screenshot);

+}

+

+function setupSavedScreenshots(screenshots) {

+  if (screenshots.length == 0) {

+    $('saved-screenshots').innerText =

+        localStrings.getString('no-saved-screenshots');

+

+    // Make sure we make the display the message

+    $('saved-screenshots').style.display = 'block';

+    

+    // In case the user tries to send now; fail safe, do not send a screenshot

+    // at all versus sending the current screenshot. 

+    selectedThumbnailDivId = '';

+    selectedThumbnailId = '';

+  } else {

+    for (i = 0; i < screenshots.length; ++i)

+      addScreenshot('saved-screenshots', screenshots[i]);

+  

+    // Now that we have our screenshots, try selecting the saved screenshots

+    // again.

+    savedSelected();

+  }

+}

+

+

+function setupDialogDefaults(defaults) {

+  if (defaults.length > 0) {

+    $('page-url-text').value = defaults[0];

+    if (defaults[0] == '')

+      $('page-url-checkbox').checked = false;

+

+    if (defaults.length > 2) {

+      // We're in Chromium OS.

+      $('user-email-text').textContent = defaults[2];

+      if (defaults[2] == '') {

+        // if we didn't get an e-mail address from cros,

+        // disable the user email display totally

+        $('user-email-table').style.display = 'none';

+        

+        // this also means we are in privacy mode, so no saved screenshots

+        $('screenshot-link-tosaved').style.display = 'none';

+      }

+    }

+  }

+}

+

+window.addEventListener('DOMContentLoaded', load);

+</script>

+</head>

+<body i18n-values=".style.fontFamily:fontfamily;.style.fontSize:fontsize">

+<div id="main-content">

+  <div id="navbar-container">

+    <h1 id="settings-title" i18n-content="page-title">

+    </h1>

+  </div>

+  <div id="mainview" class>

+    <!-- Even though we really don't need these many nested DIV's, we're staying

+    as close to the settings page layout as possible, re-using all our styles

+    from options_page.css -->

+    <div id="mainview-content">

+      <div class="page">

+        <h1 i18n-content="title"></h1>

+        <table id="main-table">

+          <!--  Issue type dropdown -->

+          <tbody>

+            <tr>

+              <th id="issue-with" class="bug-report-label"

+                  i18n-content="issue-with"></th>

+            </tr>

+            <tr>

+              <td>

+                <select id="issue-with-combo" class="bug-report-text">

+                </select>

+              </td>

+            </tr>

+            <!--  Description -->

+            <tr>

+              <th id="description" colspan="2" class="bug-report-label"

+                  i18n-content="description"></th>

+            </tr>

+            <tr>

+              <td colspan="2">

+                <textarea id="description-text" rows="10"

+                    class="bug-report-text"></textarea>

+              </td>

+            </tr>

+            <tr>

+              <td>

+                <table style="-webkit-border-vertical-spacing: 0px;">

+                  <!--  Page URL -->

+                  <tr>

+                    <td>

+                      <table class="bug-report-table">

+                        <tr>

+                          <td class="bug-report-fieldlabel">

+                            <input id="page-url-checkbox" type="checkbox"

+                                value="pageurl" checked>

+                            <span id="page-url-label" i18n-content="page-url">

+                            </span>

+                          </td>

+                          <td>

+                            <input id="page-url-text" class="bug-report-field"

+                                maxlength="200">

+                          </td>

+                        </tr>

+                      </table>

+                    </td>

+                  </tr>

+                  <!--  User e-mail -->

+                  <tr>

+                    <td>

+<if expr="pp_ifdef('chromeos')">

+                      <table id="user-email-table" class="bug-report-table">

+                        <tr>

+                          <td class="bug-report-fieldlabel">

+                            <input id="user-email-checkbox" type="checkbox"

+                                checked>

+                            <span id="user-email-label"

+                                i18n-content="user-email"></span>

+                          </td>

+                          <td>

+                            <label id="user-email-text"

+                                class="bug-report-field"></label>

+                          </td>

+                        </tr>

+                      </table>

+</if>                        

+                    </td>

+                  </tr>

+                  <!--  System Information -->

+                  <tr>

+                    <td>

+                      <table class="bug-report-table">

+                        <tr>

+                          <td class="bug-report-fieldlabel">

+                            <input id="sys-info-checkbox" type="checkbox"

+                                checked>

+                            <span id="sysinfo-label">

+                              <a id="sysinfo-url" href="#"

+                                  i18n-content="sysinfo"></a>

+                            </span>

+                          </td>

+                        </tr>

+                      </table>

+                    </td>

+                  </tr>

+                  <!--  Screenshot -->

+                  <tr>

+                    <td>

+                      <table class="bug-report-table">

+                        <tr>

+                          <td class="bug-report-fieldlabel">

+                            <input id="screenshot-checkbox" type="checkbox"

+                                checked>

+                            <span id="screenshot-label-current"

+                                i18n-content="current-screenshot">

+                            </span>

+<if expr="pp_ifdef('chromeos')">

+                            <span id="screenshot-label-saved"

+                                style="display: none;"

+                                i18n-content="saved-screenshot">

+                            </span>

+                            <a id="screenshot-link-tosaved" href="#"

+                                onclick="changeToSaved()"

+                                i18n-content="choose-different-screenshot">

+                            </a>

+                            <a id="screenshot-link-tocurrent" href="#"

+                                style="display: none;"

+                                onclick="changeToCurrent()"

+                                i18n-content="choose-original-screenshot">

+                            </a>

+</if>

+                          </td>

+                        </tr>

+                      </table>

+                    </td>

+                  </tr>

+                  <tr>

+                    <td>

+<if expr="pp_ifdef('chromeos')">

+                      <div id="saved-screenshots" style="display: none;"

+                          class="thumbnail-list"></div>

+</if>

+                      <div id="current-screenshots" class="thumbnail-list">

+                      </div>

+                    </td>

+                  </tr>

+                </table>

+              </td>

+            </tr>

+            <tr>

+              <td>

+                <div id="buttons-pane">

+                  <!--  Buttons -->

+                  <input id="send-report-button" type="submit"

+                      class="bug-report-button" onclick="sendReport()"

+                      i18n-values="value:send-report">

+                  <input id="cancel-button" type="submit"

+                      class="bug-report-button" i18n-values="value:cancel"

+                      onclick="cancel()">

+                </div>

+<if expr="pp_ifdef('chromeos')">

+                <div id="privacy-note" i18n-values=".innerHTML:privacy-note">

+                </div>

+</if>

+              </td>

+            </tr>

+          </tbody>

+        </table>

+      </div>

+    </div>

+  </div>

+</div>

+</body>

+</html>

diff --git a/chrome/browser/resources/bug_report.js b/chrome/browser/resources/bug_report.js
index c9af14f..64f37d0 100644..100755
--- a/chrome/browser/resources/bug_report.js
+++ b/chrome/browser/resources/bug_report.js
@@ -52,22 +52,18 @@ function addScreenshot(divId, screenshot) {
   };
 
   var innerDiv = document.createElement('div');
-  innerDiv.className = 'image-thumbnail';
+  if (divId == 'current-screenshots')
+    innerDiv.className = 'image-thumbnail-current';
+  else
+    innerDiv.className = 'image-thumbnail';
 
   var thumbnail = document.createElement('img');
   thumbnail.id = thumbnailDiv.id + '-image';
   // We add the ?+timestamp to make sure the image URLs are unique
   // and Chrome does not load the image from cache.
-  thumbnail.src = screenshot + "?" + Date.now();
+  thumbnail.src = screenshot + '?' + Date.now();
   innerDiv.appendChild(thumbnail);
 
-  var largeImage = document.createElement('img');
-  largeImage.src = screenshot + "?" + Date.now();
-
-  var popupDiv = document.createElement('div');
-  popupDiv.appendChild(largeImage);
-  innerDiv.appendChild(popupDiv);
-
   thumbnailDiv.appendChild(innerDiv);
   $(divId).appendChild(thumbnailDiv);
 
@@ -84,22 +80,31 @@ function sendReport() {
   if (!$('issue-with-combo').selectedIndex) {
     alert(localStrings.getString('no-issue-selected'));
     return false;
+  } else if ($('description-text').value.length == 0) {
+    alert(localStrings.getString('no-description'));
+    return false;
   }
 
   var imagePath = '';
   if (selectedThumbnailId)
     imagePath = $(selectedThumbnailId + '-image').src;
 
-  // Note, categories are based from 1 in our protocol buffers, so no
-  // adjustment is needed on selectedIndex.
+  // Note, categories are based from 1 in our protocol buffers, so no

+  // adjustment is needed on selectedIndex.

+  var pageUrl = $('page-url-text').value;

+  if (!$('page-url-checkbox').checked)

+    pageUrl = '';
   var reportArray = [String($('issue-with-combo').selectedIndex),
-                     $('page-url-text').value,
+                     pageUrl,
                      $('description-text').value,
                      imagePath];
 
-  // Add chromeos data if it exists.
-  if ($('user-email-text') && $('sys-info-checkbox')) {
-    reportArray = reportArray.concat([$('user-email-text').value,
+  // Add chromeos data if it exists.

+  if ($('user-email-text') && $('sys-info-checkbox')) {

+    var userEmail= $('user-email-text').textContent;

+    if (!$('user-email-checkbox').checked)

+      userEmail = '';

+    reportArray = reportArray.concat([userEmail,
                                       String($('sys-info-checkbox').checked)]);
   }
 
@@ -119,6 +124,7 @@ function cancel() {
  * selected when we had this div open previously.
  */
 function currentSelected() {
+  // TODO(rkc): Change this to use a class instead.
   $('current-screenshots').style.display = 'block';
   if ($('saved-screenshots'))
     $('saved-screenshots').style.display = 'none';
@@ -133,26 +139,49 @@ function currentSelected() {
 /**
  * Select the saved screenshots div, restoring the image that was
  * selected when we had this div open previously.
- */
-function savedSelected() {
+ */

+function savedSelected() {

   $('current-screenshots').style.display = 'none';
-  $('saved-screenshots').style.display = 'block';
 
-  if (selectedThumbnailDivId != 'saved-screenshots')
-    selectImage('saved-screenshots', savedThumbnailIds['saved-screenshots']);
+  if ($('saved-screenshots').childElementCount == 0) {
+    // setupSavedScreenshots will take care of changing visibility
+    chrome.send('refreshSavedScreenshots', []);
+  } else {
+    $('saved-screenshots').style.display = 'block';
+    if (selectedThumbnailDivId != 'saved-screenshots')
+      selectImage('saved-screenshots', savedThumbnailIds['saved-screenshots']);
+  }
 
   return true;
 }
 
+
 /**
- * Unselect all screenshots divs.
+ * Change the type of screenshot we're showing to the user from
+ * the current screenshot to saved screenshots
  */
-function noneSelected() {
-  $('current-screenshots').style.display = 'none';
-  if ($('saved-screenshots'))
-    $('saved-screenshots').style.display = 'none';
+function changeToSaved() {
+  $('screenshot-label-current').style.display = 'none';
+  $('screenshot-label-saved').style.display = 'inline';
+
+  // Change the link to say "go to original"
+  $('screenshot-link-tosaved').style.display = 'none';
+  $('screenshot-link-tocurrent').style.display = 'inline';
+  
+  savedSelected();
+}
 
-  selectedThumbnailDivId = '';
-  selectedThumbnailId = '';
-  return true;
+/**
+ * Change the type of screenshot we're showing to the user from
+ * the saved screenshots to the current screenshots
+ */
+function changeToCurrent() {
+  $('screenshot-label-current').style.display = 'inline';
+  $('screenshot-label-saved').style.display = 'none';
+
+  // Change the link to say "go to original"
+  $('screenshot-link-tosaved').style.display = 'inline';
+  $('screenshot-link-tocurrent').style.display = 'none';
+  
+  currentSelected();
 }