NDOJ/templates/test_formatter/edit_test_formatter.html
2024-02-05 17:02:49 -06:00

131 lines
3.4 KiB
HTML

{% extends 'base.html' %}
{% block media %}
<style>
.container {
width: 100%;
margin: auto;
}
.column {
flex: 50%;
}
.left {
padding-right: 16px;
}
.right {
padding-left: 16px;
}
.row {
display: flex;
}
input {
width: 100%;
}
.preview-container {
padding-bottom: 16px;
}
#preview {
background-color: rgb(220, 220, 220);
border: solid 2px rgb(180, 180, 180);
padding: 8px;
max-height: 134px;
height: 20%;
overflow-y: scroll;
}
.button-container {
text-align:left;
}
.button {
display:inline-block;
}
</style>
{% endblock %}
{% block js_media %}
<script>
$(document).ready(function(){
$("#convert").on("click", function(event) {
event.preventDefault()
$.ajax({
url: "{{url('test_formatter_edit')}}",
type: 'POST',
data: {
action: 'convert',
bef_inp_format: $("#bef_inp_format").val(),
bef_out_format: $("#bef_out_format").val(),
aft_inp_format: $("#aft_inp_format").val(),
aft_out_format: $("#aft_out_format").val(),
file_name: $('#file_name').val()
},
success: function(data) {
console.log(data)
$('#preview').html(data);
},
error: function(error) {
alert(error);
console.log(error.message)
}
})
});
});
$(document).ready(function(){
$("#download").on("click", function(event) {
event.preventDefault()
$.ajax({
url: "{{url('test_formatter_edit')}}",
type: 'POST',
data: {
action: 'download'
},
success: function(data) {
var file_path = data;
window.location.href = "{{url('test_formatter_download')}}" + "?file_path="+file_path;
},
error: function(error) {
alert(error);
console.log(error.message)
}
})
});
});
</script>
{% endblock %}
{% block body %}
<div class="container">
<div class="row">
{% csrf_token %}
<div class="column left">
<h3>{{_('Before')}}</h3><br>
<label for="fname">{{_('Input format')}}</label><br>
<input type="text" id="bef_inp_format" value="{{files_list[0]}}" readonly><br>
<label for="lname">{{_('Output format')}}</label><br>
<input type="text" id="bef_out_format" value="{{files_list[1]}}" readonly><br><br>
</div>
<div class="column right">
<h3>{{_('After')}}</h3><br>
<label for="fname">{{_('Input format')}}</label><br>
<input type="text" id="aft_inp_format" value="input.000"><br>
<label for="lname">{{_('Output format')}}</label><br>
<input type="text" id="aft_out_format" value="output.000"><br><br>
</div>
</div>
<div class="preview-container">
<h3>{{_('Preview')}}</h3><br>
<div id="preview">
{{ res|safe }}
</div>
</div>
<div class="filename-container">
<h3>{{_('File name')}}</h3><br>
<input type="text" id="file_name" value="{{file_name}}"><br><br>
</div>
<div class="button-container">
<button type="submit" id="convert" class="button">{{_('Convert')}}</button>
<button type="submit" id="download" class="button">{{_('Download')}}</button>
</div>
</div>
{% endblock %}