Link to the mixed content filter from security panel

Source/devtools/front_end/security/SecurityPanel.js

 // Copyright 2015 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.
 
 /**
  * @constructor
  * @extends {WebInspector.PanelWithSidebar}
  * @implements {WebInspector.TargetManager.Observer}
  */
 WebInspector.SecurityPanel = function()
@@ skipping 39 matching lines @@
  * @property {?NetworkAgent.CertificateDetails} securityDetails.certificateDetails - Certificate details of the origin (attached to security details), if available.
  * @property {?WebInspector.SecurityOriginView} originView - Current SecurityOriginView corresponding to origin.
  */
 WebInspector.SecurityPanel.OriginState;
 
 WebInspector.SecurityPanel.prototype = {
 
     /**
      * @param {!SecurityAgent.SecurityState} newSecurityState
      * @param {!Array<!SecurityAgent.SecurityStateExplanation>} explanations
+     * @param {?SecurityAgent.MixedContentStatus} mixedContentStatus
+     * @param {boolean} schemeIsCryptographic
      */
-    _updateSecurityState: function(newSecurityState, explanations)
+    _updateSecurityState: function(newSecurityState, explanations, mixedContentStatus, schemeIsCryptographic)
     {
         this._sidebarMainViewElement.setSecurityState(newSecurityState);
-        this._mainView.updateSecurityState(newSecurityState, explanations);
+        this._mainView.updateSecurityState(newSecurityState, explanations, mixedContentStatus, schemeIsCryptographic);
     },
 
     /**
      * @param {!WebInspector.Event} event
      */
     _onSecurityStateChanged: function(event)
     {
-        var securityState = /** @type {!SecurityAgent.SecurityState} */ (event.data.securityState);
-        var explanations = /** @type {!Array<!SecurityAgent.SecurityStateExplanation>} */ (event.data.explanations);
-        this._updateSecurityState(securityState, explanations);
+        var data = /** @type {!WebInspector.PageSecurityState} */ (event.data);
+        var securityState = /** @type {!SecurityAgent.SecurityState} */ (data.securityState);
+        var explanations = /** @type {!Array<!SecurityAgent.SecurityStateExplanation>} */ (data.explanations);
+        var mixedContentStatus = /** @type {?SecurityAgent.MixedContentStatus} */ (data.mixedContentStatus);
+        var schemeIsCryptographic = /** @type {boolean} */ (data.schemeIsCryptographic);
+        this._updateSecurityState(securityState, explanations, mixedContentStatus, schemeIsCryptographic);
     },
 
     showMainView: function()
     {
         this._setVisibleView(this._mainView);
     },
 
     /**
      * @param {!WebInspector.SecurityPanel.Origin} origin
      */
@@ skipping 88 matching lines @@
     /**
      * @override
      * @param {!WebInspector.Target} target
      */
     targetRemoved: function(target)
     {
     },
 
     _clear: function()
     {
-        this._updateSecurityState(SecurityAgent.SecurityState.Unknown, []);
+        this._updateSecurityState(SecurityAgent.SecurityState.Unknown, [], null, false);
         this._sidebarMainViewElement.select();
         this._sidebarOriginSection.removeChildren();
         this._origins.clear();
     },
 
     __proto__: WebInspector.PanelWithSidebar.prototype
 }
 
 /**
  * @return {!WebInspector.SecurityPanel}
@@ skipping 131 matching lines @@
     text.createChild("div", "security-summary-section-title").textContent = WebInspector.UIString("Security Overview");
     this._summaryExplanation = text.createChild("div", "security-explanation");
 
     this._securityExplanations = this.element.createChild("div", "security-explanation-list");
 
 }
 
 WebInspector.SecurityMainView.prototype = {
     /**
      * @param {!SecurityAgent.SecurityStateExplanation} explanation
+     * @return {!Element}
      */
     _addExplanation: function(explanation)
     {
         var explanationSection = this._securityExplanations.createChild("div", "security-section");
         explanationSection.classList.add("security-explanation");
 
         explanationSection.createChild("div", "lock-icon").classList.add("lock-icon-" + explanation.securityState);
         var text = explanationSection.createChild("div", "security-section-text");
         text.createChild("div", "security-section-title").textContent = explanation.summary;
         text.createChild("div", "security-explanation").textContent = explanation.description;
         if ("certificateId" in explanation) {
             var certificateAnchor = text.createChild("div", "security-certificate-id link");
             certificateAnchor.textContent = WebInspector.UIString("View certificate");
             certificateAnchor.href = "";
             certificateAnchor.addEventListener("click", showCertificateViewer, false);
         }
+
+        return text;
+
         /**
          * @param {!Event} e
          */
         function showCertificateViewer(e)
         {
             e.consume();
             WebInspector.targetManager.mainTarget().networkManager.showCertificateViewer(/** @type {number} */ (explanation.certificateId));
         }
     },
 
     /**
      * @param {!SecurityAgent.SecurityState} newSecurityState
      * @param {!Array<!SecurityAgent.SecurityStateExplanation>} explanations
+     * @param {?SecurityAgent.MixedContentStatus} mixedContentStatus
+     * @param {boolean} schemeIsCryptographic
      */
-    updateSecurityState: function(newSecurityState, explanations)
+    updateSecurityState: function(newSecurityState, explanations, mixedContentStatus, schemeIsCryptographic)
     {
         // Remove old state.
         // It's safe to call this even when this._securityState is undefined.
         this._summarylockIcon.classList.remove("lock-icon-" + this._securityState);
         this._summaryExplanation.classList.remove("security-state-" + this._securityState);
 
         // Add new state.
         this._securityState = newSecurityState;
         this._summarylockIcon.classList.add("lock-icon-" + this._securityState);
         this._summaryExplanation.classList.add("security-state-" + this._securityState);
         var summaryExplanationStrings = {
             "unknown":  WebInspector.UIString("This security of this page is unknown."),
             "insecure": WebInspector.UIString("This page is insecure (broken HTTPS)."),
             "neutral":  WebInspector.UIString("This page is not secure."),
             "secure":   WebInspector.UIString("This page is secure (valid HTTPS).")
         }
         this._summaryExplanation.textContent = summaryExplanationStrings[this._securityState];
 
         this._securityExplanations.removeChildren();
         for (var explanation of explanations)
             this._addExplanation(explanation);
+
+        if (schemeIsCryptographic && mixedContentStatus && (mixedContentStatus.ranInsecureContent || mixedContentStatus.displayedInsecureContent)) {
+            /** @type {!SecurityAgent.SecurityStateExplanation} */
+            var mixedContentExplanation;
+            if (mixedContentStatus.ranInsecureContent) {
+                mixedContentExplanation = /** @type {!SecurityAgent.SecurityStateExplanation} */ ({
+                    "securityState": mixedContentStatus.ranInsecureContentStyle,
+                    "summary": WebInspector.UIString("Active Mixed Content"),
+                    "description": WebInspector.UIString("You have recently allowed insecure content (such as scripts or iframes) to run on this site.")
+                });
+            } else if (mixedContentStatus.displayedInsecureContent) {
+                mixedContentExplanation = /** @type {!SecurityAgent.SecurityStateExplanation} */ ({
+                    "securityState": mixedContentStatus.displayedInsecureContentStyle,
+                    "summary": WebInspector.UIString("Mixed Content"),
+                    "description": WebInspector.UIString("The site includes HTTP resources.")
+                });
+            }
+
+            var requestsAnchor = this._addExplanation(mixedContentExplanation).createChild("div", "security-mixed-content link");
+            requestsAnchor.textContent = WebInspector.UIString("View requests in Network Panel");
+            requestsAnchor.href = "";
+            requestsAnchor.addEventListener("click", mixedContentStatus.ranInsecureContent ? showBlockOverriddenMixedContentInNetworkPanel : showDisplayedMixedContentInNetworkPanel, false);
+        }
+
+        /**
+         * @param {!Event} e
+         */
+        function showDisplayedMixedContentInNetworkPanel(e)
+        {
+            e.consume();
+            WebInspector.NetworkPanel.revealAndFilter(WebInspector.NetworkLogView.FilterType.MixedContent, "displayed");
+        }
+
+        /**
+         * @param {!Event} e
+         */
+        function showBlockOverriddenMixedContentInNetworkPanel(e)
+        {
+            e.consume();
+            WebInspector.NetworkPanel.revealAndFilter(WebInspector.NetworkLogView.FilterType.MixedContent, "block-overridden");
+        }
     },
 
     __proto__: WebInspector.VBox.prototype
 }
 
 /**
  * @constructor
  * @extends {WebInspector.VBox}
  * @param {!WebInspector.SecurityPanel} panel
  * @param {!WebInspector.SecurityPanel.Origin} origin
@@ skipping 150 matching lines @@
 
         var valueDiv = row.createChild("div");
         if (value instanceof HTMLDivElement) {
             valueDiv.appendChild(value);
         } else {
             valueDiv.textContent = value;
         }
     }
 }