Refactor code for improved readability and consistency across templates and frontend logic

Co-authored-by: Copilot <copilot@github.com>
This commit is contained in:
2026-04-27 18:48:22 +02:00
parent 53d2d2ffef
commit 4edadd7623
6 changed files with 351 additions and 129 deletions
+69 -35
View File
@@ -1,28 +1,43 @@
{% extends "base.html" %}
{% block title %}Video Generation — AI Allucanget{% endblock %}
{% block content %}
{% extends "base.html" %} {% block title %}Video Generation — AI Allucanget{%
endblock %} {% block content %}
<div class="card">
<h1>Video Generation</h1>
<div class="tabs-container">
<div class="tabs">
<button class="tab-btn active" data-tab="text-to-video" type="button">Text to video</button>
<button class="tab-btn" data-tab="image-to-video" type="button">Image to video</button>
<button class="tab-btn active" data-tab="text-to-video" type="button">
Text to video
</button>
<button class="tab-btn" data-tab="image-to-video" type="button">
Image to video
</button>
</div>
<!-- Text-to-video -->
<div class="tab-panel active" id="tab-text-to-video">
<form method="post">
<input type="hidden" name="mode" value="text">
<input type="hidden" name="mode" value="text" />
<label for="model-t">Model</label>
<input id="model-t" name="model" type="text" required
placeholder="e.g. openai/sora-2-pro"
value="{{ request.form.get('model', '') if request.form.get('mode','text')=='text' else '' }}">
<input
id="model-t"
name="model"
type="text"
required
placeholder="e.g. openai/sora-2-pro"
value="{{ request.form.get('model', '') if request.form.get('mode','text')=='text' else '' }}"
/>
<label for="prompt-t">Prompt</label>
<textarea id="prompt-t" name="prompt" rows="4" required
placeholder="Describe the video you want…">{{ request.form.get('prompt', '') if request.form.get('mode','text')=='text' else '' }}</textarea>
<textarea
id="prompt-t"
name="prompt"
rows="4"
required
placeholder="Describe the video you want…"
>
{{ request.form.get('prompt', '') if request.form.get('mode','text')=='text' else '' }}</textarea
>
<label for="aspect-t">Aspect ratio</label>
<select id="aspect-t" name="aspect_ratio">
@@ -38,21 +53,38 @@
<!-- Image-to-video -->
<div class="tab-panel" id="tab-image-to-video">
<form method="post">
<input type="hidden" name="mode" value="image">
<input type="hidden" name="mode" value="image" />
<label for="model-i">Model</label>
<input id="model-i" name="model" type="text" required
placeholder="e.g. openai/sora-2-pro"
value="{{ request.form.get('model', '') if request.form.get('mode')=='image' else '' }}">
<input
id="model-i"
name="model"
type="text"
required
placeholder="e.g. openai/sora-2-pro"
value="{{ request.form.get('model', '') if request.form.get('mode')=='image' else '' }}"
/>
<label for="image_url">Source image URL</label>
<input id="image_url" name="image_url" type="url" required
placeholder="https://example.com/photo.jpg"
value="{{ request.form.get('image_url', '') }}">
<input
id="image_url"
name="image_url"
type="url"
required
placeholder="https://example.com/photo.jpg"
value="{{ request.form.get('image_url', '') }}"
/>
<label for="prompt-i">Motion prompt</label>
<textarea id="prompt-i" name="prompt" rows="3" required
placeholder="Describe the motion or transformation…">{{ request.form.get('prompt', '') if request.form.get('mode')=='image' else '' }}</textarea>
<textarea
id="prompt-i"
name="prompt"
rows="3"
required
placeholder="Describe the motion or transformation…"
>
{{ request.form.get('prompt', '') if request.form.get('mode')=='image' else '' }}</textarea
>
<label for="aspect-i">Aspect ratio</label>
<select id="aspect-i" name="aspect_ratio">
@@ -67,21 +99,23 @@
</div>
{% if error %}
<div class="alert alert-error mt-2">{{ error }}</div>
{% endif %}
{% if result %}
<div class="result">
<h2>Video job</h2>
<p>Status: <strong>{{ result.status }}</strong></p>
{% if result.get('video_url') %}
<video src="{{ result.video_url }}" controls class="generated-video"></video>
{% else %}
<p class="text-muted mt-1" style="font-size:0.875rem;">
Video is being processed. Check back later.
</p>
{% endif %}
</div>
<div class="alert alert-error mt-2">{{ error }}</div>
{% endif %} {% if result %}
<div class="result">
<h2>Video job</h2>
<p>Status: <strong>{{ result.status }}</strong></p>
{% if result.get('video_url') %}
<video
src="{{ result.video_url }}"
controls
class="generated-video"
></video>
{% else %}
<p class="text-muted mt-1" style="font-size: 0.875rem">
Video is being processed. Check back later.
</p>
{% endif %}
</div>
{% endif %}
</div>
{% endblock %}