From 607d178e94a70f1089273aafe0628d408419408d Mon Sep 17 00:00:00 2001
From: Roberto Rosario <roberto.rosario.gonzalez@gmail.com>
Date: Sat, 1 Sep 2018 02:04:59 -0400
Subject: [PATCH] Load a form's specialized JS libraries asynchronously. Move
 the Dropzone import to the sources app template.

Signed-off-by: Roberto Rosario <roberto.rosario.gonzalez@gmail.com>
---
 .../appearance/generic_form_instance.html     |  8 +++-
 .../appearance/templates/appearance/root.html |  2 -
 .../templatetags/appearance_tags.py           |  5 +++
 .../templates/cabinets/cabinet_details.html   | 40 +++++++++--------
 .../sources/upload_multiform_subtemplate.html | 44 +++++++++++--------
 5 files changed, 58 insertions(+), 41 deletions(-)

diff --git a/mayan/apps/appearance/templates/appearance/generic_form_instance.html b/mayan/apps/appearance/templates/appearance/generic_form_instance.html
index 8417404443..089dfa63b0 100644
--- a/mayan/apps/appearance/templates/appearance/generic_form_instance.html
+++ b/mayan/apps/appearance/templates/appearance/generic_form_instance.html
@@ -4,7 +4,7 @@
 
 {% load appearance_tags %}
 
-{{ form.media|safe }}
+{{ form.media.render_css|safe }}
 
 {% for group, errors in form.errors.items %}
     {% for error in errors %}
@@ -116,3 +116,9 @@
             </div>
         {% endfor %}
 {% endif %}
+
+<script>
+    {% for script in form|get_form_media_js %}
+        $.getScript('{{ script }}');
+    {% endfor %}
+</script>
diff --git a/mayan/apps/appearance/templates/appearance/root.html b/mayan/apps/appearance/templates/appearance/root.html
index a88a16bae2..81c77128d1 100644
--- a/mayan/apps/appearance/templates/appearance/root.html
+++ b/mayan/apps/appearance/templates/appearance/root.html
@@ -138,7 +138,6 @@
         <script src="{% static 'appearance/node_modules/urijs/src/URI.fragmentURI.js' %}" type="text/javascript"></script>
         <script src="{% static 'appearance/node_modules/jquery-form/dist/jquery.form.min.js' %}" type="text/javascript"></script>
         <script src="{% static 'appearance/vendors/pace-0.7.8/pace.js' %}" type="text/javascript"></script>
-        <script src="{% static 'sources/node_modules/dropzone/dist/dropzone.js' %}" type="text/javascript"></script>
         <script src="{% static 'appearance/js/mayan_app.js' %}" type="text/javascript"></script>
         <script src="{% static 'appearance/js/mayan_image.js' %}" type="text/javascript"></script>
         <script src="{% static 'appearance/js/partial_navigation.js' %}" type="text/javascript"></script>
@@ -146,7 +145,6 @@
             {# Transfer variable from Django to javascript #}
             var initialURL = '{% url home_view %}';
             var djangoDEBUG = {% if debug %}true{% else %}false{% endif %};
-            Dropzone.autoDiscover = false;
         </script>
         <script src="{% static 'appearance/js/base.js' %}" type="text/javascript"></script>
         <script>
diff --git a/mayan/apps/appearance/templatetags/appearance_tags.py b/mayan/apps/appearance/templatetags/appearance_tags.py
index 8ee9a73b92..8a87d9aad7 100644
--- a/mayan/apps/appearance/templatetags/appearance_tags.py
+++ b/mayan/apps/appearance/templatetags/appearance_tags.py
@@ -14,3 +14,8 @@ def get_choice_value(field):
         return ', '.join([subwidget.data['label'] for subwidget in field.subwidgets if subwidget.data['selected']])
     except KeyError:
         return _('None')
+
+
+@register.filter
+def get_form_media_js(form):
+    return [form.media.absolute_path(path) for path in form.media._js]
diff --git a/mayan/apps/cabinets/templates/cabinets/cabinet_details.html b/mayan/apps/cabinets/templates/cabinets/cabinet_details.html
index d04f7ba414..7a19093116 100644
--- a/mayan/apps/cabinets/templates/cabinets/cabinet_details.html
+++ b/mayan/apps/cabinets/templates/cabinets/cabinet_details.html
@@ -29,28 +29,30 @@
 {% endblock %}
 
 {% block javascript %}
-    <script src="{% static 'cabinets/packages/jstree/dist/jstree.min.js' %}"></script>
     <script>
-        $(function () {
-            var jstreeElement = $('.jstree');
+        $.getScript( "{% static 'cabinets/packages/jstree/dist/jstree.min.js' %}" )
+            .done(function( script, textStatus ) {
+            $(function () {
+                var jstreeElement = $('.jstree');
 
-            jstreeElement
-                .on('select_node.jstree', function (e, data) {
-                    if(data.selected.length) {
-                        partialNavigation.setLocation(data.instance.get_node(data.selected[0]).data.href);
-                    }
-                })
-                .jstree({
-                    'core' : {
-                        'data' : [
-                            {{ jstree_data|safe }}
-
-                        ],
-                        'themes' : {
-                            'responsive' : true,
+                jstreeElement
+                    .on('select_node.jstree', function (e, data) {
+                        if(data.selected.length) {
+                            partialNavigation.setLocation(data.instance.get_node(data.selected[0]).data.href);
                         }
-                    },
+                    })
+                    .jstree({
+                        'core' : {
+                            'data' : [
+                                {{ jstree_data|safe }}
+
+                            ],
+                            'themes' : {
+                                'responsive' : true,
+                            }
+                        },
+                    });
                 });
-        });
+            });
     </script>
 {% endblock %}
diff --git a/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html b/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
index 5e72d6a95a..99d673612b 100644
--- a/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
+++ b/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
@@ -3,7 +3,9 @@
 
 {% include 'appearance/generic_multiform_subtemplate.html' %}
 
-<script type="text/javascript" src="{% url 'common:javascript_catalog' 'sources' %}"></script>
+<script>
+    $.getScript( "{% url 'common:javascript_catalog' 'sources' %}" );
+</script>
 
 <script type="text/x-template" id="previewTemplate">
     <div class="dz-preview dz-file-preview">
@@ -39,25 +41,29 @@
 </script>
 
 <script>
-    jQuery(document).ready(function() {
-        var previewTemplate = document.querySelector('#previewTemplate').innerHTML;
+    $.getScript( "{% static 'sources/node_modules/dropzone/dist/dropzone.js' %}" )
+        .done(function( script, textStatus ) {
+            Dropzone.autoDiscover = false;
+            jQuery(document).ready(function() {
+                var previewTemplate = document.querySelector('#previewTemplate').innerHTML;
 
-        {% verbatim %}
-            $('.dropzone').dropzone({
-                addRemoveLinks: true,
-                createImageThumbnails: false,
-                dictCancelUpload: gettext('Cancel upload'),
-                dictCancelUploadConfirmation: gettext('Are you sure you want to cancel this upload?'),
-                dictDefaultMessage: '<i class="fa fa-cloud-upload-alt"></i> ' + gettext('Drop files or click here to upload files'),
-                dictFallbackMessage: gettext('Your browser does not support drag\'n\'drop file uploads.'),
-                dictFallbackText: gettext('Please use the fallback form below to upload your files like in the olden days.'),
-                dictRemoveFile: gettext('Clear'),
-                dictResponseError: gettext('Server responded with {{statusCode}} code.'),
-                paramName: 'source-file',
-                previewTemplate: previewTemplate,
-                timeout: 1200000
+                {% verbatim %}
+                    $('.dropzone').dropzone({
+                        addRemoveLinks: true,
+                        createImageThumbnails: false,
+                        dictCancelUpload: gettext('Cancel upload'),
+                        dictCancelUploadConfirmation: gettext('Are you sure you want to cancel this upload?'),
+                        dictDefaultMessage: '<i class="fa fa-cloud-upload-alt"></i> ' + gettext('Drop files or click here to upload files'),
+                        dictFallbackMessage: gettext('Your browser does not support drag\'n\'drop file uploads.'),
+                        dictFallbackText: gettext('Please use the fallback form below to upload your files like in the olden days.'),
+                        dictRemoveFile: gettext('Clear'),
+                        dictResponseError: gettext('Server responded with {{statusCode}} code.'),
+                        paramName: 'source-file',
+                        previewTemplate: previewTemplate,
+                        timeout: 1200000
+                    });
+                {% endverbatim %}
             });
-        {% endverbatim %}
-    });
+        });
 </script>