Skip to content

Commit 29cd041

Browse files
bitnenferbitnenfer
committed
Added dynamic and static bitmap text
1 parent 3300eb7 commit 29cd041

16 files changed

Lines changed: 872 additions & 3 deletions

v3/src/gameobjects/bitmaptext/BitmapText.js renamed to v3/src/gameobjects/_bitmaptext/BitmapText.js

File renamed without changes.

v3/src/gameobjects/bitmaptext/BitmapTextCanvasRenderer.js renamed to v3/src/gameobjects/_bitmaptext/BitmapTextCanvasRenderer.js

File renamed without changes.

v3/src/gameobjects/bitmaptext/BitmapTextFactory.js renamed to v3/src/gameobjects/_bitmaptext/BitmapTextFactory.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
var BitmapText = require('./BitmapText');
2-
var FactoryContainer = require('../../gameobjects/FactoryContainer');
2+
var FactoryContainer = require('../../FactoryContainer');
33

44
var BitmapTextFactory = {
55

v3/src/gameobjects/bitmaptext/BitmapTextRender.js renamed to v3/src/gameobjects/_bitmaptext/BitmapTextRender.js

File renamed without changes.

v3/src/gameobjects/bitmaptext/BitmapTextWebGLRenderer.js renamed to v3/src/gameobjects/_bitmaptext/BitmapTextWebGLRenderer.js

File renamed without changes.

‎v3/src/gameobjects/bitmaptext/dynamic/DynamicBitmapText.js‎

Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
var Class = require('../../../utils/Class');
2+
var GameObject = require('../../GameObject');
3+
var Components = require('../../../components');
4+
var Render = require('./DynamicBitmapTextRender');
5+
var GetBitmapTextSize = require('../GetBitmapTextSize');
6+
7+
var DynamicBitmapText = new Class({
8+
9+
Mixins: [
10+
Components.Alpha,
11+
Components.BlendMode,
12+
Components.Origin,
13+
Components.Size,
14+
Components.Texture,
15+
Components.Transform,
16+
Components.Visible,
17+
Render
18+
],
19+
20+
initialize:
21+
22+
function DynamicBitmapText (state, x, y, font, text, size, align)
23+
{
24+
if (text === undefined) { text = ''; }
25+
if (size === undefined) { size = 32; }
26+
if (align === undefined) { align = 'left'; }
27+
28+
GameObject.call(this, state);
29+
30+
this.fontData = this.state.sys.cache.bitmapFont.get(font);
31+
32+
this.text = text;
33+
34+
this.fontSize = size;
35+
36+
this.displayCallback;
37+
38+
this.setTexture(font);
39+
this.setPosition(x, y);
40+
},
41+
42+
setDisplayCallback: function (callback)
43+
{
44+
this.displayCallback = callback;
45+
46+
return this;
47+
},
48+
49+
setFontSize: function (size)
50+
{
51+
this.fontSize = size;
52+
53+
return this;
54+
},
55+
56+
setText: function (text)
57+
{
58+
this.text = text;
59+
60+
return this;
61+
},
62+
63+
// {
64+
// local: {
65+
// x,
66+
// y,
67+
// width,
68+
// height
69+
// },
70+
// global: {
71+
// x,
72+
// y,
73+
// width,
74+
// height
75+
// }
76+
// }
77+
78+
getTextBounds: function ()
79+
{
80+
// local = the BitmapText based on fontSize and 0x0 coords
81+
// global = the BitmapText, taking into account scale and world position
82+
83+
return GetBitmapTextSize(this);
84+
}
85+
86+
});
87+
88+
module.exports = DynamicBitmapText;

‎v3/src/gameobjects/bitmaptext/dynamic/DynamicBitmapTextCanvasRenderer.js‎

Lines changed: 149 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,149 @@
1+
var DynamicBitmapTextCanvasRenderer = function (renderer, src, interpolationPercentage, camera)
2+
{
3+
var text = src.text;
4+
var textLength = text.length;
5+
6+
if (this.renderMask !== this.renderFlags || textLength === 0)
7+
{
8+
return;
9+
}
10+
11+
var textureFrame = src.frame;
12+
13+
var displayCallback = src.displayCallback;
14+
15+
var cameraScrollX = camera.scrollX;
16+
var cameraScrollY = camera.scrollY;
17+
18+
var chars = src.fontData.chars;
19+
var lineHeight = src.fontData.lineHeight;
20+
21+
var xAdvance = 0;
22+
var yAdvance = 0;
23+
24+
var indexCount = 0;
25+
var charCode = 0;
26+
27+
var glyph = null;
28+
var glyphX = 0;
29+
var glyphY = 0;
30+
var glyphW = 0;
31+
var glyphH = 0;
32+
33+
var x = 0;
34+
var y = 0;
35+
36+
var lastGlyph = null;
37+
var lastCharCode = 0;
38+
39+
var ctx = renderer.currentContext;
40+
var image = src.frame.source.image;
41+
42+
var textureX = textureFrame.cutX;
43+
var textureY = textureFrame.cutY;
44+
45+
var rotation = 0;
46+
var scale = (src.fontSize / src.fontData.size);
47+
48+
// Blend Mode
49+
if (renderer.currentBlendMode !== src.blendMode)
50+
{
51+
renderer.currentBlendMode = src.blendMode;
52+
ctx.globalCompositeOperation = renderer.blendModes[src.blendMode];
53+
}
54+
55+
// Alpha
56+
if (renderer.currentAlpha !== src.alpha)
57+
{
58+
renderer.currentAlpha = src.alpha;
59+
ctx.globalAlpha = src.alpha;
60+
}
61+
62+
// Smoothing
63+
if (renderer.currentScaleMode !== src.scaleMode)
64+
{
65+
renderer.currentScaleMode = src.scaleMode;
66+
}
67+
68+
ctx.save();
69+
ctx.translate(src.x, src.y);
70+
ctx.rotate(src.rotation);
71+
ctx.scale(src.scaleX, src.scaleY);
72+
73+
for (var index = 0; index < textLength; ++index)
74+
{
75+
// Reset the scale (in case the callback changed it)
76+
scale = (src.fontSize / src.fontData.size);
77+
rotation = 0;
78+
79+
charCode = text.charCodeAt(index);
80+
81+
if (charCode === 10)
82+
{
83+
xAdvance = 0;
84+
indexCount = 0;
85+
yAdvance += lineHeight;
86+
lastGlyph = null;
87+
continue;
88+
}
89+
90+
glyph = chars[charCode];
91+
92+
if (!glyph)
93+
{
94+
continue;
95+
}
96+
97+
glyphX = textureX + glyph.x;
98+
glyphY = textureY + glyph.y;
99+
100+
glyphW = glyph.width;
101+
glyphH = glyph.height;
102+
103+
x = indexCount + glyph.xOffset + xAdvance;
104+
y = glyph.yOffset + yAdvance;
105+
106+
if (lastGlyph !== null)
107+
{
108+
var kerningOffset = glyph.kerning[lastCharCode];
109+
x += (kerningOffset !== undefined) ? kerningOffset : 0;
110+
}
111+
112+
if (displayCallback)
113+
{
114+
var output = displayCallback({ index: index, charCode: charCode, x: x, y: y, scale: scale, rotation: 0 });
115+
116+
x = output.x;
117+
y = output.y;
118+
scale = output.scale;
119+
rotation = output.rotation;
120+
}
121+
122+
x *= scale;
123+
y *= scale;
124+
125+
x -= cameraScrollX;
126+
y -= cameraScrollY;
127+
128+
ctx.save();
129+
ctx.translate(x, y);
130+
ctx.rotate(rotation);
131+
ctx.scale(scale, scale);
132+
133+
// ctx.fillStyle = 'rgba(0,255,0,0.2)';
134+
// ctx.fillRect(0, 0, glyphW, glyphH);
135+
136+
ctx.drawImage(image, glyphX, glyphY, glyphW, glyphH, 0, 0, glyphW, glyphH);
137+
138+
ctx.restore();
139+
140+
xAdvance += glyph.xAdvance;
141+
indexCount += 1;
142+
lastGlyph = glyph;
143+
lastCharCode = charCode;
144+
}
145+
146+
ctx.restore();
147+
};
148+
149+
module.exports = DynamicBitmapTextCanvasRenderer;

‎v3/src/gameobjects/bitmaptext/dynamic/DynamicBitmapTextFactory.js‎

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
var BitmapText = require('./DynamicBitmapText');
2+
var FactoryContainer = require('../../FactoryContainer');
3+
4+
var DynamicBitmapTextFactory = {
5+
6+
KEY: 'dynamicBitmapText',
7+
8+
add: function (x, y, font, text, size, align)
9+
{
10+
return this.state.children.add(new BitmapText(this.state, x, y, font, text, size, align));
11+
},
12+
13+
make: function (x, y, font, text, size, align)
14+
{
15+
return new BitmapText(this.state, x, y, font, text, size, align);
16+
}
17+
18+
};
19+
20+
module.exports = FactoryContainer.register(DynamicBitmapTextFactory);

‎v3/src/gameobjects/bitmaptext/dynamic/DynamicBitmapTextRender.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
module.exports = {
2+
3+
renderCanvas: require('./DynamicBitmapTextCanvasRenderer'),
4+
renderWebGL: require('./DynamicBitmapTextWebGLRenderer')
5+
6+
};

0 commit comments

Comments
 (0)