Spaces:

MEO1
/

celiski-analizi

Running

App Files Files Community

MEO1 commited on Jun 28

Commit

3ce525b

verified ·

1 Parent(s): 108edd7

Update index.html

Browse files

Files changed (1) hide show

index.html +252 -77

index.html CHANGED Viewed

@@ -2,51 +2,141 @@
 <html lang="tr">
 <head>
     <meta charset="UTF-8">
-    <title>Transformers.js ile Çelişki Tespiti</title>
     <style>
         body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; margin: 2em; background-color: #f9fafb; color: #111827; }
-        .container { max-width: 800px; margin: 0 auto; background-color: white; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
         h1 { color: #374151; }
-        button { background-color: #3b82f6; color: white; border: none; padding: 10px 15px; border-radius: 5px; cursor: pointer; font-size: 16px; }
         button:hover { background-color: #2563eb; }
         #status { margin: 1em 0; padding: 1em; background-color: #eef2ff; border: 1px solid #c7d2fe; border-radius: 5px; display: none; }
         .result-item { border: 1px solid #e5e7eb; padding: 15px; margin-top: 15px; border-radius: 5px; }
         .result-item p { margin: 0.5em 0; }
         .similarity-score { font-weight: bold; color: #ef4444; }
     </style>
 </head>
 <body>
     <div class="container">
-        <h1>Metin Analizi ve Çelişki Tespiti</h1>
-        <p>Analiz etmek için bir metin (<code>.txt</code>) dosyası yükleyin. Tüm işlemler sizin tarayıcınızda, gizliliğiniz korunarak yapılır.</p>
-        <input type="file" id="file-input" accept=".txt">
-        <button id="analyze-button">Analiz Et</button>
         <div id="status"></div>
         <div id="results"></div>
     </div>
-    <script type="module">
-        import { pipeline, cos_sim } from 'https://cdn.jsdelivr.net/npm/@xenova/[email protected]';
         const fileInput = document.getElementById('file-input');
         const analyzeButton = document.getElementById('analyze-button');
         const statusDiv = document.getElementById('status');
         const resultsDiv = document.getElementById('results');
-        // Natural Language Inference (NLI) modeli - çelişki tespiti için daha uygun
-        statusDiv.style.display = 'block';
-        statusDiv.textContent = 'Yapay zeka modeli hazırlanıyor... Bu işlem ilk seferde biraz sürebilir.';
-        const classifier = await pipeline('text-classification', 'Xenova/nli-deberta-v3-small', {
-             progress_callback: (progress) => {
-                statusDiv.textContent = `Model indiriliyor... (${Math.round(progress.progress)}%)`;
-             }
-        });
-        statusDiv.textContent = 'Model hazır. Lütfen bir dosya seçip analiz edin.';
         analyzeButton.addEventListener('click', async () => {
             if (!fileInput.files || fileInput.files.length === 0) {
                 alert("Lütfen bir dosya seçin.");
                 return;
@@ -54,153 +144,238 @@
             const file = fileInput.files[0];
             const text = await file.text();
             statusDiv.style.display = 'block';
             statusDiv.textContent = 'Analiz başladı... Metin cümlelere ayrılıyor.';
             resultsDiv.innerHTML = '';
             try {
-                // Metni basit bir yöntemle cümlelere ayır. Daha gelişmiş bir kütüphane kullanılabilir.
                 let sentences = text.match(/[^.!?]+[.!?]+/g) || [];
                 if (sentences.length < 2) {
                     statusDiv.textContent = 'Analiz için en az 2 cümle bulunmalıdır.';
                     return;
                 }
-                // Çok kısa cümleleri filtrele (5 karakterden az)
-                sentences = sentences.filter(s => s.trim().length > 5);
-                // Çok fazla cümle varsa sınırla (performans için)
-                const maxSentences = 100;
                 if (sentences.length > maxSentences) {
                     sentences = sentences.slice(0, maxSentences);
-                    statusDiv.textContent = `Performans için analiz ${maxSentences} cümle ile sınırlandırıldı.`;
                     await new Promise(resolve => setTimeout(resolve, 2000));
                 }
-                statusDiv.textContent = `Toplam ${sentences.length} cümle bulundu. Çelişki analizi başlıyor...`;
                 const potentialContradictions = [];
-                // Her cümleyi diğerleriyle karşılaştır - NLI modeliyle
                 for (let i = 0; i < sentences.length; i++) {
                     for (let j = i + 1; j < sentences.length; j++) {
                         try {
-                            const sentence1 = sentences[i].trim();
-                            const sentence2 = sentences[j].trim();
-                            // Çok kısa cümleleri atla
-                            if (sentence1.length < 20 || sentence2.length < 20) continue;
                             // Çok benzer başlangıçları atla
-                            if (sentence1.substring(0, 10) === sentence2.substring(0, 10)) continue;
-                            statusDiv.textContent = `Çelişki analizi yapılıyor... (${i + 1}/${sentences.length}) - ${Math.round(((i * sentences.length + j) / (sentences.length * sentences.length)) * 100)}%`;
-                            // NLI modeli ile çelişki testi - doğru format
-                            const result = await classifier(`${sentence1} [SEP] ${sentence2}`);
-                            console.log(`Analiz: "${sentence1.substring(0, 30)}..." vs "${sentence2.substring(0, 30)}..."`, result);
-                            // Eğer 'CONTRADICTION' yüksek skorsa, çelişki var demektir
-                            const contradictionResult = result.find(r => r.label === 'CONTRADICTION' || r.label === 'contradiction');
-                            const contradictionScore = contradictionResult?.score || 0;
-                            if (contradictionScore > 0.5) { // %50'den yüksek çelişki skoru
                                 potentialContradictions.push({
                                     sentence1: sentence1,
                                     sentence2: sentence2,
-                                    similarity: 1 - contradictionScore, // Tersine çevir (düşük benzerlik = yüksek çelişki)
                                     contradictionScore: contradictionScore
                                 });
                                 console.log(`✓ Çelişki bulundu! Skor: ${(contradictionScore * 100).toFixed(1)}%`);
                             }
-                            // Kısa bekleme - her 3 karşılaştırmada bir
-                            if ((i * sentences.length + j) % 3 === 0) {
-                                await new Promise(resolve => setTimeout(resolve, 50));
                             }
                         } catch (error) {
                             console.warn(`Cümle ${i}-${j} analiz edilirken hata:`, error);
                             continue;
                         }
                     }
                 }
-                // Çok fazla çelişki varsa en güçlü olanları al
-                if (potentialContradictions.length > 15) {
                     potentialContradictions.sort((a, b) => b.contradictionScore - a.contradictionScore);
-                    const limitedContradictions = potentialContradictions.slice(0, 15);
-                    console.log(`${potentialContradictions.length} çelişki bulundu, en güçlü 15 tanesi gösteriliyor.`);
                     statusDiv.style.display = 'none';
-                    renderResults(limitedContradictions, [], potentialContradictions.length);
                 } else {
                     statusDiv.style.display = 'none';
-                    renderResults(potentialContradictions, []);
                 }
             } catch (error) {
                 statusDiv.textContent = `Analiz sırasında hata: ${error.message}`;
                 console.error('Detaylı hata:', error);
-                // Kullanıcıya yardımcı öneriler
-                if (error.message.includes('OrtRun') || error.message.includes('memory')) {
                     statusDiv.innerHTML = `
-                        <strong>Bellek hatası oluştu.</strong><br>
-                        Öneriler:<br>
-                        • Daha kısa bir metin deneyin<br>
-                        • Sayfayı yenileyin ve tekrar deneyin<br>
-                        • Diğer tarayıcı sekmelerini kapatın
                     `;
                 }
             }
         });
-        function renderResults(results, allSimilarities, totalFound) {
             if (results.length === 0) {
-                let message = '<p>Analiz tamamlandı. Belirlenen eşik değerinde potansiyel çelişki bulunamadı.</p>';
                 message += `<div style="background-color: #f3f4f6; padding: 15px; border-radius: 5px; margin-top: 15px;">
-                    <h4>NLI (Natural Language Inference) Modeli</h4>
-                    <p>Bu model özellikle çelişki tespiti için tasarlanmıştır.</p>
-                    <p>%50'den yüksek çelişki skoru aranan çelişkiler için eşik değeridir.</p>
                 </div>`;
                 resultsDiv.innerHTML = message;
                 return;
             }
-            let headerText = `<h3>${results.length} adet potansiyel çelişki bulundu:</h3>`;
             if (totalFound && totalFound > results.length) {
-                headerText = `<h3>Toplam ${totalFound} çelişki bulundu - En güçlü ${results.length} tanesi gösteriliyor:</h3>`;
             }
             resultsDiv.innerHTML = headerText;
-            // Sonuçları çelişki skoruna göre sırala (en yüksek en üstte)
             results.sort((a, b) => b.contradictionScore - a.contradictionScore);
             results.forEach((item, index) => {
                 const div = document.createElement('div');
                 div.className = 'result-item';
-                let severityColor = '#ef4444'; // kırmızı
                 let severityText = 'Yüksek';
-                if (item.contradictionScore > 0.8) {
-                    severityColor = '#dc2626'; // koyu kırmızı
                     severityText = 'Çok Yüksek';
-                }
-                if (item.contradictionScore < 0.7) {
-                    severityColor = '#f59e0b'; // turuncu
-                    severityText = 'Orta';
                 }
                 div.innerHTML = `
-                    <p><strong>Çelişki #${index + 1} - Çelişki Skoru: <span style="color: ${severityColor}; font-weight: bold;">${(item.contradictionScore * 100).toFixed(1)}%</span> (${severityText} Seviye)</strong></p>
-                    <p><em>İfade 1:</em> ${item.sentence1.trim()}</p>
-                    <p><em>İfade 2:</em> ${item.sentence2.trim()}</p>
                 `;
                 resultsDiv.appendChild(div);
             });
         }
     </script>
 </body>

 <html lang="tr">
 <head>
     <meta charset="UTF-8">
+    <title>Hugging Face API ile Çelişki Tespiti</title>
     <style>
         body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; margin: 2em; background-color: #f9fafb; color: #111827; }
+        .container { max-width: 900px; margin: 0 auto; background-color: white; padding: 2rem; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); }
         h1 { color: #374151; }
+        button { background-color: #3b82f6; color: white; border: none; padding: 10px 15px; border-radius: 5px; cursor: pointer; font-size: 16px; margin: 5px; }
         button:hover { background-color: #2563eb; }
+        button:disabled { background-color: #9ca3af; cursor: not-allowed; }
+        input[type="text"], input[type="password"] { width: 100%; padding: 10px; border: 1px solid #d1d5db; border-radius: 5px; font-size: 14px; margin: 5px 0; box-sizing: border-box; }
         #status { margin: 1em 0; padding: 1em; background-color: #eef2ff; border: 1px solid #c7d2fe; border-radius: 5px; display: none; }
         .result-item { border: 1px solid #e5e7eb; padding: 15px; margin-top: 15px; border-radius: 5px; }
         .result-item p { margin: 0.5em 0; }
         .similarity-score { font-weight: bold; color: #ef4444; }
+        .api-section { background-color: #f8fafc; padding: 20px; border-radius: 8px; margin-bottom: 20px; border: 2px solid #e2e8f0; }
+        .info-box { background-color: #dbeafe; padding: 15px; border-radius: 5px; margin: 10px 0; border-left: 4px solid #3b82f6; }
+        .model-select { margin: 10px 0; }
+        select { padding: 8px; border: 1px solid #d1d5db; border-radius: 5px; font-size: 14px; width: 100%; }
+        .progress-bar { background-color: #e5e7eb; height: 20px; border-radius: 10px; overflow: hidden; margin: 10px 0; }
+        .progress-bar-fill { background-color: #3b82f6; height: 100%; transition: width 0.3s ease; }
+        .warning-box { background-color: #fef3c7; padding: 15px; border-radius: 5px; margin: 10px 0; border-left: 4px solid #f59e0b; }
     </style>
 </head>
 <body>
     <div class="container">
+        <h1>🔍 Profesyonel Çelişki Tespiti</h1>
+        <p>Hugging Face API kullanarak güçlü dil modelleriyle çelişki analizi yapın.</p>
+        <div class="api-section">
+            <h3>🔑 API Yapılandırması</h3>
+            <div class="info-box">
+                <strong>Bilgi:</strong> Hugging Face API anahtarınızı <a href="https://huggingface.co/settings/tokens" target="_blank">buradan</a> alabilirsiniz.
+                Ücretsiz seviyede günde sınırlı sayıda istek atabilirsiniz.
+            </div>
+            <label for="api-key">Hugging Face API Anahtarı:</label>
+            <input type="password" id="api-key" placeholder="hf_xxxxxxxxxxxxxxxxxxxxxxxxx">
+            <div class="model-select">
+                <label for="model-select">Model Seçimi:</label>
+                <select id="model-select">
+                    <option value="facebook/bart-large-mnli" selected>Facebook BART-Large-MNLI (Çelişki Tespiti - Önerilen)</option>
+                    <option value="roberta-large-mnli">RoBERTa-Large-MNLI (Yüksek Performans)</option>
+                    <option value="microsoft/deberta-v3-large-mnli">DeBERTa-v3-Large-MNLI (En İyi)</option>
+                    <option value="MoritzLaurer/DeBERTa-v3-base-mnli-fever-anli">DeBERTa-v3-base-MNLI (Hızlı)</option>
+                </select>
+            </div>
+        </div>
+        <div>
+            <input type="file" id="file-input" accept=".txt">
+            <button id="analyze-button">🔍 API ile Analiz Et</button>
+        </div>
         <div id="status"></div>
+        <div class="progress-bar" id="progress-container" style="display: none;">
+            <div class="progress-bar-fill" id="progress-bar"></div>
+        </div>
         <div id="results"></div>
     </div>
+    <script>
         const fileInput = document.getElementById('file-input');
         const analyzeButton = document.getElementById('analyze-button');
         const statusDiv = document.getElementById('status');
         const resultsDiv = document.getElementById('results');
+        const apiKeyInput = document.getElementById('api-key');
+        const modelSelect = document.getElementById('model-select');
+        const progressContainer = document.getElementById('progress-container');
+        const progressBar = document.getElementById('progress-bar');
+        let totalComparisons = 0;
+        let completedComparisons = 0;
+        // Progress bar güncelleme
+        function updateProgress() {
+            if (totalComparisons > 0) {
+                const percentage = (completedComparisons / totalComparisons) * 100;
+                progressBar.style.width = percentage + '%';
+            }
+        }
+        // Hugging Face NLI API ile çelişki tespiti
+        async function analyzeContradictionWithNLI(sentence1, sentence2, apiKey, modelName) {
+            const premise = sentence1;
+            const hypothesis = sentence2;
+            const response = await fetch(`https://api-inference.huggingface.co/models/${modelName}`, {
+                method: 'POST',
+                headers: {
+                    'Authorization': `Bearer ${apiKey}`,
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify({
+                    inputs: {
+                        premise: premise,
+                        hypothesis: hypothesis
+                    }
+                })
+            });
+            if (!response.ok) {
+                if (response.status === 503) {
+                    // Model loading, retry after delay
+                    await new Promise(resolve => setTimeout(resolve, 2000));
+                    return await analyzeContradictionWithNLI(sentence1, sentence2, apiKey, modelName);
+                }
+                throw new Error(`API Error: ${response.status} - ${response.statusText}`);
+            }
+            const result = await response.json();
+            // API'den dönen format kontrol et
+            if (result.error) {
+                throw new Error(`API Error: ${result.error}`);
+            }
+            return result;
+        }
+        // Rate limiting için delay
+        async function delay(ms) {
+            return new Promise(resolve => setTimeout(resolve, ms));
+        }
+        statusDiv.style.display = 'block';
+        statusDiv.textContent = 'Sistem hazır. API anahtarınızı girin ve dosya seçip analiz edin.';
         analyzeButton.addEventListener('click', async () => {
+            const apiKey = apiKeyInput.value.trim();
+            if (!apiKey) {
+                alert("Lütfen Hugging Face API anahtarınızı girin.");
+                return;
+            }
             if (!fileInput.files || fileInput.files.length === 0) {
                 alert("Lütfen bir dosya seçin.");
                 return;
             const file = fileInput.files[0];
             const text = await file.text();
+            const selectedModel = modelSelect.value;
             statusDiv.style.display = 'block';
             statusDiv.textContent = 'Analiz başladı... Metin cümlelere ayrılıyor.';
             resultsDiv.innerHTML = '';
+            progressContainer.style.display = 'block';
+            progressBar.style.width = '0%';
+            analyzeButton.disabled = true;
             try {
+                // Metni cümlelere ayır
                 let sentences = text.match(/[^.!?]+[.!?]+/g) || [];
                 if (sentences.length < 2) {
                     statusDiv.textContent = 'Analiz için en az 2 cümle bulunmalıdır.';
+                    analyzeButton.disabled = false;
                     return;
                 }
+                // Kısa cümleleri filtrele ve temizle
+                sentences = sentences
+                    .map(s => s.trim())
+                    .filter(s => s.length > 20) // Minimum 20 karakter
+                    .filter(s => s.split(' ').length > 3); // Minimum 3 kelime
+                // Çok fazla cümle varsa sınırla
+                const maxSentences = 50; // API rate limit için daha düşük
                 if (sentences.length > maxSentences) {
                     sentences = sentences.slice(0, maxSentences);
+                    statusDiv.innerHTML = `<div class="warning-box">Performans ve API limitleri için analiz ${maxSentences} cümle ile sınırlandırıldı.</div>`;
                     await new Promise(resolve => setTimeout(resolve, 2000));
                 }
+                statusDiv.textContent = `Toplam ${sentences.length} cümle bulundu. ${selectedModel} modeli ile çelişki analizi başlıyor...`;
                 const potentialContradictions = [];
+                totalComparisons = (sentences.length * (sentences.length - 1)) / 2;
+                completedComparisons = 0;
+                // Her cümleyi diğerleriyle karşılaştır
                 for (let i = 0; i < sentences.length; i++) {
                     for (let j = i + 1; j < sentences.length; j++) {
                         try {
+                            const sentence1 = sentences[i];
+                            const sentence2 = sentences[j];
                             // Çok benzer başlangıçları atla
+                            if (sentence1.substring(0, 15) === sentence2.substring(0, 15)) {
+                                completedComparisons++;
+                                updateProgress();
+                                continue;
+                            }
+                            statusDiv.textContent = `Çelişki analizi: ${completedComparisons + 1}/${totalComparisons} - Cümle ${i + 1} vs ${j + 1}`;
+                            // API çağrısı
+                            const result = await analyzeContradictionWithNLI(sentence1, sentence2, apiKey, selectedModel);
+                            completedComparisons++;
+                            updateProgress();
+                            // Sonucu işle
+                            let contradictionScore = 0;
+                            if (Array.isArray(result)) {
+                                // Eski format: array of objects
+                                const contradictionResult = result.find(r =>
+                                    r.label === 'CONTRADICTION' ||
+                                    r.label === 'contradiction' ||
+                                    r.label === 'CONTRADICTORY'
+                                );
+                                contradictionScore = contradictionResult?.score || 0;
+                            } else if (result.labels && result.scores) {
+                                // Yeni format: object with labels and scores arrays
+                                const contradictionIndex = result.labels.findIndex(label =>
+                                    label === 'CONTRADICTION' ||
+                                    label === 'contradiction' ||
+                                    label === 'CONTRADICTORY'
+                                );
+                                if (contradictionIndex !== -1) {
+                                    contradictionScore = result.scores[contradictionIndex];
+                                }
+                            }
+                            console.log(`Analiz: "${sentence1.substring(0, 30)}..." vs "${sentence2.substring(0, 30)}..." - Çelişki: ${(contradictionScore * 100).toFixed(1)}%`);
+                            // Çelişki eşiği
+                            if (contradictionScore > 0.7) { // %70'den yüksek çelişki skoru
                                 potentialContradictions.push({
                                     sentence1: sentence1,
                                     sentence2: sentence2,
                                     contradictionScore: contradictionScore
                                 });
                                 console.log(`✓ Çelişki bulundu! Skor: ${(contradictionScore * 100).toFixed(1)}%`);
                             }
+                            // Rate limiting - her 5 istek arasında kısa bekleme
+                            if (completedComparisons % 5 === 0) {
+                                await delay(500);
                             }
                         } catch (error) {
                             console.warn(`Cümle ${i}-${j} analiz edilirken hata:`, error);
+                            completedComparisons++;
+                            updateProgress();
+                            if (error.message.includes('rate limit') || error.message.includes('429')) {
+                                statusDiv.textContent = 'API rate limit aşıldı, 10 saniye bekleniyor...';
+                                await delay(10000);
+                            } else {
+                                await delay(1000); // Genel hata durumunda kısa bekleme
+                            }
                             continue;
                         }
                     }
                 }
+                progressContainer.style.display = 'none';
+                // Sonuçları göster
+                if (potentialContradictions.length > 20) {
                     potentialContradictions.sort((a, b) => b.contradictionScore - a.contradictionScore);
+                    const limitedContradictions = potentialContradictions.slice(0, 20);
                     statusDiv.style.display = 'none';
+                    renderResults(limitedContradictions, potentialContradictions.length, selectedModel);
                 } else {
                     statusDiv.style.display = 'none';
+                    renderResults(potentialContradictions, null, selectedModel);
                 }
             } catch (error) {
+                progressContainer.style.display = 'none';
                 statusDiv.textContent = `Analiz sırasında hata: ${error.message}`;
                 console.error('Detaylı hata:', error);
+                if (error.message.includes('401') || error.message.includes('Unauthorized')) {
                     statusDiv.innerHTML = `
+                        <div class="warning-box">
+                            <strong>API Anahtarı Hatası:</strong><br>
+                            • API anahtarınızı kontrol edin<br>
+                            • Hugging Face hesabınızın aktif olduğundan emin olun<br>
+                            • API anahtarının "read" yetkisi olduğundan emin olun
+                        </div>
+                    `;
+                } else if (error.message.includes('rate limit') || error.message.includes('429')) {
+                    statusDiv.innerHTML = `
+                        <div class="warning-box">
+                            <strong>Rate Limit Aşıldı:</strong><br>
+                            • Çok fazla istek gönderildi<br>
+                            • Birkaç dakika bekleyip tekrar deneyin<br>
+                            • Daha kısa bir metin kullanmayı deneyin
+                        </div>
                     `;
                 }
+            } finally {
+                analyzeButton.disabled = false;
             }
         });
+        function renderResults(results, totalFound, modelName) {
             if (results.length === 0) {
+                let message = '<div style="text-align: center; padding: 20px;">';
+                message += '<h3>🎉 Analiz Tamamlandı</h3>';
+                message += '<p>Belirlenen eşik değerinde (%70) potansiyel çelişki bulunamadı.</p>';
                 message += `<div style="background-color: #f3f4f6; padding: 15px; border-radius: 5px; margin-top: 15px;">
+                    <h4>${modelName} Modeli Sonucu</h4>
+                    <p>Bu model özellikle çelişki tespiti için optimize edilmiştir.</p>
+                    <p>%70'den yüksek çelişki skoru aranan eşik değeridir.</p>
+                    <p>Sonuç: Metninizde güçlü çelişkiler tespit edilmemiştir.</p>
                 </div>`;
+                message += '</div>';
                 resultsDiv.innerHTML = message;
                 return;
             }
+            let headerText = `<h3>🚨 ${results.length} adet potansiyel çelişki bulundu:</h3>`;
             if (totalFound && totalFound > results.length) {
+                headerText = `<h3>🚨 Toplam ${totalFound} çelişki bulundu - En güçlü ${results.length} tanesi gösteriliyor:</h3>`;
             }
+            headerText += `<p style="color: #6b7280; margin-bottom: 20px;">Model: <strong>${modelName}</strong> | Eşik: <strong>%70</strong></p>`;
             resultsDiv.innerHTML = headerText;
+            // Sonuçları çelişki skoruna göre sırala
             results.sort((a, b) => b.contradictionScore - a.contradictionScore);
             results.forEach((item, index) => {
                 const div = document.createElement('div');
                 div.className = 'result-item';
+                let severityColor = '#ef4444';
                 let severityText = 'Yüksek';
+                let bgColor = '#fef2f2';
+                if (item.contradictionScore > 0.9) {
+                    severityColor = '#dc2626';
                     severityText = 'Çok Yüksek';
+                    bgColor = '#fecaca';
+                } else if (item.contradictionScore > 0.8) {
+                    severityColor = '#ef4444';
+                    severityText = 'Yüksek';
+                    bgColor = '#fef2f2';
+                } else if (item.contradictionScore > 0.7) {
+                    severityColor = '#f59e0b';
+                    severityText = 'Orta-Yüksek';
+                    bgColor = '#fef3c7';
                 }
+                div.style.backgroundColor = bgColor;
                 div.innerHTML = `
+                    <p><strong>Çelişki #${index + 1}</strong></p>
+                    <p><strong>Çelişki Skoru: <span style="color: ${severityColor}; font-weight: bold;">${(item.contradictionScore * 100).toFixed(1)}%</span> (${severityText} Seviye)</strong></p>
+                    <p><em>🔴 İfade 1:</em> "${item.sentence1.trim()}"</p>
+                    <p><em>🔴 İfade 2:</em> "${item.sentence2.trim()}"</p>
                 `;
                 resultsDiv.appendChild(div);
             });
+            // Özet bilgi
+            const summaryDiv = document.createElement('div');
+            summaryDiv.style.cssText = 'background-color: #f3f4f6; padding: 20px; border-radius: 8px; margin-top: 20px; border-left: 4px solid #3b82f6;';
+            summaryDiv.innerHTML = `
+                <h4>📊 Analiz Özeti</h4>
+                <p><strong>Kullanılan Model:</strong> ${modelName}</p>
+                <p><strong>Toplam Çelişki:</strong> ${totalFound || results.length}</p>
+                <p><strong>Gösterilen:</strong> ${results.length}</p>
+                <p><strong>En Yüksek Skor:</strong> ${(results[0].contradictionScore * 100).toFixed(1)}%</p>
+                <p style="margin-top: 15px; color: #6b7280; font-size: 14px;">
+                    <em>Not: Çelişki skoru %70'in üzerindeki cümle çiftleri potansiyel çelişki olarak değerlendirilmiştir.</em>
+                </p>
+            `;
+            resultsDiv.appendChild(summaryDiv);
         }
     </script>
 </body>