Insert Chars Bug
FabricJS
HTML
<script src="http://fabricjs.com/lib/fabric.js"></script>
<canvas id="paper" width="400" height="400" style="border:1px solid #ccc"></canvas>
JavaScript
nder// OVERRIDES ================================
(function() {
fabric.TextFrame = fabric.util.createClass(fabric.Textbox, {
type: 'text-frame',
initialize: function(element, options) {
this.set({
autoHeight: options.autoHeight === undefined ? true : options.autoHeight,
});
this.callSuper('initialize', element, options);
this.set({
clipTo: function(ctx){
ctx.rect(-this.width / 2, -this.height / 2,this.width, this.height);
}.bind(this)
});
this.on('scaling', function(){
this.set({
scaleX: 1,
scaleY: 1,
clipTo: function(ctx){
ctx.rect(-this.width / 2, -this.height / 2,this.width, this.height);
}
});
});
this.on('modified', function(){
this.set({
clipTo: function(ctx){
ctx.rect(-this.width / 2, -this.height / 2,this.width, this.height);
}
});
});
},
calcTextHeight: function() {
if (!this.autoHeight) {
return this.height;
} else {
var lineHeight, height = 0;
for (var i = 0, len = this._textLines.length; i < len; i++) {
lineHeight = this.getHeightOfLine(i);
height += i === len - 1 ? lineHeight / this.lineHeight : lineHeight;
}
return height;
}
},
});
var setObjectScaleOverridden = fabric.Canvas.prototype._setObjectScale;
fabric.Canvas.prototype._setObjectScale = function(localMouse, transform, lockScalingX, lockScalingY, by, lockScalingFlip, _dim) {
var t = transform.target;
if (by === "equally" && t instanceof fabric.TextFrame) {
var tw = t._getTransformedDimensions().x;
var w = t.width * (localMouse.x / tw);
var th = t._getTransformedDimensions().y;
var h = t.height * (localMouse.y / th);
t.set('width', w);
t.set('height', h);
return true;
} else if (by === "x"...