134 lines
4.8 KiB
JavaScript
134 lines
4.8 KiB
JavaScript
let base64Image = "";
|
||
let rawDescription = "";
|
||
|
||
// Görüntü seçildiğinde önizleme yap ve boyutlandır
|
||
function handlePreview(input) {
|
||
const file = input.files[0];
|
||
if (!file) return;
|
||
|
||
const reader = new FileReader();
|
||
reader.onload = function (e) {
|
||
const img = new Image();
|
||
img.onload = function () {
|
||
const canvas = document.createElement('canvas');
|
||
let width = img.width;
|
||
let height = img.height;
|
||
const max_size = 1024;
|
||
|
||
if (width > height) {
|
||
if (width > max_size) {
|
||
height *= max_size / width;
|
||
width = max_size;
|
||
}
|
||
} else {
|
||
if (height > max_size) {
|
||
width *= max_size / height;
|
||
height = max_size;
|
||
}
|
||
}
|
||
|
||
canvas.width = width;
|
||
canvas.height = height;
|
||
const ctx = canvas.getContext('2d');
|
||
ctx.drawImage(img, 0, 0, width, height);
|
||
|
||
const previewImg = document.getElementById('preview');
|
||
previewImg.src = canvas.toDataURL('image/jpeg', 0.8);
|
||
previewImg.style.display = "block";
|
||
base64Image = previewImg.src.split(',')[1];
|
||
|
||
document.getElementById('analyzeBtn').disabled = false;
|
||
document.getElementById('uploadText').innerText = file.name;
|
||
document.getElementById('resetBtn').style.display = "block";
|
||
};
|
||
img.src = e.target.result;
|
||
};
|
||
reader.readAsDataURL(file);
|
||
}
|
||
|
||
// Moondream ile analiz yap
|
||
async function analyzeImage() {
|
||
const btn = document.getElementById('analyzeBtn');
|
||
const resultBox = document.getElementById('englishOutput');
|
||
const resultText = document.getElementById('resultText');
|
||
|
||
btn.disabled = true;
|
||
btn.innerHTML = '<span class="loader"></span> Düşünüyor...';
|
||
resultBox.style.display = "block";
|
||
resultText.innerText = "Görsel işleniyor, lütfen bekleyin...";
|
||
|
||
try {
|
||
const response = await fetch('https://ai.almazlar.com/ollama/api/generate', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({
|
||
model: "moondream",
|
||
prompt: "Describe this image concisely but accurately in English.",
|
||
images: [base64Image],
|
||
stream: false
|
||
})
|
||
});
|
||
|
||
if (!response.ok) throw new Error(`Sunucu hatası: ${response.status}`);
|
||
|
||
const data = await response.json();
|
||
rawDescription = data.response;
|
||
resultText.innerText = rawDescription;
|
||
document.getElementById('translateBtn').style.display = "block";
|
||
} catch (err) {
|
||
resultText.innerText = `Hata: ${err.message}. Lütfen bağlantıyı veya model ayarlarını kontrol edin.`;
|
||
console.error(err);
|
||
} finally {
|
||
btn.innerHTML = "Yeniden Analiz Et";
|
||
btn.disabled = false;
|
||
}
|
||
}
|
||
|
||
// Llama 3 ile çeviri yap
|
||
async function translateText() {
|
||
const transBtn = document.getElementById('translateBtn');
|
||
const trBox = document.getElementById('translationResult');
|
||
const trText = document.getElementById('trText');
|
||
|
||
transBtn.disabled = true;
|
||
transBtn.innerHTML = '<span class="loader"></span> Çevriliyor...';
|
||
trBox.style.display = "block";
|
||
trText.innerText = "Çeviri yapılıyor...";
|
||
|
||
try {
|
||
const response = await fetch('https://ai.almazlar.com/ollama/api/generate', {
|
||
method: 'POST',
|
||
headers: { 'Content-Type': 'application/json' },
|
||
body: JSON.stringify({
|
||
model: "llama3",
|
||
prompt: `Translate the following description into natural Turkish. Only output the translation: "${rawDescription}"`,
|
||
stream: false
|
||
})
|
||
});
|
||
|
||
if (!response.ok) throw new Error(`Çeviri hatası: ${response.status}`);
|
||
|
||
const data = await response.json();
|
||
trText.innerText = data.response;
|
||
} catch (err) {
|
||
trText.innerText = `Hata: ${err.message}`;
|
||
} finally {
|
||
transBtn.disabled = false;
|
||
transBtn.innerHTML = "Türkçeye Çevir (Llama 3)";
|
||
}
|
||
}
|
||
|
||
// Uygulamayı sıfırla
|
||
function resetApp() {
|
||
document.getElementById('fileInput').value = "";
|
||
document.getElementById('preview').style.display = "none";
|
||
document.getElementById('preview').src = "";
|
||
document.getElementById('englishOutput').style.display = "none";
|
||
document.getElementById('translationResult').style.display = "none";
|
||
document.getElementById('analyzeBtn').disabled = true;
|
||
document.getElementById('uploadText').innerText = "📷 Görseli seçmek için buraya tıklayın";
|
||
document.getElementById('resetBtn').style.display = "none";
|
||
base64Image = "";
|
||
rawDescription = "";
|
||
}
|