| Index: chrome/test/data/third_party/spaceport/js/sprites/renderers/README.md
|
| diff --git a/chrome/test/data/third_party/spaceport/js/sprites/renderers/README.md b/chrome/test/data/third_party/spaceport/js/sprites/renderers/README.md
|
| new file mode 100644
|
| index 0000000000000000000000000000000000000000..c2606a3dc6db72381557fa741a2993547dab958c
|
| --- /dev/null
|
| +++ b/chrome/test/data/third_party/spaceport/js/sprites/renderers/README.md
|
| @@ -0,0 +1,114 @@
|
| +# Renderers
|
| +
|
| +#### css2dImg
|
| +
|
| +Renders images using the HTML `<img>` element, and transforms them using the
|
| +CSS3 2D `transform` property.
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var element = elements[i];
|
| + var sprite = sprites[i];
|
| +
|
| + element.src = sprite.img.src;
|
| + element.style.transform = sprite.cssTransform2d;
|
| + }
|
| +
|
| +#### css3dImg
|
| +
|
| +Renders images using the HTML `<img>` element, and transforms them using the
|
| +CSS3 3D `transform` property.
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var element = elements[i];
|
| + var sprite = sprites[i];
|
| +
|
| + element.src = sprite.img.src;
|
| + element.style.transform = sprite.cssTransform3d;
|
| + }
|
| +
|
| +#### css2dBackground
|
| +
|
| +Renders images using the CSS2 `background-image` property, and transforms them
|
| +using the CSS3 2D `transform` property.
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var element = elements[i];
|
| + var sprite = sprites[i];
|
| +
|
| + element.style.backgroundImage = 'url(' + sprite.img.src + ')';
|
| + element.style.transform = sprite.cssTransform2d;
|
| + element.style.width = sprite.width + 'px';
|
| + element.style.height = sprite.height + 'px';
|
| + }
|
| +
|
| +#### css3dBackground
|
| +
|
| +Renders images using the CSS2 `background-image` property, and transforms them
|
| +using the CSS3 3D `transform` property.
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var element = elements[i];
|
| + var sprite = sprites[i];
|
| +
|
| + element.style.backgroundImage = 'url(' + sprite.img.src + ')';
|
| + element.style.transform = sprite.cssTransform3d;
|
| + element.style.width = sprite.width + 'px';
|
| + element.style.height = sprite.height + 'px';
|
| + }
|
| +
|
| +#### canvasDrawImageFullClear
|
| +
|
| +Clears the entire canvas, then calls drawImage for every sprite.
|
| +
|
| + canvas.width = canvas.width;
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var m = sprites[i].matrix;
|
| + context.setTransform(m[0], m[1], m[3], m[4], m[2], m[5]);
|
| + context.drawImage(sprites[i].img, 0, 0);
|
| + }
|
| +
|
| +#### canvasDrawImageFullClearAlign
|
| +
|
| +Clears the entire canvas, then calls drawImage for every sprite. Pixel
|
| +alignment is enforced when blitting.
|
| +
|
| + canvas.width = canvas.width;
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var transform = sprites[i].transform;
|
| + context.setTransform(1, 0, 0, 1, Math.floor(transform.x), Math.floor(transform.y));
|
| + context.drawImage(sprites[i].img, 0, 0);
|
| + }
|
| +
|
| +#### canvasDrawImagePartialClear
|
| +
|
| +Clears the parts of the canvas rendered to on the previous frame, then calls
|
| +drawImage for every sprite.
|
| +
|
| + for (var i = 0; i < lastSprites.length; ++i) {
|
| + var m = lastSprites[i].matrix;
|
| + context.setTransform(m[0], m[1], m[3], m[4], m[2], m[5]);
|
| + context.clearRect(-1, -1, lastSprites[i].width + 2, lastSprites[i].height + 2);
|
| + }
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var m = sprites[i].transform;
|
| + context.setTransform(m[0], m[1], m[3], m[4], m[2], m[5]);
|
| + context.drawImage(sprite[i].img, 0, 0);
|
| + }
|
| +
|
| +#### canvasDrawImagePartialClearAlign
|
| +
|
| +Clears the parts of the canvas rendered to on the previous frame, then calls
|
| +drawImage for every sprite. Pixel alignment is enforced when blitting.
|
| +
|
| + for (var i = 0; i < lastSprites.length; ++i) {
|
| + var transform = lastSprites[i].transform;
|
| + context.setTransform(1, 0, 0, 1, Math.floor(transform.x), Math.floor(transform.y));
|
| + context.clearRect(-1, -1, lastSprites[i].width + 2, lastSprites[i].height + 2);
|
| + }
|
| +
|
| + for (var i = 0; i < sprites.length; ++i) {
|
| + var transform = sprite[i].transform;
|
| + context.setTransform(1, 0, 0, 1, Math.floor(transform.x), Math.floor(transform.y));
|
| + context.drawImage(sprite[i].img, 0, 0);
|
| + }
|
|
|