Repeating Layout Patterns about photoset-grid HOT 4 CLOSED

I can certainly see how a pattern like that would make for an interesting design with larger collections of images. Although if you're going to be using the photoset grid with a high number of images you'll run into a few issues:

1. The grid renders and layouts after all of the images has been loaded, so that the height and width values are available. Waiting until a large number of images load might not be ideal.
2. When the grid is in a flexible mode (100% width) you will eventually notice some performance issues if you have to resize a large number of images in the grid.

If you're working with 20-30 images it shouldn't be an issue, but if it's 100s there is a lot that would need to be rethought in the plugin.

For now you can always create a repeating pattern by using a bit of Javascript and math to count the images, divide by the total images in pattern, and duplicate the layout string as needed.

You're suggestion certainly give me some ideas on how to expand the plugin over time!

from photoset-grid.

Jonathan, not sure if this makes a difference but I believe it's now possible to output the width and height for images using Tumblr's theme tags, Jacob added it reasonably recently.

—Matt

On 15/03/2013, at 7:05 PM, Jonathan Moore [email protected] wrote:

I can certainly see how a pattern like that would make for an interesting design with larger collections of images. Although if you're going to be using the photoset grid with a high number of images you'll run into a few issues:

The grid renders and layouts after all of the images has been loaded, so that the height and width values are available. Waiting until a large number of images load might not be ideal.
When the grid is in a flexible mode (100% width) you will eventually notice some performance issues if you have to resize a large number of images in the grid.
If you're working with 20-30 images it shouldn't be an issue, but if it's 100s there is a lot that would need to be rethought in the plugin.

For now you can always create a repeating pattern by using a bit of Javascript and math to count the images, divide by the total images in pattern, and duplicate the layout string as needed.

You're suggestion certainly give me some ideas on how to expand the plugin over time!

—
Reply to this email directly or view it on GitHub.

from photoset-grid.

@matthewbuchanan That does make a difference!

For the 1.0 of the plugin I wanted to release something that works for us as a copy and paste replacement across our 21 themes. For new projects we are working with the height and width outputs.

In the next version of the plugin I'll make the imagesLoaded functionality optional if you have heights and widths specified on the images in the markup.

from photoset-grid.

I added this code at line 86:

        var minInOneRow = Math.min.apply(Math, this.rows);
        var allImages = $(elem).attr("data-count");
        var maxPossibleRows = parseInt(allImages / minInOneRow);
        for (var i = 1; i < maxPossibleRows; i++) {
          this.rows = this.rows.concat(this.rows);
        }

I will not have more than 30 thumbs per page, and they are pre-resized so it will not take too long to load page.

from photoset-grid.