From 47d0fbfb3fb5ddde5de8feee49698ea5c0b98970 Mon Sep 17 00:00:00 2001 From: James Jackson Date: Tue, 11 Sep 2018 11:30:11 +0100 Subject: [PATCH] Fixed height/width calculations when height/width not numeric values. Allows for the auto height/width to be preserved. --- src/commands/view/SelectComponent.js | 30 +++++++++++++++++++++------- src/utils/Resizer.js | 12 +++++++++++ 2 files changed, 35 insertions(+), 7 deletions(-) diff --git a/src/commands/view/SelectComponent.js b/src/commands/view/SelectComponent.js index 40feff9ad..ef7cc0af6 100644 --- a/src/commands/view/SelectComponent.js +++ b/src/commands/view/SelectComponent.js @@ -370,14 +370,30 @@ module.exports = { // Here the resizer is updated with the current element height and width onStart(e, opts = {}) { const { el, config, resizer } = opts; - const { keyHeight, keyWidth, currentUnit } = config; + const { + keyHeight, + keyWidth, + currentUnit, + keepAutoHeight, + keepAutoWidth + } = config; toggleBodyClass('add', e, opts); modelToStyle = em.get('StyleManager').getModelToStyle(model); const computedStyle = getComputedStyle(el); const modelStyle = modelToStyle.getStyle(); - const currentWidth = modelStyle[keyWidth] || computedStyle[keyWidth]; - const currentHeight = - modelStyle[keyHeight] || computedStyle[keyHeight]; + + let currentWidth = modelStyle[keyWidth]; + config.autoWidth = keepAutoWidth && currentWidth === 'auto'; + if (isNaN(parseFloat(currentWidth))) { + currentWidth = computedStyle[keyWidth]; + } + + let currentHeight = modelStyle[keyHeight]; + config.autoHeight = keepAutoHeight && currentHeight === 'auto'; + if (isNaN(parseFloat(currentHeight))) { + currentHeight = computedStyle[keyHeight]; + } + resizer.startDim.w = parseFloat(currentWidth); resizer.startDim.h = parseFloat(currentHeight); showOffsets = 0; @@ -405,17 +421,17 @@ module.exports = { } const { store, selectedHandler, config } = options; - const { keyHeight, keyWidth } = config; + const { keyHeight, keyWidth, autoHeight, widthAuto } = config; const onlyHeight = ['tc', 'bc'].indexOf(selectedHandler) >= 0; const onlyWidth = ['cl', 'cr'].indexOf(selectedHandler) >= 0; const style = modelToStyle.getStyle(); if (!onlyHeight) { - style[keyWidth] = rect.w + config.unitWidth; + style[keyWidth] = widthAuto ? 'auto' : rect.w + config.unitWidth; } if (!onlyWidth) { - style[keyHeight] = rect.h + config.unitHeight; + style[keyHeight] = autoHeight ? 'auto' : rect.h + config.unitHeight; } modelToStyle.setStyle(style, { avoidStore: 1 }); diff --git a/src/utils/Resizer.js b/src/utils/Resizer.js index 2ec0e4da2..5d0a21090 100644 --- a/src/utils/Resizer.js +++ b/src/utils/Resizer.js @@ -45,6 +45,18 @@ var defaultOpts = { // If true the container of handlers won't be updated avoidContainerUpdate: 0, + // If height is 'auto', this setting will preserve it and only update width + keepAutoHeight: false, + + // If width is 'auto', this setting will preserve it and only update height + keepAutoWidth: false, + + // When keepAutoHeight is true and the height has the value 'auto', this is set to true and height isn't updated + autoHeight: false, + + // When keepAutoWidth is true and the width has the value 'auto', this is set to true and width isn't updated + autoWidth: false, + // Handlers tl: 1, // Top left tc: 1, // Top center