{% extends "base.html" %}

{% block title %}Schedule calendar · LibreSignage{% endblock %}

{% block head %}
  <link rel="stylesheet" href="{{ url_for('content.static', filename='css/content.css') }}">
{% endblock %}

{% block content %}
  <div class="d-flex flex-wrap align-items-start justify-content-between gap-3 mb-4">
    <div>
      <h1 class="mb-1">Schedule calendar</h1>
      <p class="text-body-secondary mb-0">Review enabled recurring and date rules at a glance.</p>
    </div>
    <div class="btn-group" role="group" aria-label="Schedule views">
      <a class="btn btn-outline-primary" href="{{ url_for('content.schedules') }}">Schedules</a>
      <a class="btn btn-outline-primary" href="{{ url_for('content.schedule_exceptions') }}">Date rules</a>
    </div>
  </div>

  <form class="card card-body mb-4" method="get">
    <div class="row g-3 align-items-end">
      <div class="col-sm-6 col-lg-2">
        <label class="form-label" for="view">View</label>
        <select class="form-select" id="view" name="view">
          <option value="month" {% if view == "month" %}selected{% endif %}>Month</option>
          <option value="week" {% if view == "week" %}selected{% endif %}>Week</option>
        </select>
      </div>
      <div class="col-sm-6 col-lg-3">
        <label class="form-label" for="date">Date</label>
        <input class="form-control" id="date" name="date" type="date" value="{{ selected_date }}">
      </div>
      <div class="col-sm-6 col-lg-3">
        <label class="form-label" for="timezone">Timezone</label>
        <input class="form-control" id="timezone" name="timezone" value="{{ timezone }}" required>
      </div>
      <div class="col-sm-6 col-lg-3">
        <label class="form-label" for="group_id">Target</label>
        <select class="form-select" id="group_id" name="group_id">
          <option value="all" {% if target == "all" %}selected{% endif %}>All targets</option>
          <option value="global" {% if target == "global" %}selected{% endif %}>Global only</option>
          {% for group in screen_groups %}
            <option value="{{ group.id }}" {% if target == group.id|string %}selected{% endif %}>{{ group.name }} + global</option>
          {% endfor %}
        </select>
      </div>
      <div class="col-lg-1"><button class="btn btn-primary w-100" type="submit">Go</button></div>
    </div>
  </form>

  <div class="d-flex flex-wrap align-items-center justify-content-between gap-3 mb-3">
    <div class="btn-group" role="group" aria-label="Calendar navigation">
      <a class="btn btn-outline-secondary" href="{{ url_for('content.schedule_calendar', view=view, date=previous_date, timezone=timezone, group_id=target) }}">Previous</a>
      <a class="btn btn-outline-secondary" href="{{ url_for('content.schedule_calendar', view=view, date=today.isoformat(), timezone=timezone, group_id=target) }}">Today</a>
      <a class="btn btn-outline-secondary" href="{{ url_for('content.schedule_calendar', view=view, date=next_date, timezone=timezone, group_id=target) }}">Next</a>
    </div>
    <h2 class="h4 mb-0">
      {% if view == "week" %}{{ start.strftime("%b") }} {{ start.day }}–{{ end.strftime("%b") }} {{ end.day }}, {{ end.year }}{% else %}{{ selected_date.strftime("%B %Y") }}{% endif %}
    </h2>
    <div class="d-flex gap-2 small">
      <span class="badge text-bg-primary">Schedule</span>
      <span class="badge text-bg-warning">Override</span>
      <span class="badge text-bg-dark">Blackout</span>
    </div>
  </div>

  <div class="schedule-calendar schedule-calendar-{{ view }} border rounded overflow-hidden">
    {% for label in ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"] %}
      <div class="schedule-calendar-heading">{{ label }}</div>
    {% endfor %}
    {% for day in calendar_days %}
      <section class="schedule-calendar-day{% if view == 'month' and day.date.month != selected_date.month %} is-outside{% endif %}{% if day.date == today %} is-today{% endif %}">
        <time class="schedule-calendar-date" datetime="{{ day.date }}">{{ day.date.day }}</time>
        <div class="vstack gap-1 mt-2">
          {% for exception in day.exceptions %}
            <a class="schedule-calendar-event {{ 'text-bg-dark' if exception.action == 'blackout' else 'text-bg-warning' }}" href="{{ url_for('content.edit_schedule_exception', exception_id=exception.id) }}">
              {{ exception.name }}{% if exception.playlist_name %} · {{ exception.playlist_name }}{% endif %}
              <span>{{ exception.screen_group_name or "Global" }} · P{{ exception.priority }}</span>
            </a>
          {% endfor %}
          {% for schedule in day.schedules %}
            <a class="schedule-calendar-event text-bg-primary" href="{{ url_for('content.edit_schedule', schedule_id=schedule.id) }}">
              {{ schedule.name }} · {{ schedule.playlist_name }}
              <span>{{ schedule.daily_start ~ "–" ~ schedule.daily_end if schedule.daily_start else "All day" }} · {{ schedule.screen_group_name or "Global" }} · P{{ schedule.priority }}</span>
            </a>
          {% endfor %}
        </div>
      </section>
    {% endfor %}
  </div>
  <p class="form-text mt-3 mb-0">The calendar shows rules configured for {{ timezone }}. Date rules take precedence over recurring schedules during playback.</p>
{% endblock %}