simple_spritesheet_tb.ks

;___play_anim_sprite______
[macro name='play_anim_sprite']
[layopt visible=true layer=1]
[eval exp='tf.sprite_width=mp.sprite_width']
[eval exp='tf.sprite_width=mp.sprite_width']
[eval exp='tf.total_width=mp.total_width']
[eval exp='tf.sprite_x=mp.sprite_x']
[eval exp='tf.sprite_y=mp.sprite_y']
[eval exp='tf.spritesheet=mp.spritesheet']
[eval exp='tf.fps=mp.fps']
[iscript]
if(mp.fps==null){
mp.fps=12;
}
var layer = $(".1_fore").append("<div class='loop_image'></div>");
tf.sprite_image = layer.find(".loop_image");
var now, delta, num = 0;
var then = Date.now();
var interval = 1000 /mp.fps;
var target = Math.round(mp.total_width - mp.sprite_width);
var loop = true;
tf.req = null;
tf.sprite_image.css({
    "background": "url("+mp.spritesheet+")",
    "background-position": "0px 0px",
    "position": "absolute",
    "opacity": 0,
    "top": mp.sprite_y + "px",
    "left": mp.sprite_x + "px",
    "width": mp.sprite_width+"px",
    "height": mp.sprite_height+"px"
}).fadeTo(1000,1);
function anims() {
    tf.req = requestAnimationFrame(anims);
    now = Date.now();
    delta = now - then;
    if (delta > interval) {
        then = now - (delta % interval);
        if (num >= target) {
            image.css("background-position", "0px 0px");
            if (loop) {
                num = -sprite_width;
            } else {
                cancelAnimationFrame(tf.req);
            }
        } else {
            tf.sprite_image.css("background-position", "-="+mp.sprite_width+"px 0px");
        }
        tf.num += mp.sprite_width;
    }
}
anims();
[endscript]
[endmacro]

;___remvoe_anim_sprite______
[macro name='remove_anim_sprite']
[iscript]
cancelAnimationFrame(tf.req)
tf.sprite_image.remove();
[endscript]
[endmacro]