rezometz/re2o
8
0
Fork 0
mirror of https://gitlab2.federez.net/re2o/re2o synced 2024-11-16 08:23:12 +00:00
Code Issues Releases Wiki Activity

[Printer] Refactor frontend of printer interface (1st step)

Browse source
This commit is contained in:
Maxime Bombar 2018-10-21 22:29:48 +02:00 committed by root
parent d7233a0845
commit 8656f6dcf3
1 changed files with 51 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

92
printer/templates/printer/newjob.html
View file

@ -13,76 +13,86 @@
<h3>{% trans "Printing Menu" %}</h3>
{{ jobform.management_form }}
{% bootstrap_formset_errors jobform %}
<div id="form_set" class="form-group">
<div class="row">
<div id="form_set" class="form-group container">
{% for job in jobform.forms %}
<div class='file_to_print form-inline'>
{% massive_bootstrap_form job "" %}
<button class="btn btn-danger" id="id_form-0-job-remove" type="button">
<div class="file_to_print col-xs-12 col-sm-4 col-md-3" style="margin-top:1em">
{% massive_bootstrap_form job "" %}
<button class="btn btn-danger form-job-remove" type="button">
<span class="fa fa-times"></span>
</button>
</div>
{% endfor %}
</div>
</div>
<div class="col-xs-12 row btn-toolbar">
<button type="button" class="btn btn-primary" role="button" id="add_one">{% trans "Add a file"%}</button>
{% bootstrap_button action_name name="options" button_type="submit" icon="star" %}
{% bootstrap_button action_name name="Next" button_type="submit" icon="star" %}
</div>
<div style="clear:both; margin-bottom:1em"></div>
</form>
<script type="text/javascript">
var template = `{% bootstrap_form jobform.empty_form %}
<button class="btn btn-danger btn-sm"
id="id_form-__prefix__-job-remove" type="button">
var template = `{% bootstrap_form jobform.empty_form %}
<button class="btn btn-danger form-job-remove" type="button">
<span class="fa fa-times"></span>
</button>`
function add_job() {
var new_index =
document.getElementsByClassName('file_to_print').length;
document.getElementById('id_form-TOTAL_FORMS').value ++;
var new_job = document.createElement('div');
new_job.className = 'file_to_print form-inline';
new_job.innerHTML = template.replace(/__prefix__/g, new_index);
document.getElementById('form_set').appendChild(new_job);
add_listener_for_id(new_index);
function add_job() {
newId = document.getElementsByClassName('file_to_print').length;
document.getElementById('id_form-TOTAL_FORMS').value ++;
var new_job = document.createElement('div');
new_job.className = 'file_to_print col-xs-12 col-sm-4 col-md-3';
new_job.style.marginTop = '1em';
new_job.innerHTML = template.replace(/__prefix__/g, newId);
document.getElementById('form_set').appendChild(new_job);
var newJobLength = new_job.childNodes.length
add_listener_for_btn(new_job.childNodes[newJobLength - 1]);
}
function del_job(event){
var job = event.target.parentNode;
function del_job(job, event){
// var job = event.target.parentNode;
job.parentNode.removeChild(job);
document.getElementById('id_form-TOTAL_FORMS').value --;
}
function add_listener_for_id(i){
document.getElementById('id_form-' + i.toString() + '-job-remove')
.addEventListener("click", function(event){
var job = event.target.parentNode;
job.parentNode.removeChild(job);
document.getElementById('id_form-TOTAL_FORMS').value --;
}
)
}
function add_listener_for_btn(rmBtn){
rmBtn.addEventListener("click", function(event){del_job(rmBtn.parentNode, event)});
}
// Add events manager when DOM is fully loaded
document.addEventListener(
"DOMContentLoaded",
function() {
document.getElementById("add_one")
.addEventListener("click", add_job, true);
document.getElementById('id_form-0-job-remove')
.addEventListener("click", function(event){
var job = event.target.parentNode;
job.parentNode.removeChild(job);
document.getElementById('id_form-TOTAL_FORMS').value --;
}
)
}
document.getElementById("add_one").addEventListener("click", add_job, true);
);
// Array of all the delete buttons
var allBtns = document.getElementsByClassName("form-job-remove");
for (var i=0; i < allBtns.length; i++) {
add_listener_for_btn(allBtns[i]);
}
}
)
</script>
{% endblock %}