Patchwork [4,of,4,website] downloads: replace inline scripts with an onload function

login
register
mail settings
Submitter Kevin Bullock
Date May 10, 2017, 5:22 p.m.
Message ID <f194cff8d65af231bf2c.1494436945@ingalls.local>
Download mbox | patch
Permalink /patch/20561/
State Accepted
Headers show

Comments

Kevin Bullock - May 10, 2017, 5:22 p.m.
# HG changeset patch
# User Kevin Bullock <kbullock+mercurial@ringworld.org>
# Date 1494436785 18000
#      Wed May 10 12:19:45 2017 -0500
# Node ID f194cff8d65af231bf2cb1780daaecef2b0ed3d3
# Parent  130a8e2a946d71eaf031420fa43e9a0d0f7a6e8d
downloads: replace inline scripts with an onload function
Sean Farley - May 10, 2017, 6:39 p.m.
Kevin Bullock <kbullock+mercurial@ringworld.org> writes:

> # HG changeset patch
> # User Kevin Bullock <kbullock+mercurial@ringworld.org>
> # Date 1494436785 18000
> #      Wed May 10 12:19:45 2017 -0500
> # Node ID f194cff8d65af231bf2cb1780daaecef2b0ed3d3
> # Parent  130a8e2a946d71eaf031420fa43e9a0d0f7a6e8d
> downloads: replace inline scripts with an onload function
>
> diff --git a/static/js/download.js b/static/js/download.js
> --- a/static/js/download.js
> +++ b/static/js/download.js
> @@ -132,3 +132,21 @@ var Downloader = {
>          return out;
>      }
>  };
> +
> +(function (document, window) {
> +  var load = function () {
> +    Downloader.init(sources);
> +    var dl = Downloader.select();
> +    var versElement = document.getElementById('download-version')
> +      , descElement = document.getElementById('download-description');

Man, I hate javascript. Anyway, queued!
Sean Farley - May 10, 2017, 6:43 p.m.
Kevin Bullock <kbullock+mercurial@ringworld.org> writes:

>> On May 10, 2017, at 12:22, Kevin Bullock <kbullock+mercurial@ringworld.org> wrote:
>> 
>> # HG changeset patch
>> # User Kevin Bullock <kbullock+mercurial@ringworld.org>
>> # Date 1494436785 18000
>> #      Wed May 10 12:19:45 2017 -0500
>> # Node ID f194cff8d65af231bf2cb1780daaecef2b0ed3d3
>> # Parent  130a8e2a946d71eaf031420fa43e9a0d0f7a6e8d
>> downloads: replace inline scripts with an onload function
>
> I neglected to mention in the commit message that this allows us to improve our Content-Security-Policy usage (we should be able to remove 'unsafe-inline').

I figured as much since I got notified from the bug tracker :-)

Patch

diff --git a/static/js/download.js b/static/js/download.js
--- a/static/js/download.js
+++ b/static/js/download.js
@@ -132,3 +132,21 @@  var Downloader = {
         return out;
     }
 };
+
+(function (document, window) {
+  var load = function () {
+    Downloader.init(sources);
+    var dl = Downloader.select();
+    var versElement = document.getElementById('download-version')
+      , descElement = document.getElementById('download-description');
+    versElement.appendChild(document.createTextNode(dl.attr('version')));
+    descElement.appendChild(document.createTextNode(dl.attr('desc')));
+  }
+
+  if (document.readyState !== 'complete') {
+    document.addEventListener('DOMContentLoaded', load);
+    return;
+  }
+
+  load();
+})(document, window);
diff --git a/templates/base.html b/templates/base.html
--- a/templates/base.html
+++ b/templates/base.html
@@ -7,10 +7,6 @@ 
         <script type="text/javascript" src="{{ url_for('static', filename='js/common.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='sources.js') }}"></script>
         <script type="text/javascript" src="{{ url_for('static', filename='js/download.js') }}"></script>
-        <script language="javascript">
-          Downloader.init(sources);
-          var dl = Downloader.select();
-        </script>
         <link rel="shortcut icon" type="image/x-icon" href="/images/favicon.ico">
 
         <title>Mercurial SCM</title>
@@ -49,10 +45,10 @@ 
                     </div>
                     <div class="col">
                         {% block sidebar %}
-                        <a class="download" href="/downloads" onClick="return dl.download();">
+                        <a class="download" href="/downloads" onClick="return window.dl.download();">
                             <strong>Download now</strong>
-                            Mercurial <em><script language="Javascript">dl.write('version');</script></em>
-                            <span><script language="javascript">dl.write('desc');</script></span>
+                            Mercurial <em id="download-version"></em>
+                            <span id="download-description"></span>
                         </a>
                         <dl>
                             <dt>Another OS?<br><em>Get Mercurial for:</em></dt>