{% extends "base.html" %}

{% block title %}Master Library (BETA) - Video Master{% endblock %}

{% block content %}
<div class="container mt-4">
    <h2><i class="bi bi-collection me-2"></i>Master Video Library <span class="badge bg-warning text-dark">BETA</span></h2>
    <p class="text-muted">Manage master video library and fingerprinting</p>

    <div class="row mt-4">
        <div class="col-md-4">
            <div class="card">
                <div class="card-body text-center p-4">
                    <i class="bi bi-folder-plus" style="font-size: 3rem; color: var(--hm-yellow);"></i>
                    <h4 class="mt-3">Add Masters</h4>
                    <p class="text-muted">Upload and fingerprint new master videos</p>
                    <button class="btn btn-hm-primary" disabled>
                        <i class="bi bi-upload me-2"></i>
                        Upload Masters
                    </button>
                    <small class="text-muted d-block mt-2">Coming soon</small>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card">
                <div class="card-body text-center p-4">
                    <i class="bi bi-search" style="font-size: 3rem; color: var(--hm-yellow);"></i>
                    <h4 class="mt-3">Browse Library</h4>
                    <p class="text-muted">View all fingerprinted master videos</p>
                    <button class="btn btn-hm-secondary" disabled>
                        <i class="bi bi-list me-2"></i>
                        View Masters
                    </button>
                    <small class="text-muted d-block mt-2">Coming soon</small>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card">
                <div class="card-body text-center p-4">
                    <i class="bi bi-fingerprint" style="font-size: 3rem; color: var(--hm-yellow);"></i>
                    <h4 class="mt-3">Fingerprinting</h4>
                    <p class="text-muted">Generate fingerprints for matching</p>
                    <button class="btn btn-hm-secondary" disabled>
                        <i class="bi bi-cpu me-2"></i>
                        Scan Folder
                    </button>
                    <small class="text-muted d-block mt-2">Coming soon</small>
                </div>
            </div>
        </div>
    </div>

    <div class="row mt-4">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <i class="bi bi-info-circle me-2"></i>
                    About Master Fingerprinting
                </div>
                <div class="card-body">
                    <p>Master videos are fingerprinted for fast matching against adaptation videos. The fingerprinting process includes:</p>

                    <div class="row">
                        <div class="col-md-6">
                            <h5><i class="bi bi-mic me-2"></i>Audio Fingerprinting</h5>
                            <ul>
                                <li>Chromaprint audio fingerprint generation</li>
                                <li>Acoustic signature analysis</li>
                                <li>Robust to compression and format changes</li>
                            </ul>
                        </div>
                        <div class="col-md-6">
                            <h5><i class="bi bi-camera-video me-2"></i>Video Fingerprinting</h5>
                            <ul>
                                <li>Frame extraction at 2fps</li>
                                <li>8×8 DCT perceptual hash generation</li>
                                <li>Spatial-only comparison (ignores timing)</li>
                            </ul>
                        </div>
                    </div>

                    <hr>

                    <h5><i class="bi bi-clock-history me-2"></i>Fingerprinting Performance</h5>
                    <ul>
                        <li><strong>Speed:</strong> ~5-10 seconds per video (depends on duration and resolution)</li>
                        <li><strong>Storage:</strong> ~50KB per fingerprint (JSON format)</li>
                        <li><strong>Cache:</strong> Fingerprints cached for instant matching</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>

    <div class="row mt-4">
        <div class="col-12">
            <div class="alert alert-warning">
                <i class="bi bi-exclamation-triangle me-2"></i>
                <strong>BETA:</strong> Master library management functionality is under development. Full integration coming soon.
            </div>
        </div>
    </div>
</div>
{% endblock %}