diff --git a/README.md b/README.md index 357bf85..ea0fe25 100644 --- a/README.md +++ b/README.md @@ -181,7 +181,7 @@ For video layers, if parent `clip.duration` is specified, the video will be slow | Parameter | Description | Default | | |-|-|-|-| | `path` | Path to image file | | | -| `zoomDirection` | Zoom direction for Ken Burns effect: `in` or `out` | `in` | | +| `zoomDirection` | Zoom direction for Ken Burns effect: `in`, `out` or `null` to disable | `in` | | | `zoomAmount` | Zoom amount for Ken Burns effect | `0.1` | | #### Layer type 'title' diff --git a/examples/kenBurns.json5 b/examples/kenBurns.json5 index e97d3b9..e2cc833 100644 --- a/examples/kenBurns.json5 +++ b/examples/kenBurns.json5 @@ -6,5 +6,6 @@ clips: [ { duration: 3, layers: [{ type: 'image', path: './assets/img2.jpg', zoomDirection: 'out' }] }, { duration: 3, layers: [{ type: 'image', path: './assets/img3.jpg', zoomDirection: 'in' }] }, + { duration: 3, layers: [{ type: 'image', path: './assets/img1.jpg', zoomDirection: null }] }, ], } diff --git a/sources/fabricFrameSource.js b/sources/fabricFrameSource.js index 74b8299..18cb4fd 100644 --- a/sources/fabricFrameSource.js +++ b/sources/fabricFrameSource.js @@ -100,7 +100,10 @@ async function imageFrameSource({ verbose, params, width, height, canvas }) { const img = getImg(); - const scaleFactor = zoomDirection === 'in' ? (1 + progress * zoomAmount) : (1 + zoomAmount * (1 - progress)); + let scaleFactor = 1; + if (zoomDirection === 'in') scaleFactor = (1 + progress * zoomAmount); + else if (zoomDirection === 'out') scaleFactor = (1 + zoomAmount * (1 - progress)); + if (img.height > img.width) img.scaleToHeight(height * scaleFactor); else img.scaleToWidth(width * scaleFactor);