Add the extended reporting checkbox to the malware interstitial v3

The new layout was missing space for a checkbox. This adds the checkbox, and adjusts the surrounding margins.

BUG=381260

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

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

chrome/browser/resources/safe_browsing/safe_browsing_v3.js

@@ -16,3 +16,20 @@ var SB_CMD_TAKE_ME_BACK = 'takeMeBack';
 // Other constants defined in safe_browsing_blocking_page.cc.
 var SB_BOX_CHECKED = 'boxchecked';
 var SB_DISPLAY_CHECK_BOX = 'displaycheckbox';
+
+// This sets up the Extended Safe Browsing Reporting opt-in.
+function setupCheckbox() {
+  if (loadTimeData.getBoolean('ssl') || loadTimeData.getBoolean('phishing') ||
+      !loadTimeData.getBoolean(SB_DISPLAY_CHECK_BOX)) {
+    return;
+  }
+
+  $('opt-in-label').innerHTML = loadTimeData.getString('optInLink');
+  $('opt-in-checkbox').checked = loadTimeData.getBoolean(SB_BOX_CHECKED);
+  $('malware-opt-in').classList.remove('hidden');
+
+  $('opt-in-checkbox').addEventListener('click', function() {
+    sendCommand(
+        $('opt-in-checkbox').checked ? SB_CMD_DO_REPORT : SB_CMD_DONT_REPORT);
+  });
+}

chrome/browser/resources/ssl/interstitial_v2.css

@@ -46,7 +46,7 @@ button:hover {
 
 #details {
   color: #696969;
-  margin: 45px 0 150px 0;
+  margin: 45px 0 50px;
 }
 
 #details p:not(:first-of-type) {
@@ -88,8 +88,13 @@ h1 {
   width: 100%;
 }
 
+#malware-opt-in {
+  font-size: .875em;
+  margin-top: 39px;
+}
+
 .nav-wrapper {
-  margin-top: 84px;
+  margin-top: 51px;
 }
 
 .nav-wrapper::after {
@@ -99,9 +104,8 @@ h1 {
   width: 100%;
 }
 
-.small-link {
-  color: #696969;
-  font-size: .875em;
+#opt-in-label {
+  -webkit-margin-start: 32px;
 }
 
 .safe-browsing a,
@@ -121,12 +125,59 @@ h1 {
       url('../safe_browsing/images/2x/stop_sign.png') 2x);
 }
 
+.small-link {
+  color: #696969;
+  font-size: .875em;
+}
+
 .ssl .icon {
   background-image: -webkit-image-set(
       url('images/1x/brokenssl_red.png') 1x,
       url('images/2x/brokenssl_red.png') 2x);
 }
 
+.styled-checkbox {
+  float: left;
+  height: 16px;
+  margin-top: .36em;
+  position: relative;
+  width: 16px;
+}
+
+[dir='rtl'] .styled-checkbox {
+  float: right;
+}
+
+.styled-checkbox label {
+  background-color: white;
+  border-radius: 2px;
+  height: 16px;
+  left: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 16px;
+}
+
+.styled-checkbox label::after {
+  background: transparent;
+  border: 2px solid rgb(217, 69, 61);
+  border-right-width: 0;
+  border-top-width: 0;
+  content: '';
+  height: 4px;
+  left: 3px;
+  opacity: 0.3;
+  position: absolute;
+  top: 4px;
+  transform: rotate(-45deg);
+  width: 9px;
+}
+
+.styled-checkbox input[type=checkbox]:checked + label::after {
+  opacity: 1;
+}
+
 @media (max-width: 700px) {
   .interstitial-wrapper {
     padding: 0 10%;
@@ -166,6 +217,10 @@ h1 {
     padding: 0 5%;
   }
 
+  #malware-opt-in {
+    margin-top: 24px;
+  }
+
   .nav-wrapper {
     margin-top: 30px;
   }

chrome/browser/resources/ssl/interstitial_v2.html

@@ -19,6 +19,13 @@
       <h1 i18n-content="heading"></h1>
       <p i18n-values=".innerHTML:primaryParagraph"></p>
     </div>
+    <div id="malware-opt-in" class="hidden">
+      <div class="styled-checkbox">
+        <input type="checkbox" id="opt-in-checkbox">
+        <label for="opt-in-checkbox"></label>
+      </div>
+      <div id="opt-in-label"></div>
+    </div>
     <div class="nav-wrapper">
       <button i18n-content="primaryButtonText" id="primary-button"></button>
       <a href="#" id="details-button" class="small-link"

chrome/browser/resources/ssl/interstitial_v2.js

@@ -65,6 +65,7 @@ function setupEvents() {
   });
 
   preventDefaultOnPoundLinkClicks();
+  setupCheckbox();
 }
 
 document.addEventListener('DOMContentLoaded', setupEvents);

chrome/browser/safe_browsing/safe_browsing_blocking_page.cc

@@ -1322,6 +1322,30 @@ void SafeBrowsingBlockingPageV3::PopulateMalwareLoadTimeData(
   load_time_data->SetString(
       "finalParagraph",
       l10n_util::GetStringUTF16(IDS_MALWARE_V3_PROCEED_PARAGRAPH));
+
+  load_time_data->SetBoolean(kDisplayCheckBox, CanShowMalwareDetailsOption());
+  if (CanShowMalwareDetailsOption()) {
+    std::string privacy_link = base::StringPrintf(
+        kPrivacyLinkHtml,
+        l10n_util::GetStringUTF8(
+            IDS_SAFE_BROWSING_PRIVACY_POLICY_PAGE_V2).c_str());
+    load_time_data->SetString(
+        "optInLink",
+        l10n_util::GetStringFUTF16(IDS_SAFE_BROWSING_MALWARE_V2_REPORTING_AGREE,
+                                   base::UTF8ToUTF16(privacy_link)));
+    Profile* profile = Profile::FromBrowserContext(
+       web_contents_->GetBrowserContext());
+    if (profile->GetPrefs()->HasPrefPath(
+            prefs::kSafeBrowsingExtendedReportingEnabled)) {
+      reporting_checkbox_checked_ =
+          IsPrefEnabled(prefs::kSafeBrowsingExtendedReportingEnabled);
+    } else if (IsPrefEnabled(prefs::kSafeBrowsingReportingEnabled) ||
+         IsPrefEnabled(prefs::kSafeBrowsingDownloadFeedbackEnabled)) {
+      reporting_checkbox_checked_ = true;
+    }
+    load_time_data->SetBoolean(
+        kBoxChecked, reporting_checkbox_checked_);
+  }
 }
 
 void SafeBrowsingBlockingPageV3::PopulatePhishingLoadTimeData(

chrome/browser/safe_browsing/safe_browsing_blocking_page_unittest.cc

@@ -710,8 +710,7 @@ TYPED_TEST(SafeBrowsingBlockingPageTest, MalwareReportsToggling) {
 }
 
 // Test that the transition from old to new preference works.
-TYPED_TEST(SafeBrowsingBlockingPageTest,
-    DISABLED_MalwareReportsTransitionEnabled) {
+TYPED_TEST(SafeBrowsingBlockingPageTest, MalwareReportsTransitionEnabled) {
   // The old pref is enabled.
   Profile* profile = Profile::FromBrowserContext(
       this->web_contents()->GetBrowserContext());