Create new
Bindings
Transitions
Animations
Easing
Component composition
Context API
Special elements
Module context
Debugging
Miscellaneous
App.svelte
Controls.svelte
Grid.svelte
eases.js
runes
This component is in runes mode.
To disable runes mode, add the following to the top of your component:
<svelte:options runes={false} />
999
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
⌄
⌄
⌄
⌄
<script>
import { interpolateString as interpolate } from 'd3-interpolate';
import { tweened } from 'svelte/motion';
import Grid from './Grid.svelte';
import Controls from './Controls.svelte';
import { eases, types } from './eases.js';
let current_type = $state('In');
let current_ease = $state('sine');
let duration = $state(2000);
let current = $state(eases.get(current_ease)[current_type]);
let playing = $state(false);
let width = $state();
const ease_path = tweened(current.shape, { interpolate });
const time = tweened(0);
const value = tweened(1000);
$effect(() => {
current = eases.get(current_ease)[current_type];
});
$effect(() => {
current && runAnimations();
});
async function runAnimations() {
playing = true;
value.set(1000, { duration: 0 });
time.set(0, { duration: 0 });
await ease_path.set(current.shape);
await Promise.all([
time.set(1000, { duration, easing: (x) => x }),
value.set(0, { duration, easing: current.fn })
Error compiling component
WebAssembly.instantiateStreaming(): value type opcode @+13
999
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
›
⌄
⌄
⌄
⌄
import 'svelte/internal/disclose-version';
import * as $ from 'svelte/internal/client';
import { interpolateString as interpolate } from 'd3-interpolate';
import { tweened } from 'svelte/motion';
import Grid from './Grid.svelte';
import Controls from './Controls.svelte';
import { eases, types } from './eases.js';
var root = $.template(`<div class="easing-vis svelte-1c68mg5"><svg viewBox="0 0 1400 1802" class="svelte-1c68mg5"><g class="canvas"><!><g class="graph svelte-1c68mg5"><path stroke="#ff3e00" stroke-width="2" fill="none"></path><path d="M0,23.647C0,22.41 27.014,0.407 28.496,0.025C29.978,-0.357 69.188,3.744 70.104,4.744C71.02,5.745 71.02,41.499 70.104,42.5C69.188,43.501 29.978,47.601 28.496,47.219C27.014,46.837 0,24.884 0,23.647Z" fill="#ff3e00"></path><circle r="15" fill="#ff3e00"></circle></g></g></svg> <!></div>`);
export default function App($$anchor, $$props) {
$.push($$props, true);
const [$$stores, $$cleanup] = $.setup_stores();
const $time = () => $.store_get(time, '$time', $$stores);
const $value = () => $.store_get(value, '$value', $$stores);
const $ease_path = () => $.store_get(ease_path, '$ease_path', $$stores);
let current_type = $.state('In');
let current_ease = $.state('sine');
let duration = $.state(2000);
let current = $.state($.proxy(eases.get($.get(current_ease))[$.get(current_type)]));
let playing = $.state(false);
let width = $.state(undefined);
const ease_path = tweened($.get(current).shape, { interpolate });
const time = tweened(0);
const value = tweened(1000);
$.user_effect(() => {
$.set(current, $.proxy(eases.get($.get(current_ease))[$.get(current_type)]));
});
$.user_effect(() => {
$.get(current) && runAnimations();
});
async function runAnimations() {
result = svelte.compile(source, {
generate: ,
});99
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
›
:root {
scrollbar-gutter: stable;
}
.easing-vis.svelte-1c68mg5 {
display: flex;
max-height: 95%;
max-width: 800px;
margin: auto;
border: 1px solid #333;
border-radius: 2px;
padding: 20px;
}
svg.svelte-1c68mg5 {
width: 100%;
margin: 0 20px 0 0;
}
.graph.svelte-1c68mg5 {
transform: translate(200px, 400px);
}
@media (max-width: 600px) {
.easing-vis.svelte-1c68mg5 {
flex-direction: column;
max-height: calc(100% - 3rem);
}
}
Root {
css: StyleSheet {...}
- type: "StyleSheet"
- start: 1789
- end: 2215
- attributes: []
children: [...] (5)
Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 1798
- end: 1803
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 1798
- end: 1803
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
PseudoClassSelector {...}
- type: "PseudoClassSelector"
- name: "root"
- args: null
- start: 1798
- end: 1803
}
]- start: 1798
- end: 1803
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 1804
- end: 1836
children: [...] (1)
Declaration {...}
- type: "Declaration"
- start: 1808
- end: 1832
- property: "scrollbar-gutter"
- value: "stable"
}
]
}- start: 1798
- end: 1836
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 1839
- end: 1850
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 1839
- end: 1850
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
ClassSelector {...}
- type: "ClassSelector"
- name: "easing-vis"
- start: 1839
- end: 1850
}
]- start: 1839
- end: 1850
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 1851
- end: 1992
children: [...] (7)
Declaration {...}
- type: "Declaration"
- start: 1855
- end: 1868
- property: "display"
- value: "flex"
} Declaration {...}
- type: "Declaration"
- start: 1872
- end: 1887
- property: "max-height"
- value: "95%"
} Declaration {...}
- type: "Declaration"
- start: 1891
- end: 1907
- property: "max-width"
- value: "800px"
} Declaration {...}
- type: "Declaration"
- start: 1911
- end: 1923
- property: "margin"
- value: "auto"
} Declaration {...}
- type: "Declaration"
- start: 1927
- end: 1949
- property: "border"
- value: "1px solid #333"
} Declaration {...}
- type: "Declaration"
- start: 1953
- end: 1971
- property: "border-radius"
- value: "2px"
} Declaration {...}
- type: "Declaration"
- start: 1975
- end: 1988
- property: "padding"
- value: "20px"
}
]
}- start: 1839
- end: 1992
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 1995
- end: 1998
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 1995
- end: 1998
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
TypeSelector {...}
- type: "TypeSelector"
- name: "svg"
- start: 1995
- end: 1998
}
]- start: 1995
- end: 1998
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 1999
- end: 2040
children: [...] (2)
Declaration {...}
- type: "Declaration"
- start: 2003
- end: 2014
- property: "width"
- value: "100%"
} Declaration {...}
- type: "Declaration"
- start: 2018
- end: 2036
- property: "margin"
- value: "0 20px 0 0"
}
]
}- start: 1995
- end: 2040
} Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 2043
- end: 2049
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 2043
- end: 2049
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
ClassSelector {...}
- type: "ClassSelector"
- name: "graph"
- start: 2043
- end: 2049
}
]- start: 2043
- end: 2049
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 2050
- end: 2092
children: [...] (1)
Declaration {...}
- type: "Declaration"
- start: 2054
- end: 2088
- property: "transform"
- value: "translate(200px, 400px)"
}
]
}- start: 2043
- end: 2092
} Atrule {...}
- type: "Atrule"
- start: 2095
- end: 2206
- name: "media"
- prelude: "(max-width: 600px)"
block: Block {...}
- type: "Block"
- start: 2121
- end: 2206
children: [...] (1)
Rule {...}
- type: "Rule"
prelude: SelectorList {...}
- type: "SelectorList"
- start: 2125
- end: 2136
children: [...] (1)
ComplexSelector {...}
- type: "ComplexSelector"
- start: 2125
- end: 2136
children: [...] (1)
RelativeSelector {...}
- type: "RelativeSelector"
- combinator: null
selectors: [...] (1)
ClassSelector {...}
- type: "ClassSelector"
- name: "easing-vis"
- start: 2125
- end: 2136
}
]- start: 2125
- end: 2136
}
]
}
]
}block: Block {...}
- type: "Block"
- start: 2137
- end: 2203
children: [...] (2)
Declaration {...}
- type: "Declaration"
- start: 2142
- end: 2164
- property: "flex-direction"
- value: "column"
} Declaration {...}
- type: "Declaration"
- start: 2169
- end: 2198
- property: "max-height"
- value: "calc(100% - 3rem)"
}
]
}- start: 2125
- end: 2203
}
]
}
}
]content: {...}
- start: 1796
- end: 2207
- styles: "\n\t:root {\n\t\tscrollbar-gutter: stable;\n\t}\n\n\t.easing-vis {\n\t\tdisplay: flex;\n\t\tmax-height: 95%;\n\t\tmax-width: 800px;\n\t\tmargin: auto;\n\t\tborder: 1px solid #333;\n\t\tborder-radius: 2px;\n\t\tpadding: 20px;\n\t}\n\n\tsvg {\n\t\twidth: 100%;\n\t\tmargin: 0 20px 0 0;\n\t}\n\n\t.graph {\n\t\ttransform: translate(200px, 400px);\n\t}\n\n\t@media (max-width: 600px) {\n\t\t.easing-vis {\n\t\t\tflex-direction: column;\n\t\t\tmax-height: calc(100% - 3rem);\n\t\t}\n\t}\n"
- comment: null
}
}- js: []
- start: 1025
- end: 1787
- type: "Root"
fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 1023
- end: 1025
- raw: "\n\n"
- data: "\n\n"
} RegularElement {...}
- type: "RegularElement"
- start: 1025
- end: 1787
- name: "div"
attributes: [...] (2)
BindDirective {...}
- start: 1030
- end: 1054
- type: "BindDirective"
- name: "offsetWidth"
expression: Identifier {...}
- type: "Identifier"
- start: 1048
- end: 1053
loc: {...}
start: {...}
- line: 43
- column: 23
}end: {...}
- line: 43
- column: 28
}
}- name: "width"
}- modifiers: []
} Attribute {...}
- type: "Attribute"
- start: 1055
- end: 1073
- name: "class"
value: [...] (1)
Text {...}
- start: 1062
- end: 1072
- type: "Text"
- raw: "easing-vis"
- data: "easing-vis svelte-1c68mg5"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 1074
- end: 1076
- raw: "\n\t"
- data: "\n\t"
} RegularElement {...}
- type: "RegularElement"
- start: 1076
- end: 1640
- name: "svg"
attributes: [...] (2)
Attribute {...}
- type: "Attribute"
- start: 1081
- end: 1104
- name: "viewBox"
value: [...] (1)
Text {...}
- start: 1090
- end: 1103
- type: "Text"
- raw: "0 0 1400 1802"
- data: "0 0 1400 1802"
}
]
} Attribute {...}
- type: "Attribute"
- start: -1
- end: -1
- name: "class"
value: [...] (1)
Text {...}
- type: "Text"
- data: "svelte-1c68mg5"
- raw: "svelte-1c68mg5"
- start: -1
- end: -1
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (3)
Text {...}
- type: "Text"
- start: 1105
- end: 1108
- raw: "\n\t\t"
- data: "\n\t\t"
} RegularElement {...}
- type: "RegularElement"
- start: 1108
- end: 1632
- name: "g"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: 1111
- end: 1125
- name: "class"
value: [...] (1)
Text {...}
- start: 1118
- end: 1124
- type: "Text"
- raw: "canvas"
- data: "canvas"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (5)
Text {...}
- type: "Text"
- start: 1126
- end: 1130
- raw: "\n\t\t\t"
- data: "\n\t\t\t"
} Component {...}
- type: "Component"
- start: 1130
- end: 1159
- name: "Grid"
attributes: [...] (2)
Attribute {...}
- type: "Attribute"
- start: 1136
- end: 1145
- name: "x"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1138
- end: 1145
expression: Identifier {...}
- type: "Identifier"
- start: 1139
- end: 1144
loc: {...}
start: {...}
- line: 46
- column: 12
}end: {...}
- line: 46
- column: 17
}
}- name: "$time"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1146
- end: 1156
- name: "y"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1148
- end: 1156
expression: Identifier {...}
- type: "Identifier"
- start: 1149
- end: 1155
loc: {...}
start: {...}
- line: 46
- column: 22
}end: {...}
- line: 46
- column: 28
}
}- name: "$value"
}
}
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 1159
- end: 1163
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 1163
- end: 1625
- name: "g"
attributes: [...] (1)
Attribute {...}
- type: "Attribute"
- start: 1166
- end: 1179
- name: "class"
value: [...] (1)
Text {...}
- start: 1173
- end: 1178
- type: "Text"
- raw: "graph"
- data: "graph svelte-1c68mg5"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
nodes: [...] (7)
Text {...}
- type: "Text"
- start: 1180
- end: 1185
- raw: "\n\t\t\t\t"
- data: "\n\t\t\t\t"
} RegularElement {...}
- type: "RegularElement"
- start: 1185
- end: 1254
- name: "path"
attributes: [...] (4)
Attribute {...}
- type: "Attribute"
- start: 1191
- end: 1205
- name: "d"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1193
- end: 1205
expression: Identifier {...}
- type: "Identifier"
- start: 1194
- end: 1204
loc: {...}
start: {...}
- line: 48
- column: 13
}end: {...}
- line: 48
- column: 23
}
}- name: "$ease_path"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1206
- end: 1222
- name: "stroke"
value: [...] (1)
Text {...}
- start: 1214
- end: 1221
- type: "Text"
- raw: "#ff3e00"
- data: "#ff3e00"
}
]
} Attribute {...}
- type: "Attribute"
- start: 1223
- end: 1239
- name: "stroke-width"
value: [...] (1)
Text {...}
- start: 1237
- end: 1238
- type: "Text"
- raw: "2"
- data: "2"
}
]
} Attribute {...}
- type: "Attribute"
- start: 1240
- end: 1251
- name: "fill"
value: [...] (1)
Text {...}
- start: 1246
- end: 1250
- type: "Text"
- raw: "none"
- data: "none"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 1254
- end: 1260
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 1260
- end: 1556
- name: "path"
attributes: [...] (3)
Attribute {...}
- type: "Attribute"
- start: 1271
- end: 1470
- name: "d"
value: [...] (1)
Text {...}
- start: 1274
- end: 1469
- type: "Text"
- raw: "M0,23.647C0,22.41 27.014,0.407 28.496,0.025C29.978,-0.357 69.188,3.744 70.104,4.744C71.02,5.745 71.02,41.499 70.104,42.5C69.188,43.501 29.978,47.601 28.496,47.219C27.014,46.837 0,24.884 0,23.647Z"
- data: "M0,23.647C0,22.41 27.014,0.407 28.496,0.025C29.978,-0.357 69.188,3.744 70.104,4.744C71.02,5.745 71.02,41.499 70.104,42.5C69.188,43.501 29.978,47.601 28.496,47.219C27.014,46.837 0,24.884 0,23.647Z"
}
]
} Attribute {...}
- type: "Attribute"
- start: 1476
- end: 1490
- name: "fill"
value: [...] (1)
Text {...}
- start: 1482
- end: 1489
- type: "Text"
- raw: "#ff3e00"
- data: "#ff3e00"
}
]
} Attribute {...}
- type: "Attribute"
- start: 1496
- end: 1549
- name: "style"
value: [...] (3)
Text {...}
- start: 1503
- end: 1532
- type: "Text"
- raw: "transform: translate(1060px, "
- data: "transform: translate(1060px, "
} ExpressionTag {...}
- type: "ExpressionTag"
- start: 1532
- end: 1545
expression: BinaryExpression {...}
- type: "BinaryExpression"
- start: 1533
- end: 1544
loc: {...}
start: {...}
- line: 53
- column: 42
}end: {...}
- line: 53
- column: 53
}
}left: Identifier {...}
- type: "Identifier"
- start: 1533
- end: 1539
loc: {...}
start: {...}
- line: 53
- column: 42
}end: {...}
- line: 53
- column: 48
}
}- name: "$value"
}- operator: "-"
right: Literal {...}
- type: "Literal"
- start: 1542
- end: 1544
loc: {...}
start: {...}
- line: 53
- column: 51
}end: {...}
- line: 53
- column: 53
}
}- value: 24
- raw: "24"
}
}
} Text {...}
- start: 1545
- end: 1548
- type: "Text"
- raw: "px)"
- data: "px)"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 1556
- end: 1562
- raw: " "
- data: " "
} RegularElement {...}
- type: "RegularElement"
- start: 1562
- end: 1617
- name: "circle"
attributes: [...] (4)
Attribute {...}
- type: "Attribute"
- start: 1570
- end: 1580
- name: "cx"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1573
- end: 1580
expression: Identifier {...}
- type: "Identifier"
- start: 1574
- end: 1579
loc: {...}
start: {...}
- line: 56
- column: 16
}end: {...}
- line: 56
- column: 21
}
}- name: "$time"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1581
- end: 1592
- name: "cy"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1584
- end: 1592
expression: Identifier {...}
- type: "Identifier"
- start: 1585
- end: 1591
loc: {...}
start: {...}
- line: 56
- column: 27
}end: {...}
- line: 56
- column: 33
}
}- name: "$value"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1593
- end: 1599
- name: "r"
value: [...] (1)
Text {...}
- start: 1596
- end: 1598
- type: "Text"
- raw: "15"
- data: "15"
}
]
} Attribute {...}
- type: "Attribute"
- start: 1600
- end: 1614
- name: "fill"
value: [...] (1)
Text {...}
- start: 1606
- end: 1613
- type: "Text"
- raw: "#ff3e00"
- data: "#ff3e00"
}
]
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 1617
- end: 1621
- raw: "\n\t\t\t"
- data: "\n\t\t\t"
}
]
}
} Text {...}
- type: "Text"
- start: 1625
- end: 1628
- raw: "\n\t\t"
- data: "\n\t\t"
}
]
}
} Text {...}
- type: "Text"
- start: 1632
- end: 1634
- raw: "\n\t"
- data: "\n\t"
}
]
}
} Text {...}
- type: "Text"
- start: 1640
- end: 1643
- raw: " "
- data: " "
} Component {...}
- type: "Component"
- start: 1643
- end: 1780
- name: "Controls"
attributes: [...] (8)
Attribute {...}
- type: "Attribute"
- start: 1655
- end: 1662
- name: "eases"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1656
- end: 1661
expression: Identifier {...}
- start: 1656
- end: 1661
- type: "Identifier"
- name: "eases"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1665
- end: 1672
- name: "types"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1666
- end: 1671
expression: Identifier {...}
- start: 1666
- end: 1671
- type: "Identifier"
- name: "types"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1675
- end: 1684
- name: "playing"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1676
- end: 1683
expression: Identifier {...}
- start: 1676
- end: 1683
- type: "Identifier"
- name: "playing"
}
}
} Attribute {...}
- type: "Attribute"
- start: 1687
- end: 1694
- name: "width"
value: ExpressionTag {...}
- type: "ExpressionTag"
- start: 1688
- end: 1693
expression: Identifier {...}
- start: 1688
- end: 1693
- type: "Identifier"
- name: "width"
}
}
} BindDirective {...}
- start: 1697
- end: 1710
- type: "BindDirective"
- name: "duration"
expression: Identifier {...}
- start: 1702
- end: 1710
- type: "Identifier"
- name: "duration"
}- modifiers: []
} BindDirective {...}
- start: 1713
- end: 1730
- type: "BindDirective"
- name: "current_ease"
expression: Identifier {...}
- start: 1718
- end: 1730
- type: "Identifier"
- name: "current_ease"
}- modifiers: []
} BindDirective {...}
- start: 1733
- end: 1750
- type: "BindDirective"
- name: "current_type"
expression: Identifier {...}
- start: 1738
- end: 1750
- type: "Identifier"
- name: "current_type"
}- modifiers: []
} OnDirective {...}
- start: 1753
- end: 1776
- type: "OnDirective"
- name: "play"
expression: Identifier {...}
- type: "Identifier"
- start: 1762
- end: 1775
loc: {...}
start: {...}
- line: 69
- column: 11
}end: {...}
- line: 69
- column: 24
}
}- name: "runAnimations"
}- modifiers: []
}
]fragment: Fragment {...}
- type: "Fragment"
- nodes: []
}
} Text {...}
- type: "Text"
- start: 1780
- end: 1781
- raw: "\n"
- data: "\n"
}
]
}
} Text {...}
- type: "Text"
- start: 1787
- end: 1789
- raw: "\n\n"
- data: "\n\n"
}
]
}- options: null
instance: Script {...}
- type: "Script"
- start: 0
- end: 1023
- context: "default"
content: Program {...}
- type: "Program"
- start: 8
- end: 1014
loc: {...}
start: {...}
- line: 1
- column: 0
}end: {...}
- line: 41
- column: 0
}
}body: [...] (17)
ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 10
- end: 76
loc: {...}
start: {...}
- line: 2
- column: 1
}end: {...}
- line: 2
- column: 67
}
}specifiers: [...] (1)
ImportSpecifier {...}
- type: "ImportSpecifier"
- start: 19
- end: 51
loc: {...}
start: {...}
- line: 2
- column: 10
}end: {...}
- line: 2
- column: 42
}
}imported: Identifier {...}
- type: "Identifier"
- start: 19
- end: 36
loc: {...}
start: {...}
- line: 2
- column: 10
}end: {...}
- line: 2
- column: 27
}
}- name: "interpolateString"
}local: Identifier {...}
- type: "Identifier"
- start: 40
- end: 51
loc: {...}
start: {...}
- line: 2
- column: 31
}end: {...}
- line: 2
- column: 42
}
}- name: "interpolate"
}
}
]source: Literal {...}
- type: "Literal"
- start: 59
- end: 75
loc: {...}
start: {...}
- line: 2
- column: 50
}end: {...}
- line: 2
- column: 66
}
}- value: "d3-interpolate"
- raw: "'d3-interpolate'"
}
} ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 78
- end: 118
loc: {...}
start: {...}
- line: 3
- column: 1
}end: {...}
- line: 3
- column: 41
}
}specifiers: [...] (1)
ImportSpecifier {...}
- type: "ImportSpecifier"
- start: 87
- end: 94
loc: {...}
start: {...}
- line: 3
- column: 10
}end: {...}
- line: 3
- column: 17
}
}imported: Identifier {...}
- type: "Identifier"
- start: 87
- end: 94
loc: {...}
start: {...}
- line: 3
- column: 10
}end: {...}
- line: 3
- column: 17
}
}- name: "tweened"
}local: Identifier {...}
- type: "Identifier"
- start: 87
- end: 94
loc: {...}
start: {...}
- line: 3
- column: 10
}end: {...}
- line: 3
- column: 17
}
}- name: "tweened"
}
}
]source: Literal {...}
- type: "Literal"
- start: 102
- end: 117
loc: {...}
start: {...}
- line: 3
- column: 25
}end: {...}
- line: 3
- column: 40
}
}- value: "svelte/motion"
- raw: "'svelte/motion'"
}
} ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 120
- end: 153
loc: {...}
start: {...}
- line: 4
- column: 1
}end: {...}
- line: 4
- column: 34
}
}specifiers: [...] (1)
ImportDefaultSpecifier {...}
- type: "ImportDefaultSpecifier"
- start: 127
- end: 131
loc: {...}
start: {...}
- line: 4
- column: 8
}end: {...}
- line: 4
- column: 12
}
}local: Identifier {...}
- type: "Identifier"
- start: 127
- end: 131
loc: {...}
start: {...}
- line: 4
- column: 8
}end: {...}
- line: 4
- column: 12
}
}- name: "Grid"
}
}
]source: Literal {...}
- type: "Literal"
- start: 137
- end: 152
loc: {...}
start: {...}
- line: 4
- column: 18
}end: {...}
- line: 4
- column: 33
}
}- value: "./Grid.svelte"
- raw: "'./Grid.svelte'"
}
} ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 155
- end: 196
loc: {...}
start: {...}
- line: 5
- column: 1
}end: {...}
- line: 5
- column: 42
}
}specifiers: [...] (1)
ImportDefaultSpecifier {...}
- type: "ImportDefaultSpecifier"
- start: 162
- end: 170
loc: {...}
start: {...}
- line: 5
- column: 8
}end: {...}
- line: 5
- column: 16
}
}local: Identifier {...}
- type: "Identifier"
- start: 162
- end: 170
loc: {...}
start: {...}
- line: 5
- column: 8
}end: {...}
- line: 5
- column: 16
}
}- name: "Controls"
}
}
]source: Literal {...}
- type: "Literal"
- start: 176
- end: 195
loc: {...}
start: {...}
- line: 5
- column: 22
}end: {...}
- line: 5
- column: 41
}
}- value: "./Controls.svelte"
- raw: "'./Controls.svelte'"
}
} ImportDeclaration {...}
- type: "ImportDeclaration"
- start: 198
- end: 240
loc: {...}
start: {...}
- line: 6
- column: 1
}end: {...}
- line: 6
- column: 43
}
}specifiers: [...] (2)
ImportSpecifier {...}
- type: "ImportSpecifier"
- start: 207
- end: 212
loc: {...}
start: {...}
- line: 6
- column: 10
}end: {...}
- line: 6
- column: 15
}
}imported: Identifier {...}
- type: "Identifier"
- start: 207
- end: 212
loc: {...}
start: {...}
- line: 6
- column: 10
}end: {...}
- line: 6
- column: 15
}
}- name: "eases"
}local: Identifier {...}
- type: "Identifier"
- start: 207
- end: 212
loc: {...}
start: {...}
- line: 6
- column: 10
}end: {...}
- line: 6
- column: 15
}
}- name: "eases"
}
} ImportSpecifier {...}
- type: "ImportSpecifier"
- start: 214
- end: 219
loc: {...}
start: {...}
- line: 6
- column: 17
}end: {...}
- line: 6
- column: 22
}
}imported: Identifier {...}
- type: "Identifier"
- start: 214
- end: 219
loc: {...}
start: {...}
- line: 6
- column: 17
}end: {...}
- line: 6
- column: 22
}
}- name: "types"
}local: Identifier {...}
- type: "Identifier"
- start: 214
- end: 219
loc: {...}
start: {...}
- line: 6
- column: 17
}end: {...}
- line: 6
- column: 22
}
}- name: "types"
}
}
]source: Literal {...}
- type: "Literal"
- start: 227
- end: 239
loc: {...}
start: {...}
- line: 6
- column: 30
}end: {...}
- line: 6
- column: 42
}
}- value: "./eases.js"
- raw: "'./eases.js'"
}
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 243
- end: 275
loc: {...}
start: {...}
- line: 8
- column: 1
}end: {...}
- line: 8
- column: 33
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 247
- end: 274
loc: {...}
start: {...}
- line: 8
- column: 5
}end: {...}
- line: 8
- column: 32
}
}id: Identifier {...}
- type: "Identifier"
- start: 247
- end: 259
loc: {...}
start: {...}
- line: 8
- column: 5
}end: {...}
- line: 8
- column: 17
}
}- name: "current_type"
}init: CallExpression {...}
- type: "CallExpression"
- start: 262
- end: 274
loc: {...}
start: {...}
- line: 8
- column: 20
}end: {...}
- line: 8
- column: 32
}
}callee: Identifier {...}
- type: "Identifier"
- start: 262
- end: 268
loc: {...}
start: {...}
- line: 8
- column: 20
}end: {...}
- line: 8
- column: 26
}
}- name: "$state"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 269
- end: 273
loc: {...}
start: {...}
- line: 8
- column: 27
}end: {...}
- line: 8
- column: 31
}
}- value: "In"
- raw: "'In'"
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 277
- end: 311
loc: {...}
start: {...}
- line: 9
- column: 1
}end: {...}
- line: 9
- column: 35
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 281
- end: 310
loc: {...}
start: {...}
- line: 9
- column: 5
}end: {...}
- line: 9
- column: 34
}
}id: Identifier {...}
- type: "Identifier"
- start: 281
- end: 293
loc: {...}
start: {...}
- line: 9
- column: 5
}end: {...}
- line: 9
- column: 17
}
}- name: "current_ease"
}init: CallExpression {...}
- type: "CallExpression"
- start: 296
- end: 310
loc: {...}
start: {...}
- line: 9
- column: 20
}end: {...}
- line: 9
- column: 34
}
}callee: Identifier {...}
- type: "Identifier"
- start: 296
- end: 302
loc: {...}
start: {...}
- line: 9
- column: 20
}end: {...}
- line: 9
- column: 26
}
}- name: "$state"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 303
- end: 309
loc: {...}
start: {...}
- line: 9
- column: 27
}end: {...}
- line: 9
- column: 33
}
}- value: "sine"
- raw: "'sine'"
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 313
- end: 341
loc: {...}
start: {...}
- line: 10
- column: 1
}end: {...}
- line: 10
- column: 29
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 317
- end: 340
loc: {...}
start: {...}
- line: 10
- column: 5
}end: {...}
- line: 10
- column: 28
}
}id: Identifier {...}
- type: "Identifier"
- start: 317
- end: 325
loc: {...}
start: {...}
- line: 10
- column: 5
}end: {...}
- line: 10
- column: 13
}
}- name: "duration"
}init: CallExpression {...}
- type: "CallExpression"
- start: 328
- end: 340
loc: {...}
start: {...}
- line: 10
- column: 16
}end: {...}
- line: 10
- column: 28
}
}callee: Identifier {...}
- type: "Identifier"
- start: 328
- end: 334
loc: {...}
start: {...}
- line: 10
- column: 16
}end: {...}
- line: 10
- column: 22
}
}- name: "$state"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 335
- end: 339
loc: {...}
start: {...}
- line: 10
- column: 23
}end: {...}
- line: 10
- column: 27
}
}- value: 2000
- raw: "2000"
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 343
- end: 403
loc: {...}
start: {...}
- line: 11
- column: 1
}end: {...}
- line: 11
- column: 61
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 347
- end: 402
loc: {...}
start: {...}
- line: 11
- column: 5
}end: {...}
- line: 11
- column: 60
}
}id: Identifier {...}
- type: "Identifier"
- start: 347
- end: 354
loc: {...}
start: {...}
- line: 11
- column: 5
}end: {...}
- line: 11
- column: 12
}
}- name: "current"
}init: CallExpression {...}
- type: "CallExpression"
- start: 357
- end: 402
loc: {...}
start: {...}
- line: 11
- column: 15
}end: {...}
- line: 11
- column: 60
}
}callee: Identifier {...}
- type: "Identifier"
- start: 357
- end: 363
loc: {...}
start: {...}
- line: 11
- column: 15
}end: {...}
- line: 11
- column: 21
}
}- name: "$state"
}arguments: [...] (1)
MemberExpression {...}
- type: "MemberExpression"
- start: 364
- end: 401
loc: {...}
start: {...}
- line: 11
- column: 22
}end: {...}
- line: 11
- column: 59
}
}object: CallExpression {...}
- type: "CallExpression"
- start: 364
- end: 387
loc: {...}
start: {...}
- line: 11
- column: 22
}end: {...}
- line: 11
- column: 45
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 364
- end: 373
loc: {...}
start: {...}
- line: 11
- column: 22
}end: {...}
- line: 11
- column: 31
}
}object: Identifier {...}
- type: "Identifier"
- start: 364
- end: 369
loc: {...}
start: {...}
- line: 11
- column: 22
}end: {...}
- line: 11
- column: 27
}
}- name: "eases"
}property: Identifier {...}
- type: "Identifier"
- start: 370
- end: 373
loc: {...}
start: {...}
- line: 11
- column: 28
}end: {...}
- line: 11
- column: 31
}
}- name: "get"
}- computed: false
- optional: false
}arguments: [...] (1)
Identifier {...}
- type: "Identifier"
- start: 374
- end: 386
loc: {...}
start: {...}
- line: 11
- column: 32
}end: {...}
- line: 11
- column: 44
}
}- name: "current_ease"
}
]- optional: false
}property: Identifier {...}
- type: "Identifier"
- start: 388
- end: 400
loc: {...}
start: {...}
- line: 11
- column: 46
}end: {...}
- line: 11
- column: 58
}
}- name: "current_type"
}- computed: true
- optional: false
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 405
- end: 433
loc: {...}
start: {...}
- line: 12
- column: 1
}end: {...}
- line: 12
- column: 29
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 409
- end: 432
loc: {...}
start: {...}
- line: 12
- column: 5
}end: {...}
- line: 12
- column: 28
}
}id: Identifier {...}
- type: "Identifier"
- start: 409
- end: 416
loc: {...}
start: {...}
- line: 12
- column: 5
}end: {...}
- line: 12
- column: 12
}
}- name: "playing"
}init: CallExpression {...}
- type: "CallExpression"
- start: 419
- end: 432
loc: {...}
start: {...}
- line: 12
- column: 15
}end: {...}
- line: 12
- column: 28
}
}callee: Identifier {...}
- type: "Identifier"
- start: 419
- end: 425
loc: {...}
start: {...}
- line: 12
- column: 15
}end: {...}
- line: 12
- column: 21
}
}- name: "$state"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 426
- end: 431
loc: {...}
start: {...}
- line: 12
- column: 22
}end: {...}
- line: 12
- column: 27
}
}- value: false
- raw: "false"
}
]- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 435
- end: 456
loc: {...}
start: {...}
- line: 13
- column: 1
}end: {...}
- line: 13
- column: 22
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 439
- end: 455
loc: {...}
start: {...}
- line: 13
- column: 5
}end: {...}
- line: 13
- column: 21
}
}id: Identifier {...}
- type: "Identifier"
- start: 439
- end: 444
loc: {...}
start: {...}
- line: 13
- column: 5
}end: {...}
- line: 13
- column: 10
}
}- name: "width"
}init: CallExpression {...}
- type: "CallExpression"
- start: 447
- end: 455
loc: {...}
start: {...}
- line: 13
- column: 13
}end: {...}
- line: 13
- column: 21
}
}callee: Identifier {...}
- type: "Identifier"
- start: 447
- end: 453
loc: {...}
start: {...}
- line: 13
- column: 13
}end: {...}
- line: 13
- column: 19
}
}- name: "$state"
}- arguments: []
- optional: false
}
}
]- kind: "let"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 459
- end: 517
loc: {...}
start: {...}
- line: 15
- column: 1
}end: {...}
- line: 15
- column: 59
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 465
- end: 516
loc: {...}
start: {...}
- line: 15
- column: 7
}end: {...}
- line: 15
- column: 58
}
}id: Identifier {...}
- type: "Identifier"
- start: 465
- end: 474
loc: {...}
start: {...}
- line: 15
- column: 7
}end: {...}
- line: 15
- column: 16
}
}- name: "ease_path"
}init: CallExpression {...}
- type: "CallExpression"
- start: 477
- end: 516
loc: {...}
start: {...}
- line: 15
- column: 19
}end: {...}
- line: 15
- column: 58
}
}callee: Identifier {...}
- type: "Identifier"
- start: 477
- end: 484
loc: {...}
start: {...}
- line: 15
- column: 19
}end: {...}
- line: 15
- column: 26
}
}- name: "tweened"
}arguments: [...] (2)
MemberExpression {...}
- type: "MemberExpression"
- start: 485
- end: 498
loc: {...}
start: {...}
- line: 15
- column: 27
}end: {...}
- line: 15
- column: 40
}
}object: Identifier {...}
- type: "Identifier"
- start: 485
- end: 492
loc: {...}
start: {...}
- line: 15
- column: 27
}end: {...}
- line: 15
- column: 34
}
}- name: "current"
}property: Identifier {...}
- type: "Identifier"
- start: 493
- end: 498
loc: {...}
start: {...}
- line: 15
- column: 35
}end: {...}
- line: 15
- column: 40
}
}- name: "shape"
}- computed: false
- optional: false
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 500
- end: 515
loc: {...}
start: {...}
- line: 15
- column: 42
}end: {...}
- line: 15
- column: 57
}
}properties: [...] (1)
Property {...}
- type: "Property"
- start: 502
- end: 513
loc: {...}
start: {...}
- line: 15
- column: 44
}end: {...}
- line: 15
- column: 55
}
}- method: false
- shorthand: true
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 502
- end: 513
loc: {...}
start: {...}
- line: 15
- column: 44
}end: {...}
- line: 15
- column: 55
}
}- name: "interpolate"
}- kind: "init"
value: Identifier {...}
- type: "Identifier"
- start: 502
- end: 513
loc: {...}
start: {...}
- line: 15
- column: 44
}end: {...}
- line: 15
- column: 55
}
}- name: "interpolate"
}
}
]
}
]- optional: false
}
}
]- kind: "const"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 519
- end: 543
loc: {...}
start: {...}
- line: 16
- column: 1
}end: {...}
- line: 16
- column: 25
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 525
- end: 542
loc: {...}
start: {...}
- line: 16
- column: 7
}end: {...}
- line: 16
- column: 24
}
}id: Identifier {...}
- type: "Identifier"
- start: 525
- end: 529
loc: {...}
start: {...}
- line: 16
- column: 7
}end: {...}
- line: 16
- column: 11
}
}- name: "time"
}init: CallExpression {...}
- type: "CallExpression"
- start: 532
- end: 542
loc: {...}
start: {...}
- line: 16
- column: 14
}end: {...}
- line: 16
- column: 24
}
}callee: Identifier {...}
- type: "Identifier"
- start: 532
- end: 539
loc: {...}
start: {...}
- line: 16
- column: 14
}end: {...}
- line: 16
- column: 21
}
}- name: "tweened"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 540
- end: 541
loc: {...}
start: {...}
- line: 16
- column: 22
}end: {...}
- line: 16
- column: 23
}
}- value: 0
- raw: "0"
}
]- optional: false
}
}
]- kind: "const"
} VariableDeclaration {...}
- type: "VariableDeclaration"
- start: 545
- end: 573
loc: {...}
start: {...}
- line: 17
- column: 1
}end: {...}
- line: 17
- column: 29
}
}declarations: [...] (1)
VariableDeclarator {...}
- type: "VariableDeclarator"
- start: 551
- end: 572
loc: {...}
start: {...}
- line: 17
- column: 7
}end: {...}
- line: 17
- column: 28
}
}id: Identifier {...}
- type: "Identifier"
- start: 551
- end: 556
loc: {...}
start: {...}
- line: 17
- column: 7
}end: {...}
- line: 17
- column: 12
}
}- name: "value"
}init: CallExpression {...}
- type: "CallExpression"
- start: 559
- end: 572
loc: {...}
start: {...}
- line: 17
- column: 15
}end: {...}
- line: 17
- column: 28
}
}callee: Identifier {...}
- type: "Identifier"
- start: 559
- end: 566
loc: {...}
start: {...}
- line: 17
- column: 15
}end: {...}
- line: 17
- column: 22
}
}- name: "tweened"
}arguments: [...] (1)
Literal {...}
- type: "Literal"
- start: 567
- end: 571
loc: {...}
start: {...}
- line: 17
- column: 23
}end: {...}
- line: 17
- column: 27
}
}- value: 1000
- raw: "1000"
}
]- optional: false
}
}
]- kind: "const"
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 576
- end: 647
loc: {...}
start: {...}
- line: 19
- column: 1
}end: {...}
- line: 21
- column: 4
}
}expression: CallExpression {...}
- type: "CallExpression"
- start: 576
- end: 646
loc: {...}
start: {...}
- line: 19
- column: 1
}end: {...}
- line: 21
- column: 3
}
}callee: Identifier {...}
- type: "Identifier"
- start: 576
- end: 583
loc: {...}
start: {...}
- line: 19
- column: 1
}end: {...}
- line: 19
- column: 8
}
}- name: "$effect"
}arguments: [...] (1)
ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 584
- end: 645
loc: {...}
start: {...}
- line: 19
- column: 9
}end: {...}
- line: 21
- column: 2
}
}- id: null
- expression: false
- generator: false
- async: false
- params: []
body: BlockStatement {...}
- type: "BlockStatement"
- start: 590
- end: 645
loc: {...}
start: {...}
- line: 19
- column: 15
}end: {...}
- line: 21
- column: 2
}
}body: [...] (1)
ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 594
- end: 642
loc: {...}
start: {...}
- line: 20
- column: 2
}end: {...}
- line: 20
- column: 50
}
}expression: AssignmentExpression {...}
- type: "AssignmentExpression"
- start: 594
- end: 641
loc: {...}
start: {...}
- line: 20
- column: 2
}end: {...}
- line: 20
- column: 49
}
}- operator: "="
left: Identifier {...}
- type: "Identifier"
- start: 594
- end: 601
loc: {...}
start: {...}
- line: 20
- column: 2
}end: {...}
- line: 20
- column: 9
}
}- name: "current"
}right: MemberExpression {...}
- type: "MemberExpression"
- start: 604
- end: 641
loc: {...}
start: {...}
- line: 20
- column: 12
}end: {...}
- line: 20
- column: 49
}
}object: CallExpression {...}
- type: "CallExpression"
- start: 604
- end: 627
loc: {...}
start: {...}
- line: 20
- column: 12
}end: {...}
- line: 20
- column: 35
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 604
- end: 613
loc: {...}
start: {...}
- line: 20
- column: 12
}end: {...}
- line: 20
- column: 21
}
}object: Identifier {...}
- type: "Identifier"
- start: 604
- end: 609
loc: {...}
start: {...}
- line: 20
- column: 12
}end: {...}
- line: 20
- column: 17
}
}- name: "eases"
}property: Identifier {...}
- type: "Identifier"
- start: 610
- end: 613
loc: {...}
start: {...}
- line: 20
- column: 18
}end: {...}
- line: 20
- column: 21
}
}- name: "get"
}- computed: false
- optional: false
}arguments: [...] (1)
Identifier {...}
- type: "Identifier"
- start: 614
- end: 626
loc: {...}
start: {...}
- line: 20
- column: 22
}end: {...}
- line: 20
- column: 34
}
}- name: "current_ease"
}
]- optional: false
}property: Identifier {...}
- type: "Identifier"
- start: 628
- end: 640
loc: {...}
start: {...}
- line: 20
- column: 36
}end: {...}
- line: 20
- column: 48
}
}- name: "current_type"
}- computed: true
- optional: false
}
}
}
]
}
}
]- optional: false
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 650
- end: 700
loc: {...}
start: {...}
- line: 23
- column: 1
}end: {...}
- line: 25
- column: 4
}
}expression: CallExpression {...}
- type: "CallExpression"
- start: 650
- end: 699
loc: {...}
start: {...}
- line: 23
- column: 1
}end: {...}
- line: 25
- column: 3
}
}callee: Identifier {...}
- type: "Identifier"
- start: 650
- end: 657
loc: {...}
start: {...}
- line: 23
- column: 1
}end: {...}
- line: 23
- column: 8
}
}- name: "$effect"
}arguments: [...] (1)
ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 658
- end: 698
loc: {...}
start: {...}
- line: 23
- column: 9
}end: {...}
- line: 25
- column: 2
}
}- id: null
- expression: false
- generator: false
- async: false
- params: []
body: BlockStatement {...}
- type: "BlockStatement"
- start: 664
- end: 698
loc: {...}
start: {...}
- line: 23
- column: 15
}end: {...}
- line: 25
- column: 2
}
}body: [...] (1)
ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 668
- end: 695
loc: {...}
start: {...}
- line: 24
- column: 2
}end: {...}
- line: 24
- column: 29
}
}expression: LogicalExpression {...}
- type: "LogicalExpression"
- start: 668
- end: 694
loc: {...}
start: {...}
- line: 24
- column: 2
}end: {...}
- line: 24
- column: 28
}
}left: Identifier {...}
- type: "Identifier"
- start: 668
- end: 675
loc: {...}
start: {...}
- line: 24
- column: 2
}end: {...}
- line: 24
- column: 9
}
}- name: "current"
}- operator: "&&"
right: CallExpression {...}
- type: "CallExpression"
- start: 679
- end: 694
loc: {...}
start: {...}
- line: 24
- column: 13
}end: {...}
- line: 24
- column: 28
}
}callee: Identifier {...}
- type: "Identifier"
- start: 679
- end: 692
loc: {...}
start: {...}
- line: 24
- column: 13
}end: {...}
- line: 24
- column: 26
}
}- name: "runAnimations"
}- arguments: []
- optional: false
}
}
}
]
}
}
]- optional: false
}
} FunctionDeclaration {...}
- type: "FunctionDeclaration"
- start: 703
- end: 1013
loc: {...}
start: {...}
- line: 27
- column: 1
}end: {...}
- line: 40
- column: 2
}
}id: Identifier {...}
- type: "Identifier"
- start: 718
- end: 731
loc: {...}
start: {...}
- line: 27
- column: 16
}end: {...}
- line: 27
- column: 29
}
}- name: "runAnimations"
}- expression: false
- generator: false
- async: true
- params: []
body: BlockStatement {...}
- type: "BlockStatement"
- start: 734
- end: 1013
loc: {...}
start: {...}
- line: 27
- column: 32
}end: {...}
- line: 40
- column: 2
}
}body: [...] (6)
ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 738
- end: 753
loc: {...}
start: {...}
- line: 28
- column: 2
}end: {...}
- line: 28
- column: 17
}
}expression: AssignmentExpression {...}
- type: "AssignmentExpression"
- start: 738
- end: 752
loc: {...}
start: {...}
- line: 28
- column: 2
}end: {...}
- line: 28
- column: 16
}
}- operator: "="
left: Identifier {...}
- type: "Identifier"
- start: 738
- end: 745
loc: {...}
start: {...}
- line: 28
- column: 2
}end: {...}
- line: 28
- column: 9
}
}- name: "playing"
}right: Literal {...}
- type: "Literal"
- start: 748
- end: 752
loc: {...}
start: {...}
- line: 28
- column: 12
}end: {...}
- line: 28
- column: 16
}
}- value: true
- raw: "true"
}
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 757
- end: 790
loc: {...}
start: {...}
- line: 30
- column: 2
}end: {...}
- line: 30
- column: 35
}
}expression: CallExpression {...}
- type: "CallExpression"
- start: 757
- end: 789
loc: {...}
start: {...}
- line: 30
- column: 2
}end: {...}
- line: 30
- column: 34
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 757
- end: 766
loc: {...}
start: {...}
- line: 30
- column: 2
}end: {...}
- line: 30
- column: 11
}
}object: Identifier {...}
- type: "Identifier"
- start: 757
- end: 762
loc: {...}
start: {...}
- line: 30
- column: 2
}end: {...}
- line: 30
- column: 7
}
}- name: "value"
}property: Identifier {...}
- type: "Identifier"
- start: 763
- end: 766
loc: {...}
start: {...}
- line: 30
- column: 8
}end: {...}
- line: 30
- column: 11
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (2)
Literal {...}
- type: "Literal"
- start: 767
- end: 771
loc: {...}
start: {...}
- line: 30
- column: 12
}end: {...}
- line: 30
- column: 16
}
}- value: 1000
- raw: "1000"
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 773
- end: 788
loc: {...}
start: {...}
- line: 30
- column: 18
}end: {...}
- line: 30
- column: 33
}
}properties: [...] (1)
Property {...}
- type: "Property"
- start: 775
- end: 786
loc: {...}
start: {...}
- line: 30
- column: 20
}end: {...}
- line: 30
- column: 31
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 775
- end: 783
loc: {...}
start: {...}
- line: 30
- column: 20
}end: {...}
- line: 30
- column: 28
}
}- name: "duration"
}value: Literal {...}
- type: "Literal"
- start: 785
- end: 786
loc: {...}
start: {...}
- line: 30
- column: 30
}end: {...}
- line: 30
- column: 31
}
}- value: 0
- raw: "0"
}- kind: "init"
}
]
}
]- optional: false
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 793
- end: 822
loc: {...}
start: {...}
- line: 31
- column: 2
}end: {...}
- line: 31
- column: 31
}
}expression: CallExpression {...}
- type: "CallExpression"
- start: 793
- end: 821
loc: {...}
start: {...}
- line: 31
- column: 2
}end: {...}
- line: 31
- column: 30
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 793
- end: 801
loc: {...}
start: {...}
- line: 31
- column: 2
}end: {...}
- line: 31
- column: 10
}
}object: Identifier {...}
- type: "Identifier"
- start: 793
- end: 797
loc: {...}
start: {...}
- line: 31
- column: 2
}end: {...}
- line: 31
- column: 6
}
}- name: "time"
}property: Identifier {...}
- type: "Identifier"
- start: 798
- end: 801
loc: {...}
start: {...}
- line: 31
- column: 7
}end: {...}
- line: 31
- column: 10
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (2)
Literal {...}
- type: "Literal"
- start: 802
- end: 803
loc: {...}
start: {...}
- line: 31
- column: 11
}end: {...}
- line: 31
- column: 12
}
}- value: 0
- raw: "0"
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 805
- end: 820
loc: {...}
start: {...}
- line: 31
- column: 14
}end: {...}
- line: 31
- column: 29
}
}properties: [...] (1)
Property {...}
- type: "Property"
- start: 807
- end: 818
loc: {...}
start: {...}
- line: 31
- column: 16
}end: {...}
- line: 31
- column: 27
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 807
- end: 815
loc: {...}
start: {...}
- line: 31
- column: 16
}end: {...}
- line: 31
- column: 24
}
}- name: "duration"
}value: Literal {...}
- type: "Literal"
- start: 817
- end: 818
loc: {...}
start: {...}
- line: 31
- column: 26
}end: {...}
- line: 31
- column: 27
}
}- value: 0
- raw: "0"
}- kind: "init"
}
]
}
]- optional: false
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 826
- end: 861
loc: {...}
start: {...}
- line: 33
- column: 2
}end: {...}
- line: 33
- column: 37
}
}expression: AwaitExpression {...}
- type: "AwaitExpression"
- start: 826
- end: 860
loc: {...}
start: {...}
- line: 33
- column: 2
}end: {...}
- line: 33
- column: 36
}
}argument: CallExpression {...}
- type: "CallExpression"
- start: 832
- end: 860
loc: {...}
start: {...}
- line: 33
- column: 8
}end: {...}
- line: 33
- column: 36
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 832
- end: 845
loc: {...}
start: {...}
- line: 33
- column: 8
}end: {...}
- line: 33
- column: 21
}
}object: Identifier {...}
- type: "Identifier"
- start: 832
- end: 841
loc: {...}
start: {...}
- line: 33
- column: 8
}end: {...}
- line: 33
- column: 17
}
}- name: "ease_path"
}property: Identifier {...}
- type: "Identifier"
- start: 842
- end: 845
loc: {...}
start: {...}
- line: 33
- column: 18
}end: {...}
- line: 33
- column: 21
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (1)
MemberExpression {...}
- type: "MemberExpression"
- start: 846
- end: 859
loc: {...}
start: {...}
- line: 33
- column: 22
}end: {...}
- line: 33
- column: 35
}
}object: Identifier {...}
- type: "Identifier"
- start: 846
- end: 853
loc: {...}
start: {...}
- line: 33
- column: 22
}end: {...}
- line: 33
- column: 29
}
}- name: "current"
}property: Identifier {...}
- type: "Identifier"
- start: 854
- end: 859
loc: {...}
start: {...}
- line: 33
- column: 30
}end: {...}
- line: 33
- column: 35
}
}- name: "shape"
}- computed: false
- optional: false
}
]- optional: false
}
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 864
- end: 990
loc: {...}
start: {...}
- line: 34
- column: 2
}end: {...}
- line: 37
- column: 5
}
}expression: AwaitExpression {...}
- type: "AwaitExpression"
- start: 864
- end: 989
loc: {...}
start: {...}
- line: 34
- column: 2
}end: {...}
- line: 37
- column: 4
}
}argument: CallExpression {...}
- type: "CallExpression"
- start: 870
- end: 989
loc: {...}
start: {...}
- line: 34
- column: 8
}end: {...}
- line: 37
- column: 4
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 870
- end: 881
loc: {...}
start: {...}
- line: 34
- column: 8
}end: {...}
- line: 34
- column: 19
}
}object: Identifier {...}
- type: "Identifier"
- start: 870
- end: 877
loc: {...}
start: {...}
- line: 34
- column: 8
}end: {...}
- line: 34
- column: 15
}
}- name: "Promise"
}property: Identifier {...}
- type: "Identifier"
- start: 878
- end: 881
loc: {...}
start: {...}
- line: 34
- column: 16
}end: {...}
- line: 34
- column: 19
}
}- name: "all"
}- computed: false
- optional: false
}arguments: [...] (1)
ArrayExpression {...}
- type: "ArrayExpression"
- start: 882
- end: 988
loc: {...}
start: {...}
- line: 34
- column: 20
}end: {...}
- line: 37
- column: 3
}
}elements: [...] (2)
CallExpression {...}
- type: "CallExpression"
- start: 887
- end: 933
loc: {...}
start: {...}
- line: 35
- column: 3
}end: {...}
- line: 35
- column: 49
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 887
- end: 895
loc: {...}
start: {...}
- line: 35
- column: 3
}end: {...}
- line: 35
- column: 11
}
}object: Identifier {...}
- type: "Identifier"
- start: 887
- end: 891
loc: {...}
start: {...}
- line: 35
- column: 3
}end: {...}
- line: 35
- column: 7
}
}- name: "time"
}property: Identifier {...}
- type: "Identifier"
- start: 892
- end: 895
loc: {...}
start: {...}
- line: 35
- column: 8
}end: {...}
- line: 35
- column: 11
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (2)
Literal {...}
- type: "Literal"
- start: 896
- end: 900
loc: {...}
start: {...}
- line: 35
- column: 12
}end: {...}
- line: 35
- column: 16
}
}- value: 1000
- raw: "1000"
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 902
- end: 932
loc: {...}
start: {...}
- line: 35
- column: 18
}end: {...}
- line: 35
- column: 48
}
}properties: [...] (2)
Property {...}
- type: "Property"
- start: 904
- end: 912
loc: {...}
start: {...}
- line: 35
- column: 20
}end: {...}
- line: 35
- column: 28
}
}- method: false
- shorthand: true
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 904
- end: 912
loc: {...}
start: {...}
- line: 35
- column: 20
}end: {...}
- line: 35
- column: 28
}
}- name: "duration"
}- kind: "init"
value: Identifier {...}
- type: "Identifier"
- start: 904
- end: 912
loc: {...}
start: {...}
- line: 35
- column: 20
}end: {...}
- line: 35
- column: 28
}
}- name: "duration"
}
} Property {...}
- type: "Property"
- start: 914
- end: 930
loc: {...}
start: {...}
- line: 35
- column: 30
}end: {...}
- line: 35
- column: 46
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 914
- end: 920
loc: {...}
start: {...}
- line: 35
- column: 30
}end: {...}
- line: 35
- column: 36
}
}- name: "easing"
}value: ArrowFunctionExpression {...}
- type: "ArrowFunctionExpression"
- start: 922
- end: 930
loc: {...}
start: {...}
- line: 35
- column: 38
}end: {...}
- line: 35
- column: 46
}
}- id: null
- expression: true
- generator: false
- async: false
params: [...] (1)
Identifier {...}
- type: "Identifier"
- start: 923
- end: 924
loc: {...}
start: {...}
- line: 35
- column: 39
}end: {...}
- line: 35
- column: 40
}
}- name: "x"
}
]body: Identifier {...}
- type: "Identifier"
- start: 929
- end: 930
loc: {...}
start: {...}
- line: 35
- column: 45
}end: {...}
- line: 35
- column: 46
}
}- name: "x"
}
}- kind: "init"
}
]
}
]- optional: false
} CallExpression {...}
- type: "CallExpression"
- start: 938
- end: 984
loc: {...}
start: {...}
- line: 36
- column: 3
}end: {...}
- line: 36
- column: 49
}
}callee: MemberExpression {...}
- type: "MemberExpression"
- start: 938
- end: 947
loc: {...}
start: {...}
- line: 36
- column: 3
}end: {...}
- line: 36
- column: 12
}
}object: Identifier {...}
- type: "Identifier"
- start: 938
- end: 943
loc: {...}
start: {...}
- line: 36
- column: 3
}end: {...}
- line: 36
- column: 8
}
}- name: "value"
}property: Identifier {...}
- type: "Identifier"
- start: 944
- end: 947
loc: {...}
start: {...}
- line: 36
- column: 9
}end: {...}
- line: 36
- column: 12
}
}- name: "set"
}- computed: false
- optional: false
}arguments: [...] (2)
Literal {...}
- type: "Literal"
- start: 948
- end: 949
loc: {...}
start: {...}
- line: 36
- column: 13
}end: {...}
- line: 36
- column: 14
}
}- value: 0
- raw: "0"
} ObjectExpression {...}
- type: "ObjectExpression"
- start: 951
- end: 983
loc: {...}
start: {...}
- line: 36
- column: 16
}end: {...}
- line: 36
- column: 48
}
}properties: [...] (2)
Property {...}
- type: "Property"
- start: 953
- end: 961
loc: {...}
start: {...}
- line: 36
- column: 18
}end: {...}
- line: 36
- column: 26
}
}- method: false
- shorthand: true
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 953
- end: 961
loc: {...}
start: {...}
- line: 36
- column: 18
}end: {...}
- line: 36
- column: 26
}
}- name: "duration"
}- kind: "init"
value: Identifier {...}
- type: "Identifier"
- start: 953
- end: 961
loc: {...}
start: {...}
- line: 36
- column: 18
}end: {...}
- line: 36
- column: 26
}
}- name: "duration"
}
} Property {...}
- type: "Property"
- start: 963
- end: 981
loc: {...}
start: {...}
- line: 36
- column: 28
}end: {...}
- line: 36
- column: 46
}
}- method: false
- shorthand: false
- computed: false
key: Identifier {...}
- type: "Identifier"
- start: 963
- end: 969
loc: {...}
start: {...}
- line: 36
- column: 28
}end: {...}
- line: 36
- column: 34
}
}- name: "easing"
}value: MemberExpression {...}
- type: "MemberExpression"
- start: 971
- end: 981
loc: {...}
start: {...}
- line: 36
- column: 36
}end: {...}
- line: 36
- column: 46
}
}object: Identifier {...}
- type: "Identifier"
- start: 971
- end: 978
loc: {...}
start: {...}
- line: 36
- column: 36
}end: {...}
- line: 36
- column: 43
}
}- name: "current"
}property: Identifier {...}
- type: "Identifier"
- start: 979
- end: 981
loc: {...}
start: {...}
- line: 36
- column: 44
}end: {...}
- line: 36
- column: 46
}
}- name: "fn"
}- computed: false
- optional: false
}- kind: "init"
}
]
}
]- optional: false
}
]
}
]- optional: false
}
}
} ExpressionStatement {...}
- type: "ExpressionStatement"
- start: 994
- end: 1010
loc: {...}
start: {...}
- line: 39
- column: 2
}end: {...}
- line: 39
- column: 18
}
}expression: AssignmentExpression {...}
- type: "AssignmentExpression"
- start: 994
- end: 1009
loc: {...}
start: {...}
- line: 39
- column: 2
}end: {...}
- line: 39
- column: 17
}
}- operator: "="
left: Identifier {...}
- type: "Identifier"
- start: 994
- end: 1001
loc: {...}
start: {...}
- line: 39
- column: 2
}end: {...}
- line: 39
- column: 9
}
}- name: "playing"
}right: Literal {...}
- type: "Literal"
- start: 1004
- end: 1009
loc: {...}
start: {...}
- line: 39
- column: 12
}end: {...}
- line: 39
- column: 17
}
}- value: false
- raw: "false"
}
}
}
]
}
}
]- sourceType: "module"
}- attributes: []
}
}
The AST is not public API and may change at any point in time