Browse Source

Merge pull request #920 from nojacko/dev Fixes #914

Fixed TypeError when canvas has been removed.
pull/934/merge
Artur Arseniev 9 years ago
committed by GitHub
parent
commit
1e3dc7124f
No known key found for this signature in database GPG Key ID: 4AEE18F83AFDEB23
  1. 66
      src/canvas/index.js
  2. 18
      src/canvas/view/CanvasView.js
  3. 26
      src/commands/view/SelectComponent.js
  4. 18
      src/rich_text_editor/index.js

66
src/canvas/index.js

@ -245,40 +245,44 @@ module.exports = () => {
getTargetToElementDim(target, element, options) { getTargetToElementDim(target, element, options) {
var opts = options || {}; var opts = options || {};
var canvasPos = CanvasView.getPosition(); var canvasPos = CanvasView.getPosition();
var pos = opts.elPos || CanvasView.getElementPos(element); if (canvasPos) {
var toRight = options.toRight || 0; var pos = opts.elPos || CanvasView.getElementPos(element);
var targetHeight = opts.targetHeight || target.offsetHeight; var toRight = options.toRight || 0;
var targetWidth = opts.targetWidth || target.offsetWidth; var targetHeight = opts.targetHeight || target.offsetHeight;
var eventToTrigger = opts.event || null; var targetWidth = opts.targetWidth || target.offsetWidth;
var eventToTrigger = opts.event || null;
var elTop = pos.top - targetHeight;
var elLeft = pos.left; var elTop = pos.top - targetHeight;
elLeft += toRight ? pos.width : 0; var elLeft = pos.left;
elLeft = toRight ? elLeft - targetWidth : elLeft; elLeft += toRight ? pos.width : 0;
elLeft = toRight ? elLeft - targetWidth : elLeft;
var leftPos = elLeft < canvasPos.left ? canvasPos.left : elLeft;
var topPos = elTop < canvasPos.top ? canvasPos.top : elTop; var leftPos = elLeft < canvasPos.left ? canvasPos.left : elLeft;
topPos = topPos > pos.top + pos.height ? pos.top + pos.height : topPos; var topPos = elTop < canvasPos.top ? canvasPos.top : elTop;
topPos = topPos > pos.top + pos.height ? pos.top + pos.height : topPos;
var result = {
top: topPos, var result = {
left: leftPos, top: topPos,
elementTop: pos.top, left: leftPos,
elementLeft: pos.left, elementTop: pos.top,
elementWidth: pos.width, elementLeft: pos.left,
elementHeight: pos.height, elementWidth: pos.width,
targetWidth: target.offsetWidth, elementHeight: pos.height,
targetHeight: target.offsetHeight, targetWidth: target.offsetWidth,
canvasTop: canvasPos.top, targetHeight: target.offsetHeight,
canvasLeft: canvasPos.left canvasTop: canvasPos.top,
}; canvasLeft: canvasPos.left
};
// In this way I can catch data and also change the position strategy
if (eventToTrigger && c.em) {
c.em.trigger(eventToTrigger, result);
}
// In this way I can catch data and also change the position strategy return result;
if (eventToTrigger && c.em) {
c.em.trigger(eventToTrigger, result);
} }
return result; return null;
}, },
/** /**

18
src/canvas/view/CanvasView.js

@ -308,13 +308,17 @@ module.exports = Backbone.View.extend({
* @private * @private
*/ */
getPosition() { getPosition() {
var bEl = this.frame.el.contentDocument.body; if (this.frame.el.contentDocument) {
var fo = this.getFrameOffset(); var bEl = this.frame.el.contentDocument.body;
var co = this.getCanvasOffset(); var fo = this.getFrameOffset();
return { var co = this.getCanvasOffset();
top: fo.top + bEl.scrollTop - co.top, return {
left: fo.left + bEl.scrollLeft - co.left top: fo.top + bEl.scrollTop - co.top,
}; left: fo.left + bEl.scrollLeft - co.left
};
}
return null;
}, },
/** /**

26
src/commands/view/SelectComponent.js

@ -222,13 +222,15 @@ module.exports = {
var u = 'px'; var u = 'px';
bStyle.display = 'block'; bStyle.display = 'block';
var canvasPos = canvas.getCanvasView().getPosition(); var canvasPos = canvas.getCanvasView().getPosition();
var badgeH = badge ? badge.offsetHeight : 0; if (canvasPos) {
var badgeW = badge ? badge.offsetWidth : 0; var badgeH = badge ? badge.offsetHeight : 0;
var top = var badgeW = badge ? badge.offsetWidth : 0;
pos.top - badgeH < canvasPos.top ? canvasPos.top : pos.top - badgeH; var top =
var left = pos.left + badgeW < canvasPos.left ? canvasPos.left : pos.left; pos.top - badgeH < canvasPos.top ? canvasPos.top : pos.top - badgeH;
bStyle.top = top + u; var left = pos.left + badgeW < canvasPos.left ? canvasPos.left : pos.left;
bStyle.left = left + u; bStyle.top = top + u;
bStyle.left = left + u;
}
}, },
/** /**
@ -446,10 +448,12 @@ module.exports = {
elPos, elPos,
event: 'toolbarPosUpdate' event: 'toolbarPosUpdate'
}); });
var leftPos = pos.left + pos.elementWidth - pos.targetWidth; if (pos) {
toolbarStyle.top = pos.top + unit; var leftPos = pos.left + pos.elementWidth - pos.targetWidth;
toolbarStyle.left = (leftPos < 0 ? 0 : leftPos) + unit; toolbarStyle.top = pos.top + unit;
toolbarStyle.display = origDisp; toolbarStyle.left = (leftPos < 0 ? 0 : leftPos) + unit;
toolbarStyle.display = origDisp;
}
}, },
/** /**

18
src/rich_text_editor/index.js

@ -225,16 +225,18 @@ module.exports = () => {
event: 'rteToolbarPosUpdate' event: 'rteToolbarPosUpdate'
}); });
if (config.adjustToolbar) { if (pos) {
// Move the toolbar down when the top canvas edge is reached if (config.adjustToolbar) {
if (pos.top <= pos.canvasTop) { // Move the toolbar down when the top canvas edge is reached
pos.top = pos.elementTop + pos.elementHeight; if (pos.top <= pos.canvasTop) {
pos.top = pos.elementTop + pos.elementHeight;
}
} }
}
const toolbarStyle = toolbar.style; const toolbarStyle = toolbar.style;
toolbarStyle.top = pos.top + un; toolbarStyle.top = pos.top + un;
toolbarStyle.left = pos.left + un; toolbarStyle.left = pos.left + un;
}
}, },
/** /**

Loading…
Cancel
Save