[timcrob]

Is there any way to randomize the portfolio? I’m interested in having a unique order each refresh. Let me know if this is doable!

[ahmetsali]

Hi, yes this is possible; open main.js and find this code

                               // initialize isotope
				$container.isotope({
				  itemSelector : '.item',
				  layoutMode : 'fitRows'
				});

and replace it with this code;

                               // initialize isotope
				$container.isotope({
				  itemSelector : '.item',
				  layoutMode : 'fitRows',
				  sortBy : 'random'
				});

[timcrob]

Great, that works well. Currently the photos are loading in the order they were uploaded, and once everything is completed, they resort to a random order. It looks a bit glitchy. Is there a way to have the page randomize, then load the images?

[ahmetsali]

Hi, currently isotope plugin waits for the images to be loaded, before execution, you can disable this and make isotope plugin execute immediately by removing two lines of code;

            if($container.length) {
			//$container.waitForImages(function() {    *** remove this line
				
				// initialize isotope
				$container.isotope({
				  itemSelector : '.item',
				  layoutMode : 'fitRows',
				  sortBy : 'random'
				});
				
				// filter items when filter link is clicked
				$('#filters a').click(function(){
				  var selector = $(this).attr('data-filter');
				  $container.isotope({ filter: selector });
				  $(this).parent().addClass('current').siblings().removeClass('current');
				  return false;
				});
				
			//} ,null,true);             *** remove this line too
		}

[timcrob]

That will load everything in a random order, and once it fully loads, re-randomizes it once again. It also interferes somehow with the stylesheet. i.e.: https://skitch.com/timcrob/eekqy/random

[ahmetsali]

I guess you need to revert back the last changes. It looks like, in order to work properly, Isotope plugin shouldn’t be executed unless all the images loaded.

[timcrob]

is there a conditional I can put in to allow that to occur?

[ahmetsali]

sorry, i don’t understand what you mean.

[timcrob]

is there some kind of if/then statement i can put in the js so the isotope plugin isn’t executive until all images are uploaded?

Or is this what you had me to do with the last bit of code? I may have misunderstood your response

• This reply was modified 13 years, 9 months ago by timcrob.

[ahmetsali]

Hi, in the original code, isotope waits for images to be loaded before execution. I made you remove this code in my second post (by removing two lines). You can revert this changes, then it should be fine. But there will still be a delay before isotope randomizes portfolio items as it should wait until images are loaded.

[timcrob]

@ahmetsali ever since we tried this randomization my portfolio has loaded like this : https://skitch.com/timcrob/ekynx/randomloading

and readjusts to full width rows once the images load. Is there anything you can think of that would cause this to happen?

[ahmetsali]

Hi, as i can see in the screenshot, your thumbnails are in various height, so they may look weird until all the images loaded and isotope plugin called. When isotope is executed it will fix the layout, since this is a responsive theme, we can’t know the exact image size and so can not execute isotope plugin until all the images are loaded.

[teeohkay]

where can I find main.js???

[ahmetsali]

@teeohkay

it is in the theme folder; wp-content/themes/responsy-v3.1/js/main.js