Skip to content

Commit 3826eb7

Browse files
committed
Working through getting the Bitmap Text size back.
1 parent 0ba77e5 commit 3826eb7

8 files changed

Lines changed: 195 additions & 15 deletions

File tree

v3/src/checksum.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
11
var CHECKSUM = {
2-
build: '923bfa40-feec-11e6-8134-ffb6fa7d3604'
2+
build: '82b2d2f0-fefc-11e6-b3a1-070e51e60e5d'
33
};
44
module.exports = CHECKSUM;

v3/src/components/GetBounds.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,8 +7,8 @@ var GetBounds = {
77
var x = this.x;
88
var y = this.y;
99

10-
var w = this.width;
11-
var h = this.height;
10+
var w = this.displayWidth;
11+
var h = this.displayHeight;
1212

1313
var r = this.rotation;
1414

v3/src/components/Size.js

Lines changed: 23 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
var Size = {
22

3-
width: {
3+
width: 0,
4+
height: 0,
5+
6+
displayWidth: {
47

58
get: function ()
69
{
@@ -14,7 +17,7 @@ var Size = {
1417

1518
},
1619

17-
height: {
20+
displayHeight: {
1821

1922
get: function ()
2023
{
@@ -26,6 +29,24 @@ var Size = {
2629
this.scaleY = value / this.frame.realHeight;
2730
}
2831

32+
},
33+
34+
setSizeToFrame: function (frame)
35+
{
36+
if (frame === undefined) { frame = this.frame; }
37+
38+
this.width = frame.realWidth;
39+
this.height = frame.realHeight;
40+
41+
return this;
42+
},
43+
44+
setSize: function (width, height)
45+
{
46+
this.width = width;
47+
this.height = height;
48+
49+
return this;
2950
}
3051

3152
};

v3/src/gameobjects/bitmaptext/BitmapText.js

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,15 +2,17 @@ var Class = require('../../utils/Class');
22
var GameObject = require('../GameObject');
33
var Components = require('../../components');
44
var Render = require('./BitmapTextRender');
5+
var GetBitmapTextSize = require('./GetBitmapTextSize');
56

67
var BitmapText = new Class({
78

89
Mixins: [
9-
Components.Transform,
10-
Components.Texture,
11-
Components.Size,
1210
Components.Alpha,
1311
Components.BlendMode,
12+
Components.Origin,
13+
Components.Size,
14+
Components.Texture,
15+
Components.Transform,
1416
Components.Visible,
1517
Render
1618
],
@@ -31,11 +33,6 @@ var BitmapText = new Class({
3133

3234
this.fontSize = size;
3335

34-
// Setting these will enable the Size component to work
35-
// then anchorX etc will work too
36-
// this.frame.realWidth = 0;
37-
// this.frame.realHeight = 0;
38-
3936
this.displayCallback;
4037

4138
this.setTexture(font);
@@ -51,10 +48,16 @@ var BitmapText = new Class({
5148

5249
setText: function (text)
5350
{
54-
// this._text = text;
55-
// this.dirty = true;
51+
this.text = text;
5652

5753
return this;
54+
},
55+
56+
getTextBounds: function ()
57+
{
58+
var size = GetBitmapTextSize(this);
59+
60+
return { x: this.x + size.x, y: this.y + size.y, width: size.width, height: size.height };
5861
}
5962

6063
});

v3/src/gameobjects/bitmaptext/BitmapTextCanvasRenderer.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -129,7 +129,19 @@ var BitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage,
129129
ctx.translate(x, y);
130130
ctx.rotate(rotation);
131131
ctx.scale(scale, scale);
132+
133+
ctx.fillStyle = 'rgb(255,0,255)';
134+
ctx.fillRect(0, 0, glyphW, glyphH);
135+
136+
// if (!window.bob)
137+
// {
138+
// window.bob = true;
139+
// console.log('xywh', x, y, glyphW, glyphH);
140+
// console.log('scaled', x * scale, y * scale, glyphW * scale, glyphH * scale);
141+
// }
142+
132143
ctx.drawImage(image, glyphX, glyphY, glyphW, glyphH, 0, 0, glyphW, glyphH);
144+
133145
ctx.restore();
134146

135147
xAdvance += glyph.xAdvance;
Lines changed: 142 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
2+
var GetBitmapTextSize = function (src)
3+
{
4+
var text = src.text;
5+
var textLength = text.length;
6+
7+
var bounds = {
8+
x: 0,
9+
y: 0,
10+
width: 0,
11+
height: 0
12+
};
13+
14+
if (textLength === 0)
15+
{
16+
console.log('bailed');
17+
return bounds;
18+
}
19+
20+
bounds.x = Number.MAX_VALUE;
21+
bounds.y = Number.MAX_VALUE;
22+
bounds.width = -1;
23+
bounds.height = -1;
24+
25+
var textureFrame = src.frame;
26+
27+
var chars = src.fontData.chars;
28+
var lineHeight = src.fontData.lineHeight;
29+
30+
var xAdvance = 0;
31+
var yAdvance = 0;
32+
33+
var indexCount = 0;
34+
var charCode = 0;
35+
36+
var glyph = null;
37+
var glyphX = 0;
38+
var glyphY = 0;
39+
var glyphW = 0;
40+
var glyphH = 0;
41+
42+
var x = 0;
43+
var y = 0;
44+
45+
var lastGlyph = null;
46+
var lastCharCode = 0;
47+
48+
var textureX = textureFrame.cutX;
49+
var textureY = textureFrame.cutY;
50+
51+
var scale = (src.fontSize / src.fontData.size);
52+
53+
for (var index = 0; index < textLength; ++index)
54+
{
55+
charCode = text.charCodeAt(index);
56+
57+
if (charCode === 10)
58+
{
59+
xAdvance = 0;
60+
indexCount = 0;
61+
yAdvance += lineHeight;
62+
lastGlyph = null;
63+
continue;
64+
}
65+
66+
glyph = chars[charCode];
67+
68+
if (!glyph)
69+
{
70+
continue;
71+
}
72+
73+
glyphX = textureX + glyph.x;
74+
glyphY = textureY + glyph.y;
75+
76+
glyphW = glyph.width;
77+
glyphH = glyph.height;
78+
79+
x = indexCount + glyph.xOffset + xAdvance;
80+
y = glyph.yOffset + yAdvance;
81+
82+
if (lastGlyph !== null)
83+
{
84+
var kerningOffset = glyph.kerning[lastCharCode];
85+
x += (kerningOffset !== undefined) ? kerningOffset : 0;
86+
}
87+
88+
x *= scale;
89+
y *= scale;
90+
91+
// ctx.save();
92+
// ctx.translate(x, y);
93+
// ctx.rotate(rotation);
94+
// ctx.scale(scale, scale);
95+
96+
// ctx.fillStyle = 'rgb(255,0,255)';
97+
// ctx.fillRect(0, 0, glyphW, glyphH);
98+
99+
// ctx.drawImage(image, glyphX, glyphY, glyphW, glyphH, 0, 0, glyphW, glyphH);
100+
101+
// var xs = x * scale;
102+
// var ys = y * scale;
103+
104+
if (bounds.x > x)
105+
{
106+
bounds.x = x;
107+
}
108+
109+
if (bounds.y > y)
110+
{
111+
bounds.y = y;
112+
}
113+
114+
var gw = x + (glyphW * scale);
115+
var gh = y + (glyphH * scale);
116+
117+
if (bounds.width < gw)
118+
{
119+
bounds.width = gw - bounds.x;
120+
}
121+
122+
if (bounds.height < gh)
123+
{
124+
bounds.height = gh - bounds.y;
125+
}
126+
127+
// console.log('Letter', text[index]);
128+
// console.log('pos', x, y);
129+
// console.log('wh', glyphW, glyphH);
130+
// console.log('scaled', gw, gh);
131+
// console.log('bounds', bounds.width, bounds.height);
132+
133+
xAdvance += glyph.xAdvance;
134+
indexCount += 1;
135+
lastGlyph = glyph;
136+
lastCharCode = charCode;
137+
}
138+
139+
return bounds;
140+
};
141+
142+
module.exports = GetBitmapTextSize;

v3/src/gameobjects/image/Image.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ var Image = new Class({
2727

2828
this.setTexture(texture, frame);
2929
this.setPosition(x, y);
30+
this.setSizeToFrame();
3031
this.setOriginToCenter();
3132
}
3233

v3/src/gameobjects/sprite/Sprite.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,7 @@ var Sprite = new Class({
2727

2828
this.setTexture(texture, frame);
2929
this.setPosition(x, y);
30+
this.setSizeToFrame();
3031
this.setOriginToCenter();
3132
}
3233

0 commit comments

Comments
 (0)