topical media & game development

talk show tell print

mobile-game-ch25-spritesheet-test.htm / htm



  <!DOCTYPE HTML>
  <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Sprite Test</title>
      <script src='mobile-game-ch25-jquery.min.js'></script>
      <script src='mobile-game-ch25-underscore.js'></script>
      <script src='mobile-game-ch25-quintus.js'></script>
      <script src='mobile-game-ch25-quintus-sprites.js'></script>
    </head>
    <body>
      <script>
        var Q = Quintus().include('Sprites').setup();
        Q.load(['sprites.png','sprites.json'],function() {
          Q.compileSheets('sprites.png','sprites.json');
  
          var slowDown = 4,
              frame1 = 0, 
              frame2 = 0;
  
          Q.gameLoop(function() {
            Q.clear();
  
            var sheet1 = Q.sheet('man');
            sheet1.draw(Q.ctx,50,50,Math.floor(frame1/slowDown));
            frame1 = (frame1+1) % (sheet1.frames  * slowDown);
  
            var sheet2 = Q.sheet('blob');
            sheet2.draw(Q.ctx,150,50,Math.floor(frame2/slowDown));
            frame2 = (frame2+1) % (sheet2.frames * slowDown);
          });
        });
      </script>
    </body>
  </html>
  
  


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.