snap.load() fails to load multiple svgs properly

Question

Exactly how Snap.load() loads svgs internally. If run iteratively on array of svgs the script shows array index of bound. If run recursively the order of the images messes up. Although one by one loading works fine. Here is what i tried: http://jsfiddle.net/nahid/C3q2r/

p.s: comment out the necessary portions to see the behavior.

Answer 1

I was originally thinking of another way (posted in google groups an answer), but I think this solution is a bit neater if it works for you, so putting this as an answer...

To get them in order, you could call the next loading on completion of the the previous loading, which is what I think you were trying to do.

jsfiddle here... http://jsfiddle.net/C3q2r/4/

    var handlr = function( i ){
        if(i >= svg_array.length) return;

        var name = svg_array[i];
        Snap.load(name,function(f){

            var g = f.select('g');
            footpaper[i].append(g.clone());   
            }, handlr( i + 1)); 

    }
    handlr(0);