{% extends 'base.html' %}

{% block content %}
<div class="column is-4 is-offset-4">

    <h3>Editar Álbum</h3>
    <div class="box">

        <form method="POST" enctype="multipart/form-data" action="{{ url_for('paginas.edit_album', album_id=album.id) }}">
            <div class="text mb-3">
                <label for="name">Nombre:</label>
                <input class="form-control" type="text" id="name" name="name" value="{{ album.name }}" required>
            </div>

            <div class="text mb-3">
                <label for="artist">Artista:</label>
                <input class="form-control" type="text" id="artist" name="artist" value="{{ album.artist }}" required>
            </div>

            <div class="text mb-3">
                <label for="year">Año:</label>
                <input class="form-control" type="number" id="year" name="year" value="{{ album.year }}" required>
            </div>

            <div class="text mb-3">
                <label for="cover_image">Cover Image:</label>
                <input class="form-control" type="file" id="cover_image" name="coverimage">
                {% if album.cover_image %}
                <img src="{{ url_for('paginas.uploaded_file', filename=album.cover_image) }}" alt="{{ album.name }}" style="width:100px;height:100px;"><br>
                {% endif %}
            </div>
            
            <div class="text mb-3">
                <button type="submit" class="btn app-btn-primary w-100 theme-btn mx-auto">Guardar cambios</button>
            </div>
        </form>
    </div>
</div>
{% endblock %}