From bf0909a94d1bb598aa7df5aa9a6cf466486930c6 Mon Sep 17 00:00:00 2001
From: Scott Feeney <scott@zulip.com>
Date: Mon, 26 Aug 2013 13:00:38 -0400
Subject: [PATCH] Lazy load Dropbox widget, and only when enabled

This brings several improvements:

* The Dropbox script won't slow loading our app.
* If it fails to load, no traceback; Dropbox link just won't appear.
* For users with Dropbox disabled (most at this point), no loading at all.

(imported from commit e71ae5790fc85a185e622bdafb350109527b4eee)
---
 static/js/compose.js       | 17 +++++++++++++++--
 templates/zerver/base.html |  2 +-
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/static/js/compose.js b/static/js/compose.js
index ceafed5e39..b427afc675 100644
--- a/static/js/compose.js
+++ b/static/js/compose.js
@@ -520,8 +520,21 @@ $(function () {
     if (window.XMLHttpRequest && (new XMLHttpRequest()).upload) {
         $("#compose #attach_files").removeClass("notdisplayed");
     }
-    if (feature_flags.dropbox_integration && Dropbox.isBrowserSupported()) {
-        $("#compose #attach_dropbox_files").removeClass("notdisplayed");
+
+    // Lazy load the Dropbox script, since it can slow our page load
+    // otherwise, and isn't enabled for all users. Also, this Dropbox
+    // script isn't under an open source license, so we can't (for legal
+    // reasons) minify it with our own code.
+    if (feature_flags.dropbox_integration) {
+        LazyLoad.js('https://www.dropbox.com/static/api/1/dropins.js', function () {
+            // Successful load. We should now have window.Dropbox.
+            if (! _.has(window, 'Dropbox')) {
+                blueslip.error('Dropbox script reports loading but window.Dropbox undefined');
+            } else if (Dropbox.isBrowserSupported()) {
+                Dropbox.init({appKey: window.dropboxAppKey});
+                $("#compose #attach_dropbox_files").removeClass("notdisplayed");
+            }
+        });
     }
 
     // Click event binding for "Attach files" button
diff --git a/templates/zerver/base.html b/templates/zerver/base.html
index f9e76960c3..7bf0ec1850 100644
--- a/templates/zerver/base.html
+++ b/templates/zerver/base.html
@@ -18,7 +18,7 @@
     <![endif]-->
     <link href="/static/favicon.ico?v=2" rel="shortcut icon">
 
-    <script type="text/javascript" src="https://www.dropbox.com/static/api/1/dropins.js" id="dropboxjs" data-app-key="xxxxxxxxxxxxxxx"></script>
+    <script type="text/javascript">var dropboxAppKey = "xxxxxxxxxxxxxxx";</script>
     {# mixpanel #}
     <script type="text/javascript">
 (function(e,b){if(!b.__SV){var a,f,i,g;window.mixpanel=b;a=e.createElement("script");a.type="text/javascript";a.async=!0;a.src=("https:"===e.location.protocol?"https:":"http:")+'//cdn.mxpnl.com/libs/mixpanel-2.2.min.js';f=e.getElementsByTagName("script")[0];f.parentNode.insertBefore(a,f);b._i=[];b.init=function(a,e,d){function f(b,h){var a=h.split(".");2==a.length&&(b=b[a[0]],h=a[1]);b[h]=function(){b.push([h].concat(Array.prototype.slice.call(arguments,0)))}}var c=b;"undefined"!==