Mirror/filesafe
1
0
Fork 0
mirror of https://github.com/BobbyWibowo/lolisafe.git synced 2025-01-05 19:40:09 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

perf: lazyload album pages' images detailing

Browse Source 
e.g. prettify size & date functions
This commit is contained in:
Bobby 2022-10-09 01:55:56 +07:00
parent effdf8c607
commit c192bf8c25
No known key found for this signature in database
GPG Key ID: 941839794CBF5A09
1 changed files with 29 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
src/js/album.js
View File

@ -9,25 +9,40 @@ const page = {
// Array of extensions that will be whitelisted for SimpleLightbox // Array of extensions that will be whitelisted for SimpleLightbox
// Should only include image extensions that can be rendered directly on browsers // Should only include image extensions that can be rendered directly on browsers
lightboxExts: ['.gif', '.jpeg', '.jpg', '.png', '.svg', '.tif', '.tiff', '.webp', '.bmp'] lightboxExts: ['.gif', '.jpeg', '.jpg', '.png', '.svg', '.tif', '.tiff', '.webp', '.bmp'],
updateImageContainer: element => {
// Update size & string elements within each individual image container
const container = element.parentNode.parentNode
if (!container.classList.contains('image-container')) return
const sizeElement = container.querySelector('.file-size')
if (sizeElement) {
const string = sizeElement.dataset.value || sizeElement.innerHTML
sizeElement.innerHTML = page.getPrettyBytes(parseInt(string, 10))
}
const dateElement = document.querySelector('.file-date')
if (dateElement) {
const string = dateElement.dataset.value
dateElement.innerHTML = page.getPrettyDate(new Date(parseInt(string, 10) * 1000))
}
}
} }
window.addEventListener('DOMContentLoaded', () => { window.addEventListener('DOMContentLoaded', () => {
// Prettify all .file-size elements // Update size string in album header block
const sizeElements = document.querySelectorAll('.file-size') const headerSize = document.querySelector('#count .file-size')
for (let i = 0; i < sizeElements.length; i++) { if (headerSize) {
const string = sizeElements[i].dataset.value || sizeElements[i].innerHTML const string = headerSize.dataset.value || headerSize.innerHTML
sizeElements[i].innerHTML = page.getPrettyBytes(parseInt(string, 10)) headerSize.innerHTML = page.getPrettyBytes(parseInt(string, 10))
} }
// Prettify all .file-date elements // Attach callback function to lazyloader
const dateElements = document.querySelectorAll('.file-date') page.lazyLoad = new LazyLoad({
for (let i = 0; i < dateElements.length; i++) { unobserve_entered: true,
const string = dateElements[i].dataset.value callback_enter: page.updateImageContainer
dateElements[i].innerHTML = page.getPrettyDate(new Date(parseInt(string, 10) * 1000)) })
}
page.lazyLoad = new LazyLoad()
// Build RegExp out of imageExts array // Build RegExp out of imageExts array
// SimpleLightbox demands RegExp for configuring supported file extensions // SimpleLightbox demands RegExp for configuring supported file extensions