daveadmin
7c4b161f04
- korrespond-about.php: marketing/hype page with hero image, features, 3-step pipeline, screenshot gallery, dbn-legal-agent LLM spotlight, authority coverage grid, and CTA strip - korrespond-guide.php: step-by-step user guide covering mode selection, recipient body presets, output types, tone, all form fields, clarify gate, output columns, and Refine pass - korrespond-tech.php: technical showcase — Hard-RAG pipeline diagram, corpus stats, CITE:N verification system, fine-tuned model details, formal citation style guide, privacy section - 5 UI screenshots + 3 AI-generated hero images in assets/images/korrespond/ - korrespond.php: add "About · User guide · How it works" inline links - preview.php: add korrespond to localizedContent (en+no) and samples; render doc-page links in preview CTA section for korrespond slug - tools.css: +600 lines .kdoc-* CSS (hero, features, pipeline, guide steps, tech diagrams, finetune block, privacy block, stat cards) Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
182 lines
13 KiB
PHP
182 lines
13 KiB
PHP
<?php
|
||
declare(strict_types=1);
|
||
$toolName = 'korrespond';
|
||
$toolTitle = 'Korrespond';
|
||
$toolKind = 'Draft & reply to Norwegian authorities';
|
||
$toolBadge = 'Hard-RAG · Norsk + EN/PL/UK';
|
||
$extraScripts = ['assets/js/korrespond.js'];
|
||
require_once __DIR__ . '/includes/layout.php';
|
||
?>
|
||
<form id="korrForm" class="tool-form deep-research" enctype="multipart/form-data">
|
||
|
||
<div class="lang-switcher" id="korrLangSwitcher" role="group" aria-label="UI language">
|
||
<button type="button" class="lang-btn is-active" data-lang="en">🇬🇧 EN</button>
|
||
<button type="button" class="lang-btn" data-lang="no">🇳🇴 NO</button>
|
||
<button type="button" class="lang-btn" data-lang="uk">🇺🇦 UK</button>
|
||
<button type="button" class="lang-btn" data-lang="pl">🇵🇱 PL</button>
|
||
</div>
|
||
|
||
<div class="korr-doc-links">
|
||
<a href="/korrespond-about.php" target="_blank">About this tool</a>
|
||
<span aria-hidden="true">·</span>
|
||
<a href="/korrespond-guide.php" target="_blank">User guide</a>
|
||
<span aria-hidden="true">·</span>
|
||
<a href="/korrespond-tech.php" target="_blank">How it works</a>
|
||
</div>
|
||
|
||
<!-- Mode toggle -->
|
||
<div class="control-row" id="korrModeControl">
|
||
<span class="control-label">Mode</span>
|
||
<label><input type="radio" name="korrMode" value="reply"> <strong>Reply</strong> <small class="control-hint">to a letter / decision / notice you received</small></label>
|
||
<label><input type="radio" name="korrMode" value="initiate" checked> <strong>Initiate</strong> <small class="control-hint">start a new correspondence</small></label>
|
||
</div>
|
||
|
||
<!-- Recipient body -->
|
||
<div class="adv-role-row">
|
||
<label class="control-label" for="korrBody">Recipient body</label>
|
||
<select id="korrBody" class="adv-role-select" required>
|
||
<option value="">— Velg mottaker —</option>
|
||
<option value="barnehage">Barnehage</option>
|
||
<option value="school_1_10">Skole (1.–10. trinn)</option>
|
||
<option value="sfo">SFO</option>
|
||
<option value="nav">NAV</option>
|
||
<option value="bufdir">Bufdir (adopsjon, surrogati)</option>
|
||
<option value="barnevernet">Barnevernet</option>
|
||
<option value="kommune_other">Kommunen (annet)</option>
|
||
<option value="statsforvalter">Statsforvalteren</option>
|
||
<option value="trygderetten">Trygderetten</option>
|
||
<option value="tingrett">Tingretten</option>
|
||
<option value="other">Annet</option>
|
||
</select>
|
||
<p class="upload-hint">Each recipient preset pulls the relevant statute set into the hard-RAG retrieval (fvl, barnevernsloven, NAV-loven, opplæringslova, barnehageloven, EMK).</p>
|
||
</div>
|
||
|
||
<!-- Output type -->
|
||
<div class="control-row" id="korrOutputControl">
|
||
<span class="control-label">Output type</span>
|
||
<label><input type="radio" name="korrOutput" value="email" checked> Email</label>
|
||
<label><input type="radio" name="korrOutput" value="formal"> Formal letter</label>
|
||
<label><input type="radio" name="korrOutput" value="filing"> Court/tribunal filing</label>
|
||
<label><input type="radio" name="korrOutput" value="call_prep"> Phone-call prep</label>
|
||
</div>
|
||
|
||
<!-- Tone -->
|
||
<div class="control-row" id="korrToneControl">
|
||
<span class="control-label">Tone</span>
|
||
<label><input type="radio" name="korrTone" value="cooperative"> Cooperative</label>
|
||
<label><input type="radio" name="korrTone" value="neutral" checked> Neutral-professional ★</label>
|
||
<label><input type="radio" name="korrTone" value="firm"> Firm</label>
|
||
<label><input type="radio" name="korrTone" value="adversarial"> Adversarial</label>
|
||
<label><input type="radio" name="korrTone" value="warm"> Conciliatory-warm</label>
|
||
</div>
|
||
|
||
<!-- Case context fields -->
|
||
<div class="dr-control-grid">
|
||
<div class="dr-control-card">
|
||
<label for="korrCaseRef">Case reference (saksnummer)</label>
|
||
<input type="text" id="korrCaseRef" maxlength="120" placeholder="e.g. 2026/12345">
|
||
</div>
|
||
<div class="dr-control-card">
|
||
<label for="korrWhere">Where (kommune / fylke)</label>
|
||
<input type="text" id="korrWhere" maxlength="200" placeholder="e.g. Trondheim kommune">
|
||
</div>
|
||
<div class="dr-control-card">
|
||
<label for="korrDeadline">Next deadline</label>
|
||
<input type="text" id="korrDeadline" maxlength="60" placeholder="YYYY-MM-DD or '3 weeks'">
|
||
</div>
|
||
</div>
|
||
|
||
<label class="input-label" for="korrParties">Who is involved? <span class="optional-hint">(names + roles)</span></label>
|
||
<textarea id="korrParties" rows="2" maxlength="2000" placeholder="e.g. Me (parent), caseworker Anna Hansen, child Ola (age 5). Use the Redact tool first if you'll share externally."></textarea>
|
||
|
||
<label class="input-label" for="korrNarrative">What happened / context <span class="required-hint">(required for initiate mode)</span></label>
|
||
<textarea id="korrNarrative" rows="6" maxlength="8000" placeholder="Describe the situation: what happened, when, who decided what, what you want."></textarea>
|
||
|
||
<label class="input-label" for="korrGoal">Goal of this letter <span class="optional-hint">(or pick a chip)</span></label>
|
||
<input type="text" id="korrGoal" maxlength="600" placeholder="e.g. request access to all case documents under forvaltningsloven §18">
|
||
<div class="korr-goal-chips" id="korrGoalChips" role="group" aria-label="Common goals">
|
||
<button type="button" class="korr-chip" data-goal="Request access to case documents (forvaltningsloven §18)">Access to docs (fvl §18)</button>
|
||
<button type="button" class="korr-chip" data-goal="Appeal the decision (forvaltningsloven §28)">Appeal (fvl §28)</button>
|
||
<button type="button" class="korr-chip" data-goal="Request a meeting">Request meeting</button>
|
||
<button type="button" class="korr-chip" data-goal="Request reasoned written decision (forvaltningsloven §24-25)">Reasoned decision (fvl §24-25)</button>
|
||
<button type="button" class="korr-chip" data-goal="Invoke right to be heard (forvaltningsloven §17)">Right to be heard (fvl §17)</button>
|
||
<button type="button" class="korr-chip" data-goal="Complaint about caseworker conduct">Complaint</button>
|
||
<button type="button" class="korr-chip" data-goal="Clarify status / timeline of the case">Clarify timeline</button>
|
||
</div>
|
||
|
||
<!-- File upload (required for Reply mode) -->
|
||
<div class="upload-zone" id="korrUploadZone" role="region" aria-label="File upload">
|
||
<input type="file" id="korrUploadInput" multiple accept=".pdf,.docx,.txt" aria-label="Choose received letter or attachments">
|
||
<div id="korrUploadPrompt" class="upload-prompt">
|
||
<span class="upload-icon" aria-hidden="true">⇧</span>
|
||
<p>Upload the received letter (reply mode) or supporting attachments, or <label for="korrUploadInput" class="upload-browse">browse</label></p>
|
||
<p class="upload-hint"><strong>PDF</strong>, <strong>DOCX</strong>, <strong>TXT</strong> — up to 4 files, max 8 MB each — processed in memory.</p>
|
||
</div>
|
||
<div id="korrUploadFileInfo" class="upload-file is-hidden">
|
||
<ul id="korrUploadFileList" class="upload-file-list"></ul>
|
||
<button type="button" id="korrUploadClear" class="upload-clear">× Clear</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="form-footer">
|
||
<p id="korrStatus" class="form-status" role="status" aria-live="polite"></p>
|
||
<button id="korrRunButton" type="submit">Draft</button>
|
||
</div>
|
||
</form>
|
||
|
||
<!-- Clarify panel (shown if Pass 1 returns missing_facts) -->
|
||
<section id="korrClarifyPanel" class="korr-clarify-panel is-hidden" aria-labelledby="korrClarifyTitle">
|
||
<h3 id="korrClarifyTitle" data-i18n="clarify_title">Before we draft, clarify:</h3>
|
||
<p class="upload-hint" data-i18n="clarify_hint">Answer what you can, then click Continue draft. Or click Draft anyway to proceed with what we have.</p>
|
||
<div id="korrClarifyList" class="korr-clarify-list"></div>
|
||
<div class="korr-clarify-actions">
|
||
<button type="button" id="korrClarifyContinue" class="primary-button" data-i18n="clarify_continue">Continue draft</button>
|
||
<button type="button" id="korrClarifyForce" class="secondary-button" data-i18n="clarify_force">Draft anyway</button>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="korrResults" class="results deep-research-results" aria-live="polite">
|
||
<div class="empty-state">
|
||
<h3 data-i18n="ready_title">Ready</h3>
|
||
<p data-i18n="ready_desc">Pick a recipient body, describe the situation, choose an output type and tone, then run. Drafts always come back in Norwegian bokmål + your working language, side-by-side, with verified law citations.</p>
|
||
</div>
|
||
</section>
|
||
|
||
<!-- Hidden stubs so tools.js element refs don't crash on this page -->
|
||
<div class="is-hidden" id="languageControl" aria-hidden="true">
|
||
<input type="radio" name="language" value="en" checked>
|
||
<input type="radio" name="language" value="no">
|
||
<input type="radio" name="language" value="uk">
|
||
<input type="radio" name="language" value="pl">
|
||
</div>
|
||
<div class="is-hidden" id="redactionControl" aria-hidden="true"></div>
|
||
<div class="is-hidden" id="audioZone" aria-hidden="true">
|
||
<input type="file" id="audioInput" style="display:none">
|
||
<div id="audioPrompt"></div>
|
||
<div id="audioFileInfo"><ol id="audioQueueList"></ol><button type="button" id="audioClear"></button></div>
|
||
</div>
|
||
<div class="is-hidden" id="diarizeControl" aria-hidden="true">
|
||
<input type="checkbox" id="diarizeCheck">
|
||
<input type="number" id="numSpeakersInput">
|
||
</div>
|
||
<div class="is-hidden" id="transcribeLangControl" aria-hidden="true"><input type="radio" name="transcribeLang" value="no" checked></div>
|
||
<div class="is-hidden" id="vocabControl" aria-hidden="true">
|
||
<div id="vocabPresets"></div>
|
||
<textarea id="initPromptInput"></textarea>
|
||
</div>
|
||
<div class="is-hidden" id="aliasSection" aria-hidden="true">
|
||
<button type="button" id="addAliasRow"></button>
|
||
<div id="aliasRows"></div>
|
||
</div>
|
||
<div class="is-hidden" id="exemptSection" aria-hidden="true">
|
||
<button type="button" id="addExemptRow"></button>
|
||
<div id="exemptRows"></div>
|
||
</div>
|
||
<div class="is-hidden" id="uploadZone" aria-hidden="true">
|
||
<input type="file" id="uploadInput">
|
||
<div id="uploadPrompt"></div>
|
||
<div id="uploadFileInfo"><ul id="uploadFileList"></ul><button type="button" id="uploadClear"></button></div>
|
||
</div>
|
||
<textarea class="is-hidden" id="toolInput" aria-hidden="true"></textarea>
|
||
<?php require_once __DIR__ . '/includes/layout_footer.php'; ?>
|