admin/38702-vm
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

2

Browse Source
This commit is contained in:
Flatlogic Bot 2026-02-23 08:48:15 +00:00
parent 0c65e736c6
commit b464398843
6 changed files with 81 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
config/__pycache__/settings.cpython-311.pyc
View File

Binary file not shown.

BIN
config/__pycache__/urls.cpython-311.pyc
View File

Binary file not shown.

5
config/settings.py
View File

@ -155,6 +155,9 @@ STATICFILES_DIRS = [
BASE_DIR / 'node_modules',
]
MEDIA_URL = '/outputs/'
MEDIA_ROOT = BASE_DIR / 'outputs'
# Email
EMAIL_BACKEND = os.getenv(
"EMAIL_BACKEND",
@ -179,4 +182,4 @@ if EMAIL_USE_SSL:
# Default primary key field type
# https://docs.djangoproject.com/en/5.2/ref/settings/#default-auto-field
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'

1
config/urls.py
View File

@ -27,3 +27,4 @@ urlpatterns = [
if settings.DEBUG:
urlpatterns += static("/assets/", document_root=settings.BASE_DIR / "assets")
urlpatterns += static(settings.STATIC_URL, document_root=settings.STATIC_ROOT)
urlpatterns += static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

81
core/templates/core/index.html
View File

@ -7,6 +7,7 @@
<title>{{ project_name }} - Quran Reels Generator</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Amiri&family=Inter:wght@400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
<style>
:root {
--primary-emerald: #064E3B;
@ -82,6 +83,13 @@
border: 1px solid #D1D5DB;
padding: 0.6rem;
}
.video-preview-btn {
cursor: pointer;
transition: color 0.2s;
}
.video-preview-btn:hover {
color: var(--primary-emerald);
}
</style>
</head>
<body>
@ -164,12 +172,17 @@
<div class="col-lg-4">
<div class="card">
<div class="card-header">Recent Generations</div>
<div class="card-header d-flex justify-content-between align-items-center">
<span>Recent Generations</span>
<button class="btn btn-sm btn-link p-0 text-decoration-none" onclick="location.reload()">
<i class="bi bi-arrow-clockwise"></i> Refresh
</button>
</div>
<div class="card-body p-0">
<ul class="list-group list-group-flush">
{% for task in tasks %}
<li class="list-group-item">
<div class="d-flex justify-content-between align-items-start">
<div class="d-flex justify-content-between align-items-start mb-2">
<div>
<strong class="d-block">{{ task.surah_name }}</strong>
<small class="text-muted">Ayahs {{ task.verse_start }}-{{ task.verse_end }}</small>
@ -178,10 +191,24 @@
{{ task.status|title }}
</span>
</div>
{% if task.status == 'completed' %}
<a href="{{ task.output_path }}" class="btn btn-sm btn-outline-success mt-2 w-100" download>Download</a>
<div class="btn-group w-100 mt-2" role="group">
<button type="button" class="btn btn-sm btn-outline-primary"
onclick="previewVideo('{{ task.output_path }}', '{{ task.surah_name }} ({{ task.verse_start }}-{{ task.verse_end }})')">
<i class="bi bi-play-fill"></i> Preview
</button>
<a href="{{ task.output_path }}" class="btn btn-sm btn-outline-success" download>
<i class="bi bi-download"></i> Download
</a>
</div>
{% elif task.status == 'failed' %}
<p class="text-danger x-small mt-1 mb-0">{{ task.error_message|truncatechars:50 }}</p>
<p class="text-danger small mt-1 mb-0"><i class="bi bi-exclamation-triangle"></i> {{ task.error_message|truncatechars:100 }}</p>
{% elif task.status == 'processing' or task.status == 'pending' %}
<div class="progress mt-2" style="height: 5px;">
<div class="progress-bar progress-bar-striped progress-bar-animated bg-success" role="progressbar" style="width: 100%"></div>
</div>
<p class="text-muted small mt-1 mb-0">Processing... Please refresh in a moment.</p>
{% endif %}
</li>
{% empty %}
@ -194,6 +221,31 @@
</div>
</div>
<!-- Video Preview Modal -->
<div class="modal fade" id="videoModal" tabindex="-1" aria-labelledby="videoModalLabel" aria-hidden="true">
<div class="modal-dialog modal-lg modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="videoModalLabel">Video Preview</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body p-0 bg-black">
<div class="ratio ratio-9x16">
<video id="previewPlayer" controls>
<source src="" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>
</div>
<div class="modal-footer">
<a id="downloadBtn" href="" class="btn btn-success" download>Download Video</a>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
document.getElementById('surahSelect').addEventListener('change', function() {
const surahNum = this.value;
@ -208,7 +260,26 @@
document.getElementById('verseEnd').max = max;
});
});
const videoModal = new bootstrap.Modal(document.getElementById('videoModal'));
const previewPlayer = document.getElementById('previewPlayer');
const downloadBtn = document.getElementById('downloadBtn');
const modalTitle = document.getElementById('videoModalLabel');
function previewVideo(url, title) {
previewPlayer.src = url;
downloadBtn.href = url;
modalTitle.textContent = "Preview: " + title;
videoModal.show();
previewPlayer.play();
}
// Stop video when modal is closed
document.getElementById('videoModal').addEventListener('hidden.bs.modal', function () {
previewPlayer.pause();
previewPlayer.src = "";
});
</script>
</body>
</html>
</html>

BIN
outputs/temp_audio/task_3_ayah_0.mp3 Normal file
View File

Binary file not shown.