@wordpress/block-editor
Version:
8 lines (7 loc) • 23 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/components/iframe/use-scale-canvas.js"],
"sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { useEffect, useRef, useCallback } from '@wordpress/element';\nimport { useReducedMotion, useResizeObserver } from '@wordpress/compose';\n\n/**\n * @typedef {Object} TransitionState\n * @property {number} scaleValue Scale of the canvas.\n * @property {number} frameSize Size of the frame/offset around the canvas.\n * @property {number} containerHeight containerHeight of the iframe.\n * @property {number} scrollTop ScrollTop of the iframe.\n * @property {number} scrollHeight ScrollHeight of the iframe.\n */\n\n/**\n * Calculate the scale of the canvas.\n *\n * @param {Object} options Object of options\n * @param {number} options.frameSize Size of the frame/offset around the canvas\n * @param {number} options.containerWidth Actual width of the canvas container\n * @param {number} options.maxContainerWidth Maximum width of the container to use for the scale calculation. This locks the canvas to a maximum width when zooming out.\n * @param {number} options.scaleContainerWidth Width the of the container wrapping the canvas container\n * @return {number} Scale value between 0 and/or equal to 1\n */\nfunction calculateScale( {\n\tframeSize,\n\tcontainerWidth,\n\tmaxContainerWidth,\n\tscaleContainerWidth,\n} ) {\n\treturn (\n\t\t( Math.min( containerWidth, maxContainerWidth ) - frameSize * 2 ) /\n\t\tscaleContainerWidth\n\t);\n}\n\n/**\n * Compute the next scrollHeight based on the transition states.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollHeight based on scale and frame value changes.\n */\nfunction computeScrollHeightNext( transitionFrom, transitionTo ) {\n\tconst { scaleValue: prevScale, scrollHeight: prevScrollHeight } =\n\t\ttransitionFrom;\n\tconst { frameSize, scaleValue } = transitionTo;\n\n\treturn prevScrollHeight * ( scaleValue / prevScale ) + frameSize * 2;\n}\n\n/**\n * Compute the next scrollTop position after scaling the iframe content.\n *\n * @param {TransitionState} transitionFrom Starting point of the transition\n * @param {TransitionState} transitionTo Ending state of the transition\n * @return {number} Next scrollTop position after scaling the iframe content.\n */\nfunction computeScrollTopNext( transitionFrom, transitionTo ) {\n\tconst {\n\t\tcontainerHeight: prevContainerHeight,\n\t\tframeSize: prevFrameSize,\n\t\tscaleValue: prevScale,\n\t\tscrollTop: prevScrollTop,\n\t} = transitionFrom;\n\tconst { containerHeight, frameSize, scaleValue, scrollHeight } =\n\t\ttransitionTo;\n\t// Step 0: Start with the current scrollTop.\n\tlet scrollTopNext = prevScrollTop;\n\t// Step 1: Undo the effects of the previous scale and frame around the\n\t// midpoint of the visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + prevContainerHeight / 2 - prevFrameSize ) /\n\t\t\tprevScale -\n\t\tprevContainerHeight / 2;\n\n\t// Step 2: Apply the new scale and frame around the midpoint of the\n\t// visible area.\n\tscrollTopNext =\n\t\t( scrollTopNext + containerHeight / 2 ) * scaleValue +\n\t\tframeSize -\n\t\tcontainerHeight / 2;\n\n\t// Step 3: Handle an edge case so that you scroll to the top of the\n\t// iframe if the top of the iframe content is visible in the container.\n\t// The same edge case for the bottom is skipped because changing content\n\t// makes calculating it impossible.\n\tscrollTopNext = prevScrollTop <= prevFrameSize ? 0 : scrollTopNext;\n\n\t// This is the scrollTop value if you are scrolled to the bottom of the\n\t// iframe. We can't just let the browser handle it because we need to\n\t// animate the scaling.\n\tconst maxScrollTop = scrollHeight - containerHeight;\n\n\t// Step 4: Clamp the scrollTopNext between the minimum and maximum\n\t// possible scrollTop positions. Round the value to avoid subpixel\n\t// truncation by the browser which sometimes causes a 1px error.\n\treturn Math.round(\n\t\tMath.min( Math.max( 0, scrollTopNext ), Math.max( 0, maxScrollTop ) )\n\t);\n}\n\n/**\n * Generate the keyframes to use for the zoom out animation.\n *\n * @param {TransitionState} transitionFrom Starting transition state.\n * @param {TransitionState} transitionTo Ending transition state.\n * @return {Object[]} An array of keyframes to use for the animation.\n */\nfunction getAnimationKeyframes( transitionFrom, transitionTo ) {\n\tconst {\n\t\tscaleValue: prevScale,\n\t\tframeSize: prevFrameSize,\n\t\tscrollTop,\n\t} = transitionFrom;\n\tconst { scaleValue, frameSize, scrollTop: scrollTopNext } = transitionTo;\n\n\treturn [\n\t\t{\n\t\t\ttranslate: `0 0`,\n\t\t\tscale: prevScale,\n\t\t\tpaddingTop: `${ prevFrameSize / prevScale }px`,\n\t\t\tpaddingBottom: `${ prevFrameSize / prevScale }px`,\n\t\t},\n\t\t{\n\t\t\ttranslate: `0 ${ scrollTop - scrollTopNext }px`,\n\t\t\tscale: scaleValue,\n\t\t\tpaddingTop: `${ frameSize / scaleValue }px`,\n\t\t\tpaddingBottom: `${ frameSize / scaleValue }px`,\n\t\t},\n\t];\n}\n\n/**\n * @typedef {Object} ScaleCanvasResult\n * @property {boolean} isZoomedOut A boolean indicating if the canvas is zoomed out.\n * @property {number} scaleContainerWidth The width of the container used to calculate the scale.\n * @property {Object} contentResizeListener A resize observer for the content.\n * @property {Object} containerResizeListener A resize observer for the container.\n */\n\n/**\n * Handles scaling the canvas for the zoom out mode and animating between\n * the states.\n *\n * @param {Object} options Object of options.\n * @param {number} options.frameSize Size of the frame around the content.\n * @param {Document} options.iframeDocument Document of the iframe.\n * @param {number} options.maxContainerWidth Max width of the canvas to use as the starting scale point. Defaults to 750.\n * @param {number|string} options.scale Scale of the canvas. Can be an decimal between 0 and 1, 1, or 'auto-scaled'.\n * @return {ScaleCanvasResult} Properties of the result.\n */\nexport function useScaleCanvas( {\n\tframeSize,\n\tiframeDocument,\n\tmaxContainerWidth = 750,\n\tscale,\n} ) {\n\tconst [ contentResizeListener, { height: contentHeight } ] =\n\t\tuseResizeObserver();\n\tconst [\n\t\tcontainerResizeListener,\n\t\t{ width: containerWidth, height: containerHeight },\n\t] = useResizeObserver();\n\n\tconst initialContainerWidthRef = useRef( 0 );\n\tconst isZoomedOut = scale !== 1;\n\tconst prefersReducedMotion = useReducedMotion();\n\tconst isAutoScaled = scale === 'auto-scaled';\n\t// Track if the animation should start when the useEffect runs.\n\tconst startAnimationRef = useRef( false );\n\t// Track the animation so we know if we have an animation running,\n\t// and can cancel it, reverse it, call a finish event, etc.\n\tconst animationRef = useRef( null );\n\n\tuseEffect( () => {\n\t\tif ( ! isZoomedOut ) {\n\t\t\tinitialContainerWidthRef.current = containerWidth;\n\t\t}\n\t}, [ containerWidth, isZoomedOut ] );\n\n\tconst scaleContainerWidth = Math.max(\n\t\tinitialContainerWidthRef.current,\n\t\tcontainerWidth\n\t);\n\n\tconst scaleValue = isAutoScaled\n\t\t? calculateScale( {\n\t\t\t\tframeSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth,\n\t\t } )\n\t\t: scale;\n\n\t/**\n\t * The starting transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionFromRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * The ending transition state for the zoom out animation.\n\t * @type {import('react').RefObject<TransitionState>}\n\t */\n\tconst transitionToRef = useRef( {\n\t\tscaleValue,\n\t\tframeSize,\n\t\tcontainerHeight: 0,\n\t\tscrollTop: 0,\n\t\tscrollHeight: 0,\n\t} );\n\n\t/**\n\t * Start the zoom out animation. This sets the necessary CSS variables\n\t * for animating the canvas and returns the Animation object.\n\t *\n\t * @return {Animation} The animation object for the zoom out animation.\n\t */\n\tconst startZoomOutAnimation = useCallback( () => {\n\t\tconst { scrollTop } = transitionFromRef.current;\n\t\tconst { scrollTop: scrollTopNext } = transitionToRef.current;\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top',\n\t\t\t`${ scrollTop }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next',\n\t\t\t`${ scrollTopNext }px`\n\t\t);\n\n\t\t// If the container has a scrolllbar, force a scrollbar to prevent the content from shifting while animating.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior',\n\t\t\ttransitionFromRef.current.scrollHeight ===\n\t\t\t\ttransitionFromRef.current.containerHeight\n\t\t\t\t? 'auto'\n\t\t\t\t: 'scroll'\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.add( 'zoom-out-animation' );\n\n\t\treturn iframeDocument.documentElement.animate(\n\t\t\tgetAnimationKeyframes(\n\t\t\t\ttransitionFromRef.current,\n\t\t\t\ttransitionToRef.current\n\t\t\t),\n\t\t\t{\n\t\t\t\teasing: 'cubic-bezier(0.46, 0.03, 0.52, 0.96)',\n\t\t\t\tduration: 400,\n\t\t\t}\n\t\t);\n\t}, [ iframeDocument ] );\n\n\t/**\n\t * Callback when the zoom out animation is finished.\n\t * - Cleans up animations refs.\n\t * - Adds final CSS vars for scale and frame size to preserve the state.\n\t * - Removes the 'zoom-out-animation' class (which has the fixed positioning).\n\t * - Sets the final scroll position after the canvas is no longer in fixed position.\n\t * - Removes CSS vars related to the animation.\n\t * - Sets the transitionFrom to the transitionTo state to be ready for the next animation.\n\t */\n\tconst finishZoomOutAnimation = useCallback( () => {\n\t\tstartAnimationRef.current = false;\n\t\tanimationRef.current = null;\n\n\t\t// Add our final scale and frame size now that the animation is done.\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\ttransitionToRef.current.scaleValue\n\t\t);\n\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t`${ transitionToRef.current.frameSize }px`\n\t\t);\n\n\t\tiframeDocument.documentElement.classList.remove( 'zoom-out-animation' );\n\n\t\t// Set the final scroll position that was just animated to.\n\t\t// Disable reason: Eslint isn't smart enough to know that this is a\n\t\t// DOM element. https://github.com/facebook/react/issues/31483\n\t\t// eslint-disable-next-line react-compiler/react-compiler\n\t\tiframeDocument.documentElement.scrollTop =\n\t\t\ttransitionToRef.current.scrollTop;\n\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-scroll-top-next'\n\t\t);\n\t\tiframeDocument.documentElement.style.removeProperty(\n\t\t\t'--wp-block-editor-iframe-zoom-out-overflow-behavior'\n\t\t);\n\n\t\t// Update previous values.\n\t\ttransitionFromRef.current = transitionToRef.current;\n\t}, [ iframeDocument ] );\n\n\tconst previousIsZoomedOut = useRef( false );\n\n\t/**\n\t * Runs when zoom out mode is toggled, and sets the startAnimation flag\n\t * so the animation will start when the next useEffect runs. We _only_\n\t * want to animate when the zoom out mode is toggled, not when the scale\n\t * changes due to the container resizing.\n\t */\n\tuseEffect( () => {\n\t\tconst trigger =\n\t\t\tiframeDocument && previousIsZoomedOut.current !== isZoomedOut;\n\n\t\tpreviousIsZoomedOut.current = isZoomedOut;\n\n\t\tif ( ! trigger ) {\n\t\t\treturn;\n\t\t}\n\n\t\tstartAnimationRef.current = true;\n\n\t\tif ( ! isZoomedOut ) {\n\t\t\treturn;\n\t\t}\n\n\t\tiframeDocument.documentElement.classList.add( 'is-zoomed-out' );\n\t\treturn () => {\n\t\t\tiframeDocument.documentElement.classList.remove( 'is-zoomed-out' );\n\t\t};\n\t}, [ iframeDocument, isZoomedOut ] );\n\n\t/**\n\t * This handles:\n\t * 1. Setting the correct scale and vars of the canvas when zoomed out\n\t * 2. If zoom out mode has been toggled, runs the animation of zooming in/out\n\t */\n\tuseEffect( () => {\n\t\tif ( ! iframeDocument ) {\n\t\t\treturn;\n\t\t}\n\n\t\t// We need to update the appropriate scale to exit from. If sidebars have been opened since setting the\n\t\t// original scale, we will snap to a much smaller scale due to the scale container immediately changing sizes when exiting.\n\t\tif ( isAutoScaled && transitionFromRef.current.scaleValue !== 1 ) {\n\t\t\t// We use containerWidth as the divisor, as scaleContainerWidth will always match the containerWidth when\n\t\t\t// exiting.\n\t\t\ttransitionFromRef.current.scaleValue = calculateScale( {\n\t\t\t\tframeSize: transitionFromRef.current.frameSize,\n\t\t\t\tcontainerWidth,\n\t\t\t\tmaxContainerWidth,\n\t\t\t\tscaleContainerWidth: containerWidth,\n\t\t\t} );\n\t\t}\n\n\t\tif ( scaleValue < 1 ) {\n\t\t\t// If we are not going to animate the transition, set the scale and frame size directly.\n\t\t\t// If we are animating, these values will be set when the animation is finished.\n\t\t\t// Example: Opening sidebars that reduce the scale of the canvas, but we don't want to\n\t\t\t// animate the transition.\n\t\t\tif ( ! startAnimationRef.current ) {\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale',\n\t\t\t\t\tscaleValue\n\t\t\t\t);\n\t\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t\t'--wp-block-editor-iframe-zoom-out-frame-size',\n\t\t\t\t\t`${ frameSize }px`\n\t\t\t\t);\n\t\t\t}\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-content-height',\n\t\t\t\t`${ contentHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-inner-height',\n\t\t\t\t`${ containerHeight }px`\n\t\t\t);\n\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-container-width',\n\t\t\t\t`${ containerWidth }px`\n\t\t\t);\n\t\t\tiframeDocument.documentElement.style.setProperty(\n\t\t\t\t'--wp-block-editor-iframe-zoom-out-scale-container-width',\n\t\t\t\t`${ scaleContainerWidth }px`\n\t\t\t);\n\t\t}\n\n\t\t/**\n\t\t * Handle the zoom out animation:\n\t\t *\n\t\t * - Get the current scrollTop position.\n\t\t * - Calculate where the same scroll position is after scaling.\n\t\t * - Apply fixed positioning to the canvas with a transform offset\n\t\t * to keep the canvas centered.\n\t\t * - Animate the scale and padding to the new scale and frame size.\n\t\t * - After the animation is complete, remove the fixed positioning\n\t\t * and set the scroll position that keeps everything centered.\n\t\t */\n\t\tif ( startAnimationRef.current ) {\n\t\t\t// Don't allow a new transition to start again unless it was started by the zoom out mode changing.\n\t\t\tstartAnimationRef.current = false;\n\n\t\t\t/**\n\t\t\t * If we already have an animation running, reverse it.\n\t\t\t */\n\t\t\tif ( animationRef.current ) {\n\t\t\t\tanimationRef.current.reverse();\n\t\t\t\t// Swap the transition to/from refs so that we set the correct values when\n\t\t\t\t// finishZoomOutAnimation runs.\n\t\t\t\tconst tempTransitionFrom = transitionFromRef.current;\n\t\t\t\tconst tempTransitionTo = transitionToRef.current;\n\t\t\t\ttransitionFromRef.current = tempTransitionTo;\n\t\t\t\ttransitionToRef.current = tempTransitionFrom;\n\t\t\t} else {\n\t\t\t\t/**\n\t\t\t\t * Start a new zoom animation.\n\t\t\t\t */\n\n\t\t\t\t// We can't trust the set value from contentHeight, as it was measured\n\t\t\t\t// before the zoom out mode was changed. After zoom out mode is changed,\n\t\t\t\t// appenders may appear or disappear, so we need to get the height from\n\t\t\t\t// the iframe at this point when we're about to animate the zoom out.\n\t\t\t\t// The iframe scrollTop, scrollHeight, and clientHeight will all be\n\t\t\t\t// the most accurate.\n\t\t\t\ttransitionFromRef.current.scrollTop =\n\t\t\t\t\tiframeDocument.documentElement.scrollTop;\n\t\t\t\ttransitionFromRef.current.scrollHeight =\n\t\t\t\t\tiframeDocument.documentElement.scrollHeight;\n\t\t\t\t// Use containerHeight, as it's the previous container height before the zoom out animation starts.\n\t\t\t\ttransitionFromRef.current.containerHeight = containerHeight;\n\n\t\t\t\ttransitionToRef.current = {\n\t\t\t\t\tscaleValue,\n\t\t\t\t\tframeSize,\n\t\t\t\t\tcontainerHeight:\n\t\t\t\t\t\tiframeDocument.documentElement.clientHeight, // use clientHeight to get the actual height of the new container after zoom state changes have rendered, as it will be the most up-to-date.\n\t\t\t\t};\n\n\t\t\t\ttransitionToRef.current.scrollHeight = computeScrollHeightNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\t\t\t\ttransitionToRef.current.scrollTop = computeScrollTopNext(\n\t\t\t\t\ttransitionFromRef.current,\n\t\t\t\t\ttransitionToRef.current\n\t\t\t\t);\n\n\t\t\t\tanimationRef.current = startZoomOutAnimation();\n\n\t\t\t\t// If the user prefers reduced motion, finish the animation immediately and set the final state.\n\t\t\t\tif ( prefersReducedMotion ) {\n\t\t\t\t\tfinishZoomOutAnimation();\n\t\t\t\t} else {\n\t\t\t\t\tanimationRef.current.onfinish = finishZoomOutAnimation;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}, [\n\t\tstartZoomOutAnimation,\n\t\tfinishZoomOutAnimation,\n\t\tprefersReducedMotion,\n\t\tisAutoScaled,\n\t\tscaleValue,\n\t\tframeSize,\n\t\tiframeDocument,\n\t\tcontentHeight,\n\t\tcontainerWidth,\n\t\tcontainerHeight,\n\t\tmaxContainerWidth,\n\t\tscaleContainerWidth,\n\t] );\n\n\treturn {\n\t\tisZoomedOut,\n\t\tscaleContainerWidth,\n\t\tcontentResizeListener,\n\t\tcontainerResizeListener,\n\t};\n}\n"],
"mappings": "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",
"names": []
}