{% extends "layout.html" %}

{% block title %}OptiWarm - {% if is_new %}New Place Type{% else %}Edit {{ place_type.name }}{% endif %}{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h1>
        <i class="fas fa-th-large mr-2"></i>{% if is_new %}New Place Type{% else %}Edit {{ place_type.name }}{% endif %}
    </h1>
    <div class="btn-group">
        <a href="{{ url_for('placetypes.place_types') }}" class="btn btn-secondary">
            <i class="fas fa-arrow-left mr-2"></i>Back to Place Types
        </a>
    </div>
</div>

<div class="card">
    <div class="card-body">
        <form method="post">
            {{ form.csrf_token }}
            
            <div class="form-group">
                <label for="name">Name</label>
                {{ form.name(class="form-control", placeholder="Enter place type name") }}
                {% if form.name.errors %}
                    <div class="text-danger">
                        {% for error in form.name.errors %}
                            {{ error }}
                        {% endfor %}
                    </div>
                {% endif %}
                <small class="form-text text-muted">{{ form.name.description }}</small>
            </div>
            
            <div class="form-group">
                <label for="description">Description</label>
                {{ form.description(class="form-control", rows=3, placeholder="Description of the place type") }}
                {% if form.description.errors %}
                    <div class="text-danger">
                        {% for error in form.description.errors %}
                            {{ error }}
                        {% endfor %}
                    </div>
                {% endif %}
                <small class="form-text text-muted">{{ form.description.description }}</small>
            </div>
            
            <div class="form-group">
                <label for="warming_rule_types">Warming Rule Types</label>
                {{ form.warming_rule_types(class="form-control select2", multiple="multiple", data_placeholder="Select warming rule types") }}
                {% if form.warming_rule_types.errors %}
                    <div class="text-danger">
                        {% for error in form.warming_rule_types.errors %}
                            {{ error }}
                        {% endfor %}
                    </div>
                {% endif %}
                <small class="form-text text-muted">{{ form.warming_rule_types.description }}</small>
            </div>
            
            <!-- Add Select2 styling for multiple select -->
            {% block head %}
                <link href="/static/css/select2.min.css" rel="stylesheet" />
            {% endblock %}
            
            {% block scripts %}
                <script src="/static/js/select2.min.js"></script>
                <script>
                    $(document).ready(function() {
                        $('.select2').select2({
                            theme: 'classic',
                            placeholder: "Select warming rule types",
                            allowClear: true
                        });
                    });
                </script>
            {% endblock %}
            
            <div class="form-group">
                <button type="submit" class="btn btn-primary">
                    <i class="fas fa-save mr-2"></i>{% if is_new %}Create Place Type{% else %}Update Place Type{% endif %}
                </button>
                <a href="{{ url_for('placetypes.place_types') }}" class="btn btn-secondary">
                    Cancel
                </a>
            </div>
        </form>
    </div>
</div>
{% endblock %}