New SSL interstitial (behind Finch flag)

chrome/browser/resources/ssl/overridable_v2.js

Index: chrome/browser/resources/ssl/overridable_v2.js
diff --git a/chrome/browser/resources/ssl/overridable_v2.js b/chrome/browser/resources/ssl/overridable_v2.js
new file mode 100644
index 0000000000000000000000000000000000000000..0485b2bdbb63d9e2ab31c766ae425eefdaf82f39
--- /dev/null
+++ b/chrome/browser/resources/ssl/overridable_v2.js
@@ -0,0 +1,31 @@
+// Copyright 2014 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.
+
+var expandedDetails = false;
+
+function setupEvents() {
+  var clickEventType = ('ontouchstart' in window ? 'touchend' : 'click');

[Bernhard Bauer, 2014/05/26 10:13:20]

Does this mean that we *require* a touch if the device supports touches?
Couldn't we simply listen for both?

[felt, 2014/05/27 12:25:06]

Oh, right. I guess on devices like a Pixel there are both. Done.

[felt, 2014/05/28 12:56:29]

It turns out I just need the 'click', touchscreen devices will send both touch
and click. So I've removed the 'touch' as it is redundant.

[Bernhard Bauer, 2014/05/28 13:17:47]

OK, cool.

+
+  $('safety-button').addEventListener(clickEventType, function() {
+    sendCommand(CMD_DONT_PROCEED);
+  });
+
+  $('proceed-link').addEventListener(clickEventType, function() {
+    sendCommand(CMD_PROCEED);
+  });
+
+  $('details-button').addEventListener(clickEventType, function() {
+    $('details').classList.toggle('hidden');
+    $('details-button').innerText = $('details').classList.contains('hidden') ?
+        $('details-button').innerText = templateData.openDetails :

[Bernhard Bauer, 2014/05/26 10:13:20]

You already assign the result of the ?: operator.

[felt, 2014/05/27 12:25:06]

Done.

+        $('details-button').innerText = templateData.closeDetails;
+    if (!expandedDetails) {
+      // Record a histogram entry only the first time that details is opened.
+      sendCommand(CMD_MORE);
+      expandedDetails = true;
+    }
+  });
+}
+
+document.addEventListener('DOMContentLoaded', setupEvents);