{% extends "base.html" %}
{% block title %}পুনরাবৃত্তি লগ — ইসলামইনলাইফ কুরআন অ্যাপ{% endblock %}
{% block body %}
<header>
  <h1>🔁 পুনরাবৃত্তি লগ</h1>
  <div><a href="{{ url_for('revision_mode_setup') }}">মোড সেটআপ</a> &nbsp;·&nbsp; <a href="{{ url_for('revision_due') }}">বাকি</a> &nbsp;·&nbsp; <a href="{{ url_for('revision_summary') }}">সারসংক্ষেপ</a> &nbsp;·&nbsp; {{ display_name }} &nbsp;·&nbsp; <a href="{{ url_for('home') }}">হোম</a></div>
</header>
<main>
  {% include "_revision_log_banner.html" %}
  <div id="msgBox"></div>

  <div class="card" style="background:#eaf4fb;">
    মোড: <strong>{% if mode == "sura" %}সূরা{% elif mode == "page" %}পৃষ্ঠা{% else %}আয়াত{% endif %}-ভিত্তিক</strong>
    <span style="font-size:12px; color:#566573;">(এটি ডেস্কটপ অ্যাপের Revision Mode Setup থেকে পরিবর্তন করুন)</span>
  </div>

  <div class="card">
    <div class="section-title">একটি পুনরাবৃত্তি সেশন লগ করুন</div>

    {% if mode == "sura" %}
      <label>সূরা (শুধুমাত্র মুখস্থ করা সূরা)</label>
      <select id="f_sura" onchange="loadMemos()">
        <option value="">— নির্বাচন করুন —</option>
        {% for s in suras %}<option value="{{ s.sura_no }}">{{ s.label }}</option>{% endfor %}
      </select>
      <label>মুখস্থকরণ এন্ট্রি</label>
      <select id="f_memo"><option value="">— প্রথমে একটি সূরা নির্বাচন করুন —</option></select>

    {% elif mode == "page" %}
      <label>মুসহাফ পৃষ্ঠা নম্বর</label>
      <input type="text" id="f_page" placeholder="যেমন 15">

    {% elif mode == "verse" %}
      <label>সূরা</label>
      <select id="f_sura">
        <option value="">— নির্বাচন করুন —</option>
        {% for s in suras %}<option value="{{ s.sura_no }}">{{ s.label }}</option>{% endfor %}
      </select>
      <div class="row">
        <div><label>আয়াত থেকে</label><input type="text" id="f_verse_from" placeholder="1"></div>
        <div><label>আয়াত পর্যন্ত (ঐচ্ছিক)</label><input type="text" id="f_verse_to" placeholder="ঐচ্ছিক"></div>
      </div>
    {% endif %}

    <label>মান</label>
    <select id="f_quality">
      <option value="Strong">শক্তিশালী</option>
      <option value="Average" selected>গড়পড়তা</option>
      <option value="Weak">দুর্বল</option>
    </select>

    <label>নোট (ঐচ্ছিক)</label>
    <textarea id="f_notes" placeholder="ঐচ্ছিক নোট..."></textarea>

    <button class="btn-save" onclick="logRevision()">✅ আজকের পুনরাবৃত্তি লগ করুন</button>
  </div>

  <div class="card">
    <div class="section-title">📅 সাম্প্রতিক পুনরাবৃত্তি</div>
    <table>
      <tr><th>তারিখ</th><th>সূরা / পৃষ্ঠা / আয়াত</th><th>মান</th><th>নোট</th></tr>
      {% for h in history %}
      <tr><td data-label="তারিখ">{{ h.date | fmt_date }}</td><td data-label="সূরা / পৃষ্ঠা / আয়াত">{{ h.sura }}</td><td data-label="মান">{{ h.quality | bn_status }}</td><td data-label="নোট">{{ h.notes or "" }}</td></tr>
      {% endfor %}
    </table>
  </div>
</main>

<script>
const MODE = "{{ mode }}";

function loadMemos() {
  const sura = document.getElementById('f_sura').value;
  const memoSel = document.getElementById('f_memo');
  if (!sura) { memoSel.innerHTML = '<option value="">— প্রথমে একটি সূরা নির্বাচন করুন —</option>'; return; }
  fetch(APP_PREFIX + `/api/revision/memos-for-sura/${sura}`).then(r => r.json()).then(memos => {
    memoSel.innerHTML = '<option value="">— নির্বাচন করুন —</option>';
    memos.forEach(m => {
      const opt = document.createElement('option');
      opt.value = m.id; opt.textContent = m.label;
      memoSel.appendChild(opt);
    });
  });
}

function showMsg(text, isError) {
  const box = document.getElementById('msgBox');
  box.innerHTML = `<div class="msg ${isError ? 'msg-error' : 'msg-success'}">${text}</div>`;
  if (!isError) setTimeout(() => location.reload(), 900);
}

function logRevision() {
  const fd = new FormData();
  fd.append('mode', MODE);
  fd.append('quality', document.getElementById('f_quality').value);
  fd.append('notes', document.getElementById('f_notes').value);

  if (MODE === 'sura') {
    fd.append('sura_no', document.getElementById('f_sura').value);
    fd.append('memo_id', document.getElementById('f_memo').value);
  } else if (MODE === 'page') {
    fd.append('page_no', document.getElementById('f_page').value);
  } else if (MODE === 'verse') {
    fd.append('sura_no', document.getElementById('f_sura').value);
    fd.append('verse_no', document.getElementById('f_verse_from').value);
    fd.append('verse_no_end', document.getElementById('f_verse_to').value);
  }

  fetch(APP_PREFIX + '/api/revision/log', { method: 'POST', body: fd })
    .then(r => r.json().then(d => ({ ok: r.ok, body: d })))
    .then(({ ok, body }) => {
      if (ok && body.ok) showMsg('✅ লগ করা হয়েছে।', false);
      else showMsg(body.error || 'এই পুনরাবৃত্তি লগ করা যায়নি।', true);
    });
}
</script>
{% endblock %}