mirror of
https://github.com/photonstorm/phaser
synced 2024-11-23 05:03:37 +00:00
More updates to BitmapData.
This commit is contained in:
parent
8d48576fe2
commit
83cacb93a0
7 changed files with 196 additions and 2 deletions
|
@ -71,6 +71,8 @@ Version 1.1.3 - in build
|
|||
* Updated: If running in Canvas mode and you have a render function it will save the context and reset the transform before running your render function
|
||||
* Updated: Sprite will now check the exists property of the Group it is in, if the Group.exists = false the Sprite won't update.
|
||||
* Updated: Lots of small documentation tweaks across various files such as Pointer.
|
||||
* Updated: If you specify 'null' as a Group parent it will now revert to using the World as the parent (before only 'undefined' worked)
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
|
@ -87,10 +87,10 @@
|
|||
|
||||
<script src="../src/gameobjects/Events.js"></script>
|
||||
<script src="../src/gameobjects/GameObjectFactory.js"></script>
|
||||
<script src="../src/gameobjects/BitmapData.js"></script>
|
||||
<script src="../src/gameobjects/Sprite.js"></script>
|
||||
<script src="../src/gameobjects/TileSprite.js"></script>
|
||||
<script src="../src/gameobjects/Text.js"></script>
|
||||
<script src="../src/gameobjects/BitmapData.js"></script>
|
||||
<script src="../src/gameobjects/BitmapText.js"></script>
|
||||
<script src="../src/gameobjects/Button.js"></script>
|
||||
<script src="../src/gameobjects/Graphics.js"></script>
|
||||
|
|
|
@ -95,6 +95,7 @@
|
|||
<script src="../src/input/InputHandler.js"></script>
|
||||
<script src="../src/gameobjects/Events.js"></script>
|
||||
<script src="../src/gameobjects/GameObjectFactory.js"></script>
|
||||
<script src="../src/gameobjects/BitmapData.js"></script>
|
||||
<script src="../src/gameobjects/Sprite.js"></script>
|
||||
<script src="../src/gameobjects/TileSprite.js"></script>
|
||||
<script src="../src/gameobjects/Text.js"></script>
|
||||
|
|
|
@ -94,6 +94,7 @@
|
|||
<script src="../src/input/InputHandler.js"></script>
|
||||
<script src="../src/gameobjects/Events.js"></script>
|
||||
<script src="../src/gameobjects/GameObjectFactory.js"></script>
|
||||
<script src="../src/gameobjects/BitmapData.js"></script>
|
||||
<script src="../src/gameobjects/Sprite.js"></script>
|
||||
<script src="../src/gameobjects/TileSprite.js"></script>
|
||||
<script src="../src/gameobjects/Text.js"></script>
|
||||
|
|
47
examples/wip/bmd2.js
Normal file
47
examples/wip/bmd2.js
Normal file
|
@ -0,0 +1,47 @@
|
|||
|
||||
var game = new Phaser.Game(800, 600, Phaser.AUTO, 'phaser-example', { preload: preload, create: create, update: update, render: render });
|
||||
|
||||
function preload() {
|
||||
|
||||
game.load.image('atari1', 'assets/sprites/atari130xe.png');
|
||||
game.load.image('coke', 'assets/sprites/cokecan.png');
|
||||
game.load.image('mushroom', 'assets/sprites/mushroom2.png');
|
||||
game.load.image('ball', 'assets/sprites/shinyball.png');
|
||||
|
||||
}
|
||||
|
||||
var bmd;
|
||||
|
||||
function create() {
|
||||
|
||||
//game.stage.backgroundColor = '#450034';
|
||||
|
||||
bmd = game.add.bitmapData('bob', 800, 600);
|
||||
|
||||
// And apply it to 100 randomly positioned sprites
|
||||
for (var i = 0; i < 100; i++)
|
||||
{
|
||||
bmd.setPixel(game.world.randomX, game.world.randomY, Math.random() * 255, Math.random() * 255, 255);
|
||||
}
|
||||
|
||||
bmd.context.fillStyle = '#ffffff';
|
||||
bmd.context.fillRect(20,20,16,16);
|
||||
|
||||
var d = game.add.sprite(0, 0, bmd);
|
||||
|
||||
}
|
||||
|
||||
function update() {
|
||||
|
||||
// bmd.clear();
|
||||
|
||||
// updateWobblyBall();
|
||||
|
||||
}
|
||||
|
||||
|
||||
function render() {
|
||||
|
||||
// bmd.render();
|
||||
|
||||
}
|
|
@ -16,7 +16,7 @@
|
|||
*/
|
||||
Phaser.Group = function (game, parent, name, useStage) {
|
||||
|
||||
if (typeof parent === 'undefined')
|
||||
if (typeof parent === 'undefined' || typeof parent === null)
|
||||
{
|
||||
parent = game.world;
|
||||
}
|
||||
|
|
|
@ -52,6 +52,40 @@ Phaser.BitmapData = function (game, key, width, height) {
|
|||
*/
|
||||
this.context = this.canvas.getContext('2d');
|
||||
|
||||
/**
|
||||
* @property {array} imageData - The canvas image data.
|
||||
*/
|
||||
this.imageData = this.context.getImageData(0, 0, width, height);
|
||||
|
||||
/**
|
||||
* @property {ArrayBuffer} buffer - A TypedArray storing the canvas image data.
|
||||
* TODO: = (typeof Float32Array !== 'undefined') ? Float32Array : Array;
|
||||
*/
|
||||
this.buffer = new ArrayBuffer(this.imageData.data.length);
|
||||
|
||||
/**
|
||||
* @property {Uint8ClampedArray} buffer - A uint8 clamped view on the buffer.
|
||||
*/
|
||||
this.data8 = new Uint8ClampedArray(this.buffer);
|
||||
|
||||
/**
|
||||
* @property {Uint32Array} buffer - A Uint32 view on the buffer.
|
||||
*/
|
||||
this.data32 = new Uint32Array(this.buffer);
|
||||
|
||||
// Little or big-endian?
|
||||
this.data32[1] = 0x0a0b0c0d;
|
||||
|
||||
/**
|
||||
* @property {boolean} isLittleEndian - .
|
||||
*/
|
||||
this.isLittleEndian = true;
|
||||
|
||||
if (this.data32[4] === 0x0a && this.data32[5] === 0x0b && this.data32[6] === 0x0c && this.data32[7] === 0x0d)
|
||||
{
|
||||
this.isLittleEndian = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* @property {PIXI.BaseTexture} baseTexture - The PIXI.BaseTexture.
|
||||
* @default
|
||||
|
@ -76,6 +110,16 @@ Phaser.BitmapData = function (game, key, width, height) {
|
|||
*/
|
||||
this.type = Phaser.BITMAPDATA;
|
||||
|
||||
/**
|
||||
* You can set a globalCompositeOperation that will be applied to this BitmapData.
|
||||
* This is useful if you wish to apply an effect like 'lighten'.
|
||||
* If this value is set it will call a canvas context save and restore before and after the render pass, so use it sparingly.
|
||||
* Set to null to disable.
|
||||
* @property {string} globalCompositeOperation
|
||||
* @default
|
||||
*/
|
||||
this.globalCompositeOperation = null;
|
||||
|
||||
}
|
||||
|
||||
Phaser.BitmapData.prototype = {
|
||||
|
@ -86,6 +130,105 @@ Phaser.BitmapData.prototype = {
|
|||
|
||||
},
|
||||
|
||||
/**
|
||||
* Sets the color of the given pixel.
|
||||
* @param {number} x - The X coordinate of the pixel to be set.
|
||||
* @param {number} y - The Y coordinate of the pixel to be set.
|
||||
* @param {number} red - The red color value (between 0 and 255)
|
||||
* @param {number} green - The green color value (between 0 and 255)
|
||||
* @param {number} blue - The blue color value (between 0 and 255)
|
||||
* @param {number} alpha - The alpha color value (between 0 and 255)
|
||||
*/
|
||||
setPixel32: function (x, y, red, green, blue, alpha) {
|
||||
|
||||
if (x >= 0 && x <= this.width && y >= 0 && y <= this.height)
|
||||
{
|
||||
var value = x * y & 0xff;
|
||||
|
||||
if (this.isLittleEndian)
|
||||
{
|
||||
this.data32[y * this.width + x] = (alpha << 24) | (blue << 16) | (green << 8) | red;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.data32[y * this.width + x] = (red << 24) | (green << 16) | (blue << 8) | alpha;
|
||||
}
|
||||
|
||||
this.imageData.data.set(this.data8);
|
||||
|
||||
this.context.putImageData(this.imageData, 0, 0);
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Sets the color of the given pixel.
|
||||
* @param {number} x - The X coordinate of the pixel to be set.
|
||||
* @param {number} y - The Y coordinate of the pixel to be set.
|
||||
* @param {number} red - The red color value (between 0 and 255)
|
||||
* @param {number} green - The green color value (between 0 and 255)
|
||||
* @param {number} blue - The blue color value (between 0 and 255)
|
||||
* @param {number} alpha - The alpha color value (between 0 and 255)
|
||||
*/
|
||||
setPixel: function (x, y, red, green, blue) {
|
||||
|
||||
this.setPixel32(x, y, red, green, blue, 255);
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Get a color of a specific pixel.
|
||||
* @param x {number} X position of the pixel in this texture.
|
||||
* @param y {number} Y position of the pixel in this texture.
|
||||
* @return {number} A native color value integer (format: 0xRRGGBB)
|
||||
*/
|
||||
getPixel: function (x, y) {
|
||||
|
||||
if (x >= 0 && x <= this.width && y >= 0 && y <= this.height)
|
||||
{
|
||||
if (this.isLittleEndian)
|
||||
{
|
||||
}
|
||||
else
|
||||
{
|
||||
}
|
||||
}
|
||||
|
||||
//r = imageData.data[0];
|
||||
//g = imageData.data[1];
|
||||
//b = imageData.data[2];
|
||||
//a = imageData.data[3];
|
||||
// var imageData = this.context.getImageData(x, y, 1, 1);
|
||||
|
||||
// return Phaser.ColorUtils.getColor(imageData.data[0], imageData.data[1], imageData.data[2]);
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Get a color of a specific pixel (including alpha value).
|
||||
* @param x {number} X position of the pixel in this texture.
|
||||
* @param y {number} Y position of the pixel in this texture.
|
||||
* @return A native color value integer (format: 0xAARRGGBB)
|
||||
*/
|
||||
getPixel32: function (x, y) {
|
||||
|
||||
// var imageData = this.context.getImageData(x, y, 1, 1);
|
||||
|
||||
// return Phaser.ColorUtils.getColor32(imageData.data[3], imageData.data[0], imageData.data[1], imageData.data[2]);
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Get pixels in array in a specific Rectangle.
|
||||
* @param rect {Rectangle} The specific Rectangle.
|
||||
* @returns {array} CanvasPixelArray.
|
||||
*/
|
||||
getPixels: function (rect) {
|
||||
|
||||
// return this.context.getImageData(rect.x, rect.y, rect.width, rect.height);
|
||||
|
||||
},
|
||||
|
||||
render: function () {
|
||||
|
||||
// Only needed if running in WebGL, otherwise this array will never get cleared down I don't think!
|
||||
|
|
Loading…
Reference in a new issue