mirror of
https://github.com/Derpy-Leggies/OnlyLegs.git
synced 2025-02-13 17:00:05 +00:00
Update Grid and Square functions
This commit is contained in:
parent
4435325003
commit
ca91809a44
|
@ -8,6 +8,21 @@ function makeGrid() {
|
||||||
const maxWidth = container.clientWidth - gap;
|
const maxWidth = container.clientWidth - gap;
|
||||||
const maxHeight = 13 * 16;
|
const maxHeight = 13 * 16;
|
||||||
|
|
||||||
|
|
||||||
|
if (window.innerWidth < 800) {
|
||||||
|
for (let i = 0; i < images.length; i++) {
|
||||||
|
images[i].style.height = images[i].offsetWidth + 'px';
|
||||||
|
|
||||||
|
images[i].style.width = null;
|
||||||
|
images[i].style.left = null;
|
||||||
|
images[i].style.top = null;
|
||||||
|
}
|
||||||
|
|
||||||
|
container.style.height = null;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// Calculate the width and height of each image
|
// Calculate the width and height of each image
|
||||||
let calculated = {};
|
let calculated = {};
|
||||||
for (let i = 0; i < images.length; i++) {
|
for (let i = 0; i < images.length; i++) {
|
||||||
|
@ -37,15 +52,13 @@ function makeGrid() {
|
||||||
let currectLength = 0;
|
let currectLength = 0;
|
||||||
|
|
||||||
// While the row is not full add images to it
|
// While the row is not full add images to it
|
||||||
while (currectLength < maxWidth) {
|
while (currectLength < maxWidth && i !== images.length) {
|
||||||
currentRow.push(i);
|
currentRow.push(i);
|
||||||
currectLength += calculated[i]["width"];
|
currectLength += calculated[i]["width"];
|
||||||
i++;
|
i++;
|
||||||
}
|
}
|
||||||
// currentRow.push(i);
|
|
||||||
// currectLength += calculated[i]["width"];
|
// Go back one image since the last one pushed the row over the limit
|
||||||
|
|
||||||
// Go back one image as it can't be added to the row
|
|
||||||
i--;
|
i--;
|
||||||
|
|
||||||
// Calculate the amount of space required to fill the row
|
// Calculate the amount of space required to fill the row
|
||||||
|
@ -70,4 +83,6 @@ function makeGrid() {
|
||||||
nextTop += maxHeight + gap;
|
nextTop += maxHeight + gap;
|
||||||
nextLeft = gap;
|
nextLeft = gap;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
container.style.height = nextTop + 'px';
|
||||||
}
|
}
|
|
@ -1,11 +1,6 @@
|
||||||
function keepSquare() {
|
function keepSquare() {
|
||||||
const images = document.querySelectorAll('.gallery-item');
|
let square = document.getElementsByClassName('square')
|
||||||
for (let i = 0; i < images.length; i++) {
|
for (let i = 0; i < square.length; i++) {
|
||||||
images[i].style.height = images[i].offsetWidth + 'px';
|
square[i].style.height = square[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';
|
|
||||||
}
|
}
|
||||||
}
|
}
|
Loading…
Reference in a new issue