diff --git a/src/js/includes/RulerHandler.js b/src/js/includes/RulerHandler.js index 33cba56..ec2bd5b 100644 --- a/src/js/includes/RulerHandler.js +++ b/src/js/includes/RulerHandler.js @@ -14,20 +14,24 @@ function RulerHandler(viewport) { * Triggers when handlebar is moved */ onMove: function () { - var axis = this.axis; - var bounds = viewport.getBounds(); - var pos = util.assertBetween(this[axis], bounds.min[axis], bounds.max[axis]); - this.marker[axis] = this[axis] = pos; - var dim = (this[axis] - bounds[axis]) / (viewport.getData().ppmm * 10 * viewport.canvas.getImage().scaleX); - - if (axis === 'top') { - dim = viewport.getData().dim.height - dim; - } - - this.setText(Math.round(dim * 100) / 100 + ' ' + viewport.getData().dim.units); + updateRulerText(this); } }; + function updateRulerText(ruler) { + var axis = ruler.axis; + var bounds = viewport.getBounds(); + var pos = util.assertBetween(ruler[axis], bounds.min[axis], bounds.max[axis]); + ruler.marker[axis] = ruler[axis] = pos; + var dim = (ruler[axis] - bounds[axis]) / (viewport.getData().ppmm * 10 * viewport.canvas.getImage().scaleX); + + if (axis === 'top') { + dim = viewport.getData().dim.height - dim; + } + + ruler.setText(Math.round(dim * 100) / 100 + ' ' + viewport.getData().dim.units); + } + /** * @return {fabric.Line} */ @@ -62,16 +66,29 @@ function RulerHandler(viewport) { * @return {RulerHandler} */ this.enable = function (enabled) { + var bounds = viewport.getBounds(); + + var keepPosition = ( + enabled && (_enabled === enabled) && + _lines.x && (Math.abs(_lines.x.width - bounds.width) < 1) && + _lines.y && (Math.abs(_lines.y.height - bounds.height) < 1) + ); + + if (keepPosition) { + updateRulerText(_rect.x); + updateRulerText(_rect.y); + return this; + } + _enabled = enabled; + this.clear(); if (!_enabled) { viewport.canvas.renderAll(); - return; + return this; } - var bounds = viewport.getBounds(); - _lines = { x: getLine('x'), y: getLine('y') }; viewport.canvas.add(_lines.x);