Files
Abschluss-Projekt/js/add-image.js
2025-12-08 12:26:34 +01:00

39 lines
1.1 KiB
JavaScript
Executable File

//Global Variable
var imgBlob;
var imgMimeType
// Create a hidden file input dynamically
const fileInput = document.createElement('input');
fileInput.type = 'file';
fileInput.accept = 'image/*';
fileInput.style.display = 'none';
document.body.appendChild(fileInput);
function uploadButtonHandler() {
fileInput.click();
};
fileInput.addEventListener('change', () => {
const imageDiv = document.querySelector('.popup .image');
const file = fileInput.files[0];
if (!file) return;
const reader = new FileReader();
reader.onload = (e) => {
imageDiv.innerHTML = ''; // clear previous content
const img = document.createElement('img');
img.src = e.target.result;
img.alt = 'Uploaded Image';
img.style.width = '100%';
img.style.height = '100%';
img.style.objectFit = 'cover';
img.style.borderRadius = '10px';
imageDiv.appendChild(img);
// Use the original file as the blob and store its MIME type
imgBlob = file;
imgMimeType = file.type;
};
reader.readAsDataURL(file);
});