TextPath now uses Text to build the context.font value for consistency and code reuse. Type._getRandomColorKey now uses an or bitwise operation to round rgb values much faster

This commit is contained in:
Eric Rowell
2013-03-19 10:17:09 -07:00
parent 97db4fc053
commit 0073c4cbb9
3 changed files with 17 additions and 9 deletions

View File

@@ -29,11 +29,12 @@
Kinetic.Plugins.TextPath.prototype = { Kinetic.Plugins.TextPath.prototype = {
_initTextPath: function(config) { _initTextPath: function(config) {
var that = this;
this.createAttrs(); this.createAttrs();
this.dummyCanvas = document.createElement('canvas'); this.dummyCanvas = document.createElement('canvas');
this.dataArray = []; this.dataArray = [];
var that = this;
// call super constructor // call super constructor
Kinetic.Shape.call(this, config); Kinetic.Shape.call(this, config);
@@ -60,7 +61,7 @@
drawFunc: function(canvas) { drawFunc: function(canvas) {
var charArr = this.charArr, context = canvas.getContext(); var charArr = this.charArr, context = canvas.getContext();
context.font = this.attrs.fontStyle + ' ' + this.attrs.fontSize + 'pt ' + this.attrs.fontFamily; context.font = this._getContextFont();
context.textBaseline = 'middle'; context.textBaseline = 'middle';
context.textAlign = 'left'; context.textAlign = 'left';
context.save(); context.save();
@@ -124,7 +125,7 @@
context.save(); context.save();
context.font = this.attrs.fontStyle + ' ' + this.attrs.fontSize + 'pt ' + this.attrs.fontFamily; context.font = this._getContextFont();
var metrics = context.measureText(text); var metrics = context.measureText(text);
context.restore(); context.restore();
@@ -304,6 +305,10 @@
} }
} }
}; };
// map TextPath methods to Text
Kinetic.Plugins.TextPath.prototype._getContextFont = Kinetic.Text.prototype._getContextFont;
Kinetic.Global.extend(Kinetic.Plugins.TextPath, Kinetic.Shape); Kinetic.Global.extend(Kinetic.Plugins.TextPath, Kinetic.Shape);
// add setters and getters // add setters and getters

View File

@@ -89,7 +89,7 @@
textArrLen = textArr.length, textArrLen = textArr.length,
totalWidth = this.getWidth(); totalWidth = this.getWidth();
context.font = fontStyle + SPACE + fontSize + PX_SPACE + fontFamily; context.font = this._getContextFont();
context.textBaseline = MIDDLE; context.textBaseline = MIDDLE;
context.textAlign = LEFT; context.textAlign = LEFT;
context.save(); context.save();
@@ -176,7 +176,7 @@
metrics; metrics;
context.save(); context.save();
context.font = this.getFontStyle() + SPACE + fontSize + PX_SPACE + this.getFontFamily(); context.font = this._getContextFont();
metrics = context.measureText(text); metrics = context.measureText(text);
context.restore(); context.restore();
@@ -185,6 +185,9 @@
height: parseInt(fontSize, 10) height: parseInt(fontSize, 10)
}; };
}, },
_getContextFont: function() {
return this.getFontStyle() + SPACE + this.getFontSize() + PX_SPACE + this.getFontFamily();
},
_expandTextData: function(arr) { _expandTextData: function(arr) {
var len = arr.length; var len = arr.length;
n = 0, n = 0,

View File

@@ -280,9 +280,9 @@
}; };
}, },
_getRandomColorKey: function() { _getRandomColorKey: function() {
var r = Math.round(Math.random() * 255); var r = (Math.random() * 255) | 0;
var g = Math.round(Math.random() * 255); var g = (Math.random() * 255) | 0;
var b = Math.round(Math.random() * 255); var b = (Math.random() * 255) | 0;
return this._rgbToHex(r, g, b); return this._rgbToHex(r, g, b);
}, },
// o1 takes precedence over o2 // o1 takes precedence over o2