mirror of
https://github.com/denizsafak/abogen.git
synced 2026-07-18 13:40:27 +02:00
JB
718a3fa1c0
- Updated styles for job cards to include a paused state and improved title styling. - Modified job card template to display job status and progress more clearly, including pause/resume functionality. - Introduced a new script for managing chapter row states in the prepare job form, allowing for dynamic enabling/disabling of inputs. - Created a new template for preparing jobs, featuring a summary of metadata and chapter details. - Added a comprehensive apostrophe normalization module to handle various cases of apostrophe usage in text.
89 lines
4.9 KiB
HTML
89 lines
4.9 KiB
HTML
<div class="card__title">Queue</div>
|
|
|
|
<section class="queue-section">
|
|
<header class="queue-section__header">
|
|
<h3>Active jobs</h3>
|
|
</header>
|
|
{% if active_jobs %}
|
|
<ul class="job-cards">
|
|
{% for job in active_jobs %}
|
|
{% set progress_value = ((job.progress or 0) * 100)|round(1) %}
|
|
<li class="job-card" data-status="{{ job.status.value }}">
|
|
<div class="job-card__header">
|
|
<div>
|
|
<a class="job-card__title" href="{{ url_for('web.job_detail', job_id=job.id) }}">{{ job.original_filename }}</a>
|
|
<div class="job-card__meta">
|
|
{% if job.queue_position %}Position #{{ job.queue_position }} · {% endif %}
|
|
{% if job.voice_profile %}Profile: {{ job.voice_profile }}{% else %}Voice: {{ job.voice }}{% endif %} · {{ job.language }}
|
|
</div>
|
|
{% if job.pause_requested and job.status == JobStatus.RUNNING %}
|
|
<div class="job-card__meta job-card__meta--warning">Pause requested — waiting for a safe point…</div>
|
|
{% endif %}
|
|
</div>
|
|
<span class="badge badge--{{ job.status.value }}">{{ job.status.value|title }}</span>
|
|
</div>
|
|
<div class="job-card__progress">
|
|
<div class="progress-bar" style="--progress: {{ progress_value }}%">
|
|
<div class="progress-bar__fill"></div>
|
|
</div>
|
|
<small>{{ progress_value }}% · {{ job.processed_characters }} / {{ job.total_characters or '—' }}</small>
|
|
</div>
|
|
<div class="job-card__footer">
|
|
<a class="button button--ghost" href="{{ url_for('web.job_detail', job_id=job.id) }}">Details</a>
|
|
{% if job.status == JobStatus.RUNNING %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.pause_job', job_id=job.id) }}" hx-target="#jobs-panel" hx-swap="innerHTML">Pause</button>
|
|
{% elif job.status == JobStatus.PAUSED %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.resume_job', job_id=job.id) }}" hx-target="#jobs-panel" hx-swap="innerHTML">Resume</button>
|
|
{% elif job.status == JobStatus.PENDING %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.pause_job', job_id=job.id) }}" hx-target="#jobs-panel" hx-swap="innerHTML">Pause</button>
|
|
{% endif %}
|
|
{% if job.status in [JobStatus.PENDING, JobStatus.RUNNING, JobStatus.PAUSED] %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.cancel_job', job_id=job.id) }}" hx-target="#jobs-panel" hx-swap="innerHTML" hx-confirm="Cancel this conversion?">Cancel</button>
|
|
{% endif %}
|
|
</div>
|
|
</li>
|
|
{% endfor %}
|
|
</ul>
|
|
{% else %}
|
|
<p class="queue-empty">No active jobs. Drop a file or paste text to get started.</p>
|
|
{% endif %}
|
|
</section>
|
|
|
|
<section class="queue-section">
|
|
<header class="queue-section__header">
|
|
<h3>Recent results</h3>
|
|
{% if total_finished > 0 %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.clear_finished_jobs') }}" hx-target="#jobs-panel" hx-swap="innerHTML" hx-confirm="Remove completed jobs from this list?">Clear finished</button>
|
|
{% endif %}
|
|
</header>
|
|
{% if finished_jobs %}
|
|
<ul class="job-cards job-cards--compact">
|
|
{% for job in finished_jobs %}
|
|
<li class="job-card">
|
|
<div class="job-card__header">
|
|
<div>
|
|
<a class="job-card__title" href="{{ url_for('web.job_detail', job_id=job.id) }}">{{ job.original_filename }}</a>
|
|
<div class="job-card__meta">Finished {{ job.finished_at|datetimeformat }}</div>
|
|
</div>
|
|
<span class="badge badge--{{ job.status.value }}">{{ job.status.value|title }}</span>
|
|
</div>
|
|
<div class="job-card__footer">
|
|
<a class="button button--ghost" href="{{ url_for('web.job_detail', job_id=job.id) }}">Inspect</a>
|
|
{% if job.status == JobStatus.COMPLETED and job.result.audio_path %}
|
|
<a class="button button--ghost" href="{{ url_for('web.download_job', job_id=job.id) }}">Download</a>
|
|
{% endif %}
|
|
<button type="button" class="button button--ghost" hx-post="{{ url_for('web.delete_job', job_id=job.id) }}" hx-target="#jobs-panel" hx-swap="innerHTML" hx-confirm="Remove this job from the list?">Remove</button>
|
|
</div>
|
|
</li>
|
|
{% endfor %}
|
|
{% if total_finished > finished_jobs|length %}
|
|
<li class="job-card job-card--info">
|
|
<div class="job-card__meta">{{ total_finished - finished_jobs|length }} more finished job{{ 's' if (total_finished - finished_jobs|length) != 1 else '' }} hidden. Clear finished to remove them.</div>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
{% else %}
|
|
<p class="queue-empty">Completed jobs will appear here.</p>
|
|
{% endif %}
|
|
</section>
|