108 lines
3.3 KiB
HTML
108 lines
3.3 KiB
HTML
{% extends "base.html" %}
|
|
{% load django_tables2 %}
|
|
{% load crispy_forms_tags %}
|
|
{% load i18n %}
|
|
|
|
{% block title %}{% trans "Cookbook" %}{% endblock %}
|
|
|
|
{% block content %}
|
|
|
|
<div class="row">
|
|
<div class="col md-12">
|
|
{% if filter %}
|
|
<div class="card">
|
|
<div class="card-header">
|
|
<i class="fas fa-search"></i> {% trans "Search" %}
|
|
</div>
|
|
<div class="card-body">
|
|
<form action="" method="get">
|
|
{{ filter.form|crispy }}
|
|
<input class="btn btn-primary" type="submit"/>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
|
|
<br/>
|
|
|
|
{% if recipes %}
|
|
{% render_table recipes %}
|
|
{% else %}
|
|
<div class="alert alert-danger" role="alert">
|
|
{% trans "Log in to view Recipies" %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
<style>
|
|
.loader {
|
|
border: 16px solid #f3f3f3; /* Light grey */
|
|
border-top: 16px solid #3498db; /* Blue */
|
|
border-radius: 50%;
|
|
width: 120px;
|
|
height: 120px;
|
|
animation: spin 2s linear infinite;
|
|
}
|
|
|
|
@keyframes spin {
|
|
0% {
|
|
transform: rotate(0deg);
|
|
}
|
|
100% {
|
|
transform: rotate(360deg);
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<div class="modal" tabindex="-1" role="dialog" id="modal_recipe">
|
|
<div class="modal-dialog" role="document">
|
|
<div class="modal-content">
|
|
<div class="modal-header">
|
|
<h5 class="modal-title">{% trans 'Recipe' %}</h5>
|
|
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
|
|
<span aria-hidden="true">×</span>
|
|
</button>
|
|
</div>
|
|
<div class="modal-body" style="text-align: center">
|
|
<div class="loader" id="div_loader"></div>
|
|
<a href="" id="a_recipe_open" target="_blank" onclick="afterClick()" style="font-size: 250%"></a>
|
|
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-dismiss="modal">{% trans 'Close' %}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
function openRecipe(id) {
|
|
var link = $('#a_recipe_open');
|
|
link.hide();
|
|
|
|
var url = "{% url 'api_get_file_link' recipe_id=12345 %}".replace(/12345/, id);
|
|
|
|
link.text("{% trans 'Open Recipe' %}");
|
|
$('#modal_recipe').modal('show');
|
|
|
|
var xhttp = new XMLHttpRequest();
|
|
xhttp.onreadystatechange = function () {
|
|
if (this.readyState === 4 && this.status === 200) {
|
|
link.attr("href", this.responseText);
|
|
link.show();
|
|
$('#div_loader').hide();
|
|
|
|
}
|
|
};
|
|
xhttp.open("GET", url, true);
|
|
xhttp.send();
|
|
}
|
|
|
|
function afterClick() {
|
|
$('#modal_recipe').modal('hide');
|
|
return true;
|
|
}
|
|
</script>
|
|
|
|
{% endblock %} |