From ca91809a4451285606d313da06431aabbdca6311 Mon Sep 17 00:00:00 2001 From: Fluffy-Bean <michal-gdula@protonmail.com> Date: Mon, 29 May 2023 10:39:31 +0000 Subject: [PATCH] Update Grid and Square functions --- onlylegs/static/js/grid.js | 25 ++++++++++++++++++++----- onlylegs/static/js/square.js | 11 +++-------- 2 files changed, 23 insertions(+), 13 deletions(-) diff --git a/onlylegs/static/js/grid.js b/onlylegs/static/js/grid.js index 339dcd7..54aae09 100644 --- a/onlylegs/static/js/grid.js +++ b/onlylegs/static/js/grid.js @@ -8,6 +8,21 @@ function makeGrid() { const maxWidth = container.clientWidth - gap; 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 let calculated = {}; for (let i = 0; i < images.length; i++) { @@ -37,15 +52,13 @@ function makeGrid() { let currectLength = 0; // While the row is not full add images to it - while (currectLength < maxWidth) { + while (currectLength < maxWidth && i !== images.length) { currentRow.push(i); currectLength += calculated[i]["width"]; i++; } - // currentRow.push(i); - // currectLength += calculated[i]["width"]; - - // Go back one image as it can't be added to the row + + // Go back one image since the last one pushed the row over the limit i--; // Calculate the amount of space required to fill the row @@ -70,4 +83,6 @@ function makeGrid() { nextTop += maxHeight + gap; nextLeft = gap; } + + container.style.height = nextTop + 'px'; } \ No newline at end of file diff --git a/onlylegs/static/js/square.js b/onlylegs/static/js/square.js index 83e0482..ff9bfb4 100644 --- a/onlylegs/static/js/square.js +++ b/onlylegs/static/js/square.js @@ -1,11 +1,6 @@ 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'; + let square = document.getElementsByClassName('square') + for (let i = 0; i < square.length; i++) { + square[i].style.height = square[i].offsetWidth + 'px'; } } \ No newline at end of file