Fix #1074 -- More specific messages during asynctasks

This commit is contained in:
Raphael Michel
2018-11-08 16:31:49 +01:00
parent c2d03f5e6b
commit bd838b3b7c
9 changed files with 109 additions and 33 deletions

View File

@@ -72,11 +72,16 @@
<div id="ajaxerr">
</div>
<div id="loadingmodal">
<i class="fa fa-cog big-rotating-icon"></i>
<h1>{% trans "We are processing your request …" %}</h1>
<p>
{% trans "If this takes longer than a few minutes, please contact us." %}
</p>
<div class="modal-card">
<div class="modal-card-icon">
<i class="fa fa-cog big-rotating-icon"></i>
</div>
<div class="modal-card-content">
<h3></h3>
<p class="text"></p>
<p class="status">{% trans "If this takes longer than a few minutes, please contact us." %}</p>
</div>
</div>
</div>
{% if DEBUG %}
<script type="text/javascript" src="{% url 'javascript-catalog' lang=request.LANGUAGE_CODE %}" async></script>

View File

@@ -5,7 +5,8 @@
<p>
{% trans "For some of the products in your cart, you can choose additional options before you continue." %}
</p>
<form class="form-horizontal" method="post" data-asynctask>
<form class="form-horizontal" method="post" data-asynctask
data-asynctask-headline="{% trans "We're now trying to book these add-ons for you!" %}">
{% csrf_token %}
<div class="panel-group" id="questions_group">
{% for form in forms %}

View File

@@ -8,7 +8,8 @@
<h2>{% trans "Review order" %}</h2>
{% include "pretixpresale/event/fragment_checkoutflow.html" %}
<p>{% trans "Please review the details below and confirm your order." %}</p>
<form method="post" data-asynctask>
<form method="post" data-asynctask
data-asynctask-headline="{% trans "Please hang tight, we're finalizing your order!" %}">
{% csrf_token %}
<div class="panel panel-primary cart">
<div class="panel-heading">

View File

@@ -81,6 +81,7 @@
<div class="count">
{% if editable %}
<form action="{% eventurl event "presale:event.cart.remove" cart_namespace=cart_namespace|default_if_none:"" %}"
data-asynctask-headline="{% trans "Okay, we're removing that" %}"
method="post" data-asynctask>
{% csrf_token %}
<input type="hidden" name="id" value="{{ line.id }}" />
@@ -92,6 +93,8 @@
{{ line.count }}
{% if editable %}
<form action="{% eventurl event "presale:event.cart.add" cart_namespace=cart_namespace|default_if_none:"" %}"
data-asynctask-headline="{% trans "We're trying to reserve another one for you!" %}"
data-asynctask-text="{% blocktrans with time=event.settings.reservation_time %}Once the items are in your cart, you will have {{ time }} minutes to complete your purchase.{% endblocktrans %}"
method="post" data-asynctask>
<input type="hidden" name="subevent" value="{{ line.subevent_id|default_if_none:"" }}" />
{% csrf_token %}

View File

@@ -180,6 +180,8 @@
{% if ev.presale_is_running or event.settings.show_items_outside_presale_period %}
<form method="post" data-asynctask
data-asynctask-headline="{% trans "We're now trying to reserve this for you!" %}"
data-asynctask-text="{% blocktrans with time=event.settings.reservation_time %}Once the items are in your cart, you will have {{ time }} minutes to complete your purchase.{% endblocktrans %}"
action="{% eventurl request.event "presale:event.cart.add" cart_namespace=cart_namespace %}?next={{ request.path|urlencode }}">
{% csrf_token %}
<input type="hidden" name="subevent" value="{{ subevent.id|default_if_none:"" }}" />

View File

@@ -21,7 +21,11 @@
{% if event.presale_is_running or event.settings.show_items_outside_presale_period %}
<form method="post"
action="{% eventurl request.event "presale:event.cart.add" cart_namespace=cart_namespace %}?next={% eventurl request.event "presale:event.index" cart_namespace=cart_namespace %}{% if "iframe" in request.GET and not new_tab %}&iframe={{ request.GET.iframe }}{% endif %}{% if "take_cart_id" in request.GET and new_tab %}&take_cart_id={{ request.GET.take_cart_id }}{% endif %}"
{% if new_tab %}target="_blank"{% else %}data-asynctask{% endif %}>
{% if new_tab %}target="_blank"{% else %}
data-asynctask
data-asynctask-headline="{% trans "We're now trying to reserve this for you!" %}"
data-asynctask-text="{% blocktrans with time=event.settings.reservation_time %}Once the items are in your cart, you will have {{ time }} minutes to complete your purchase.{% endblocktrans %}"
{% endif %}>
{% csrf_token %}
<input type="hidden" name="subevent" value="{{ subevent.id|default_if_none:"" }}" />
<input type="hidden" name="_voucher_code" value="{{ voucher.code }}">

View File

@@ -35,13 +35,17 @@ function async_task_check_callback(data, jqXHR, status) {
async_task_timeout = window.setTimeout(async_task_check, 250);
if (async_task_is_long) {
$("#loadingmodal p").text(gettext('Your request has been queued on the server and will now be ' +
'processed. Depending on the size of your event, this might take up to a ' +
'few minutes.'));
$("#loadingmodal p.status").text(gettext(
'Your request has been queued on the server and will now be ' +
'processed. Depending on the size of your event, this might take up to a ' +
'few minutes.'
));
} else {
$("#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.'));
$("#loadingmodal p.status").text(gettext(
'Your request arrived on the server but we still wait for it to be ' +
'processed. If this takes longer than two minutes, please contact us or go ' +
'back in your browser and try again.'
));
}
}
@@ -62,7 +66,7 @@ function async_task_check_error(jqXHR, textStatus, errorThrown) {
alert(gettext('An error of type {code} occurred.').replace(/\{code\}/, jqXHR.status));
} else {
// 500 can be an application error or overload in some cases :(
$("#loadingmodal p").text(gettext('We currently cannot reach the server, but we keep trying.' +
$("#loadingmodal p.status").text(gettext('We currently cannot reach the server, but we keep trying.' +
' Last error code: {code}').replace(/\{code\}/, jqXHR.status));
async_task_timeout = window.setTimeout(async_task_check, 5000);
}
@@ -87,13 +91,17 @@ function async_task_callback(data, jqXHR, status) {
async_task_timeout = window.setTimeout(async_task_check, 100);
if (async_task_is_long) {
$("#loadingmodal p").text(gettext('Your request has been queued on the server and will now be ' +
'processed. Depending on the size of your event, this might take up to a ' +
'few minutes.'));
$("#loadingmodal p.status").text(gettext(
'Your request has been queued on the server and will now be ' +
'processed. Depending on the size of your event, this might take up to a ' +
'few minutes.'
));
} else {
$("#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.'));
$("#loadingmodal p.status").text(gettext(
'Your request arrived on the server but we still wait for it to be ' +
'processed. If this takes longer than two minutes, please contact us or go ' +
'back in your browser and try again.'
));
}
if (location.href.indexOf("async_id") === -1) {
history.pushState({}, "Waiting", async_task_check_url.replace(/ajax=1/, ''));
@@ -134,10 +142,21 @@ $(function () {
async_task_is_long = $(this).is("[data-asynctask-long]");
async_task_old_url = location.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.'));
if ($(this).is("[data-asynctask-headline]")) {
waitingDialog.show($(this).attr("data-asynctask-headline"));
} else {
waitingDialog.show(gettext('We are processing your request …'));
}
if ($(this).is("[data-asynctask-text]")) {
$("#loadingmodal p.text").text($(this).attr("data-asynctask-text")).show();
} else {
$("#loadingmodal p.text").hide();
}
$("#loadingmodal p.status").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.'
));
$.ajax(
{
@@ -157,7 +176,7 @@ $(function () {
var waitingDialog = {
show: function (message) {
"use strict";
$("#loadingmodal").find("h1").html(message);
$("#loadingmodal").find("h3").html(message);
$("body").addClass("loading");
},
hide: function () {

View File

@@ -96,7 +96,6 @@ body.loading .container {
height: 100vh;
background: rgba(255, 255, 255, .7);
opacity: 0;
text-align: center;
z-index: 900000;
visibility: hidden;
padding: 10px;
@@ -107,14 +106,53 @@ body.loading .container {
color: $brand-primary;
}
.big-rotating-icon {
-webkit-animation: fa-spin 8s infinite linear;
animation: fa-spin 8s infinite linear;
margin-top: 50px;
font-size: 200px;
color: $brand-primary;
.modal-card {
margin: 50px auto 0;
top: 50px;
width: 90%;
max-width: 600px;
background: white;
border-radius: $border-radius-large;
box-shadow: 0 7px 14px 0 rgba(78, 50, 92, 0.1),0 3px 6px 0 rgba(0,0,0,.07);
padding: 20px;
min-height: 160px;
.modal-card-icon {
float: left;
width: 150px;
text-align: center;
.big-rotating-icon {
-webkit-animation: fa-spin 8s infinite linear;
animation: fa-spin 8s infinite linear;
font-size: 120px;
color: $brand-primary;
}
}
.modal-card-content {
margin-left: 160px;
text-align: left;
h3 {
margin-top: 0;
}
}
}
}
@media (max-width: 700px) {
#loadingmodal, #ajaxerr {
.modal-card {
.modal-card-icon {
float: none;
width: 100%;
}
.modal-card-content {
text-align: center;
margin-left: 0;
margin-top: 10px;
}
}
}
}
#ajaxerr {
background: rgba(236, 236, 236, .9);
}

View File

@@ -29,6 +29,9 @@ PASSWORD_HASHERS = ['django.contrib.auth.hashers.MD5PasswordHasher']
# Disable celery
CELERY_ALWAYS_EAGER = True
HAS_CELERY = False
CELERY_BROKER_URL = None
CELERY_RESULT_BACKEND = None
CELERY_TASK_ALWAYS_EAGER = True
# Don't use redis
SESSION_ENGINE = "django.contrib.sessions.backends.db"