Adding imagesloaded to packery module With many responsive designs it is not possible to assign image dimensions as they will be determined by the view-port dimensions. However some scripts, such as Packery, require image dimensions to be known to enable them to arrange items correctly, without overlapping or leaving large gaps. One solution often suggested (e.g. at https://drupal.stackexchange.com/a/77330/14365) is to use imagesloaded. 

I have looked at other Drupal modules such as Views Isotope and Field Slideshow which both use imagesLoaded. They each implement it in a different way and I am looking for the correct way to add it in to the Packery module.

My understanding is that: First, a call to add the imagesLoaded script needs to be added to the module file. (The script itself is added to the libraries directory within a folder named 'imagesLoaded'). Secondly, the imagesLoaded() must be declared with the JavaScript file which currently contains:

(function($) { 
  Drupal.behaviors.packery = {
    attach: function(context, settings) {
      for (var packery in settings.packery) {
        var $container = $('#' + packery);
        $container.packery(settings.packery[packery].settings);
      }
    }
  };

}(jQuery));


Within the above I need to add in:

$('#container').imagesLoaded( function() {
  // images have loaded
});


Does the way that imagesLoaded is added within the module effect if it becomes a function?
Adding the script side-wide is not really appropriate as it is only required in combination with the use of Packery. Does this mean it should be added in a certain way?
Super late but support for this request has been added in the latest commit of the Packery module: Commit 24856cf on 7.x-1.x by swim: Added imagesLoaded support on per settings basis.

Just toggle on/off on the settings page, and read the README.txt for the plugin placement. Here is a quote from the updated README.txt:


  ImagesLoaded support
  
  For imagesLoaded support please download the plugin from https://github.com/desandro/imagesloaded.
  Place the plugin in the libraries directory at sites/all/libraries/imagesloaded so that the file is at sites/all/libraries/imagesloaded/imagesloaded.pkgd.min.js.