Fix for out of order script loading

There are two issues here:

- The first issue is that a Sphinx theme sets defer or async
  when loading jQuery. This can cause jQuery to not be available
  before readthedocs-doc-embed.js sets its own event listener.
- The second issue is caused by the sustainability API loading
  faster than the ad client. This should be rare since the ad client
  is loaded via a CDN but it can happen especially on slow networks.

I was able to reproduce these issues by setting throttling
in the browser developer tools.

Author: davidfischer

readthedocs/core/static-src/core/js/doc-embed/sponsorship.js

@@ -19,6 +19,7 @@ function inject_ads_client() {
     script.src = "https://media.ethicalads.io/media/client/beta/ethicalads.min.js";
     script.type = "text/javascript";
     script.async = true;
+    script.id = "ethicaladsjs";
     document.getElementsByTagName("head")[0].appendChild(script);
 }
 
@@ -185,6 +186,14 @@ function init() {
                 // Ad client prevented from loading - check ad blockers
                 adblock_admonition();
                 adblock_nag(placement);
+            } else {
+                // The ad client hasn't loaded yet which could happen due to a variety of issues
+                // Add an event listener for it to load
+                $("#ethicaladsjs").on("load", function () {
+                    if (typeof ethicalads !== "undefined") {
+                        ethicalads.load();
+                    }
+                });
             }
         },
         error: function () {

readthedocs/core/static-src/core/js/readthedocs-doc-embed.js

@@ -7,11 +7,22 @@ var sphinx = require('./doc-embed/sphinx');
 var search = require('./doc-embed/search');
 
 
-$(document).ready(function () {
-    footer.init();
-    sphinx.init();
-    // grokthedocs.init();
-    // mkdocs.init();
-    search.init();
-    sponsorship.init();
-});
+// While much of this script relies on jQuery (which Sphinx relies on),
+// we purposefully do not use it before DOMContentLoaded in case scripts are loaded out of order
+(function () {
+    function domReady(fn) {
+        // If the DOM is already done parsing
+        if (document.readyState === "complete" || document.readyState === "interactive") {
+            setTimeout(fn, 1);
+        } else {
+            document.addEventListener("DOMContentLoaded", fn);
+        }
+    }
+
+    domReady(function() {
+        footer.init();
+        sphinx.init();
+        search.init();
+        sponsorship.init();
+    });
+}())