From 57dd5b1bcaf6b0354232b520dce53ded16215cea Mon Sep 17 00:00:00 2001
From: Roberto Rosario <roberto.rosario@mayan-edms.com>
Date: Thu, 10 Oct 2019 17:15:45 -0400
Subject: [PATCH 1/3] Split source multiform template

Signed-off-by: Roberto Rosario <roberto.rosario@mayan-edms.com>
---
 .../sources/templates/sources/dropzone.html   | 115 +++++++++++++++++
 .../sources/upload_multiform_subtemplate.html | 118 +-----------------
 2 files changed, 116 insertions(+), 117 deletions(-)
 create mode 100644 mayan/apps/sources/templates/sources/dropzone.html

diff --git a/mayan/apps/sources/templates/sources/dropzone.html b/mayan/apps/sources/templates/sources/dropzone.html
new file mode 100644
index 0000000000..9f2118eb62
--- /dev/null
+++ b/mayan/apps/sources/templates/sources/dropzone.html
@@ -0,0 +1,115 @@
+{% load i18n %}
+{% load static %}
+
+<link href="{% static 'sources/node_modules/dropzone/dist/dropzone.css' %}" media="screen" rel="stylesheet" type="text/css" />
+
+<style>
+    .dropzone .dz-preview .dz-details {
+        top: 25px;
+    }
+
+    .dropzone .dz-preview .dz-progress {
+        top: 60%;
+    }
+
+    .dropzone .dz-preview .dz-error-message {
+        top: 130px;
+    }
+
+    .dropzone-previews, .dropzone .dz-message {
+        border: 2px solid rgba(0, 0, 0, 0.3);
+        padding: 40px 20px;
+    }
+
+    .dropzone .dz-preview .dz-error-message {
+        overflow-wrap: break-word;
+        padding: 1.2em;
+        top: 180px;
+    }
+
+    .dropzone .dz-preview .dz-details .dz-filename span,
+    .dropzone .dz-preview .dz-details .dz-size span {
+        padding: 0px;
+    }
+
+    .dropzone {
+        min-height: 150px;
+        border: inherit;
+        background: inherit;
+        padding: 0px;
+    }
+
+    .dropzone-previews, .dropzone .dz-message {
+        background: white;
+    }
+}
+</style>
+
+<script type="text/x-template" id="previewTemplate">
+    <div class="dz-preview dz-file-preview">
+        <i class="far fa-file fa-10x"></i>
+        <div class="dz-details">
+            <div class="dz-filename"><span data-dz-name></span></div>
+            <div class="dz-size" data-dz-size></div>
+            <img data-dz-thumbnail />
+        </div>
+
+        <div class="dz-progress">
+            <span class="dz-upload" data-dz-uploadprogress>
+                <div class="progress-bar progress-bar-success progress-bar-striped active" role="progressbar" style="width: 100%">
+                </div>
+            </span>
+        </div>
+
+        <div class="dz-success-mark">
+            <span>
+                <i class="text-success fa fa-4x fa-check-circle"></i>
+            </span>
+        </div>
+        <div class="dz-error-mark">
+            <span>
+                <i class="text-danger fa fa-4x fa-times-circle"></i>
+            </span>
+        </div>
+        <div class="dz-error-message">
+            <span data-dz-errormessage>
+            </span>
+        </div>
+    </div>
+</script>
+
+<script>
+    var messageCancelUpload = "{% trans 'Cancel upload' %}";
+    var messageCancelUploadConfirmation = "{% trans 'Are you sure you want to cancel this upload?' %}";
+    var messageDefaultMessage = "{% trans 'Drop files or click here to upload files' %}";
+    var messageFallbackMessage = "{% trans 'Your browser does not support drag and drop file uploads.' %}";
+    var messageFallbackText = "{% trans 'Please use the fallback form below to upload your files.' %}";
+    var messageRemoveFile = "{% trans 'Clear' %}";
+    var messageResponseError = "{% trans 'Server responded with {{statusCode}} code.' %}";
+
+    $.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: messageCancelUpload,
+                        dictCancelUploadConfirmation: messageCancelUploadConfirmation,
+                        dictDefaultMessage: '<i class="fa fa-cloud-upload-alt"></i> ' + messageDefaultMessage,
+                        dictFallbackMessage: messageFallbackMessage,
+                        dictFallbackText: messageFallbackText,
+                        dictRemoveFile: messageRemoveFile,
+                        dictResponseError: messageResponseError,
+                        maxFilesize: 2048,
+                        paramName: 'source-file',
+                        previewTemplate: previewTemplate,
+                        timeout: 1200000
+                    });
+                {% endverbatim %}
+            });
+        });
+</script>
diff --git a/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html b/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
index 573aeee391..100f5ae9c8 100644
--- a/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
+++ b/mayan/apps/sources/templates/sources/upload_multiform_subtemplate.html
@@ -1,118 +1,2 @@
-{% load i18n %}
-{% load static %}
-
-<link href="{% static 'sources/node_modules/dropzone/dist/dropzone.css' %}" media="screen" rel="stylesheet" type="text/css" />
-
-<style>
-    .dropzone .dz-preview .dz-details {
-        top: 25px;
-    }
-
-    .dropzone .dz-preview .dz-progress {
-        top: 60%;
-    }
-
-    .dropzone .dz-preview .dz-error-message {
-        top: 130px;
-    }
-
-    .dropzone-previews, .dropzone .dz-message {
-        border: 2px solid rgba(0, 0, 0, 0.3);
-        padding: 40px 20px;
-    }
-
-    .dropzone .dz-preview .dz-error-message {
-        overflow-wrap: break-word;
-        padding: 1.2em;
-        top: 180px;
-    }
-
-    .dropzone .dz-preview .dz-details .dz-filename span,
-    .dropzone .dz-preview .dz-details .dz-size span {
-        padding: 0px;
-    }
-
-    .dropzone {
-        min-height: 150px;
-        border: inherit;
-        background: inherit;
-        padding: 0px;
-    }
-
-    .dropzone-previews, .dropzone .dz-message {
-        background: white;
-    }
-}
-</style>
-
 {% include 'appearance/generic_multiform_subtemplate.html' %}
-
-<script type="text/x-template" id="previewTemplate">
-    <div class="dz-preview dz-file-preview">
-        <i class="far fa-file fa-10x"></i>
-        <div class="dz-details">
-            <div class="dz-filename"><span data-dz-name></span></div>
-            <div class="dz-size" data-dz-size></div>
-            <img data-dz-thumbnail />
-        </div>
-
-        <div class="dz-progress">
-            <span class="dz-upload" data-dz-uploadprogress>
-                <div class="progress-bar progress-bar-success progress-bar-striped active" role="progressbar" style="width: 100%">
-                </div>
-            </span>
-        </div>
-
-        <div class="dz-success-mark">
-            <span>
-                <i class="text-success fa fa-4x fa-check-circle"></i>
-            </span>
-        </div>
-        <div class="dz-error-mark">
-            <span>
-                <i class="text-danger fa fa-4x fa-times-circle"></i>
-            </span>
-        </div>
-        <div class="dz-error-message">
-            <span data-dz-errormessage>
-            </span>
-        </div>
-    </div>
-</script>
-
-<script>
-    var messageCancelUpload = "{% trans 'Cancel upload' %}";
-    var messageCancelUploadConfirmation = "{% trans 'Are you sure you want to cancel this upload?' %}";
-    var messageDefaultMessage = "{% trans 'Drop files or click here to upload files' %}";
-    var messageFallbackMessage = "{% trans 'Your browser does not support drag and drop file uploads.' %}";
-    var messageFallbackText = "{% trans 'Please use the fallback form below to upload your files.' %}";
-    var messageRemoveFile = "{% trans 'Clear' %}";
-    var messageResponseError = "{% trans 'Server responded with {{statusCode}} code.' %}";
-
-    $.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: messageCancelUpload,
-                        dictCancelUploadConfirmation: messageCancelUploadConfirmation,
-                        dictDefaultMessage: '<i class="fa fa-cloud-upload-alt"></i> ' + messageDefaultMessage,
-                        dictFallbackMessage: messageFallbackMessage,
-                        dictFallbackText: messageFallbackText,
-                        dictRemoveFile: messageRemoveFile,
-                        dictResponseError: messageResponseError,
-                        maxFilesize: 2048,
-                        paramName: 'source-file',
-                        previewTemplate: previewTemplate,
-                        timeout: 1200000
-                    });
-                {% endverbatim %}
-            });
-        });
-</script>
-
+{% include 'sources/dropzone.html' %}

From fc14341d4039be2baf619416eddba689f0074957 Mon Sep 17 00:00:00 2001
From: Roberto Rosario <roberto.rosario@mayan-edms.com>
Date: Thu, 10 Oct 2019 17:16:16 -0400
Subject: [PATCH 2/3] Update document version upload to use dropzone

Signed-off-by: Roberto Rosario <roberto.rosario@mayan-edms.com>
---
 mayan/apps/sources/views.py | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/mayan/apps/sources/views.py b/mayan/apps/sources/views.py
index 4e24c01be3..8085143921 100644
--- a/mayan/apps/sources/views.py
+++ b/mayan/apps/sources/views.py
@@ -449,9 +449,15 @@ class DocumentVersionUploadInteractiveView(UploadBaseView):
         )
 
     def get_form_classes(self):
+        source_form_class = get_upload_form_class(self.source.source_type)
+
+        # Override source form class to enable the HTML5 file uploader
+        if source_form_class == WebFormUploadForm:
+            source_form_class = WebFormUploadFormHTML5
+
         return {
             'document_form': NewVersionForm,
-            'source_form': get_upload_form_class(self.source.source_type)
+            'source_form': source_form_class
         }
 
     def get_context_data(self, **kwargs):
@@ -464,6 +470,14 @@ class DocumentVersionUploadInteractiveView(UploadBaseView):
             'from source: %(source)s'
         ) % {'document': self.document, 'source': self.source.label}
         context['submit_label'] = _('Submit')
+        context['form_css_classes'] = 'dropzone'
+        context['form_disable_submit'] = True
+        context['form_action'] = '{}?{}'.format(
+            reverse(
+                viewname=self.request.resolver_match.view_name,
+                kwargs=self.request.resolver_match.kwargs
+            ), self.request.META['QUERY_STRING']
+        )
 
         return context
 

From b2390843abfa03e56ae677d9a8b85d33598f8b87 Mon Sep 17 00:00:00 2001
From: Roberto Rosario <roberto.rosario@mayan-edms.com>
Date: Thu, 10 Oct 2019 17:18:39 -0400
Subject: [PATCH 3/3] Update changelog

Signed-off-by: Roberto Rosario <roberto.rosario@mayan-edms.com>
---
 HISTORY.rst | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/HISTORY.rst b/HISTORY.rst
index aea00e8a61..a61fdd6a1e 100644
--- a/HISTORY.rst
+++ b/HISTORY.rst
@@ -78,6 +78,8 @@
   Support Docker networks and make it the default.
   Delete the containers to allow the script to be idempotent.
   Deploy a Redis container.
+- Improve document version upload form.
+- Use dropzone for document version upload form.
 
 3.2.8 (2019-10-01)
 ==================