@extends('layouts.app')
@section('title', 'Duplikate entfernen – Doppelte Zeilen löschen | kotsch.tech')
@section('meta_description', 'Doppelte Zeilen aus Listen entfernen: Groß/Kleinschreibung ignorieren, Leerzeichen trimmen, Duplikate anzeigen oder behalten. Kostenlos im Browser.')
@section('meta_extra')
<meta name="keywords" content="Duplikate entfernen, doppelte Zeilen löschen, Liste bereinigen, unique Zeilen, Duplikate finden">
@endsection
@section('content')
@include('tools._tool_base')
<style>
.dup-chip { display:inline-block; padding:2px 8px; border-radius:999px; font-size:0.75rem; font-weight:700; }
.dup-chip.removed { background:#fee2e2; color:#991b1b; }
.dup-chip.kept { background:#dcfce7; color:#166534; }
.dup-highlight { background:#fef3c7; }
</style>

<div class="tool-page">
<div class="tool-container">
    <div class="tool-header">
        <span class="t-tag"><i class="fas fa-clone"></i> Text</span>
        <h1 class="tool-h1">Duplikate<span> entfernen.</span></h1>
        <p class="tool-sub">Doppelte Zeilen finden, markieren und bereinigen – mit Vorschau und Statistik.</p>
    </div>

    <div class="t-panel">
        <div class="t-grid-2" style="gap:16px">
            <div class="t-field">
                <label class="t-label">Eingabe</label>
                <div class="t-copy-wrap">
                    <textarea class="t-textarea" id="dup-inp" placeholder="Zeilen eingeben oder einfügen…" style="min-height:260px;font-family:'JetBrains Mono',monospace;font-size:0.85rem" oninput="analyze()"></textarea>
                    <button class="t-copy-btn" onclick="navigator.clipboard.readText().then(t=>{document.getElementById('dup-inp').value=t;analyze()})"><i class="fas fa-paste"></i></button>
                </div>
            </div>
            <div class="t-field">
                <label class="t-label">Bereinigter Text</label>
                <div class="t-copy-wrap">
                    <textarea class="t-textarea" id="dup-out" readonly style="min-height:260px;font-family:'JetBrains Mono',monospace;font-size:0.85rem"></textarea>
                    <button class="t-copy-btn" onclick="navigator.clipboard.writeText(document.getElementById('dup-out').value)"><i class="fas fa-copy"></i></button>
                </div>
            </div>
        </div>

        <div style="border-top:1px solid var(--line);padding-top:14px;margin-top:8px">
            <div class="t-toggle-row" style="border-bottom:1px solid var(--line)">
                <label for="dup-case">Groß-/Kleinschreibung ignorieren</label>
                <input type="checkbox" id="dup-case" class="t-check" checked onchange="analyze()">
            </div>
            <div class="t-toggle-row" style="border-bottom:1px solid var(--line)">
                <label for="dup-trim">Leerzeichen trimmen</label>
                <input type="checkbox" id="dup-trim" class="t-check" checked onchange="analyze()">
            </div>
            <div class="t-toggle-row" style="border-bottom:1px solid var(--line)">
                <label for="dup-empty">Leerzeilen entfernen</label>
                <input type="checkbox" id="dup-empty" class="t-check" checked onchange="analyze()">
            </div>
            <div class="t-toggle-row">
                <label for="dup-keep-last">Letztes Vorkommen behalten (statt erstes)</label>
                <input type="checkbox" id="dup-keep-last" class="t-check" onchange="analyze()">
            </div>
        </div>

        <div style="margin-top:14px">
            <div class="t-field">
                <label class="t-label">Ausgabe</label>
                <div style="display:flex;gap:6px;flex-wrap:wrap">
                    <button class="t-btn ghost sm" id="mode-unique" onclick="setOutputMode('unique',this)">Nur Eindeutige</button>
                    <button class="t-btn ghost sm" id="mode-dups" onclick="setOutputMode('dups',this)">Nur Duplikate</button>
                    <button class="t-btn ghost sm" id="mode-counted" onclick="setOutputMode('counted',this)">Mit Anzahl</button>
                </div>
            </div>
        </div>

        <div style="margin-top:10px;display:flex;gap:8px;flex-wrap:wrap">
            <button class="t-btn ghost sm" onclick="loadExample()"><i class="fas fa-file-alt"></i> Beispiel</button>
            <button class="t-btn ghost sm" onclick="clearAll()"><i class="fas fa-trash"></i> Leeren</button>
            <button class="t-btn ghost sm" onclick="downloadOut()"><i class="fas fa-download"></i> Herunterladen</button>
        </div>
    </div>

    <div class="t-panel">
        <div class="t-panel-title"><i class="fas fa-chart-bar"></i> Statistiken</div>
        <div class="t-grid-4" style="gap:10px">
            <div class="t-stat-card"><div class="t-stat-val" id="st-total">0</div><div class="t-stat-label">Zeilen gesamt</div></div>
            <div class="t-stat-card"><div class="t-stat-val" id="st-unique">0</div><div class="t-stat-label">Eindeutig</div></div>
            <div class="t-stat-card"><div class="t-stat-val" id="st-dup">0</div><div class="t-stat-label">Duplikate</div></div>
            <div class="t-stat-card"><div class="t-stat-val" id="st-pct">0%</div><div class="t-stat-label">Duplikatquote</div></div>
        </div>
    </div>

    <div class="t-panel" id="dup-detail-panel" style="display:none">
        <div class="t-panel-title"><i class="fas fa-search"></i> Duplikate im Detail</div>
        <div id="dup-detail" style="font-family:'JetBrains Mono',monospace;font-size:0.82rem"></div>
    </div>
</div>
@include('tools._ads_banner')
</div>

<script>
let outputMode = 'unique';

function setOutputMode(mode, btn) {
    outputMode = mode;
    document.querySelectorAll('[id^="mode-"]').forEach(b => b.style.background = '');
    btn.style.background = 'var(--accent-soft)';
    btn.style.borderColor = 'var(--accent)';
    btn.style.color = 'var(--accent)';
    analyze();
}

function getLines() {
    let lines = document.getElementById('dup-inp').value.split('\n');
    if (document.getElementById('dup-trim').checked) lines = lines.map(l => l.trim());
    if (document.getElementById('dup-empty').checked) lines = lines.filter(l => l.length > 0);
    return lines;
}

function analyze() {
    const lines = getLines();
    const icase = document.getElementById('dup-case').checked;
    const keepLast = document.getElementById('dup-keep-last').checked;
    const key = l => icase ? l.toLowerCase() : l;

    const counts = new Map();
    lines.forEach(l => { const k = key(l); counts.set(k, (counts.get(k)||0)+1); });

    const seen = new Set();
    let unique = [];
    const src = keepLast ? [...lines].reverse() : lines;
    src.forEach(l => { const k = key(l); if(!seen.has(k)){seen.add(k); unique.push(l);} });
    if (keepLast) unique.reverse();

    const dups = [...new Map([...counts].filter(([,v])=>v>1))];
    const dupLines = lines.filter(l => counts.get(key(l)) > 1);
    const uniqueDupLines = [...new Set(dupLines.map(key))].map(k => lines.find(l => key(l)===k));

    let result;
    if (outputMode === 'unique') result = unique;
    else if (outputMode === 'dups') result = uniqueDupLines;
    else result = unique.map(l => `(${counts.get(key(l))}) ${l}`);

    document.getElementById('dup-out').value = result.join('\n');

    const dupCount = lines.length - unique.length;
    document.getElementById('st-total').textContent = lines.length;
    document.getElementById('st-unique').textContent = unique.length;
    document.getElementById('st-dup').textContent = dupCount;
    document.getElementById('st-pct').textContent = lines.length ? Math.round(dupCount/lines.length*100)+'%' : '0%';

    if (dups.length) {
        document.getElementById('dup-detail-panel').style.display = '';
        document.getElementById('dup-detail').innerHTML = dups.map(([k,n]) => {
            const orig = lines.find(l => key(l)===k) || k;
            return `<div style="display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--line)">
                <span style="flex:1">${escH(orig)}</span>
                <span style="background:#fee2e2;color:#991b1b;padding:2px 8px;border-radius:999px;font-size:0.75rem;font-weight:700">${n}×</span>
            </div>`;
        }).join('');
    } else {
        document.getElementById('dup-detail-panel').style.display = 'none';
    }
}

function downloadOut() {
    const val = document.getElementById('dup-out').value;
    if (!val) return;
    const a = document.createElement('a');
    a.href = URL.createObjectURL(new Blob([val],{type:'text/plain;charset=utf-8'}));
    a.download = 'bereinigt.txt'; a.click(); URL.revokeObjectURL(a.href);
}

function clearAll() {
    document.getElementById('dup-inp').value = '';
    document.getElementById('dup-out').value = '';
    ['st-total','st-unique','st-dup'].forEach(id => document.getElementById(id).textContent = '0');
    document.getElementById('st-pct').textContent = '0%';
    document.getElementById('dup-detail-panel').style.display = 'none';
}

function loadExample() {
    document.getElementById('dup-inp').value = 'Berlin\nHamburg\nMünchen\nBerlin\nKöln\nFrankfurt\nHamburg\nStuttgart\nDüsseldorf\nBerlin\nMünchen\nLeipzig';
    analyze();
}

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

document.getElementById('mode-unique').style.background = 'var(--accent-soft)';
document.getElementById('mode-unique').style.borderColor = 'var(--accent)';
document.getElementById('mode-unique').style.color = 'var(--accent)';
loadExample();
</script>

@include('tools._seo_content', ['toolSlug' => 'duplikate-entfernen', 'toolName' => 'Duplikate entfernen'])

@endsection