Getting ready for HTTPS & HTTP/2

README.md

@@ -11,7 +11,7 @@ Analyzes a webpage and detects **performance** or **front-end code quality** iss
     <tr>
         <td width="70%">
             The <b>online tool</b> (recommended): 
-            <a href="http://yellowlab.tools" target="_blank">http://yellowlab.tools</a>
+            <a href="https://yellowlab.tools" target="_blank">https://yellowlab.tools</a>
         </td>
         <td width="30%">
             <img src="./doc/img/YLT-animated.gif"></img>

front/src/js/controllers/dashboardCtrl.js

@@ -41,11 +41,11 @@ dashboardCtrl.controller('DashboardCtrl', ['$scope', '$rootScope', '$routeParams
     };
 
     $scope.shareOnTwitter = function(message) {
-        openSocialPopup('https://twitter.com/intent/tweet?text=' + encodeURIComponent(message + 'http://yellowlab.tools'));
+        openSocialPopup('https://twitter.com/intent/tweet?text=' + encodeURIComponent(message + 'https://yellowlab.tools'));
     };
 
     $scope.shareOnLinkedin = function(message) {
-        openSocialPopup('https://www.linkedin.com/shareArticle?mini=true&url=http://yellowlab.tools&title=' + encodeURIComponent(message) + '&summary=' + encodeURIComponent('YellowLabTools is a free online tool that analyzes performance and front-end quality of a webpage.'));
+        openSocialPopup('https://www.linkedin.com/shareArticle?mini=true&url=https://yellowlab.tools&title=' + encodeURIComponent(message) + '&summary=' + encodeURIComponent('YellowLabTools is a free online tool that analyzes performance and front-end quality of a webpage.'));
     };
 
     function openSocialPopup(url) {

front/src/js/directives/offendersDirectives.js

@@ -924,4 +924,15 @@
         };
     });
 
+    // Proxify an HTTP image to HTTPS if hosted on HTTPS
+    // Uses a great free open-source external service: https://images.weserv.nl
+    offendersDirectives.filter('https', function() {
+        return function(url) {
+            if (url && url.indexOf('http://') === 0 && window.location.protocol === 'https:') {
+                return 'https://images.weserv.nl/?url=' + encodeURIComponent(url.substr(7));
+            }
+            return url;
+        };
+    });
+
 })();

front/src/main.html

@@ -18,10 +18,10 @@
     <link rel="stylesheet" type="text/css" href="css/about.css">
     <!-- endbuild -->
 
-    <link rel="preconnect" href="//www.google-analytics.com">
-    <link rel="dns-prefetch" href="//www.google-analytics.com">
-    <link rel="preconnect" href="//ghbtns.com">
-    <link rel="dns-prefetch" href="//ghbtns.com">
+    <link rel="preconnect" href="https://www.google-analytics.com">
+    <link rel="dns-prefetch" href="https://www.google-analytics.com">
+    <link rel="preconnect" href="https://ghbtns.com">
+    <link rel="dns-prefetch" href="https://ghbtns.com">
     <link rel="preconnect" href="https://api.github.com">
     <link rel="dns-prefetch" href="https://api.github.com">
 

front/src/views/rule.html

@@ -133,7 +133,7 @@
                     </div>
 
                     <div ng-if="policyName === 'lazyLoadableImagesBelowTheFold' || policyName === 'hiddenImages'">
-                        <img ng-src="{{offender}}" class="smallPreview checker"></img>
+                        <img ng-src="{{offender | https}}" class="smallPreview checker"></img>
                         <url-link url="offender" max-length="100"></url-link>
                     </div>
 
@@ -267,7 +267,7 @@
             <div ng-repeat="image in rule.offendersObj.list.images | orderBy:'-gain'">
                 <div>
                     Current file: <url-link url="image.url" max-length="50"></url-link>
-                    <div><a href="{{image.url}}" target="_blank"><img ng-src="{{image.url}}" class="checker" /></a></div>
+                    <div><a href="{{image.url}}" target="_blank"><img ng-src="{{image.url | https}}" class="checker" /></a></div>
                 </div>
                 <div>
                     <p ng-if="!image.afterCompression">Current weight: {{image.original | bytes}}</p>
@@ -364,7 +364,7 @@
                     <div>Weight (bytes)</div>
                 </div>
                 <div ng-repeat="request in requests track by $index">
-                    <div ng-if="type == 'image'"><img ng-src="{{request.url}}" class="smallPreview checker" /></div>
+                    <div ng-if="type == 'image'"><img ng-src="{{request.url | https}}" class="smallPreview checker" /></div>
                     <div><url-link url="request.url" max-length="100"></url-link></div>
                     <div>{{request.size}}</div>
                 </div>

package.json

@@ -6,7 +6,7 @@
   "author": {
     "name": "Gaël Métais",
     "email": "gael@gaelmetais.com",
-    "url": "http://www.gaelmetais.com"
+    "url": "https://www.gaelmetais.com"
   },
   "repository": {
     "type": "git",