Improve file download UX

src/pretix/presale/templates/pretixpresale/base.html

@@ -25,6 +25,7 @@
         <script type="text/javascript" src="{% static "bootstrap/js/bootstrap.js" %}"></script>
         <script type="text/javascript" src="{% static "pretixpresale/js/ui/main.js" %}"></script>
         <script type="text/javascript" src="{% static "pretixpresale/js/ui/asynctask.js" %}"></script>
+        <script type="text/javascript" src="{% static "pretixpresale/js/ui/asyncdownload.js" %}"></script>
         <script type="text/javascript" src="{% static "pretixpresale/js/ui/cart.js" %}"></script>
         <script type="text/javascript" src="{% static "lightbox/js/lightbox.min.js" %}"></script>
     {% endcompress %}

src/pretix/presale/templates/pretixpresale/event/fragment_cart.html

@@ -30,7 +30,7 @@
             <div class="download-desktop">
                 {% for b in download_buttons %}
                     <a href="{% eventurl event "presale:event.order.download" secret=order.secret order=order.code output=b.identifier position=line.id %}"
-                            class="btn btn-default btn-sm">
+                            class="btn btn-default btn-sm" data-asyncdownload>
                         <span class="fa fa-download"></span> {{ b.text }}
                     </a>
                 {% endfor %}
@@ -92,7 +92,7 @@
             <div class="download-mobile">
                 {% for b in download_buttons %}
                     <a href="{% eventurl event "presale:event.order.download" secret=order.secret order=order.code output=b.identifier position=line.id %}"
-                       class="btn btn-default btn-sm">
+                       class="btn btn-default btn-sm" data-asyncdownload>
                         <span class="fa fa-download"></span> {{ b.text }}
                     </a>
                 {% endfor %}

src/pretix/presale/views/order.py

@@ -532,11 +532,14 @@ class OrderDownload(EventViewMixin, OrderDetailMixin, View):
         except CachedTicket.DoesNotExist:
             ct = None
 
+        if not ct:
+            ct = CachedTicket.objects.create(
+                order_position=self.order_position, provider=self.output.identifier,
+                extension='', type='', file=None)
+            generate.apply_async(args=(self.order_position.id, self.output.identifier))
+
         if 'ajax' in request.GET:
             return HttpResponse('1' if ct and ct.file else '0')
-        elif not ct:
-            generate.apply_async(args=(self.order_position.id, self.output.identifier))
-            return render(request, "pretixbase/cachedfiles/pending.html", {})
         elif not ct.file:
             return render(request, "pretixbase/cachedfiles/pending.html", {})
         else:

src/static/pretixpresale/js/ui/asyncdownload.js

@@ -0,0 +1,60 @@
+/*global $, waitingDialog, gettext */
+var async_dl_url = null;
+var async_dl_timeout = null;
+
+function async_dl_check() {
+    "use strict";
+    $.ajax(
+        {
+            'type': 'GET',
+            'url': async_dl_url + '?ajax=1',
+            'success': async_dl_check_callback,
+            'error': async_dl_check_error,
+            'context': this,
+        }
+    );
+}
+
+function async_dl_check_callback(data, jqXHR, status) {
+    "use strict";
+    if (data == 1) {
+        $("body").data('ajaxing', false);
+        location.href = async_dl_url;
+        waitingDialog.hide();
+        return;
+    }
+    async_dl_timeout = window.setTimeout(async_dl_check, 250);
+    $("#loadingmodal p").text(gettext('Your request has been queued on the server and will now be ' +
+                                      'processed. If this takes longer than two minutes, please contact us or go ' +
+                                      'back in your browser and try again.'));
+}
+
+function async_dl_check_error(jqXHR, textStatus, errorThrown) {
+    "use strict";
+    $("body").data('ajaxing', false);
+    waitingDialog.hide();
+    var c = $(jqXHR.responseText).filter('.container');
+    if (c.length > 0) {
+        ajaxErrDialog.show(c.first().html());
+    } else if (jqXHR.status >= 400) {
+        alert(gettext('An error of type {code} occured.').replace(/\{code\}/, jqXHR.status));
+    }
+}
+
+$(function () {
+    "use strict";
+    $("body").on('click', 'a[data-asyncdownload]', function (e) {
+        e.preventDefault();
+        if ($("body").data('ajaxing')) {
+            return;
+        }
+        async_dl_url = $(this).attr("href");
+        $("body").data('ajaxing', true);
+        waitingDialog.show(gettext('We are processing your request …'));
+        $("#loadingmodal p").text(gettext('We are currently sending your request to the server. If this takes longer ' +
+                                          'than one minute, please check your internet connection and then reload ' +
+                                          'this page and try again.'));
+
+        async_dl_check();
+    });
+});

src/static/pretixpresale/js/ui/asynctask.js

@@ -33,10 +33,12 @@ function async_task_check_error(jqXHR, textStatus, errorThrown) {
     "use strict";
     var c = $(jqXHR.responseText).filter('.container');
     if (c.length > 0) {
+        $("body").data('ajaxing', false);
         waitingDialog.hide();
         ajaxErrDialog.show(c.first().html());
     } else {
         if (jqXHR.status >= 400 && jqXHR.status < 500) {
+            $("body").data('ajaxing', false);
             waitingDialog.hide();
             alert(gettext('An error of type {code} occured.').replace(/\{code\}/, jqXHR.status));
         } else {