<h1>
  Deployment #<%= dep.id %> · <a href="/projects/<%= dep.app %>"><%= dep.app %></a>
  <span id="dep-chip" class="chip <%= dep.status %>"><%= h.depLabel(dep.status) %></span>
</h1>

<div class="muted" style="margin-bottom:14px">
  source: <%= dep.source %>
  · commit: <span class="mono"><%= h.shortSha(dep.commit_sha) %></span>
  · started: <%= h.fmtTime(dep.started_at) %>
  · duration: <%= h.duration(dep.started_at, dep.finished_at) %>
  <% if (dep.release_dir) { %> · release: <span class="mono"><%= dep.release_dir %></span><% } %>
</div>

<% if (typeof msg !== 'undefined' && msg) { %><div class="flash"><%= msg %></div><% } %>
<% if (typeof err !== 'undefined' && err) { %><div class="flash err"><%= err %></div><% } %>

<% if (typeof fix !== 'undefined' && fix) { %>
<div class="card" style="border-color: rgba(210,153,34,.6)">
  <h2>💡 <%= fix.title %></h2>
  <p style="margin:6px 0 12px"><%= fix.detail %></p>
  <form class="inline" method="post" action="/deployments/<%= dep.id %>/fix">
    <button class="btn primary" type="submit">Apply fix &amp; retry build</button>
  </form>
</div>
<% } %>

<div id="live-note" class="muted" style="margin-bottom:10px"><%= live ? 'Streaming live log…' : '' %></div>

<pre class="log" id="log"><%= content %></pre>

<% if (live) { %>
<script>
(function () {
  var pre = document.getElementById('log');
  var chip = document.getElementById('dep-chip');
  var note = document.getElementById('live-note');
  var autoscroll = true;

  pre.addEventListener('scroll', function () {
    autoscroll = pre.scrollTop + pre.clientHeight >= pre.scrollHeight - 40;
  });

  var es = new EventSource('/deployments/<%= dep.id %>/log/stream');

  es.onmessage = function (e) {
    pre.textContent += e.data + '\n';
    if (autoscroll) pre.scrollTop = pre.scrollHeight;
  };

  es.addEventListener('done', function (e) {
    var status = e.data || 'finished';
    chip.className = 'chip ' + status;
    chip.textContent = status === 'live' ? '\u25CF Ready' : status;
    note.textContent = 'Deployment finished: ' + (status === 'live' ? 'Ready' : status);
    es.close();
    setTimeout(function () { location.reload(); }, 1500);
  });

  es.onerror = function () {
    note.textContent = 'Log stream interrupted — reload the page to reconnect.';
  };
})();
</script>
<% } %>
