42 lines
993 B
JavaScript
42 lines
993 B
JavaScript
const img = document.getElementById('mainImg');
|
|
const btnImg = document.getElementById('image-cycle');
|
|
const btnImg_bw = document.getElementById('image-cycle-bw');
|
|
|
|
/**
|
|
* Images to be used
|
|
*/
|
|
|
|
const images = [];
|
|
for (let i = 1; i <= 28; i++) {
|
|
images.push(`t${i}.jpg`);
|
|
}
|
|
|
|
/**
|
|
* Index of the image. Revert the the first image if nothing found
|
|
* in the local storage.
|
|
*/
|
|
let imgIndex = localStorage.getItem('imgIndex') || 0
|
|
|
|
/*
|
|
* Load image on page load.
|
|
*/
|
|
img.src = 'assets/img/' + images[imgIndex]
|
|
|
|
/**
|
|
* Change image when clicking the button.
|
|
*/
|
|
function changeImg() {
|
|
imgIndex = (imgIndex + 1) % images.length
|
|
img.src = 'assets/img/' + images[imgIndex]
|
|
localStorage.setItem('imgIndex', imgIndex)
|
|
}
|
|
|
|
function changeImg_bw() {
|
|
imgIndex = (imgIndex + images.length - 1) % images.length
|
|
img.src = 'assets/img/' + images[imgIndex]
|
|
localStorage.setItem('imgIndex', imgIndex)
|
|
}
|
|
|
|
btnImg.addEventListener('click', changeImg)
|
|
btnImg_bw.addEventListener('click', changeImg_bw)
|