From f51da6e1e113be0d24d9f092d41faef59788bdf4 Mon Sep 17 00:00:00 2001
From: Jaspreet Singh <dev@jas.bio>
Date: Sat, 27 Apr 2019 20:38:50 +0530
Subject: [PATCH] Use flip from svelte/animate

---
 .../06-deferred-transitions/App.svelte        |  8 +++----
 .../06-deferred-transitions/flip.js           | 24 -------------------
 .../10-animations/00-animate/App.svelte       |  8 +++----
 .../examples/10-animations/00-animate/flip.js | 24 -------------------
 4 files changed, 8 insertions(+), 56 deletions(-)
 delete mode 100644 site/content/examples/09-transitions/06-deferred-transitions/flip.js
 delete mode 100644 site/content/examples/10-animations/00-animate/flip.js

diff --git a/site/content/examples/09-transitions/06-deferred-transitions/App.svelte b/site/content/examples/09-transitions/06-deferred-transitions/App.svelte
index 523da0257d..1674834c56 100644
--- a/site/content/examples/09-transitions/06-deferred-transitions/App.svelte
+++ b/site/content/examples/09-transitions/06-deferred-transitions/App.svelte
@@ -1,7 +1,7 @@
 <script>
 	import { quintOut } from 'svelte/easing';
+	import { flip } from 'svelte/animate';
 	import crossfade from './crossfade.js'; // TODO put this in svelte/transition!
-	import { flip } from './flip.js';
 
 	const { send, receive } = crossfade({
 		fallback(node, params) {
@@ -12,9 +12,9 @@
 				duration: 600,
 				easing: quintOut,
 				css: t => `
-							transform: ${transform} scale(${t});
-							opacity: ${t}
-						`,
+								transform: ${transform} scale(${t});
+								opacity: ${t}
+							`,
 			};
 		},
 	});
diff --git a/site/content/examples/09-transitions/06-deferred-transitions/flip.js b/site/content/examples/09-transitions/06-deferred-transitions/flip.js
deleted file mode 100644
index c24bc98da7..0000000000
--- a/site/content/examples/09-transitions/06-deferred-transitions/flip.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { cubicOut } from 'svelte/easing';
-
- export function flip(node, animation, params) {
-	const style = getComputedStyle(node);
-	const transform = style.transform === 'none' ? '' : style.transform;
-
- 	const dx = animation.from.left - animation.to.left;
-	const dy = animation.from.top - animation.to.top;
-
- 	const d = Math.sqrt(dx * dx + dy * dy);
-
- 	const {
-		delay = 0,
-		duration = d => Math.sqrt(d) * 120,
-		easing = cubicOut
-	} = params;
-
- 	return {
-		delay,
-		duration: typeof duration === 'function' ? duration(d) : duration,
-		easing,
-		css: (t, u) => `transform: ${transform} translate(${u * dx}px, ${u * dy}px);`
-	};
-}
\ No newline at end of file
diff --git a/site/content/examples/10-animations/00-animate/App.svelte b/site/content/examples/10-animations/00-animate/App.svelte
index 0fbc00bdc1..3f4488b147 100644
--- a/site/content/examples/10-animations/00-animate/App.svelte
+++ b/site/content/examples/10-animations/00-animate/App.svelte
@@ -1,7 +1,7 @@
 <script>
 	import { quintOut } from 'svelte/easing';
+	import { flip } from 'svelte/animate';
 	import crossfade from './crossfade.js'; // TODO put this in svelte/transition!
-	import { flip } from './flip.js';
 
 	const { send, receive } = crossfade({
 		fallback(node, params) {
@@ -12,9 +12,9 @@
 				duration: 600,
 				easing: quintOut,
 				css: t => `
-							transform: ${transform} scale(${t});
-							opacity: ${t}
-						`,
+								transform: ${transform} scale(${t});
+								opacity: ${t}
+							`,
 			};
 		},
 	});
diff --git a/site/content/examples/10-animations/00-animate/flip.js b/site/content/examples/10-animations/00-animate/flip.js
deleted file mode 100644
index c24bc98da7..0000000000
--- a/site/content/examples/10-animations/00-animate/flip.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { cubicOut } from 'svelte/easing';
-
- export function flip(node, animation, params) {
-	const style = getComputedStyle(node);
-	const transform = style.transform === 'none' ? '' : style.transform;
-
- 	const dx = animation.from.left - animation.to.left;
-	const dy = animation.from.top - animation.to.top;
-
- 	const d = Math.sqrt(dx * dx + dy * dy);
-
- 	const {
-		delay = 0,
-		duration = d => Math.sqrt(d) * 120,
-		easing = cubicOut
-	} = params;
-
- 	return {
-		delay,
-		duration: typeof duration === 'function' ? duration(d) : duration,
-		easing,
-		css: (t, u) => `transform: ${transform} translate(${u * dx}px, ${u * dy}px);`
-	};
-}
\ No newline at end of file