hm_video_ai_qc_tool/web/templates/upload.html
2025-12-31 12:59:50 +02:00

54 lines
2.2 KiB
HTML

{% extends "base.html" %}
{% block title %}Upload Video - HM Video QC{% endblock %}
{% block wizard_nav %}
<div class="wizard-nav">
<div class="wizard-step active">1. Upload</div>
<div class="wizard-step">2. Configure</div>
<div class="wizard-step">3. Results</div>
</div>
{% endblock %}
{% block content %}
<div class="upload-container">
<h2>Upload Video File</h2>
{% if error %}
<div class="alert alert-danger">{{ error }}</div>
{% endif %}
<form id="uploadForm" method="POST" action="{{ url_for('upload') }}" enctype="multipart/form-data">
<div class="drop-zone" id="dropZone">
<svg class="upload-icon" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M7 10L12 15L17 10" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M12 15V3" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20 21H4C3.44772 21 3 20.5523 3 20V13" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M21 13V20C21 20.5523 20.5523 21 20 21" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
<p>Drag and drop video file here</p>
<p class="or-text">or</p>
<label for="videoFile" class="btn btn-yellow">Choose File</label>
<input type="file" id="videoFile" name="video_file" accept=".mp4,.mov,.avi,.mkv,.webm,.flv,.wmv,.m4v" hidden>
</div>
<div id="fileInfo" class="file-info hidden">
<p><strong>Selected:</strong> <span id="fileName"></span></p>
<p><strong>Size:</strong> <span id="fileSize"></span></p>
</div>
<button type="submit" id="uploadBtn" class="btn btn-yellow btn-lg" disabled>
Upload and Continue
</button>
</form>
<div class="supported-formats">
<h4>Supported Formats:</h4>
<p>.mp4, .mov, .avi, .mkv, .webm, .flv, .wmv, .m4v</p>
</div>
</div>
{% endblock %}
{% block scripts %}
<script src="{{ url_for('static', filename='js/upload.js') }}"></script>
{% endblock %}