foster/liabru-matter-js
0
0
Fork 0
mirror of https://github.com/liabru/matter-js.git synced 2024-11-27 09:50:52 -05:00
Code Issues Wiki Activity

render will now manage sprite images passed as paths

Browse source
This commit is contained in:
liabru 2014-03-19 22:09:29 +00:00
parent e619be0d01
commit 86457bb719
1 changed files with 31 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
src/render/Render.js
View file

@ -48,6 +48,7 @@ var Render = {};
render.canvas = render.canvas || _createCanvas(render.options.width, render.options.height); render.canvas = render.canvas || _createCanvas(render.options.width, render.options.height);
render.context = render.canvas.getContext('2d'); render.context = render.canvas.getContext('2d');
render.textures = {};
Render.setBackground(render, render.options.background); Render.setBackground(render, render.options.background);
@ -68,7 +69,12 @@ var Render = {};
*/ */
Render.setBackground = function(render, background) { Render.setBackground = function(render, background) {
if (render.currentBackground !== background) { if (render.currentBackground !== background) {
render.canvas.style.background = background; var cssBackground = background;
if (/(jpg|gif|png)$/.test(background))
cssBackground = 'url(' + background + ')';
render.canvas.style.background = cssBackground;
render.canvas.style.backgroundSize = "contain"; render.canvas.style.backgroundSize = "contain";
render.currentBackground = background; render.currentBackground = background;
} }
@ -274,7 +280,8 @@ var Render = {};
if (body.render.visible) { if (body.render.visible) {
if (body.render.sprite && !options.wireframes) { if (body.render.sprite && !options.wireframes) {
// body sprite // body sprite
var sprite = body.render.sprite; var sprite = body.render.sprite,
texture = _getTexture(render, sprite.texture);
if (options.showSleeping && body.isSleeping) if (options.showSleeping && body.isSleeping)
c.globalAlpha = 0.5; c.globalAlpha = 0.5;
@ -282,8 +289,8 @@ var Render = {};
c.translate(body.position.x, body.position.y); c.translate(body.position.x, body.position.y);
c.rotate(body.angle); c.rotate(body.angle);
c.drawImage(sprite.image, sprite.width * -0.5 * sprite.xScale, sprite.height * -0.5 * sprite.yScale, c.drawImage(texture, texture.width * -0.5 * sprite.xScale, texture.height * -0.5 * sprite.yScale,
sprite.width * sprite.xScale, sprite.height * sprite.yScale); texture.width * sprite.xScale, texture.height * sprite.yScale);
// revert translation, hopefully faster than save / restore // revert translation, hopefully faster than save / restore
c.rotate(-body.angle); c.rotate(-body.angle);
@ -493,4 +500,24 @@ var Render = {};
return canvas; return canvas;
}; };
/**
* Gets the requested texture (an Image) via its path
* @method _getTexture
* @private
* @param {render} render
* @param {string} imagePath
* @return {Image} texture
*/
var _getTexture = function(render, imagePath) {
var image = render.textures[imagePath];
if (image)
return image;
image = render.textures[imagePath] = new Image();
image.src = imagePath;
return image;
};
})(); })();