andros/example-in-django-waiting-room-for-asynchronous-tasks
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update

Browse Source
This commit is contained in:
Andros Fenollosa
2024-11-05 16:52:47 +01:00
parent b97d9383a5
commit 19d5317f0d
9 changed files with 87 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
waiting_room/templates/about_us.html Normal file
View File

@ -0,0 +1,8 @@
{% extends 'base.html' %}
{% block title %}About us{% endblock %}
{% block content %}
<h1>About us</h1>
<a href="{% url 'waiting_room:index' %}">Go to index</a>
{% endblock %}

16
waiting_room/templates/base.html Normal file
View File

@ -0,0 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<title>{% block title %}Waiting Room{% endblock %}</title>
<script src="https://unpkg.com/htmx.org@2.0.3" integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
<script src="https://unpkg.com/htmx-ext-ws@2.0.1/ws.js"></script>
</head>
<body>
<main>
{% include 'progress_bar.html' %}
<section>{% block content %}{% endblock %}</section>
</main>
</body>
</html>

21
waiting_room/templates/index.html Normal file
View File

@ -0,0 +1,21 @@
{% extends 'base.html' %}
{% block title %}Run task{% endblock %}
{% block content %}
<h1>Index</h1>
<section
hx-ext="ws"
ws-connect="/ws/nombre_temporal/"
>
<form id="form" ws-send>
<input type="submit" name="task" value="calculate">
</form>
</section>
<section>
{% if result %}
<h2>The result is {{ result }}</h2>
{% endif %}
</section>
<a href="{% url 'waiting_room:about_us' %}">Go to about us</a>
{% endblock %}

20
waiting_room/templates/progress_bar.html Normal file
View File

@ -0,0 +1,20 @@
<section
hx-ext="ws"
ws-connect="/ws/nombre_temporal/"
hx-swap-oob="innerHTML:notification"
style="
position: fixed;
right: 0;
bottom: 0;
padding: 2rem;
background: lightgray;
">
<div id="notification"></div>
<!-- <h1>Task</h1>
{% if result %}
<h3>Done!</h3>
<a href="{% url 'waiting_room:index' %}?result={{ result }}">Show result</a>
{% else %}
<progress value="{{ progress }}" max="100">{{ progress }}</progress>
{% endif %} -->
</section>