add load spinner
This commit is contained in:
parent
f6b70801b0
commit
19c9322cdb
@ -4,6 +4,8 @@ galleryContainer = document.getElementById("galleryContainer");
|
|||||||
galleryImage = document.getElementById("galleryImage");
|
galleryImage = document.getElementById("galleryImage");
|
||||||
previewLinks = document.getElementsByClassName("previewLink");
|
previewLinks = document.getElementsByClassName("previewLink");
|
||||||
headerImage = document.getElementById("headerImage");
|
headerImage = document.getElementById("headerImage");
|
||||||
|
loadingImage = new Image()
|
||||||
|
loadingImage.src = "/loading.gif"
|
||||||
|
|
||||||
touchDragThreshold = 50;
|
touchDragThreshold = 50;
|
||||||
directionDetermined = false;
|
directionDetermined = false;
|
||||||
@ -16,13 +18,25 @@ touchDirection = null;
|
|||||||
// changes to style.rotate are necessary because transformed elements
|
// changes to style.rotate are necessary because transformed elements
|
||||||
// get stuck in front of the gallery images
|
// get stuck in front of the gallery images
|
||||||
|
|
||||||
|
function loadImage () {
|
||||||
|
image = new Image();
|
||||||
|
image.src = "/compressed/compressed_" + photos[viewState];
|
||||||
|
timeout = window.setTimeout(function () {
|
||||||
|
galleryImage.src = loadImage.src;
|
||||||
|
}, 400)
|
||||||
|
image.onload = function () {
|
||||||
|
window.clearTimeout(timeout);
|
||||||
|
galleryImage.fullRes = photos[viewState];
|
||||||
|
galleryImage.src = image.src;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function enlargeImage (filename) {
|
function enlargeImage (filename) {
|
||||||
viewState = photos.indexOf(filename);
|
viewState = photos.indexOf(filename);
|
||||||
galleryImage.fullRes = filename;
|
|
||||||
galleryImage.src = "/compressed/compressed_" + filename;
|
|
||||||
galleryContainer.style.display = "block";
|
galleryContainer.style.display = "block";
|
||||||
document.body.style = "overflow:hidden;"
|
document.body.style = "overflow:hidden;"
|
||||||
headerImage.style.rotate = "none";
|
headerImage.style.rotate = "none";
|
||||||
|
loadImage()
|
||||||
};
|
};
|
||||||
|
|
||||||
function delGallery () {
|
function delGallery () {
|
||||||
@ -37,8 +51,7 @@ function nextImage () {
|
|||||||
if (viewState == previewLinks.length) {
|
if (viewState == previewLinks.length) {
|
||||||
viewState = 0;
|
viewState = 0;
|
||||||
};
|
};
|
||||||
galleryImage.fullRes = photos[viewState];
|
loadImage()
|
||||||
galleryImage.src = "/compressed/compressed_" + photos[viewState];
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function prevImage () {
|
function prevImage () {
|
||||||
@ -46,8 +59,7 @@ function prevImage () {
|
|||||||
if (viewState == -1) {
|
if (viewState == -1) {
|
||||||
viewState = previewLinks.length - 1;
|
viewState = previewLinks.length - 1;
|
||||||
};
|
};
|
||||||
galleryImage.fullRes = photos[viewState];
|
loadImage()
|
||||||
galleryImage.src = "/compressed/compressed_" + photos[viewState];
|
|
||||||
};
|
};
|
||||||
|
|
||||||
function imageNewTab () {
|
function imageNewTab () {
|
||||||
|
Loading…
x
Reference in New Issue
Block a user