
M.bindImgs = function(miracle, allImgs) {

    allImgs.on('load', function() {
        /* On load each miracle children image dependency
         (img elem src or css bg-img) increment overall loaded images counter of miracle */

        miracle.imgsLoadedCounter++;

        if (miracle.imgsLoadedCounter >= allImgs.length) {
            /* Wait until all images dependencies are loaded */

            miracle.$.trigger('m-loaded');
        }
    });
}

@@ -41,48 +41,8 @@
  %7B%0A%0A
-    allImgs.on('load', function() %7B%0A    
     
@@ -91,20 +91,16 @@
 endency%0A
-    
      (im
@@ -175,24 +175,60 @@
  miracle */%0A
+    allImgs.on('load', function(e) %7B
 %0A        mir
@@ -224,23 +224,17 @@
         
-miracle
+M
 .imgsLoa
@@ -247,68 +247,131 @@
 nter
-++;%0A%0A        if (miracle.imgsLoadedCounter %3E= allImgs.length
+.increment(miracle);%0A    %7D);%0A%0A    /* Detect when browser failed to load image source. */%0A    allImgs.on('error', function(e
 ) %7B%0A
@@ -382,36 +382,44 @@
     
-   
- 
 /* 
-Wait until all
+Simulate load event to this
  image
-s
  dep
@@ -428,79 +428,293 @@
 denc
-ies are loaded */%0A%0A            miracle.$.trigger('m-loaded');%0A        %7D
+y to continue animations. */%0A        M.imgsLoadedCounter.increment(miracle);%0A        console.log('MIRACLE ERROR: Image dependency was not loaded. Miracle simulated load event for this image and showed it to not interrupt overall animations on page and UX. Image url: ' + e.target.src);
 %0A   

add error event for image dependencies, separate imgsLoadedCounter