{% extends "base.html" %}
{% block title %}Scan {{ job.scan_id }} · ai-protect{% endblock %}

{% block autorefresh %}
  // Disable the global autorefresh on this page — we do our own AJAX polling
  // below (see #scan-poller) so the page doesn't lose scroll position or
  // flash the log every 3 seconds while the scan is running.
  window.AI_PROTECT_NO_AUTOREFRESH = true;
{% endblock %}

{% block content %}
  <a class="back" href="{{ url_for('scan_launcher') }}">← back to scan launcher</a>

  <article class="change-detail" data-scan-id="{{ job.scan_id }}" data-initial-status="{{ job.status }}" data-app-name="{{ job.app_name }}">
    <header>
      <div class="status-row">
        {% if job.status == 'running' %}
          <span id="scan-status-badge" class="status-pill status-running">
            <span class="status-dot"></span>Running<span class="status-dot"></span>
          </span>
          <button id="scan-stop-btn" type="button" class="status-pill status-stop" data-scan-id="{{ job.scan_id }}">
            <span class="stop-sign">⛔</span>Stop scan<span class="stop-sign">⛔</span>
          </button>
        {% elif job.status == 'done' %}
          <span id="scan-status-badge" class="status-pill status-done">{{ job.status }}</span>
        {% elif job.status == 'failed' %}
          <span id="scan-status-badge" class="status-pill status-failed">{{ job.status }}</span>
        {% elif job.status == 'stopped' %}
          <span id="scan-status-badge" class="status-pill status-stopped">{{ job.status }}</span>
        {% else %}
          <span id="scan-status-badge" class="sev-badge sev-low">{{ job.status }}</span>
          {# Stop button placeholder for AJAX path: hidden but kept in DOM so
             a status flip back to 'running' (rare) can reveal it. #}
          <button id="scan-stop-btn" type="button" class="status-pill status-stop" data-scan-id="{{ job.scan_id }}" hidden>
            <span class="stop-sign">⛔</span>Stop scan<span class="stop-sign">⛔</span>
          </button>
        {% endif %}
        <span id="scan-stop-status" class="small muted"></span>
      </div>
      <h1>Scan {{ job.scan_id }}</h1>
      <div class="meta">
        <span><strong>app:</strong> {{ job.app_name }}</span>
        <span><strong>stage:</strong> {{ job.stage }}</span>
        <span><strong>adapter:</strong> {{ job.adapter or "all" }}</span>
        <span><strong>pid:</strong> <code>{{ job.pid }}</code></span>
        <span id="scan-findings-meta">
          {% if job.findings_after is not none %}
            <strong>findings:</strong> {{ job.findings_before }} → {{ job.findings_after }}
            (Δ {{ job.findings_after - job.findings_before }})
          {% endif %}
        </span>
      </div>
    </header>

    <section>
      <h2>Live log</h2>
      <pre id="scan-log" class="diff" style="max-height:520px">{{ log_tail }}</pre>
      <div id="scan-beam" class="scan-beam scan-beam-thick"
        {% if job.status not in ('running', 'pending') %}hidden{% endif %}
        aria-hidden="true"></div>
    </section>

    <section id="scan-action-bar" class="action-bar"
      {% if job.status not in ('done', 'failed', 'stopped') %}hidden{% endif %}>
      {% if job.status == 'done' %}
        <h2>Done</h2>
        <a href="{{ url_for('index', app=job.app_name) }}" class="btn btn-primary">View findings for {{ job.app_name }}</a>
        <a href="{{ url_for('index') }}" class="btn btn-secondary">All findings</a>
        <a href="{{ url_for('scan_launcher') }}" class="btn btn-secondary">Run another scan</a>
      {% elif job.status == 'failed' %}
        <h2>Failed</h2>
        <p>Exit code {{ job.exit_code }}. Inspect the log above; common causes: missing tool on PATH, manifest validation error, adapter crash.</p>
        <a href="{{ url_for('scan_launcher') }}" class="btn btn-secondary">Try again</a>
      {% elif job.status == 'stopped' %}
        <h2>Stopped</h2>
        <p>Scan was cancelled by the operator. Partial findings (if any) are in the store.</p>
        <a href="{{ url_for('index', app=job.app_name) }}" class="btn btn-primary">View findings for {{ job.app_name }}</a>
        <a href="{{ url_for('scan_launcher') }}" class="btn btn-secondary">Run another scan</a>
      {% endif %}
    </section>
  </article>

  <script id="scan-poller">
  (function() {
    const article = document.querySelector('article.change-detail');
    if (!article) return;
    const scanId = article.dataset.scanId;
    const initial = article.dataset.initialStatus;
    const appName = article.dataset.appName || '';
    if (initial !== 'running' && initial !== 'pending') return;  // nothing to poll

    const badge = document.getElementById('scan-status-badge');
    const logEl = document.getElementById('scan-log');
    const beam = document.getElementById('scan-beam');
    const findingsMeta = document.getElementById('scan-findings-meta');
    const actionBar = document.getElementById('scan-action-bar');

    const POLL_MS = 4000;
    let timer = null;
    let lastLog = logEl.textContent;
    let consecutiveErrors = 0;

    function escapeHtml(s) {
      return (s || '').replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;');
    }

    function updateBadge(status) {
      if (status === 'running') {
        badge.className = 'status-pill status-running';
        badge.innerHTML = '<span class="status-dot"></span>Running<span class="status-dot"></span>';
      } else if (status === 'done') {
        badge.className = 'status-pill status-done';
        badge.textContent = 'done';
      } else if (status === 'failed') {
        badge.className = 'status-pill status-failed';
        badge.textContent = 'failed';
      } else if (status === 'stopped') {
        badge.className = 'status-pill status-stopped';
        badge.textContent = 'stopped';
      } else {
        badge.className = 'sev-badge sev-low';
        badge.textContent = status;
      }
      // The Stop pill sits in the same .status-row as the badge — show it
      // only while the scan is actively running.
      const stopBtn = document.getElementById('scan-stop-btn');
      if (stopBtn) {
        stopBtn.hidden = (status !== 'running' && status !== 'pending');
      }
    }

    function renderFinishedActions(data) {
      if (data.status === 'done') {
        const appHref = appName ? ('/?app=' + encodeURIComponent(appName)) : '/';
        const appLabel = appName ? ('View findings for ' + escapeHtml(appName)) : 'View findings';
        actionBar.innerHTML =
          '<h2>Done</h2>' +
          '<a href="' + appHref + '" class="btn btn-primary">' + appLabel + '</a> ' +
          (appName ? '<a href="/" class="btn btn-secondary">All findings</a> ' : '') +
          '<a href="/scan" class="btn btn-secondary">Run another scan</a>';
      } else if (data.status === 'stopped') {
        const appHref = appName ? ('/?app=' + encodeURIComponent(appName)) : '/';
        const appLabel = appName ? ('View findings for ' + escapeHtml(appName)) : 'View findings';
        actionBar.innerHTML =
          '<h2>Stopped</h2>' +
          '<p>Scan was cancelled by the operator. Partial findings (if any) are in the store.</p>' +
          '<a href="' + appHref + '" class="btn btn-primary">' + appLabel + '</a> ' +
          '<a href="/scan" class="btn btn-secondary">Run another scan</a>';
      } else if (data.status === 'failed') {
        actionBar.innerHTML =
          '<h2>Failed</h2>' +
          '<p>Exit code ' + (data.exit_code ?? '?') + '. Inspect the log above; common causes: missing tool on PATH, manifest validation error, adapter crash.</p>' +
          '<a href="/scan" class="btn btn-secondary">Try again</a>';
      }
      actionBar.hidden = false;
    }

    async function tick() {
      try {
        const resp = await fetch('/api/scan/' + encodeURIComponent(scanId), {cache: 'no-store'});
        if (!resp.ok) throw new Error('HTTP ' + resp.status);
        const data = await resp.json();
        consecutiveErrors = 0;

        // Status transition
        updateBadge(data.status);

        // Log — only repaint if changed (avoids losing selection/scroll)
        if (data.log_tail !== lastLog) {
          const atBottom = (logEl.scrollTop + logEl.clientHeight) >= (logEl.scrollHeight - 8);
          logEl.textContent = data.log_tail;
          lastLog = data.log_tail;
          if (atBottom) logEl.scrollTop = logEl.scrollHeight;
        }

        // Findings delta — show only when both numbers are present
        if (data.findings_after !== null && data.findings_after !== undefined) {
          const delta = (data.findings_after - (data.findings_before || 0));
          findingsMeta.innerHTML = '<strong>findings:</strong> ' +
            escapeHtml(String(data.findings_before)) + ' → ' +
            escapeHtml(String(data.findings_after)) +
            ' (Δ ' + (delta >= 0 ? '+' : '') + delta + ')';
        }

        if (data.status === 'done' || data.status === 'failed' || data.status === 'stopped') {
          if (beam) beam.hidden = true;
          renderFinishedActions(data);
          return;  // stop polling — no setTimeout
        }
      } catch (e) {
        consecutiveErrors += 1;
        if (consecutiveErrors >= 5) return;  // give up after ~20s of errors
      }
      timer = setTimeout(tick, POLL_MS);
    }

    // Stop polling when the tab is hidden; resume on visibility.
    document.addEventListener('visibilitychange', () => {
      if (document.hidden && timer) { clearTimeout(timer); timer = null; }
      else if (!document.hidden && !timer) { tick(); }
    });

    // ---- Stop scan button ----
    const stopBtn = document.getElementById('scan-stop-btn');
    const stopStatus = document.getElementById('scan-stop-status');
    if (stopBtn) {
      stopBtn.addEventListener('click', async () => {
        if (!confirm('Stop this scan?\n\nSends SIGTERM (then SIGKILL after 2s) to the scan process and its children. Partial findings written so far stay in the store.')) return;
        stopBtn.disabled = true;
        if (stopStatus) stopStatus.textContent = 'sending stop signal…';
        try {
          const resp = await fetch('/scan/' + encodeURIComponent(scanId) + '/stop', {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
          });
          const data = await resp.json();
          if (!resp.ok) {
            if (stopStatus) stopStatus.textContent = 'stop failed: ' + (data.error || ('HTTP ' + resp.status));
            stopBtn.disabled = false;
            return;
          }
          // Immediate UI update; the next poll tick will confirm.
          if (stopStatus) stopStatus.textContent = 'stopped via ' + (data.killed_via || 'signal');
          updateBadge('stopped');
          if (beam) beam.hidden = true;
          renderFinishedActions({status: 'stopped'});
          if (timer) { clearTimeout(timer); timer = null; }
        } catch (e) {
          if (stopStatus) stopStatus.textContent = 'stop request errored: ' + e;
          stopBtn.disabled = false;
        }
      });
    }

    timer = setTimeout(tick, POLL_MS);
  })();
  </script>
{% endblock %}