docs: convert "media-image" in to AnimationEditor

motion-canvas · Apr 29, 2023 · c8b6bd6 · c8b6bd6
1 parent c87cbd6
commit c8b6bd6
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 57 deletions.
diff --git a/packages/docs/docs/getting-started/media.mdx b/packages/docs/docs/getting-started/media.mdx
@@ -110,7 +110,25 @@ export default makeScene2D(function* (view) {
 });
 ```
 
-<AnimationPlayer name="media-image" small />
+```tsx editor
+import {makeScene2D} from '@motion-canvas/2d/lib/scenes';
+import {Img} from '@motion-canvas/2d/lib/components';
+import {createRef} from '@motion-canvas/core/lib/utils';
+import {all} from '@motion-canvas/core/lib/flow';
+
+import logoSvg from '@motion-canvas/examples/assets/logo.svg';
+
+export default makeScene2D(function* (view) {
+  const imageRef = createRef<Img>();
+
+  yield view.add(<Img ref={imageRef} src={logoSvg} scale={2} />);
+
+  yield* all(
+    imageRef().scale(2.5, 1.5).to(2, 1.5),
+    imageRef().absoluteRotation(90, 1.5).to(0, 1.5),
+  );
+});
+```
 
 ### Supported Formats
 

diff --git a/packages/examples/src/media-image.meta b/packages/examples/src/media-image.meta
diff --git a/packages/examples/src/media-image.ts b/packages/examples/src/media-image.ts
diff --git a/packages/examples/src/scenes/media-image.meta b/packages/examples/src/scenes/media-image.meta
diff --git a/packages/examples/src/scenes/media-image.tsx b/packages/examples/src/scenes/media-image.tsx
diff --git a/packages/examples/vite.config.ts b/packages/examples/vite.config.ts
@@ -6,7 +6,6 @@ export default defineConfig({
     motionCanvas({
       project: [
         './src/quickstart.ts',
-        './src/media-image.ts',
         './src/media-video.ts',
         './src/logging.ts',
         './src/transitions.ts',