From 6c9a9b22312acde7e64462f554fe3b9006becc9f Mon Sep 17 00:00:00 2001 From: Jorge Costa Date: Tue, 2 Apr 2019 08:04:54 +0100 Subject: [PATCH] Fix: Cover Block: Remove focal point attributes when they are not needed (#14746) ## Description Currently, on the cover block, the focal points attributes are not unset even when they are not needed/used e.g: when the background is a video or when the background is fixed. This makes the markup more complex with attributes that are irrelevant. ## How has this been tested? Add a cover block with an image as background. Change the focal points. Enable the fixed background option. Check on the code editor that there are no references to the focalPoint attribute. Add a cover block with an image as background. Enable the fixed background option. Change the block to use a video background (using the media edit button + the media library). Check on the code editor that there are no references to the hasParallax attribute. Add a cover block with an image as background. Change the focal points. Change the block to use a video background (using the media edit button + the media library). Check on the code editor that there are no references to the focalPoint attribute. --- packages/block-library/src/cover/edit.js | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/block-library/src/cover/edit.js b/packages/block-library/src/cover/edit.js index bdf85c0874a757..d7e51f876156f4 100644 --- a/packages/block-library/src/cover/edit.js +++ b/packages/block-library/src/cover/edit.js @@ -137,9 +137,19 @@ class CoverEdit extends Component { url: media.url, id: media.id, backgroundType: mediaType, + ...( mediaType === VIDEO_BACKGROUND_TYPE ? + { focalPoint: undefined, hasParallax: undefined } : + {} + ), + } ); + }; + + const toggleParallax = () => { + setAttributes( { + hasParallax: ! hasParallax, + ...( ! hasParallax ? { focalPoint: undefined } : {} ), } ); }; - const toggleParallax = () => setAttributes( { hasParallax: ! hasParallax } ); const setDimRatio = ( ratio ) => setAttributes( { dimRatio: ratio } ); const style = {