mirror of
https://github.com/photonstorm/phaser
synced 2024-11-27 15:12:18 +00:00
Added Style set methods and moved shadow sync.
This commit is contained in:
parent
b5258b55b1
commit
08d9e55066
2 changed files with 125 additions and 37 deletions
|
@ -25,8 +25,7 @@ var TextStyle = new Class({
|
||||||
|
|
||||||
function TextStyle (text, style)
|
function TextStyle (text, style)
|
||||||
{
|
{
|
||||||
// Needed?
|
this.parent = text;
|
||||||
this.text = text;
|
|
||||||
|
|
||||||
this.font = propertyMap.font[1];
|
this.font = propertyMap.font[1];
|
||||||
this.backgroundColor = propertyMap.backgroundColor[1];
|
this.backgroundColor = propertyMap.backgroundColor[1];
|
||||||
|
@ -48,17 +47,7 @@ var TextStyle = new Class({
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
setStyle: function (style)
|
syncFont: function (canvas, context)
|
||||||
{
|
|
||||||
for (var key in propertyMap)
|
|
||||||
{
|
|
||||||
this[key] = GetObjectValue(style, propertyMap[key][0], this[key]);
|
|
||||||
}
|
|
||||||
|
|
||||||
return this;
|
|
||||||
},
|
|
||||||
|
|
||||||
syncToCanvas: function (canvas, context)
|
|
||||||
{
|
{
|
||||||
context.font = this.font;
|
context.font = this.font;
|
||||||
context.textBaseline = 'alphabetic';
|
context.textBaseline = 'alphabetic';
|
||||||
|
@ -71,13 +60,132 @@ var TextStyle = new Class({
|
||||||
context.lineJoin = 'round';
|
context.lineJoin = 'round';
|
||||||
},
|
},
|
||||||
|
|
||||||
|
syncShadow: function (canvas, context, visible)
|
||||||
|
{
|
||||||
|
var style = this.style;
|
||||||
|
|
||||||
|
if (visible)
|
||||||
|
{
|
||||||
|
context.shadowOffsetX = style.shadowOffsetX;
|
||||||
|
context.shadowOffsetY = style.shadowOffsetY;
|
||||||
|
context.shadowColor = style.shadowColor;
|
||||||
|
context.shadowBlur = style.shadowBlur;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
context.shadowOffsetX = 0;
|
||||||
|
context.shadowOffsetY = 0;
|
||||||
|
context.shadowColor = 0;
|
||||||
|
context.shadowBlur = 0;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
setStyle: function (style)
|
||||||
|
{
|
||||||
|
for (var key in propertyMap)
|
||||||
|
{
|
||||||
|
this[key] = GetObjectValue(style, propertyMap[key][0], this[key]);
|
||||||
|
}
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
setFont: function (font)
|
setFont: function (font)
|
||||||
{
|
{
|
||||||
|
|
||||||
this.font = font;
|
this.font = font;
|
||||||
|
|
||||||
// Tell Text it changed
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
},
|
},
|
||||||
|
|
||||||
|
setBackgroundColor: function (color)
|
||||||
|
{
|
||||||
|
this.backgroundColor = color;
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
setFill: function (color)
|
||||||
|
{
|
||||||
|
this.fill = color;
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
setStroke: function (color, thickness)
|
||||||
|
{
|
||||||
|
if (color === undefined)
|
||||||
|
{
|
||||||
|
// Reset the stroke to zero (disabling it)
|
||||||
|
this.strokeThickness = 0;
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
|
if (thickness === undefined) { thickness = this.strokeThickness; }
|
||||||
|
|
||||||
|
this.stroke = color;
|
||||||
|
this.strokeThickness = thickness;
|
||||||
|
}
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
setShadow: function (x, y, color, blur, shadowStroke, shadowFill)
|
||||||
|
{
|
||||||
|
if (x === undefined) { x = 0; }
|
||||||
|
if (y === undefined) { y = 0; }
|
||||||
|
if (color === undefined) { color = '#000'; }
|
||||||
|
if (blur === undefined) { blur = 0; }
|
||||||
|
if (shadowStroke === undefined) { shadowStroke = false; }
|
||||||
|
if (shadowFill === undefined) { shadowFill = false; }
|
||||||
|
|
||||||
|
this.shadowOffsetX = x;
|
||||||
|
this.shadowOffsetY = y;
|
||||||
|
this.shadowColor = color;
|
||||||
|
this.shadowBlur = blur;
|
||||||
|
this.shadowStroke = shadowStroke;
|
||||||
|
this.shadowFill = shadowFill;
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
setAlign: function (align)
|
||||||
|
{
|
||||||
|
if (align === undefined) { align = 'left'; }
|
||||||
|
|
||||||
|
this.align = align;
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
setMaxLines: function (max)
|
||||||
|
{
|
||||||
|
if (max === undefined) { max = 0; }
|
||||||
|
|
||||||
|
this.maxLines = max;
|
||||||
|
|
||||||
|
this.parent.updateText();
|
||||||
|
|
||||||
|
return this;
|
||||||
|
},
|
||||||
|
|
||||||
|
destroy: function ()
|
||||||
|
{
|
||||||
|
this.parent = undefined;
|
||||||
|
}
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
module.exports = TextStyle;
|
module.exports = TextStyle;
|
||||||
|
|
|
@ -153,42 +153,22 @@ var Text = new Class({
|
||||||
|
|
||||||
if (style.strokeThickness)
|
if (style.strokeThickness)
|
||||||
{
|
{
|
||||||
this.updateShadow(style.shadowStroke);
|
this.style.syncShadow(style.shadowStroke);
|
||||||
|
|
||||||
context.strokeText(lines[i], linePositionX, linePositionY);
|
context.strokeText(lines[i], linePositionX, linePositionY);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (style.fill)
|
if (style.fill)
|
||||||
{
|
{
|
||||||
this.updateShadow(style.shadowFill);
|
this.style.syncShadow(style.shadowFill);
|
||||||
|
|
||||||
context.fillText(lines[i], linePositionX, linePositionY);
|
context.fillText(lines[i], linePositionX, linePositionY);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
|
|
||||||
// Add style callback so we can chain filter effects
|
// Add style callback so we can chain filter effects
|
||||||
|
|
||||||
updateShadow: function (visible)
|
|
||||||
{
|
|
||||||
var context = this.context;
|
|
||||||
var style = this.style;
|
|
||||||
|
|
||||||
if (visible)
|
|
||||||
{
|
|
||||||
context.shadowOffsetX = style.shadowOffsetX;
|
|
||||||
context.shadowOffsetY = style.shadowOffsetY;
|
|
||||||
context.shadowColor = style.shadowColor;
|
|
||||||
context.shadowBlur = style.shadowBlur;
|
|
||||||
}
|
|
||||||
else
|
|
||||||
{
|
|
||||||
context.shadowOffsetX = 0;
|
|
||||||
context.shadowOffsetY = 0;
|
|
||||||
context.shadowColor = 0;
|
|
||||||
context.shadowBlur = 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue