| OLD | NEW |
| (Empty) | |
| 1 define([ 'util/ensureCallback' ], function (ensureCallback) { |
| 2 var IMAGE_SRC = 'assets/monstro-fada.png'; |
| 3 |
| 4 var FRAME_WIDTH = 37 * 3; |
| 5 var FRAME_HEIGHT = 58 * 3; |
| 6 |
| 7 var FRAMES_HORIZ = 6; |
| 8 var FRAMES_VERT = 1; |
| 9 |
| 10 var TOTAL_FRAMES = FRAMES_HORIZ * FRAMES_VERT; |
| 11 |
| 12 function ImageSource(img) { |
| 13 this.img = img; |
| 14 |
| 15 var canvas = document.createElement('canvas'); |
| 16 canvas.width = FRAME_WIDTH; |
| 17 canvas.height = FRAME_HEIGHT; |
| 18 |
| 19 var context = canvas.getContext('2d'); |
| 20 context.globalCompositeOperation = 'copy'; |
| 21 |
| 22 this.frameImages = [ ]; |
| 23 this.frameInfos = [ ]; |
| 24 var x, y; |
| 25 for (y = 0; y < FRAMES_VERT; ++y) { |
| 26 for (x = 0; x < FRAMES_HORIZ; ++x) { |
| 27 var px = x * FRAME_WIDTH; |
| 28 var py = y * FRAME_WIDTH; |
| 29 |
| 30 context.drawImage( |
| 31 img, |
| 32 px, py, |
| 33 FRAME_WIDTH, FRAME_HEIGHT, |
| 34 0, 0, |
| 35 FRAME_WIDTH, FRAME_HEIGHT |
| 36 ); |
| 37 |
| 38 var frameImage = new window.Image(); |
| 39 frameImage.src = canvas.toDataURL(); |
| 40 |
| 41 this.frameInfos.push({ |
| 42 x: px, |
| 43 y: py, |
| 44 width: FRAME_WIDTH, |
| 45 height: FRAME_HEIGHT, |
| 46 image: frameImage, |
| 47 sheetImage: img |
| 48 }); |
| 49 } |
| 50 } |
| 51 |
| 52 // TODO Cycle frameInfos |
| 53 } |
| 54 |
| 55 ImageSource.prototype.getImage = function getImage(frameIndex) { |
| 56 return this.frameInfos[frameIndex % TOTAL_FRAMES].image; |
| 57 }; |
| 58 |
| 59 ImageSource.prototype.drawToCanvas = function drawToCanvas(context, dx, dy,
frameIndex) { |
| 60 var frameInfo = this.frameInfos[frameIndex % TOTAL_FRAMES]; |
| 61 |
| 62 context.drawImage( |
| 63 frameInfo.sheetImage, |
| 64 frameInfo.x, frameInfo.y, |
| 65 frameInfo.width, frameInfo.height, |
| 66 dx, dy, |
| 67 frameInfo.width, frameInfo.height |
| 68 ); |
| 69 }; |
| 70 |
| 71 ImageSource.prototype.getFrameInfo = function getFrameInfo(frameIndex) { |
| 72 return this.frameInfos[frameIndex % TOTAL_FRAMES]; |
| 73 }; |
| 74 |
| 75 return function spriteSheet(callback) { |
| 76 callback = ensureCallback(callback); |
| 77 |
| 78 var img = new window.Image(); |
| 79 img.onload = function () { |
| 80 var imageSource = new ImageSource(img); |
| 81 callback(null, imageSource); |
| 82 }; |
| 83 img.src = IMAGE_SRC; |
| 84 }; |
| 85 }); |
| OLD | NEW |