Working through getting the Bitmap Text size back.

v3/src/checksum.js

@@ -1,4 +1,4 @@
 var CHECKSUM = {
-build: '923bfa40-feec-11e6-8134-ffb6fa7d3604'
+build: '82b2d2f0-fefc-11e6-b3a1-070e51e60e5d'
 };
 module.exports = CHECKSUM;

v3/src/components/GetBounds.js

@@ -7,8 +7,8 @@ var GetBounds = {
         var x = this.x;
         var y = this.y;
 
-        var w = this.width;
-        var h = this.height;
+        var w = this.displayWidth;
+        var h = this.displayHeight;
 
         var r = this.rotation;
 

v3/src/components/Size.js

@@ -1,6 +1,9 @@
 var Size = {
 
-    width: {
+    width: 0,
+    height: 0,
+
+    displayWidth: {
 
         get: function ()
         {
@@ -14,7 +17,7 @@ var Size = {
 
     },
 
-    height: {
+    displayHeight: {
 
         get: function ()
         {
@@ -26,6 +29,24 @@ var Size = {
             this.scaleY = value / this.frame.realHeight;
         }
 
+    },
+
+    setSizeToFrame: function (frame)
+    {
+        if (frame === undefined) { frame = this.frame; }
+
+        this.width = frame.realWidth;
+        this.height = frame.realHeight;
+
+        return this;
+    },
+
+    setSize: function (width, height)
+    {
+        this.width = width;
+        this.height = height;
+
+        return this;
     }
 
 };

v3/src/gameobjects/bitmaptext/BitmapText.js

@@ -2,15 +2,17 @@ var Class = require('../../utils/Class');
 var GameObject = require('../GameObject');
 var Components = require('../../components');
 var Render = require('./BitmapTextRender');
+var GetBitmapTextSize = require('./GetBitmapTextSize');
 
 var BitmapText = new Class({
 
     Mixins: [
-        Components.Transform,
-        Components.Texture,
-        Components.Size,
         Components.Alpha,
         Components.BlendMode,
+        Components.Origin,
+        Components.Size,
+        Components.Texture,
+        Components.Transform,
         Components.Visible,
         Render
     ],
@@ -31,11 +33,6 @@ var BitmapText = new Class({
 
         this.fontSize = size;
 
-        //  Setting these will enable the Size component to work
-        //  then anchorX etc will work too
-        // this.frame.realWidth = 0;
-        // this.frame.realHeight = 0;
-
         this.displayCallback;
 
         this.setTexture(font);
@@ -51,10 +48,16 @@ var BitmapText = new Class({
 
     setText: function (text)
     {
-        // this._text = text;
-        // this.dirty = true;
+        this.text = text;
 
         return this;
+    },
+
+    getTextBounds: function ()
+    {
+        var size = GetBitmapTextSize(this);
+
+        return { x: this.x + size.x, y: this.y + size.y, width: size.width, height: size.height };
     }
 
 });

v3/src/gameobjects/bitmaptext/BitmapTextCanvasRenderer.js

@@ -129,7 +129,19 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
         ctx.translate(x, y);
         ctx.rotate(rotation);
         ctx.scale(scale, scale);
+
+        ctx.fillStyle = 'rgb(255,0,255)';
+        ctx.fillRect(0, 0, glyphW, glyphH);
+
+        // if (!window.bob)
+        // {
+        //     window.bob = true;
+        //     console.log('xywh', x, y, glyphW, glyphH);
+        //     console.log('scaled', x * scale, y * scale, glyphW * scale, glyphH * scale);
+        // }
+
         ctx.drawImage(image, glyphX, glyphY, glyphW, glyphH, 0, 0, glyphW, glyphH);
+
         ctx.restore();
         
         xAdvance += glyph.xAdvance;

v3/src/gameobjects/bitmaptext/GetBitmapTextSize.js

@@ -0,0 +1,142 @@
+
+var GetBitmapTextSize = function (src)
+{
+    var text = src.text;
+    var textLength = text.length;
+
+    var bounds = {
+        x: 0,
+        y: 0,
+        width: 0,
+        height: 0
+    };
+
+    if (textLength === 0)
+    {
+        console.log('bailed');
+        return bounds;
+    }
+
+    bounds.x = Number.MAX_VALUE;
+    bounds.y = Number.MAX_VALUE;
+    bounds.width = -1;
+    bounds.height = -1;
+    
+    var textureFrame = src.frame;
+
+    var chars = src.fontData.chars;
+    var lineHeight = src.fontData.lineHeight;
+
+    var xAdvance = 0;
+    var yAdvance = 0;
+
+    var indexCount = 0;
+    var charCode = 0;
+
+    var glyph = null;
+    var glyphX = 0;
+    var glyphY = 0;
+    var glyphW = 0;
+    var glyphH = 0;
+
+    var x = 0;
+    var y = 0;
+
+    var lastGlyph = null;
+    var lastCharCode = 0;
+
+    var textureX = textureFrame.cutX;
+    var textureY = textureFrame.cutY;
+
+    var scale = (src.fontSize / src.fontData.size);
+
+    for (var index = 0; index < textLength; ++index)
+    {
+        charCode = text.charCodeAt(index);
+
+        if (charCode === 10)
+        {
+            xAdvance = 0;
+            indexCount = 0;
+            yAdvance += lineHeight;
+            lastGlyph = null;
+            continue;
+        }
+
+        glyph = chars[charCode];
+
+        if (!glyph)
+        {
+            continue;
+        }
+
+        glyphX = textureX + glyph.x;
+        glyphY = textureY + glyph.y;
+
+        glyphW = glyph.width;
+        glyphH = glyph.height;
+
+        x = indexCount + glyph.xOffset + xAdvance;
+        y = glyph.yOffset + yAdvance;
+
+        if (lastGlyph !== null)
+        {
+            var kerningOffset = glyph.kerning[lastCharCode];
+            x += (kerningOffset !== undefined) ? kerningOffset : 0;
+        }
+
+        x *= scale;
+        y *= scale;
+
+        // ctx.save();
+        // ctx.translate(x, y);
+        // ctx.rotate(rotation);
+        // ctx.scale(scale, scale);
+
+        // ctx.fillStyle = 'rgb(255,0,255)';
+        // ctx.fillRect(0, 0, glyphW, glyphH);
+
+        // ctx.drawImage(image, glyphX, glyphY, glyphW, glyphH, 0, 0, glyphW, glyphH);
+
+        // var xs = x * scale;
+        // var ys = y * scale;
+
+        if (bounds.x > x)
+        {
+            bounds.x = x;
+        }
+
+        if (bounds.y > y)
+        {
+            bounds.y = y;
+        }
+
+        var gw = x + (glyphW * scale);
+        var gh = y + (glyphH * scale);
+
+        if (bounds.width < gw)
+        {
+            bounds.width = gw - bounds.x;
+        }
+        
+        if (bounds.height < gh)
+        {
+            bounds.height = gh - bounds.y;
+        }
+
+        // console.log('Letter', text[index]);
+        // console.log('pos', x, y);
+        // console.log('wh', glyphW, glyphH);
+        // console.log('scaled', gw, gh);
+        // console.log('bounds', bounds.width, bounds.height);
+
+        xAdvance += glyph.xAdvance;
+        indexCount += 1;
+        lastGlyph = glyph;
+        lastCharCode = charCode;
+    }
+
+    return bounds;
+};
+
+module.exports = GetBitmapTextSize;

v3/src/gameobjects/image/Image.js

@@ -27,6 +27,7 @@ var Image = new Class({
 
         this.setTexture(texture, frame);
         this.setPosition(x, y);
+        this.setSizeToFrame();
         this.setOriginToCenter();
     }
 

v3/src/gameobjects/sprite/Sprite.js

@@ -27,6 +27,7 @@ var Sprite = new Class({
 
         this.setTexture(texture, frame);
         this.setPosition(x, y);
+        this.setSizeToFrame();
         this.setOriginToCenter();
     }