Implementation of the full clock interstitial.

chrome/browser/resources/security_warnings/interstitial_v2.js

Index: chrome/browser/resources/security_warnings/interstitial_v2.js
diff --git a/chrome/browser/resources/security_warnings/interstitial_v2.js b/chrome/browser/resources/security_warnings/interstitial_v2.js
index ab376c277ee056b22268d083dafd98bd7fd43f35..e71f39ff2c1b6b64503fcd81fbf1122e04ea3ae6 100644
--- a/chrome/browser/resources/security_warnings/interstitial_v2.js
+++ b/chrome/browser/resources/security_warnings/interstitial_v2.js
@@ -66,9 +66,12 @@ function toggleDebuggingInfo() {
 function setupEvents() {
   var overridable = loadTimeData.getBoolean('overridable');
   var ssl = loadTimeData.getString('type') === 'SSL';
+  var badClock = ssl && loadTimeData.getBoolean('bad_clock');
 
   if (ssl) {
-    $('body').classList.add('ssl');
+    var bodyClass = badClock ? 'bad-clock' : 'ssl';

[felt, 2014/10/23 01:54:10]

you could simplify here: $('body').classList.dd(badClock ? 'bad-clock' : 'ssl');

[lgarron, 2014/10/23 03:02:04]

Personally, I prefer not to use ternary operators as function arguments.

I can't find anything about this in the style guide, but if you'd really like, I
can change it.

[felt, 2014/10/23 05:26:22]

It seems odd to define a variable that's only used once.

[lgarron, 2014/10/23 19:37:44]

Hmm, I don't really find it odd. In any case, I've already changed it in the
second patch. :-)

+    $('body').classList.add(bodyClass);

[felt, 2014/10/23 01:54:10]

I'm surprised you don't need both ssl and bad-clock in the class list. Is that
because only the icon selection relies on ssl being in the body class list?

[lgarron, 2014/10/23 03:02:04]

Yep, exactly. (I was surprised, too!)

If we expect to add more styling to all SSL interstitials (including bad clock),
I wouldn't mind giving them all the `.ssl` class in addition to more specific
selectors like `.bad-clock`.

+
     $('error-code').textContent = loadTimeData.getString('errorCode');
     $('error-code').classList.remove('hidden');
   } else {
@@ -78,6 +81,8 @@ function setupEvents() {
   $('primary-button').addEventListener('click', function() {
     if (!ssl)
       sendCommand(SB_CMD_TAKE_ME_BACK);
+    else if (badClock)
+      sendCommand(SSL_CMD_CLOCK);
     else if (overridable)
       sendCommand(SSL_CMD_DONT_PROCEED);
     else
@@ -106,21 +111,19 @@ function setupEvents() {
     });
   }
 
-  if (ssl && $('clock-link')) {
-    $('clock-link').addEventListener('click', function(event) {
-      sendCommand(SSL_CMD_CLOCK);
-    });
-  }
-
   $('details-button').addEventListener('click', function(event) {
-    var hiddenDetails = $('details').classList.toggle('hidden');
-    $('details-button').innerText = hiddenDetails ?
-        loadTimeData.getString('openDetails') :
-        loadTimeData.getString('closeDetails');
-    if (!expandedDetails) {
-      // Record a histogram entry only the first time that details is opened.
-      sendCommand(ssl ? SSL_CMD_MORE : SB_CMD_EXPANDED_SEE_MORE);
-      expandedDetails = true;
+    if (badClock) {
+      sendCommand(SSL_CMD_RELOAD);
+    } else {
+      var hiddenDetails = $('details').classList.toggle('hidden');
+      $('details-button').innerText = hiddenDetails ?
+          loadTimeData.getString('openDetails') :
+          loadTimeData.getString('closeDetails');
+      if (!expandedDetails) {
+        // Record a histogram entry only the first time that details is opened.
+        sendCommand(ssl ? SSL_CMD_MORE : SB_CMD_EXPANDED_SEE_MORE);
+        expandedDetails = true;
+      }
     }
   });