diff --git a/app/scripts/fabric-extensions/annotations.js b/app/scripts/fabric-extensions/annotations.js index c1b6720..e74d7d8 100644 --- a/app/scripts/fabric-extensions/annotations.js +++ b/app/scripts/fabric-extensions/annotations.js @@ -90,6 +90,32 @@ function handleAnnotations(annotationTool) { }); } }); + + canvas.on('text:editing:entered', (e) => { + e.target.__annotationTextLastValue = e.target.hiddenTextarea.value; + if (e.target.__annotationKeyUpHandler) { + e.target.hiddenTextarea.removeEventListener("keyup", e.target.__annotationKeyUpHandler); + } + + e.target.__annotationKeyUpHandler = (keyEvent) => { + var key = keyEvent.key; + var value = e.target.hiddenTextarea.value; + if (((key === "Delete") || (key === "Backspace")) && (value === "") && (e.target.__annotationTextLastValue === "")) { + e.target.hiddenTextarea.removeEventListener("keyup", e.target.__annotationKeyUpHandler); + e.target.__annotationKeyUpHandler = null; + canvas.remove(e.target); + } + e.target.__annotationTextLastValue = value; + } + e.target.hiddenTextarea.addEventListener("keyup", e.target.__annotationKeyUpHandler); + }); + + canvas.on('text:editing:exiting', (e) => { + if (e.target.__annotationKeyUpHandler) { + e.target.hiddenTextarea.removeEventListener("keyup", e.target.__annotationKeyUpHandler); + e.target.__annotationKeyUpHandler = null; + } + }); } module.exports = handleAnnotations; @@ -305,6 +331,15 @@ module.exports = handleAnnotations; point.y >= borderRect.top && point.y <= borderRect.top + borderRect.height; }, + exitEditing: function() { + // fire this before calling into the library so we have access to the hidden textarea + // which isn't present when the 'text:editing:exited' event is fired + if (this.canvas) { + this.canvas.fire('text:editing:exiting', { target: this }); + } + this.callSuper('exitEditing'); + }, + _renderTextCommon: function (ctx, method) { this.callSuper('_renderTextCommon', ctx, method);