80 lines
1.9 KiB
JavaScript
80 lines
1.9 KiB
JavaScript
export const b = {
|
|
init: 'activatePostImages getUserData',
|
|
}
|
|
|
|
const POST_IMAGES_SELECTOR = 'img.post-image:not(aside img.post-image)'
|
|
const WHOAMI_ENDPOINT = '/api/whoami/'
|
|
|
|
let images = [];
|
|
let currentIndex = 0;
|
|
let currentUser = null;
|
|
|
|
export function activatePostImages(_, __, ___) {
|
|
const images = document.querySelectorAll(POST_IMAGES_SELECTOR);
|
|
images.forEach(image => {
|
|
image.style.cursor = 'pointer';
|
|
image.dataset.s = 'collectImages';
|
|
});
|
|
}
|
|
|
|
export function collectImages(_, sender, el) {
|
|
if (!el.contains(sender)) return;
|
|
images = Array.from(el.querySelectorAll(POST_IMAGES_SELECTOR));
|
|
currentIndex = images.indexOf(sender);
|
|
b.trigger('showLightbox');
|
|
}
|
|
|
|
export function showLightbox(_, __, el) {
|
|
const originalImg = images[currentIndex];
|
|
const lightboxImg = el.querySelector('img');
|
|
const anchor = el.querySelector('a');
|
|
anchor.href = originalImg.src;
|
|
lightboxImg.src = originalImg.src;
|
|
lightboxImg.alt = originalImg.alt;
|
|
|
|
if (!el.open) {
|
|
el.showModal();
|
|
}
|
|
|
|
b.trigger('lightboxSetCounter');
|
|
}
|
|
|
|
export function closeLightbox(_, __, el) {
|
|
el.close();
|
|
}
|
|
|
|
export function lightboxSetCounter(_, __, el) {
|
|
el.innerText = `${currentIndex + 1}/${images.length}`;
|
|
}
|
|
|
|
export function lightboxNext(_, __, ___) {
|
|
if (images.length == 1) return;
|
|
currentIndex++;
|
|
if (currentIndex >= images.length) {
|
|
currentIndex = 0;
|
|
}
|
|
b.trigger('showLightbox');
|
|
}
|
|
|
|
export function lightboxPrevious(_, __, ___) {
|
|
if (images.length == 1) return;
|
|
currentIndex--;
|
|
if (currentIndex < 0) {
|
|
currentIndex = images.length - 1;
|
|
}
|
|
b.trigger('showLightbox');
|
|
}
|
|
|
|
export async function getUserData(_, __, ___) {
|
|
currentUser = await b.getData(WHOAMI_ENDPOINT);
|
|
b.trigger('highlightMentions');
|
|
}
|
|
|
|
export function highlightMentions(_, __, el) {
|
|
if (!el) return;
|
|
|
|
if (el.dataset.username === currentUser.username) {
|
|
el.classList.add('me');
|
|
}
|
|
}
|