Janky when looping through sprites

[JimmyRittenborg]

There seems to be a jank between each sprite when doing this

var canvidControl = canvid({
    selector : '.video',
    videos: {
        clip1: { src: 'clip-1.min.jpg', frames: 32, cols: 6, fps: 30, loops: 1, onEnd: function(){
          canvidControl.play('clip2');
        }},
        clip2: { src: 'clip-2.min.jpg', frames: 32, cols: 6, fps: 30, loops: 1, onEnd: function(){
          canvidControl.play('clip3');
        }},
        clip3: { src: 'clip-3.min.jpg', frames: 32, cols: 6, fps: 30, loops: 1},
    },
    width: 640,
    height: 360,
    loaded: function() {
        canvidControl.play('clip1');
    }
});

[moklick]

Thanks! I will check that

[gka]

Maybe it makes sense to allow playing of a sequence of multiple clips using one play() call:

canvidControl.play(['clip1', 'clip2', 'clip3']);

Seems to be a common use case. This would probably make it easier to solve the jank issue internally.

[rumbogs]

I don't think it can be solved, I've tried to implement a different playback system starting from canvid js, and it seems to be an issue with the implementation of requestAnimationFrame that skips a frame when switching sprite sheets.

[gka]

can you provide a complete test for this issue, for instance on jsbin / jsfiddle or similar? I tried to reproduce it with a multi-clip video but didn't see janks.