From d376e23a753032e73e5babe9c54f70fe0457cf65 Mon Sep 17 00:00:00 2001
From: Paul Chobert <paul@chobert.fr>
Date: Fri, 8 Mar 2013 13:13:15 +0100
Subject: [PATCH] use imageloaded to wait for images before masonry!

---
 app/assets/javascripts/application.js           | 1 +
 app/views/gallery/gallery/index.html.haml       | 5 +++--
 vendor/assets/javascripts/jquery.imageloaded.js | 3 +++
 3 files changed, 7 insertions(+), 2 deletions(-)
 create mode 100644 vendor/assets/javascripts/jquery.imageloaded.js

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index e6e5435..76521f9 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -18,6 +18,7 @@
 //= require bootstrap-datepicker/locales/bootstrap-datepicker.fr
 //= require bootstrap/load-image.min
 //= require bootstrap/image-gallery.min
+//= require jquery.imageloaded
 //= require masonry
 //= require select2
 //= require_tree .
diff --git a/app/views/gallery/gallery/index.html.haml b/app/views/gallery/gallery/index.html.haml
index e4b0f17..ec0ed4d 100644
--- a/app/views/gallery/gallery/index.html.haml
+++ b/app/views/gallery/gallery/index.html.haml
@@ -38,8 +38,9 @@
                 = a.date.strftime("%F")
 
 :coffeescript
-  $(window).load ->
-    $('.albums').masonry
+  $container = $('.albums')
+  $container.imagesLoaded ->
+    $container.masonry
       itemSelector: '.album'
       columnWidth: (containerWidth) ->
         containerWidth / 4
diff --git a/vendor/assets/javascripts/jquery.imageloaded.js b/vendor/assets/javascripts/jquery.imageloaded.js
new file mode 100644
index 0000000..921fabc
--- /dev/null
+++ b/vendor/assets/javascripts/jquery.imageloaded.js
@@ -0,0 +1,3 @@
+(function(c,q){var m="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==";c.fn.imagesLoaded=function(f){function n(){var b=c(j),a=c(h);d&&(h.length?d.reject(e,b,a):d.resolve(e));c.isFunction(f)&&f.call(g,e,b,a)}function p(b){k(b.target,"error"===b.type)}function k(b,a){b.src===m||-1!==c.inArray(b,l)||(l.push(b),a?h.push(b):j.push(b),c.data(b,"imagesLoaded",{isBroken:a,src:b.src}),r&&d.notifyWith(c(b),[a,e,c(j),c(h)]),e.length===l.length&&(setTimeout(n),e.unbind(".imagesLoaded",
+p)))}var g=this,d=c.isFunction(c.Deferred)?c.Deferred():0,r=c.isFunction(d.notify),e=g.find("img").add(g.filter("img")),l=[],j=[],h=[];c.isPlainObject(f)&&c.each(f,function(b,a){if("callback"===b)f=a;else if(d)d[b](a)});e.length?e.bind("load.imagesLoaded error.imagesLoaded",p).each(function(b,a){var d=a.src,e=c.data(a,"imagesLoaded");if(e&&e.src===d)k(a,e.isBroken);else if(a.complete&&a.naturalWidth!==q)k(a,0===a.naturalWidth||0===a.naturalHeight);else if(a.readyState||a.complete)a.src=m,a.src=d}):
+n();return d?d.promise(g):g}})(jQuery);