{% extends "base.html" %}

{% block title %}{{ 'New' if is_new else 'Edit' }} Label - Admin{% endblock %}

{% block content %}
<div class="row mb-4">
    <div class="col">
        <h1><i class="bi bi-tag"></i> {{ 'New Label' if is_new else 'Edit Label' }}</h1>
    </div>
    <div class="col-auto">
        <a href="{{ url_for('labels.index') }}" class="btn btn-outline-secondary">
            <i class="bi bi-arrow-left"></i> Back to labels
        </a>
    </div>
</div>

<form method="POST" enctype="multipart/form-data">
<div class="row">
    <div class="col-lg-8">
        <div class="card mb-3">
            <div class="card-header"><strong>What's in the drawer</strong></div>
            <div class="card-body">
                <div class="row g-3">
                    <div class="col-md-8">
                        <label class="form-label">Name <span class="text-danger">*</span></label>
                        <input type="text" name="name" class="form-control" required
                               value="{{ label.name or '' }}" placeholder="Brick">
                        <div class="form-text">The big line on the label. Keep it short &mdash; "Brick", "Plate, Modified with Clip".</div>
                    </div>
                    <div class="col-md-4">
                        <label class="form-label">Dimensions</label>
                        <input type="text" name="dimensions" class="form-control"
                               value="{{ label.dimensions or '' }}" placeholder="2 x 4">
                    </div>
                    <div class="col-md-4">
                        <label class="form-label">Part number</label>
                        <input type="text" name="part_number" class="form-control"
                               value="{{ label.part_number or '' }}" placeholder="3001">
                    </div>
                    <div class="col-md-8">
                        <label class="form-label">Alternate part numbers</label>
                        <input type="text" name="alt_part_numbers" class="form-control"
                               value="{{ label.alt_part_numbers or '' }}" placeholder="3001a, 3001b">
                        <div class="form-text">Comma separated. Old moulds that live in the same drawer.</div>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Category</label>
                        <select name="category_id" class="form-select">
                            <option value="">Uncategorised</option>
                            {% for cid, text in categories %}
                            <option value="{{ cid }}" {% if label.category_id == cid %}selected{% endif %}>{{ text }}</option>
                            {% endfor %}
                        </select>
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Colour name</label>
                        <input type="text" name="colour_name" class="form-control"
                               value="{{ label.colour_name or '' }}" placeholder="Leave blank for a mixed drawer">
                    </div>
                    <div class="col-md-6">
                        <label class="form-label">Drawer / location</label>
                        <input type="text" name="location" class="form-control"
                               value="{{ label.location or '' }}" placeholder="Cabinet A - Drawer 12">
                    </div>
                    <div class="col-12">
                        <label class="form-label">Notes</label>
                        <textarea name="notes" class="form-control" rows="2"
                                  placeholder="Not printed. Anything you want to remember.">{{ label.notes or '' }}</textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="col-lg-4">
        <div class="card mb-3">
            <div class="card-header"><strong>Artwork</strong></div>
            <div class="card-body text-center">
                {% if label.get_image() %}
                <img src="{{ label.get_image() }}" alt="" class="img-fluid mb-2" style="max-height: 140px; object-fit: contain;">
                <div class="form-check d-inline-block mb-3">
                    <input class="form-check-input" type="checkbox" name="clear_image" id="clearImage" value="1">
                    <label class="form-check-label small" for="clearImage">Remove this image</label>
                </div>
                {% else %}
                <p class="text-muted small">No image yet.</p>
                {% endif %}

                <div class="text-start">
                    <label class="form-label">Upload an image</label>
                    <input type="file" name="image" class="form-control mb-3" accept="image/*">

                    <label class="form-label">...or paste an image URL</label>
                    <input type="url" name="image_url" class="form-control"
                           value="{{ label.image_url or '' }}" placeholder="https://...">
                    <div class="form-check mt-2">
                        <input class="form-check-input" type="checkbox" name="cache_image" id="cacheImage" value="1" checked>
                        <label class="form-check-label small" for="cacheImage">
                            Download a local copy so labels print offline
                        </label>
                    </div>
                </div>
            </div>
        </div>

        <div class="card mb-3">
            <div class="card-body d-grid gap-2">
                <button type="submit" class="btn btn-danger"><i class="bi bi-check-lg"></i> Save label</button>
                {% if is_new %}
                <button type="submit" name="save_and_new" value="1" class="btn btn-outline-danger">
                    <i class="bi bi-plus-lg"></i> Save and add another
                </button>
                {% else %}
                <a href="{{ url_for('labels.print_sheet', ids=label.id) }}" class="btn btn-outline-danger">
                    <i class="bi bi-printer"></i> Print this label
                </a>
                {% endif %}
            </div>
        </div>
    </div>
</div>
</form>

{% if not is_new %}
<form method="POST" action="{{ url_for('labels.delete_label', label_id=label.id) }}"
      onsubmit="return confirm('Delete this label? The drawer keeps its contents, obviously.');">
    <button class="btn btn-outline-danger btn-sm"><i class="bi bi-trash"></i> Delete label</button>
</form>
{% endif %}
{% endblock %}