{% extends "base.html" %}
{% block title %}{% if kind == 'student' %}Studentenplan{% else %}Studiengang-Plan{% endif %}{% endblock %}
{% block content %}
<h1 class="page-title">
  {% if kind == 'student' %}
    Studentenplan
    {% if person %}<span class="badge">{{ person.name }}</span>{% endif %}
  {% else %}
    Studiengang-Plan
    {% if stg %}<span class="badge">{{ stg.code }} - {{ stg.name }}</span>{% endif %}
  {% endif %}
  <span class="badge badge-muted">{{ semester }}</span>
</h1>

<div class="card">
  <form class="form-row" method="get" action="/{{ kind if kind != 'student' else 'plan' }}">
    {% if kind == 'student' %}
      <div class="field uid-field">
        <label>Matrikel oder Lektor</label>
        <input type="text" id="uid-input" name="uid" value="{{ uid }}"
               placeholder="z.B. 2410640055 oder rmatzinger" required>
        <div class="suggest" id="uid-suggest"></div>
      </div>
      {% if uid and uid | length >= 9 %}
        {% set dec = decode_matrikel(uid, meta.stgs) %}
        {% if dec %}
        <div class="field">
          <label>&nbsp;</label>
          <div class="badge badge-muted" style="margin-bottom:24px">
            Start: {{ dec.start }}
            {% if dec.stg_code %} · {{ dec.stg_code }} - {{ dec.stg_name }}{% endif %}
            · Nr. {{ dec.nr }}
          </div>
        </div>
        {% endif %}
      {% endif %}
    {% else %}
      <div class="field">
        <label>Studiengang</label>
          <select name="kz" id="stg-select" required onchange="reloadSemesters()">
          {% for s in meta.stgs %}
            <option value="{{ s.kz }}" {{ 'selected' if s.kz == kz }}>{{ s.code }} - {{ s.name }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="field">
        <label>Studien-Sem.</label>
          <select name="sem" id="sem-select" onchange="reloadVerbands()">
            {% for n in sems %}
              <option value="{{ n }}" {{ 'selected' if (n | string) == sem }}>{{ n }}</option>
            {% endfor %}
          </select>
      </div>
      <div class="field">
        <label>Verband</label>
        <select name="ver" id="ver-select">
          {% for v in verbands %}
            <option value="{{ v }}" {{ 'selected' if v == ver }}>{{ v }}{{ verband_label(v) }}</option>
          {% endfor %}
        </select>
      </div>
    {% endif %}
    <div class="field">
      <label>Semester</label>
      <select name="semester">
        {% for s in meta.semesters %}
          <option value="{{ s.label }}" {{ 'selected' if s.label == semester }}>{{ s.label }}</option>
        {% endfor %}
      </select>
    </div>
    <button class="btn btn-primary" type="submit">Laden</button>
    <a class="btn" href="/export/ical?kind={{ kind }}{% if kind == 'student' %}&uid={{ uid }}{% else %}&kz={{ kz }}&sem={{ sem }}&ver={{ ver }}{% endif %}&semester={{ semester }}"
       title="iCal-Download (Google, Outlook, Thunderbird, ...)">iCal export</a>
    <button class="btn" onclick="downloadCSV()" title="Termine als CSV herunterladen">CSV export</button>
  </form>
</div>

{% if kind == 'student' and person %}
<div class="card">
  <div class="kv">
    <div class="item"><div class="k">Person</div><div class="v">{{ person.name }}
      {% if person.kind == 'lektor' %}<span class="badge">Lektor</span>{% endif %}
      <a class="btn btn-sm" href="/person/{{ person.uid }}" style="margin-left:10px">Profil</a>
    </div></div>
    {% if person.kind == 'student' %}
    <div class="item"><div class="k">Matrikelnummer</div><div class="v mono">{{ person.uid }}</div></div>
    <div class="item"><div class="k">Studiengang</div><div class="v">{{ person.stg }}</div></div>
    <div class="item"><div class="k">Semester / Verband</div><div class="v">{{ person.semester }} / {{ person.verband }}{% if person.gruppe %} / Grp. {{ person.gruppe }}{% endif %}</div></div>
    {% else %}
    <div class="item"><div class="k">Username</div><div class="v mono">{{ person.uid }}</div></div>
    {% endif %}
  </div>
</div>
{% endif %}

<div class="card">
  <div class="tabs">
    <button id="tab-week" class="active" onclick="switchTab('week')">Wochenansicht</button>
    <button id="tab-sem" onclick="switchTab('sem')">Semesterübersicht</button>
  </div>
  <div id="pane-week" class="tabpane active">
    <div class="weekbar">
      <div>
        <span class="week-label" id="week-label"></span>
        <span class="week-range" id="week-range"></span>
      </div>
      <div class="nav-btns">
        <select id="gruppe-filter" onchange="setGruppeFilter(this.value)" style="display:none;margin-right:4px;padding:5px 8px;border:1px solid var(--line);border-radius:8px;font-size:13px">
          <option value="">alle Gruppen</option>
        </select>
        <button class="btn btn-sm" onclick="shiftWeek(-1)">&#9664;</button>
        <button class="btn btn-sm" onclick="goToday()">Heute</button>
        <button class="btn btn-sm" onclick="shiftWeek(1)">&#9654;</button>
      </div>
    </div>
    <div class="week-scroll"><div class="week-grid" id="week-grid"></div></div>
    <div class="legend" id="legend"></div>
  </div>
  <div id="pane-sem" class="tabpane">
    <div id="sem-lv"></div>
    <h3>Alle Termine</h3>
    <div id="sem-events"></div>
  </div>
</div>

<div class="modal-back" id="detail-modal" onclick="if(event.target===this)closeDetail()">
  <div class="modal">
    <button class="close" onclick="closeDetail()">&times;</button>
    <h3>LV-Details</h3>
    <div id="detail-body"></div>
  </div>
</div>
{% endblock %}

{% block scripts %}
<script>
window.__PLAN_DATA__ = {
  kind: "{{ kind }}",
  ptype: "{{ person.kind if person else '' }}",
  tab: "{{ tab }}",
  uid: "{{ uid }}",
  kz: "{{ kz }}",
  sem: "{{ sem }}",
  ver: "{{ ver }}",
  grp: "{{ grp }}",
  semester: "{{ semester }}",
  initWeek: "{{ init_week.isoformat() }}",
  slots: {{ slots | tojson }},
  events: {{ events_json | tojson }}
};
</script>
{% endblock %}