Galleries/PythonGallery
1
0
Fork 0
mirror of https://github.com/Derpy-Leggies/OnlyLegs.git synced 2025-06-29 03:26:16 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Move JS to layout HTML for faster loading

Browse source 
Keep images square through JS and not a bug with ::after
This commit is contained in:
Michał Gdula 2023-04-22 13:45:29 +00:00
parent ac2e73042e
commit e9e3706172
7 changed files with 103 additions and 99 deletions
Download patch file Download diff file Expand all files Collapse all files

11
onlylegs/static/js/fade.js Normal file
View file

@ -0,0 +1,11 @@
// fade in images
function imgFade(obj, time = 200) {
setTimeout(() => {
obj.style.animation = `imgFadeIn ${time}ms`;
setTimeout(() => {
obj.style.opacity = null;
obj.style.animation = null;
}, time);
}, 1);
}

72
onlylegs/static/js/index.js
View file

@ -1,72 +0,0 @@
// fade in images
function imgFade(obj, time = 200) {
obj.style.opacity = null;
obj.style.animation = `imgFadeIn ${time}ms`;
setTimeout(() => { obj.style.animation = null; }, time);
}
window.onload = function () {
const times = document.querySelectorAll('.time');
for (let i = 0; i < times.length; i++) {
// Remove milliseconds
const raw = times[i].innerHTML.split('.')[0];
// Parse YYYY-MM-DD HH:MM:SS to Date object
const time = raw.split(' ')[1];
const date = raw.split(' ')[0].split('-');
// Format to YYYY/MM/DD HH:MM:SS and convert to UTC Date object
const dateTime = new Date(`${date[0]}/${date[1]}/${date[2]} ${time} UTC`);
// Convert to local time
times[i].innerHTML = `${dateTime.toLocaleDateString()} ${dateTime.toLocaleTimeString()}`;
}
// Top Of Page button
const topOfPage = document.querySelector('.top-of-page');
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
topOfPage.classList.add('show');
} else {
topOfPage.classList.remove('show');
}
topOfPage.onclick = function () {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
}
// Info button
const infoButton = document.querySelector('.info-button');
if (infoButton) {
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
infoButton.classList.remove('show');
} else {
infoButton.classList.add('show');
}
infoButton.onclick = function () {
popUpShow('OnlyLegs',
'<a href="https://github.com/Fluffy-Bean/onlylegs">v0.1.4</a> ' +
'using <a href="https://phosphoricons.com/">Phosphoricons</a> and Flask.' +
'<br>Made by Fluffy and others with ❤️');
}
}
};
window.onscroll = function () {
// Top Of Page button
const topOfPage = document.querySelector('.top-of-page');
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
topOfPage.classList.add('show');
} else {
topOfPage.classList.remove('show');
}
// Info button
const infoButton = document.querySelector('.info-button');
if (infoButton) {
if (document.body.scrollTop > 300 || document.documentElement.scrollTop > 20) {
infoButton.classList.remove('show');
} else {
infoButton.classList.add('show');
}
}
};

11
onlylegs/static/js/square.js Normal file
View file

@ -0,0 +1,11 @@
function keepSquare() {
const images = document.querySelectorAll('.gallery-item');
for (let i = 0; i < images.length; i++) {
images[i].style.height = images[i].offsetWidth + 'px';
}
const groups = document.querySelectorAll('.group-item');
for (let i = 0; i < groups.length; i++) {
groups[i].style.height = groups[i].offsetWidth + 'px';
}
}