{% extends "base.html" %}
{% block title %}Issue {{ issue.publication_date }} · IP TM Manager{% endblock %}
{% block body %}
<div class="toolbar">
  <div>
    <h1 style="margin:0">Issue · {{ issue.publication_date }}</h1>
    <p class="sub" style="margin:4px 0 0">
      <span class="pill {{ issue.status }}">{{ issue.status }}</span>
      &nbsp; Opposition deadline:
      <span class="mono" style="color:var(--warn)">{{ issue.opposition_deadline }}</span>
      &nbsp; · &nbsp; Loaded {{ issue.loaded_count }} / {{ issue.expected_count or '—' }}
      {% if issue.is_full %}<span class="pill ok">complete count</span>{% endif %}
    </p>
  </div>
</div>

{% if current_user and current_user.is_admin %}
<div class="panel">
  <h2>Upload Application PDFs</h2>
  <form method="post" action="{{ url_for('upload', issue_id=issue.id) }}"
        enctype="multipart/form-data" id="upform">
    <div class="upload" id="drop">
      <input type="file" name="pdfs" id="files" accept="application/pdf" multiple hidden>
      <div style="font-family:'Fraunces',serif;font-size:18px">Drop PDF files here</div>
      <div class="muted" style="margin-top:6px">or click to browse · ~50 files typical, more is fine</div>
      <div id="filecount" class="muted mono" style="margin-top:10px"></div>
      <div class="progress" id="prog"><div class="bar" id="bar"></div></div>
    </div>
    <div style="margin-top:14px"><button class="btn" type="submit">Upload &amp; Extract</button></div>
  </form>
</div>
{% endif %}

<div class="panel">
  <div class="toolbar">
    <h2 style="margin:0">Applications</h2>
    <div class="spacer"></div>
    {% if current_user and current_user.is_admin %}
    <form method="post" action="{{ url_for('mark_complete', issue_id=issue.id) }}">
      <button class="btn ghost sm" type="submit">Mark Complete</button></form>
    <form method="post" action="{{ url_for('send_issue', issue_id=issue.id) }}"
          onsubmit="return confirm('Send this issue to all active subscribers?')">
      <button class="btn sm" type="submit">Send to Subscribers</button></form>
    {% endif %}
  </div>
  <table>
    <tr><th>#</th><th>Pub. No.</th><th>Mark</th><th>Applicant</th><th>Class</th>
      <th>Status</th><th>Source</th><th></th></tr>
    {% for a in applications %}
    <tr>
      <td class="muted">{{ loop.index }}</td>
      <td class="mono">{{ a.pub_number or '—' }}</td>
      <td>{{ a.mark_translit or a.mark_translation or a.mark_text or '—' }}</td>
      <td>{{ a.applicant_en or "—" }}</td>
      <td>{{ a.nice_class or '—' }}</td>
      <td>
        {% if a.verified %}<span class="pill ok">verified</span>
        {% elif not a.extraction_ok %}<span class="pill flag">review</span>
        {% else %}<span class="pill open">draft</span>{% endif %}
      </td>
      <td><a href="{{ url_for('source_file', app_id=a.id) }}">PDF</a></td>
      <td>
        {% if current_user and current_user.is_admin %}
        <a class="btn ghost sm" href="{{ url_for('edit_application', app_id=a.id) }}">Edit</a>
        {% else %}
        <a class="btn ghost sm" href="{{ url_for('application_detail', app_id=a.id) }}">View</a>
        {% endif %}
      </td>
    </tr>
    {% else %}
    <tr><td colspan="8" class="muted">No applications yet — upload PDFs above.</td></tr>
    {% endfor %}
  </table>
</div>

<div class="panel">
  <h2>Generate / Preview Report</h2>
  <div class="row">
    <div class="field"><label>Format</label>
      <select id="r_fmt"><option>pdf</option><option>docx</option>
        <option>xlsx</option><option>html</option></select></div>
    <div class="field"><label>Design</label>
      <select id="r_design">{% for d in designs %}<option>{{ d }}</option>{% endfor %}</select></div>
    <div class="field"><label>Language</label>
      <select id="r_lang">{% for code,name in languages.items() %}
        <option value="{{ code }}">{{ name }}</option>{% endfor %}</select></div>
    <div class="field" style="display:flex;align-items:flex-end;gap:8px">
      <button class="btn" onclick="genReport()">Download</button>
      <button class="btn ghost" onclick="genReport('html')">Preview</button>
    </div>
  </div>
</div>

<div class="panel">
  <h2>What Each Subscriber Will Receive</h2>
  <p class="sub" style="margin-top:-8px">Reports are filtered to each subscriber's classes of interest. Subscribers with no match are skipped on send.</p>
  <table>
    <tr><th>Subscriber</th><th>Classes watched</th><th>Matching apps</th><th>Format</th><th>Preview</th></tr>
    {% for p in sub_preview %}
    <tr>
      <td>{{ p.sub.name }}</td>
      <td>{% if p.classes == 'all' %}<span class="muted">all</span>{% else %}<span class="mono">{{ p.classes }}</span>{% endif %}</td>
      <td>{% if p.matched %}<span class="pill ok">{{ p.matched }} of {{ applications|length }}</span>{% else %}<span class="pill flag">0 — skipped</span>{% endif %}</td>
      <td class="muted">{{ p.sub.pref_format }}</td>
      <td>{% if p.matched %}<a class="btn ghost sm" href="{{ url_for('preview_for_subscriber', issue_id=issue.id, sub_id=p.sub.id, format='html') }}" target="_blank">Preview</a>{% else %}—{% endif %}</td>
    </tr>
    {% else %}<tr><td colspan="5" class="muted">No active subscribers.</td></tr>{% endfor %}
  </table>
</div>
{% endblock %}
{% block scripts %}
<script>
const drop=document.getElementById('drop'),files=document.getElementById('files');
const fc=document.getElementById('filecount');
drop.onclick=()=>files.click();
files.onchange=()=>fc.textContent=files.files.length+' file(s) selected';
['dragover','dragenter'].forEach(e=>drop.addEventListener(e,ev=>{ev.preventDefault();drop.classList.add('drag')}));
['dragleave','drop'].forEach(e=>drop.addEventListener(e,ev=>{ev.preventDefault();drop.classList.remove('drag')}));
drop.addEventListener('drop',ev=>{files.files=ev.dataTransfer.files;fc.textContent=files.files.length+' file(s) selected'});

const base="{{ url_for('report', issue_id=issue.id) }}";
function genReport(forceFmt){
  const fmt=forceFmt||document.getElementById('r_fmt').value;
  const d=document.getElementById('r_design').value;
  const l=document.getElementById('r_lang').value;
  const url=`${base}?format=${fmt}&design=${d}&lang=${l}`;
  if(fmt==='html'){window.open(url,'_blank')}else{window.location=url}
}
// simple progress feedback on submit
document.getElementById('upform').addEventListener('submit',()=>{
  document.getElementById('prog').classList.add('show');
  let w=0;const b=document.getElementById('bar');
  const t=setInterval(()=>{w=Math.min(w+5,90);b.style.width=w+'%';if(w>=90)clearInterval(t)},150);
});
</script>
{% endblock %}