tidy up

src/compile/render-dom/wrappers/Element/index.ts

@@ -666,18 +666,18 @@ export default class ElementWrapper extends Wrapper {
 		const { component } = this.renderer;
 
 		const rect = block.getUniqueName('rect');
-		const animation = block.getUniqueName('animation');
+		const stop_animation = block.getUniqueName('stop_animation');
 
 		block.addVariable(rect);
-		block.addVariable(animation);
+		block.addVariable(stop_animation, '@noop');
 
 		block.builders.measure.addBlock(deindent`
 			${rect} = ${this.var}.getBoundingClientRect();
 		`);
 
 		block.builders.fix.addBlock(deindent`
-			@fixPosition(${this.var});
+			@fix_position(${this.var});
-			if (${animation}) ${animation}.stop();
+			${stop_animation}();
 		`);
 
 		const params = this.node.animation.expression ? this.node.animation.expression.render() : '{}';
@@ -685,8 +685,8 @@ export default class ElementWrapper extends Wrapper {
 		const name = component.qualify(this.node.animation.name);
 
 		block.builders.animate.addBlock(deindent`
-			if (${animation}) ${animation}.stop();
+			${stop_animation}();
-			${animation} = @wrapAnimation(${this.var}, ${rect}, ${name}, ${params});
+			${stop_animation} = @animate(${this.var}, ${rect}, ${name}, ${params});
 		`);
 	}
 

src/internal/animations.js

@@ -2,7 +2,7 @@ import { identity as linear, noop } from './utils.js';
 import { loop } from './loop.js';
 import { create_rule, delete_rule } from './style_manager.js';
 
-export function wrapAnimation(node, from, fn, params) {
+export function animate(node, from, fn, params) {
 	if (!from) return;
 
 	const to = node.getBoundingClientRect();
@@ -68,19 +68,18 @@ export function wrapAnimation(node, from, fn, params) {
 		return true;
 	});
 
-	tick(0, 1);
-
 	if (delay) {
 		if (css) node.style.cssText += css(0, 1);
 	} else {
 		start();
 	}
 
-	// TODO just return the function
+	tick(0, 1);
-	return { stop };
+
+	return stop;
 }
 
-export function fixPosition(node) {
+export function fix_position(node) {
 	const style = getComputedStyle(node);
 
 	if (style.position !== 'absolute' && style.position !== 'fixed') {

src/internal/keyed-each.js

@@ -105,19 +105,4 @@ export function measure(blocks) {
 	let i = blocks.length;
 	while (i--) rects[blocks[i].key] = blocks[i].node.getBoundingClientRect();
 	return rects;
-}
-
-export function animate(blocks, rects, fn, params) {
-	let i = blocks.length;
-	while (i--) {
-		const block = blocks[i];
-		const from = rects[block.key];
-
-		if (!from) continue;
-		const to = block.node.getBoundingClientRect();
-
-		if (from.left === to.left && from.right === to.right && from.top === to.top && from.bottom === to.bottom) continue;
-
-
-	}
 }