{% extends "django_program/manage/base.html" %}

{% block title %}{% if is_create %}Add Room{% else %}Edit Room{% endif %}{% endblock %}

{% block breadcrumb %}
<nav class="breadcrumb" aria-label="Breadcrumb">
  <a href="{% url 'manage:dashboard' conference.slug %}">Dashboard</a>
  <span class="breadcrumb-separator"></span>
  <a href="{% url 'manage:room-list' conference.slug %}">Rooms</a>
  <span class="breadcrumb-separator"></span>
  <span>{% if is_create %}Add{% else %}Edit{% endif %}</span>
</nav>
{% endblock %}

{% block page_title %}
<h1>{% if is_create %}Add Room{% else %}Edit Room: {{ room.name }}{% endif %}</h1>
{% endblock %}

{% block content %}
{% if is_synced %}
<div class="sync-banner">
  <span>&#128274;</span>
  This room was synced from Pretalx on {{ room.synced_at|date:"N j, Y, P" }}.
  Synced fields are locked and cannot be edited here. Run a new sync to update Pretalx data.
</div>
{% endif %}

<div class="form-container">
  <form method="post">
    {% csrf_token %}
    {% for field in form %}
    <div class="form-group {% if is_synced %}form-group--locked{% endif %}">
      <label for="{{ field.id_for_label }}">
        {{ field.label }}
        {% if is_synced %}<span class="lock-icon" title="Synced from Pretalx">&#128274;</span>{% endif %}
      </label>
      {{ field }}
      {% if field.help_text %}
      <span class="helptext">{{ field.help_text }}</span>
      {% endif %}
      {% if field.errors %}
      <ul class="errorlist">
        {% for error in field.errors %}
        <li>{{ error }}</li>
        {% endfor %}
      </ul>
      {% endif %}
    </div>
    {% endfor %}
    <div class="form-actions">
      {% if not is_synced %}
      <button type="submit" class="btn btn-primary">{% if is_create %}Create Room{% else %}Save Changes{% endif %}</button>
      {% endif %}
      <a href="{% url 'manage:room-list' conference.slug %}" class="btn btn-secondary">{% if is_synced %}Back to Rooms{% else %}Cancel{% endif %}</a>
    </div>
  </form>
</div>
{% endblock %}