Tidy up the code a little.

pull/3292/head
pngwn 6 years ago
parent 1360b2a547
commit fc807c797e

@ -28,7 +28,7 @@
await Promise.all([ await Promise.all([
time.set(1000, {duration, easing: x => x}), time.set(1000, {duration, easing: x => x}),
value.set(0, {duration, easing: current.fn}) value.set(0, {duration, easing: current.fn})
]) ]);
playing = false; playing = false;
} }

@ -11,7 +11,7 @@
const dispatch = createEventDispatcher(); const dispatch = createEventDispatcher();
$: mobile = width && width < 600 $: mobile = width && width < 600;
</script> </script>
<style> <style>
@ -25,7 +25,7 @@
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
font-size: 18px font-size: 18px;
} }
li { li {
@ -183,6 +183,4 @@
{playing ? 'Restart' : 'Play'} {playing ? 'Restart' : 'Play'}
</button> </button>
</div> </div>
</div> </div>

@ -1,44 +1,44 @@
import * as eases from 'svelte/easing'; import * as eases from 'svelte/easing';
let processed_eases = {}; const processed_eases = {};
for (let ease in eases) { for (const ease in eases) {
if (ease === "linear") { if (ease === "linear") {
processed_eases.linear = eases.linear; processed_eases.linear = eases.linear;
} else { } else {
const name = ease.replace(/In$|InOut$|Out$/, ''); const name = ease.replace(/In$|InOut$|Out$/, '');
const type = ease.match(/In$|InOut$|Out$/)[0]; const type = ease.match(/In$|InOut$|Out$/)[0];
if (!processed_eases.hasOwnProperty(name)) processed_eases[name] = {}; if (!(name in processed_eases)) processed_eases[name] = {};
processed_eases[name][type] = {}; processed_eases[name][type] = {};
processed_eases[name][type].fn = eases[ease]; processed_eases[name][type].fn = eases[ease];
let shape = 'M0 1000' let shape = 'M0 1000';
for (let i = 1; i <= 1000; i++) { for (let i = 1; i <= 1000; i++) {
shape = `${shape} L${(i / 1000) * 1000} ${1000 - eases[ease](i / 1000) * 1000} `; shape = `${shape} L${(i / 1000) * 1000} ${1000 - eases[ease](i / 1000) * 1000} `;
processed_eases[name][type].shape = shape; processed_eases[name][type].shape = shape;
} }
} }
} }
let sorted_eases = new Map([ const sorted_eases = new Map([
['sine', processed_eases.sine], ['sine', processed_eases.sine],
['quad', processed_eases.quad], ['quad', processed_eases.quad],
['cubic', processed_eases.cubic], ['cubic', processed_eases.cubic],
['quart', processed_eases.quart], ['quart', processed_eases.quart],
['quint', processed_eases.quint], ['quint', processed_eases.quint],
['expo', processed_eases.expo], ['expo', processed_eases.expo],
['circ', processed_eases.circ], ['circ', processed_eases.circ],
['back', processed_eases.back], ['back', processed_eases.back],
['elastic', processed_eases.elastic], ['elastic', processed_eases.elastic],
['bounce', processed_eases.bounce], ['bounce', processed_eases.bounce],
]); ]);
export let types = [ export const types = [
['Ease In', 'In'], ['Ease In', 'In'],
['Ease Out', 'Out'], ['Ease Out', 'Out'],
['Ease In Out', 'InOut'] ['Ease In Out', 'InOut']
]; ];
export { sorted_eases as eases }; export { sorted_eases as eases };
Loading…
Cancel
Save