File size: 1,960 Bytes
6df3c38 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
// Function to load images from a folder
function loadImagesFromFolder(folder) {
return new Promise((resolve, reject) => {
fetch(folder)
.then(response => response.text())
.then(text => {
const parser = new DOMParser();
const htmlDoc = parser.parseFromString(text, 'text/html');
const images = Array.from(htmlDoc.querySelectorAll('a'))
.filter(a => /\.(jpe?g|png|gif)$/i.test(a.href))
.map(a => a.href);
resolve(images);
})
.catch(error => {
reject(error);
});
});
}
// Function to display slideshow
function displaySlideshow(images) {
const canvas = document.getElementById('c3');
const ctx = canvas.getContext('2d');
const img = document.getElementById('my-image');
let currentIndex = 0;
// Function to draw current image on canvas
function drawImageOnCanvas(index) {
img.src = images[index];
img.onload = () => {
canvas.width = img.width;
canvas.height = img.height;
ctx.drawImage(img, 0, 0);
};
}
// Initial drawing
drawImageOnCanvas(currentIndex);
// Switch to the next image in the array
function nextImage() {
currentIndex = (currentIndex + 1) % images.length;
drawImageOnCanvas(currentIndex);
}
// Start slideshow
const slideshowInterval = setInterval(nextImage, 2000); // Change interval as needed
// Stop slideshow after all images have been shown
setTimeout(() => {
clearInterval(slideshowInterval);
}, images.length * 2000); // Adjust duration based on image count
}
// Usage
const folderPath = 'temp/uploads';
loadImagesFromFolder(folderPath)
.then(images => {
displaySlideshow(images);
})
.catch(error => {
console.error('Error loading images:', error);
});
|