E-okuldan indirdiğiniz excel dosyalarında bazı öğrenci fotoları renksiz görününebilir. Alternatif yöntem Pdf olarak indireceğiniz Fotoğraflı-Kimlik Bilgili Öğrenci Listesindeki fotoğrafları renkli olarak ayıklamak için Html kodu yazdım.
Kod:
<!DOCTYPE html>
<html lang="tr">
<head>
<meta charset="UTF-8">
<title>PDF Resim Ayıklayıcı</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
<style>
body { font-family: 'Segoe UI', Tahoma, sans-serif; background: #f4f7f6; display: flex; justify-content: center; align-items: center; min-height: 100vh; margin: 0; }
.card { background: white; padding: 2.5rem; border-radius: 20px; box-shadow: 0 15px 35px rgba(0,0,0,0.1); width: 100%; max-width: 550px; text-align: center; }
#drop-area {
border: 3px dashed #3498db;
border-radius: 15px;
padding: 50px 20px;
cursor: pointer;
transition: 0.3s;
background: #f0f7ff;
margin: 20px 0;
}
#drop-area.highlight {
background: #e1f0ff;
border-color: #2e86de;
transform: scale(1.02);
}
#status { font-weight: bold; color: #2980b9; margin-top: 10px; }
.info { font-size: 0.9rem; color: #666; }
</style>
</head>
<body>
<div class="card">
<h2>PDF Resim Ayıklayıcı</h2>
<p class="info">Resimleri (image1.jpeg,image2.jpeg vb.formatta) ayıklar ZIP olarak indirir.</p>
<div id="drop-area">
<strong>PDF'i Buraya Bırakın veya Seçmek İçin Tıklayın</strong>
</div>
<input type="file" id="file-input" accept="application/pdf" style="display:none">
<div id="status">Hazırım Diyor</div>
</div>
<script>
const pdfjsLib = window['pdfjs-dist/build/pdf'];
pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdnjs.cloudflare.com/ajax/libs/pdf.js/3.4.120/pdf.worker.min.js';
const dropArea = document.getElementById('drop-area');
const fileInput = document.getElementById('file-input');
const status = document.getElementById('status');
dropArea.onclick = () => fileInput.click();
fileInput.onchange = (e) => handleFile(e.target.files[0]);
['dragenter', 'dragover', 'dragleave', 'drop'].forEach(eventName => {
dropArea.addEventListener(eventName, (e) => {
e.preventDefault();
e.stopPropagation();
}, false);
});
['dragenter', 'dragover'].forEach(eventName => {
dropArea.addEventListener(eventName, () => dropArea.classList.add('highlight'), false);
});
['dragleave', 'drop'].forEach(eventName => {
dropArea.addEventListener(eventName, () => dropArea.classList.remove('highlight'), false);
});
dropArea.addEventListener('drop', (e) => {
const dt = e.dataTransfer;
const file = dt.files[0];
if (file && file.type === "application/pdf") {
handleFile(file);
} else {
status.innerText = "Hata: Lütfen geçerli bir PDF bırakın.";
}
});
async function handleFile(file) {
if (!file) return;
status.innerText = "İşleniyor...";
const zip = new JSZip();
try {
const arrayBuffer = await file.arrayBuffer();
const pdf = await pdfjsLib.getDocument({data: arrayBuffer}).promise;
let imageIndex = 0;
for (let i = 1; i <= pdf.numPages; i++) {
const page = await pdf.getPage(i);
const ops = await page.getOperatorList();
status.innerText = `Sayfa ${i}/${pdf.numPages} taranıyor...`;
for (let j = 0; j < ops.fnArray.length; j++) {
if (ops.fnArray[j] === pdfjsLib.OPS.paintImageXObject ||
ops.fnArray[j] === pdfjsLib.OPS.paintInlineImageXObject) {
const name = ops.argsArray[j][0];
try {
const img = await page.objs.get(name);
if (!img) continue;
if (img.width > img.height) continue;
const canvas = document.createElement('canvas');
canvas.width = img.width;
canvas.height = img.height;
const ctx = canvas.getContext('2d');
ctx.fillStyle = "#FFFFFF";
ctx.fillRect(0, 0, canvas.width, canvas.height);
const imageData = ctx.createImageData(img.width, img.height);
if (img.data.length === img.width * img.height * 3) {
for (let k = 0, l = 0; k < img.data.length; k += 3, l += 4) {
imageData.data[l] = img.data[k];
imageData.data[l+1] = img.data[k+1];
imageData.data[l+2] = img.data[k+2];
imageData.data[l+3] = 255;
}
} else {
imageData.data.set(img.data);
}
const tempCanvas = document.createElement('canvas');
tempCanvas.width = img.width;
tempCanvas.height = img.height;
tempCanvas.getContext('2d').putImageData(imageData, 0, 0);
ctx.drawImage(tempCanvas, 0, 0);
const finalCanvas = document.createElement('canvas');
const border = 6;
finalCanvas.width = Math.max(1, img.width - (border * 2));
finalCanvas.height = Math.max(1, img.height - (border * 2));
finalCanvas.getContext('2d').drawImage(
canvas,
border, border, finalCanvas.width, finalCanvas.height,
0, 0, finalCanvas.width, finalCanvas.height
);
imageIndex++;
const imgData = finalCanvas.toDataURL("image/jpeg", 0.90).split(',')[1];
zip.file(`image${imageIndex}.jpeg`, imgData, {base64: true});
} catch (e) { console.warn("Resim hatası:", e); }
}
}
}
if (imageIndex > 0) {
status.innerText = "ZIP hazırlanıyor...";
const content = await zip.generateAsync({type:"blob"});
const link = document.createElement('a');
link.href = URL.createObjectURL(content);
link.download = "media.zip";
link.click();
status.innerText = `Başarılı! ${imageIndex} resim media.zip olarak indirildi.`;
} else {
status.innerText = "Uygun resim bulunamadı.";
}
} catch (err) {
console.error(err);
status.innerText = "Hata oluştu. PDF dosyası bozuk veya şifreli olabilir.";
}
}
</script>
</body>
</html>
Son düzenleme:
