Spaces:
Running
Running
<html lang="en"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>Fast-DetectGPT</title> | |
<style> | |
body { | |
font-family: Arial, sans-serif; | |
margin: 20px; | |
background-color: #f9f9f9; | |
} | |
.container { | |
max-width: 700px; | |
margin: auto; | |
background: #ffffff; | |
border-radius: 8px; | |
padding: 20px; | |
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); | |
} | |
h1 { | |
text-align: center; | |
color: #333; | |
} | |
textarea { | |
width: 100%; | |
height: 150px; | |
margin: 15px 0; | |
padding: 10px; | |
border: 1px solid #ccc; | |
border-radius: 5px; | |
font-size: 16px; | |
} | |
button { | |
display: block; | |
width: 100%; | |
padding: 10px; | |
background-color: #007bff; | |
color: white; | |
border: none; | |
border-radius: 5px; | |
font-size: 16px; | |
cursor: pointer; | |
} | |
button:hover { | |
background-color: #0056b3; | |
} | |
#result { | |
margin-top: 20px; | |
padding: 15px; | |
background-color: #f1f1f1; | |
border: 1px solid #ddd; | |
border-radius: 5px; | |
} | |
.error { | |
color: red; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="container"> | |
<h1>Fast-DetectGPT</h1> | |
<form id="analyzeForm"> | |
<textarea name="text" placeholder="Enter your text here..." required></textarea> | |
<button type="submit">Analyze</button> | |
</form> | |
<div id="result"></div> | |
</div> | |
<script> | |
document.getElementById('analyzeForm').addEventListener('submit', function (e) { | |
e.preventDefault(); // Formun varsayılan davranışını durdurur. | |
const formData = new FormData(this); | |
const resultDiv = document.getElementById('result'); | |
// Önce sonucu temizle | |
resultDiv.textContent = ''; | |
// POST isteği gönder | |
fetch('/analyze', { | |
method: 'POST', | |
headers: { | |
'Content-Type': 'application/json', | |
}, | |
body: JSON.stringify({ | |
text: formData.get('text'), | |
}), | |
}) | |
.then(response => response.json()) | |
.then(data => { | |
if (data.error) { | |
resultDiv.innerHTML = `<p class="error">Error: ${data.error}</p>`; | |
} else { | |
resultDiv.innerHTML = ` | |
<p><strong>Criterion:</strong> ${data.criterion}</p> | |
<p><strong>Probability of being machine-generated:</strong> ${data.probability_machine_generated}</p> | |
`; | |
} | |
}) | |
.catch(err => { | |
resultDiv.innerHTML = `<p class="error">An error occurred: ${err.message}</p>`; | |
}); | |
}); | |
</script> | |
</body> | |
</html> | |