Expanding BitmapData

examples/wip/bmd2.js

@@ -14,33 +14,32 @@ var bmd;
 
 function create() {
 
-	//game.stage.backgroundColor = '#450034';
+	bmd = game.add.bitmapData(800, 600);
 
-	bmd = game.add.bitmapData('bob', 800, 600);
+    console.log('isLittleEndian', bmd.isLittleEndian);
+    bmd.isLittleEndian = false;
+
+    bmd.beginPath();
+    bmd.beginLinearGradientFill(["#ff0000", "#ffff00"], [0, 1], 0, 0, 0, 600);
+    bmd.rect(0, 0, 800, 600);
+    bmd.closePath();
+    bmd.fill();
+
+    bmd.refreshBuffer();
 
-    //  And apply it to 100 randomly positioned sprites
     for (var i = 0; i < 100; i++)
     {
-    	//bmd.setPixel(game.world.randomX, game.world.randomY, 100 + Math.random() * 155, 100 + Math.random() * 155, 255);
+    	bmd.setPixel(game.world.randomX, game.world.randomY, 0, 0, 0);
     }
 
-    bmd.context.fillStyle = '#ffffff';
-    bmd.context.fillRect(20,20,16,16);
-
     var d = game.add.sprite(0, 0, bmd);
 
 }
 
 function update() {
 
-    // bmd.context.fillRect(game.world.randomX,game.world.randomY,4,4);
-
-    //console.log('b');
-
-
-    // bmd.setPixel(game.world.randomX, game.world.randomY, 250, 250, 250);
-    
-    bmd.setPixel(game.input.x, game.input.y, 255, 255, 255);
+    bmd.refreshBuffer();
+    bmd.setPixel(game.input.x, game.input.y, 0, 0, 0);
 
 }
 

examples/wip/bmd3.js

@@ -0,0 +1,74 @@
+
+var game = new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', { preload: preload, create: create, update: update, render: render });
+
+function preload() {
+
+    game.load.image('atari1', 'assets/sprites/atari130xe.png');
+
+}
+
+var bmd;
+var img;
+
+function create() {
+
+    var canvas = Phaser.Canvas.create(800, 600);
+    var context = canvas.getContext('2d');
+
+    context.drawImage(game.cache.getImage('atari1'), 0, 0);
+
+    img = context.getImageData(0, 0, 800, 600);
+
+    var data8 = new Uint8ClampedArray(img.data.buffer);
+    var data32 = new Uint32Array(img.data.buffer);
+
+    context.drawImage(game.cache.getImage('atari1'), 32, 50);
+
+    img = context.getImageData(0, 0, 800, 600);
+
+    // console.log(data32[y * 800 + x]);
+
+    var alpha = 255;
+    var blue = 50;
+    var red = 50;
+    var green = 100;
+
+    for (var y = 0; y < 100; y++)
+    {
+        for (var x = 0; x < 250; x++)
+        {
+            // var value = x * y & 0xff;
+            // console.log(data32[y * 800 + x]);
+            // data32[((y + 100) * 800) + x] = 0;
+            // data32[y * 800 + x] = (alpha << 24) | (blue << 16) | (green << 8) | red;;
+            // data32[y * 800 + x] = (red << 24) | (green << 16) | (blue << 8) | alpha;
+            data32[y * 800 + (x + 300)] = data32[y * 800 + x];
+        }
+    }
+
+            // 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;
+            // }
+
+    img.data.set(data8);
+    context.putImageData(img, 0, 0);
+
+    document.getElementById('phaser-example').appendChild(canvas);
+
+}
+
+function update() {
+
+
+}
+
+
+function render() {
+
+
+}