Jun 30 - Update analysis content layout
This commit is contained in:
+105
-40
@@ -328,16 +328,6 @@ var _rawText = ''; // kept for copy/save
|
||||
|
||||
function showResult(data) {
|
||||
_rawText = data.summary || '';
|
||||
var fileList = (data.file_names || '').split(', ').map(function(f) {
|
||||
return ' - ' + f;
|
||||
}).join('\n');
|
||||
var criteriaNote = data.criteria_count > 0
|
||||
? 'Criteria evaluated: ' + data.criteria_count
|
||||
: 'No evaluation criteria configured.';
|
||||
var header = 'AI Extraction | Model: ' + (data.model || '')
|
||||
+ '\nFiles analyzed (' + (data.file_count || 1) + '):\n' + fileList
|
||||
+ '\n' + criteriaNote
|
||||
+ '\n' + '='.repeat(60);
|
||||
|
||||
// Verdict banner
|
||||
var banner = document.getElementById('verdict-banner');
|
||||
@@ -349,10 +339,25 @@ function showResult(data) {
|
||||
banner.innerHTML = '';
|
||||
}
|
||||
|
||||
// Render output: header as plain preformatted, then markdown body
|
||||
document.getElementById('ai-output').innerHTML =
|
||||
'<pre class="ai-header-block">' + escHtml(header) + '</pre>'
|
||||
+ '<div class="ai-rendered-output">' + renderAI(_rawText) + '</div>';
|
||||
// Meta pill bar (replaces old <pre> header block)
|
||||
var files = (data.file_names || '').split(', ').filter(Boolean);
|
||||
var metaHtml = '<div class="ai-meta-bar">'
|
||||
+ '<span class="ai-meta-pill">' + escHtml(data.model || 'AI') + '</span>'
|
||||
+ '<span class="ai-meta-pill">📄 ' + files.length + ' file' + (files.length !== 1 ? 's' : '')
|
||||
+ (files.length <= 3 ? ': ' + files.map(escHtml).join(', ') : '') + '</span>'
|
||||
+ (data.criteria_count > 0 ? '<span class="ai-meta-pill ai-meta-pill-green">✓ ' + data.criteria_count + ' criteria evaluated</span>' : '')
|
||||
+ (data.truncated ? '<span class="ai-meta-pill ai-meta-pill-warn">⚠ Document truncated to first ~14 000 chars</span>' : '')
|
||||
+ '</div>';
|
||||
|
||||
// Render markdown, then colorize evaluation keywords
|
||||
var rendered = document.createElement('div');
|
||||
rendered.className = 'ai-rendered-output';
|
||||
rendered.innerHTML = renderAI(_rawText);
|
||||
colorizeEval(rendered);
|
||||
|
||||
var outputEl = document.getElementById('ai-output');
|
||||
outputEl.innerHTML = metaHtml;
|
||||
outputEl.appendChild(rendered);
|
||||
|
||||
// Show action buttons
|
||||
document.getElementById('btn-copy').style.display = '';
|
||||
@@ -612,8 +617,9 @@ document.querySelectorAll('.history-row').forEach(function(row) {
|
||||
} catch(e) { /* ignore malformed snapshot */ }
|
||||
}
|
||||
|
||||
document.getElementById('hist-body').innerHTML =
|
||||
renderAI(d.summary_text || '');
|
||||
var histBody = document.getElementById('hist-body');
|
||||
histBody.innerHTML = renderAI(d.summary_text || '');
|
||||
colorizeEval(histBody);
|
||||
if (IS_ADMIN) {
|
||||
document.getElementById('btn-delete-analysis').style.display = '';
|
||||
}
|
||||
@@ -665,6 +671,25 @@ function escHtml(str) {
|
||||
});
|
||||
}
|
||||
|
||||
function colorizeEval(container) {
|
||||
container.querySelectorAll('li, td, p').forEach(function(el) {
|
||||
if (el.querySelector('ul,ol,table,div')) return; // skip block containers
|
||||
var h = el.innerHTML;
|
||||
// Null-byte placeholders prevent cascading replacements
|
||||
h = h.replace(/DOES NOT MEET/g, '\x00NM\x00');
|
||||
h = h.replace(/PARTIALLY MEETS/g, '\x00PM\x00');
|
||||
h = h.replace(/\bMEETS\b/g, '\x00M\x00');
|
||||
h = h.replace(/CANNOT DETERMINE/g,'\x00CD\x00');
|
||||
h = h.replace(/\x00NM\x00/g, '<span class="eval-badge eval-not-meet">DOES NOT MEET</span>');
|
||||
h = h.replace(/\x00PM\x00/g, '<span class="eval-badge eval-partial">PARTIALLY MEETS</span>');
|
||||
h = h.replace(/\x00M\x00/g, '<span class="eval-badge eval-meets">MEETS</span>');
|
||||
h = h.replace(/\x00CD\x00/g, '<span class="eval-badge eval-unclear">CANNOT DETERMINE</span>');
|
||||
h = h.replace(/Not specified in the document\./g,
|
||||
'<span class="eval-missing">Not specified in the document.</span>');
|
||||
el.innerHTML = h;
|
||||
});
|
||||
}
|
||||
|
||||
/* ─── Chat ──────────────────────────────────────────────────── */
|
||||
var _chatAnalysisId = null;
|
||||
var _chatMessages = [];
|
||||
@@ -776,45 +801,85 @@ document.getElementById('chat-input').addEventListener('keydown', function(e) {
|
||||
.ai-placeholder{
|
||||
padding:2rem 1.5rem;color:var(--text-muted);
|
||||
}
|
||||
.ai-header-block{
|
||||
background:var(--bg-subtle);border-bottom:1px solid var(--border);
|
||||
padding:.85rem 1.4rem;font-family:'DM Mono',monospace;font-size:.78rem;
|
||||
color:var(--text-secondary);margin:0;white-space:pre-wrap;line-height:1.6;
|
||||
}
|
||||
|
||||
/* ── Meta pill bar ─────────────────────────────────────────── */
|
||||
.ai-meta-bar{
|
||||
padding:.6rem 1.5rem;font-size:.78rem;font-family:'DM Mono',monospace;
|
||||
color:var(--text-muted);background:var(--bg-subtle);
|
||||
display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;
|
||||
padding:.7rem 1.4rem;background:var(--bg-subtle);
|
||||
border-bottom:1px solid var(--border);
|
||||
}
|
||||
.ai-meta-pill{
|
||||
display:inline-flex;align-items:center;
|
||||
font-size:.72rem;font-family:'DM Mono',monospace;
|
||||
background:var(--bg-card,#fff);color:var(--text-secondary);
|
||||
border:1px solid var(--border);border-radius:999px;
|
||||
padding:.18rem .65rem;white-space:nowrap;
|
||||
}
|
||||
.ai-meta-pill-green{border-color:#86efac;color:#15803d;background:#f0fdf4}
|
||||
.ai-meta-pill-warn{border-color:#fcd34d;color:#92400e;background:#fffbeb}
|
||||
|
||||
/* ── Rendered markdown output ──────────────────────────────── */
|
||||
.ai-rendered-output{
|
||||
padding:1.1rem 1.4rem 1.5rem;
|
||||
font-size:.9rem;line-height:1.8;color:var(--text-secondary);
|
||||
padding:1.4rem 1.75rem 2rem;
|
||||
font-size:.9rem;line-height:1.85;color:var(--text);
|
||||
}
|
||||
.ai-rendered-output h1,.ai-rendered-output h2{
|
||||
font-size:1rem;font-weight:700;color:var(--text);
|
||||
margin:1.4rem 0 .5rem;padding-bottom:.3rem;
|
||||
.ai-rendered-output h1{
|
||||
font-size:1.05rem;font-weight:800;color:var(--text);
|
||||
margin:1.8rem 0 .6rem;padding-bottom:.4rem;
|
||||
border-bottom:2px solid var(--accent);
|
||||
}
|
||||
.ai-rendered-output h2{
|
||||
font-size:.97rem;font-weight:700;color:var(--text);
|
||||
margin:1.5rem 0 .5rem;padding-bottom:.3rem;
|
||||
border-bottom:1px solid var(--border);
|
||||
}
|
||||
.ai-rendered-output h3,.ai-rendered-output h4{
|
||||
font-size:.9rem;font-weight:700;color:var(--text);margin:1rem 0 .35rem;
|
||||
.ai-rendered-output h3{
|
||||
font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
|
||||
color:var(--text-secondary);margin:1.25rem 0 .35rem;
|
||||
}
|
||||
.ai-rendered-output p{margin:.35rem 0}
|
||||
.ai-rendered-output h4{font-size:.9rem;font-weight:700;color:var(--text);margin:.9rem 0 .25rem}
|
||||
.ai-rendered-output p{margin:.4rem 0}
|
||||
.ai-rendered-output strong{color:var(--text);font-weight:700}
|
||||
.ai-rendered-output ul,.ai-rendered-output ol{
|
||||
padding-left:1.4rem;margin:.35rem 0;
|
||||
}
|
||||
.ai-rendered-output li{margin:.2rem 0}
|
||||
.ai-rendered-output hr{
|
||||
border:none;border-top:2px solid var(--border);margin:1.25rem 0;
|
||||
}
|
||||
.ai-rendered-output em{font-style:italic;color:var(--text-secondary)}
|
||||
.ai-rendered-output ul,.ai-rendered-output ol{padding-left:1.5rem;margin:.45rem 0 .65rem}
|
||||
.ai-rendered-output li{margin:.3rem 0;line-height:1.75}
|
||||
.ai-rendered-output hr{border:none;border-top:2px solid var(--border);margin:1.75rem 0}
|
||||
.ai-rendered-output pre,.ai-rendered-output code{
|
||||
font-family:'DM Mono',monospace;font-size:.82rem;
|
||||
background:var(--bg-subtle);border-radius:var(--r-sm);
|
||||
}
|
||||
.ai-rendered-output pre{padding:.75rem 1rem;overflow-x:auto}
|
||||
.ai-rendered-output code{padding:.1rem .3rem}
|
||||
.ai-rendered-output pre{padding:.75rem 1rem;overflow-x:auto;border:1px solid var(--border)}
|
||||
.ai-rendered-output code{padding:.15rem .35rem;border:1px solid var(--border)}
|
||||
|
||||
/* Tables ── */
|
||||
.ai-rendered-output table{
|
||||
width:100%;border-collapse:collapse;font-size:.845rem;
|
||||
margin:.75rem 0 1.25rem;border:1px solid var(--border);
|
||||
border-radius:var(--r-sm);overflow:hidden;display:table;
|
||||
}
|
||||
.ai-rendered-output th{
|
||||
background:var(--bg-subtle);color:var(--text);font-weight:700;
|
||||
padding:.5rem .9rem;border-bottom:2px solid var(--border);text-align:left;
|
||||
font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;
|
||||
}
|
||||
.ai-rendered-output td{
|
||||
padding:.45rem .9rem;border-bottom:1px solid var(--border);
|
||||
vertical-align:top;color:var(--text-secondary);
|
||||
}
|
||||
.ai-rendered-output tr:last-child td{border-bottom:none}
|
||||
.ai-rendered-output tbody tr:hover td{background:var(--bg-subtle)}
|
||||
.ai-rendered-output td:first-child{font-weight:600;color:var(--text);width:38%;white-space:nowrap}
|
||||
|
||||
/* Evaluation badges ── */
|
||||
.eval-badge{
|
||||
display:inline-block;font-size:.72rem;font-weight:700;
|
||||
padding:.1rem .5rem;border-radius:999px;border:1px solid;letter-spacing:.02em;
|
||||
}
|
||||
.eval-meets{background:#f0fdf4;color:#15803d;border-color:#86efac}
|
||||
.eval-not-meet{background:#fef2f2;color:#dc2626;border-color:#fca5a5}
|
||||
.eval-partial{background:#fffbeb;color:#92400e;border-color:#fcd34d}
|
||||
.eval-unclear{background:var(--bg-subtle);color:var(--text-secondary);border-color:var(--border)}
|
||||
.eval-missing{color:var(--text-muted);font-style:italic}
|
||||
|
||||
/* ── Criteria list ─────────────────────────────────────────── */
|
||||
.criteria-list{display:flex;flex-direction:column}
|
||||
|
||||
Reference in New Issue
Block a user