Skip to content
Snippets Groups Projects
Commit a996d36f authored by Patrick Jentsch's avatar Patrick Jentsch
Browse files

Rework jobs package

parent 73a597fd
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
web/app/templates/jobs/job.html.j2
+ 138
− 137
View file @ a996d36f
{% extends "nopaque.html.j2" %} {% extends "nopaque.html.j2" %}
{% from '_constants.html.j2' import COLORS %}
{% set headline = '<i class="left material-icons service" data-service="{service}" style="font-size: inherit;"></i>Job ({service}) - {title}'.format(service=job.service, title=job.title) %}
{% if job.service == 'file-setup' %} {% if job.service == 'file-setup' %}
{% set border_color = COLORS.file_setup_darken %}
{% set main_class = 'file-setup-color lighten' %} {% set main_class = 'file-setup-color lighten' %}
{% set scheme_color = COLORS.file_setup_darken %}
{% elif job.service == 'nlp' %} {% elif job.service == 'nlp' %}
{% set border_color = COLORS.nlp_darken %}
{% set main_class = 'nlp-color lighten' %} {% set main_class = 'nlp-color lighten' %}
{% set scheme_color = COLORS.nlp_darken %}
{% elif job.service == 'ocr' %} {% elif job.service == 'ocr' %}
{% set border_color = COLORS.ocr_darken %}
{% set main_class = 'ocr-color lighten' %} {% set main_class = 'ocr-color lighten' %}
{% set scheme_color = COLORS.ocr_darken %}
{% endif %} {% endif %}
{% block page_content %}
{% if job.service == 'file-setup' %} {% block main_attribs %} class="{{ main_class }}"{% endblock main_attribs %}
{{ Macros.insert_color_scheme(file_setup_color_darken) }}
{% set border_color = file_setup_color_darken %}
{% elif job.service == 'nlp' %}
{{ Macros.insert_color_scheme(nlp_color_darken) }}
{% set border_color = nlp_color_darken %}
{% elif job.service == 'ocr' %}
{{ Macros.insert_color_scheme(ocr_color_darken) }}
{% set border_color = ocr_color_darken %}
{% endif %}
<div class="col s12"> {% block page_content %}
<div class="card" style="border-top: 10px solid {{border_color}}"> <div class="container">
<div class="card-content"> <div class="row">
<div class="row"> <div class="col s12">
<div class="col s8 m9 l10"> <h1><i class="left material-icons service" data-service="{{ job.service }}" style="font-size: inherit;"></i>Job ({{ job.service }}) - {{ job.title }}</h1>
<span class="card-title title">{{ job.title }}</span> </div>
</div>
<div class="col s4 m3 l2 right-align"> <div class="col s12">
<span class="chip status white-text"></span> <div class="card" style="border-top: 10px solid {{border_color}}">
<div class="active preloader-wrapper small" id="progress-indicator"> <div class="card-content">
<div class="spinner-layer spinner-blue-only"> <div class="row">
<div class="circle-clipper left"> <div class="col s8 m9 l10">
<div class="circle"></div> <span class="card-title title">{{ job.title }}</span>
</div> </div>
<div class="gap-patch">
<div class="circle"></div> <div class="col s4 m3 l2 right-align">
</div> <span class="chip status white-text"></span>
<div class="circle-clipper right"> <div class="active preloader-wrapper small" id="progress-indicator">
<div class="circle"></div> <div class="spinner-layer spinner-blue-only">
<div class="circle-clipper left">
<div class="circle"></div>
</div>
<div class="gap-patch">
<div class="circle"></div>
</div>
<div class="circle-clipper right">
<div class="circle"></div>
</div>
</div>
</div> </div>
</div> </div>
</div>
</div>
<div class="col s12"> <div class="col s12">
<p class="description">{{ job.description }}</p> <p class="description">{{ job.description }}</p>
</div> </div>
<div class="col s12">&nbsp;</div> <div class="col s12">&nbsp;</div>
<div class="col s12 m6"> <div class="col s12 m6">
<div class="input-field"> <div class="input-field">
<input disabled id="creation-date" type="text" value="{{ job.creation_date.strftime('%d/%m/%Y, %H:%M:%S %p') }}"> <input disabled id="creation-date" type="text" value="{{ job.creation_date.strftime('%d/%m/%Y, %H:%M:%S %p') }}">
<label for="creation-date">Creation date</label> <label for="creation-date">Creation date</label>
</div> </div>
</div> </div>
<div class="col s12 m6"> <div class="col s12 m6">
<div class="input-field"> <div class="input-field">
<input class="end-date" disabled id="end-date" type="text" value=""> <input class="end-date" disabled id="end-date" type="text" value="">
<label for="end-date">End date</label> <label for="end-date">End date</label>
</div> </div>
</div> </div>
<div class="col s12 m4"> <div class="col s12 m4">
<div class="input-field"> <div class="input-field">
<input disabled id="service" type="text" value="{{ job.service }}"> <input disabled id="service" type="text" value="{{ job.service }}">
<label for="service">Service</label> <label for="service">Service</label>
</div> </div>
</div> </div>
<div class="col s12 m4"> <div class="col s12 m4">
<div class="input-field"> <div class="input-field">
<input disabled id="service-args" type="text" value="{{ job.service_args|e }}"> <input disabled id="service-args" type="text" value="{{ job.service_args|e }}">
<label for="service-args">Service arguments</label> <label for="service-args">Service arguments</label>
</div> </div>
</div> </div>
<div class="col s12 m4"> <div class="col s12 m4">
<div class="input-field"> <div class="input-field">
<input disabled id="service-version" type="text" value="{{ job.service_version }}"> <input disabled id="service-version" type="text" value="{{ job.service_version }}">
<label for="service-version">Service version</label> <label for="service-version">Service version</label>
</div>
</div>
</div> </div>
</div> </div>
<div class="card-action right-align">
{% if current_user.is_administrator() and job.status == 'failed' %}
<a href="{{ url_for('jobs.restart', job_id=job.id) }}" class="btn waves-effect waves-light"><i class="material-icons left">repeat</i>Restart</a>
{% endif %}
<!-- <a href="#" class="btn disabled waves-effect waves-light"><i class="material-icons left">settings</i>Export Parameters</a> -->
<a data-target="delete-job-modal" class="waves-effect waves-light btn red modal-trigger"><i class="material-icons left">delete</i>Delete</a>
</div>
</div> </div>
</div> </div>
<div class="card-action right-align">
{% if current_user.is_administrator() and job.status == 'failed' %}
<a href="{{ url_for('jobs.restart', job_id=job.id) }}" class="btn waves-effect waves-light"><i class="material-icons left">repeat</i>Restart</a>
{% endif %}
<!-- <a href="#" class="btn disabled waves-effect waves-light"><i class="material-icons left">settings</i>Export Parameters</a> -->
<a data-target="delete-job-modal" class="waves-effect waves-light btn red modal-trigger"><i class="material-icons left">delete</i>Delete</a>
</div>
</div>
</div>
<div class="col s12"> <div class="col s12">
<div class="card"> <div class="card">
<div class="card-content" id="inputs"> <div class="card-content" id="inputs">
<div class="row"> <div class="row">
<div class="col s12 m2"> <div class="col s12 m2">
<span class="card-title"><i class="left material-icons" style="font-size: inherit;">input</i>Inputs</span> <span class="card-title"><i class="left material-icons" style="font-size: inherit;">input</i>Inputs</span>
<p>Original input files.</p> <p>Original input files.</p>
</div> </div>
<div class="col s12 m10"> <div class="col s12 m10">
<ul class="pagination paginationTop"></ul> <ul class="pagination paginationTop"></ul>
<table class="highlight responsive-table"> <table class="highlight responsive-table">
<thead> <thead>
<tr> <tr>
<th class="sort" data-sort="filename">Filename</th> <th class="sort" data-sort="filename">Filename</th>
<th>{# Actions #}</th> <th>{# Actions #}</th>
</tr> </tr>
</thead> </thead>
<tbody class="list"> <tbody class="list">
</tbody> </tbody>
</table> </table>
<ul class="pagination paginationBottom"></ul> <ul class="pagination paginationBottom"></ul>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="col s12"> <div class="col s12">
<div class="card"> <div class="card">
<div class="card-content"> <div class="card-content">
<div class="row"> <div class="row">
<div class="col s12 m2"> <div class="col s12 m2">
<span class="card-title"><i class="left material-icons" style="font-size: inherit;">done</i>Results</span> <span class="card-title"><i class="left material-icons" style="font-size: inherit;">done</i>Results</span>
<p>Processed result files.</p> <p>Processed result files.</p>
</div> </div>
<div class="col s12 m10"> <div class="col s12 m10">
<table class="highlight responsive-table"> <table class="highlight responsive-table">
<thead> <thead>
<tr> <tr>
<th>Result Type</th> <th>Result Type</th>
<th>Archive Name</th> <th>Archive Name</th>
<th>{# Actions #}</th> <th>{# Actions #}</th>
</tr> </tr>
</thead> </thead>
<tbody class="results"> <tbody class="results">
<tr class="show-if-only-child"> <tr class="show-if-only-child">
<td colspan="3"> <td colspan="3">
<span class="card-title"> <span class="card-title">
<i class="left material-icons" style="font-size: inherit;">file_download</i>Nothing here... <i class="left material-icons" style="font-size: inherit;">file_download</i>Nothing here...
</span> </span>
<p> <p>
No results available (yet). Is the job already completed? No results available (yet). Is the job already completed?
</p> </p>
</td> </td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
<!-- Modals --> <!-- Modals -->
<div id="delete-job-modal" class="modal"> <div id="delete-job-modal" class="modal">
<div class="modal-content"> <div class="modal-content">
...@@ -174,8 +177,10 @@ ...@@ -174,8 +177,10 @@
<a class="btn modal-close red waves-effect waves-light" href="{{ url_for('jobs.delete_job', job_id=job.id) }}"><i class="material-icons left">delete</i>Delete</a> <a class="btn modal-close red waves-effect waves-light" href="{{ url_for('jobs.delete_job', job_id=job.id) }}"><i class="material-icons left">delete</i>Delete</a>
</div> </div>
</div> </div>
{% endblock page_content %}
{% block scripts %}
{{ super() }}
<script type="module"> <script type="module">
import {RessourceList} from '../../static/js/nopaque.lists.js'; import {RessourceList} from '../../static/js/nopaque.lists.js';
class InformationUpdater { class InformationUpdater {
...@@ -309,13 +314,9 @@ class InformationUpdater { ...@@ -309,13 +314,9 @@ class InformationUpdater {
var informationUpdater = new InformationUpdater({{ job.id }}, false); var informationUpdater = new InformationUpdater({{ job.id }}, false);
{% else %} {% else %}
var informationUpdater = new InformationUpdater({{ job.id }}, true); var informationUpdater = new InformationUpdater({{ job.id }}, true);
document.addEventListener("DOMContentLoaded", () => { nopaque.socket.emit("foreign_user_data_stream_init", {{ job.user_id }});
nopaque.socket.emit("foreign_user_data_stream_init", {{ job.user_id }});
});
{% endif %} {% endif %}
let jobInputsList = new RessourceList("inputs", null, "JobInput"); let jobInputsList = new RessourceList("inputs", null, "JobInput");
document.addEventListener("DOMContentLoaded", () => { jobInputsList._add({{ job_inputs|tojson|safe }});
jobInputsList._add({{ job_inputs|tojson|safe }});
});
</script> </script>
{% endblock %} {% endblock scripts %}
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment