pacer-js 1.0.5 → 1.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/Pacer.js +4 -4
- package/README.md +254 -196
- package/pacer.svg +17 -0
- package/package.json +1 -1
package/Pacer.js
CHANGED
|
@@ -243,11 +243,11 @@ class Pacer {
|
|
|
243
243
|
this.lastTouchedKey.label = s
|
|
244
244
|
return this
|
|
245
245
|
}
|
|
246
|
-
values( v ){
|
|
246
|
+
// values( v ){
|
|
247
247
|
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
}
|
|
248
|
+
// this.lastTouchedKey.values = v
|
|
249
|
+
// return this
|
|
250
|
+
// }
|
|
251
251
|
tween( fn ){
|
|
252
252
|
|
|
253
253
|
this.lastTouchedKey.tween = fn
|
package/README.md
CHANGED
|
@@ -1,19 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
/////// // ////// /////// ///////
|
|
6
|
-
// // //// // // // // //
|
|
7
|
-
// // // // // ////// // //
|
|
8
|
-
/////// /////// // // // ///////
|
|
9
|
-
// // // ////// /////// // //
|
|
10
|
-
// // //
|
|
11
|
-
// //
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
```
|
|
15
|
-
Getting you from A to B since 2025.
|
|
1
|
+
<img src="./pacer.svg?raw=true" width="100%">
|
|
16
2
|
|
|
3
|
+
<p align="center" style="text-align: center;">Driving you from A to B since 2025.</p>
|
|
17
4
|
<br>
|
|
18
5
|
|
|
19
6
|
|
|
@@ -21,17 +8,18 @@ Getting you from A to B since 2025.
|
|
|
21
8
|
|
|
22
9
|
## TL;DR
|
|
23
10
|
|
|
24
|
-
__Pacer__ is a light-weight keyframing toolkit inspired by [Soledad Penadés](https://soledadpenades.com/)’ original [tween.js](https://soledadpenades.com/projects/tween-js/) masterpiece. List your keyframes as time / value pairs, and __Pacer__ will ✨ tween your numbers and 📞 call your callbacks. __It’s minimal__. Only does what it needs to. __It’s reliable__. We use this in our own professional projects. We found the bumps and sanded them down so you won’t have to
|
|
11
|
+
__Pacer__ is a light-weight keyframing toolkit inspired by [Soledad Penadés](https://soledadpenades.com/)’ original [tween.js](https://soledadpenades.com/projects/tween-js/) masterpiece. List your keyframes as time / value pairs, and __Pacer__ will ✨ tween your numbers and 📞 call your callbacks. __It’s minimal__. Only does what it needs to. __It’s reliable__. We use this in our own professional projects. We found the bumps and sanded them down ✅ (so you won’t have to). Either include the `Pacer.js` ES6 module in your codebase, or install the [Node package](https://www.npmjs.com/package/pacer-js):
|
|
25
12
|
|
|
26
13
|
```shell
|
|
27
14
|
npm install pacer-js
|
|
28
15
|
```
|
|
29
|
-
Now you’re cooking
|
|
16
|
+
Now you’re cooking 🔥
|
|
30
17
|
|
|
31
18
|
```javascript
|
|
32
19
|
import Pacer from 'pacer-js'
|
|
33
20
|
|
|
34
|
-
|
|
21
|
+
|
|
22
|
+
new Pacer()
|
|
35
23
|
|
|
36
24
|
.key( Date.now(), { n: 0 })
|
|
37
25
|
.onKey(( e )=> console.log( '1st keyframe', e.n ))
|
|
@@ -39,17 +27,19 @@ var p = new Pacer()
|
|
|
39
27
|
.key( 2000, { n: 1 })
|
|
40
28
|
.onKey(( e )=> console.log( '2 seconds later', e.n ))
|
|
41
29
|
.tween( Pacer.cubic.inOut )
|
|
42
|
-
.onTween(( e )=> console.log( 'Tweened
|
|
30
|
+
.onTween(( e )=> console.log( 'Tweened value', e.n ))
|
|
43
31
|
|
|
44
32
|
.key( 2000, { n: 2 })
|
|
45
33
|
.onKey(( e )=> console.log( '2 more later', e.n ))
|
|
46
34
|
```
|
|
47
35
|
|
|
48
|
-
|
|
36
|
+
Stick 👇 this 👇 in your animation loop 💫
|
|
49
37
|
|
|
50
38
|
```javascript
|
|
51
|
-
|
|
39
|
+
Pacer.update()
|
|
52
40
|
```
|
|
41
|
+
That’s it. You’re good to go 👍
|
|
42
|
+
|
|
53
43
|
|
|
54
44
|
|
|
55
45
|
|
|
@@ -60,28 +50,61 @@ p.update()
|
|
|
60
50
|
|
|
61
51
|
## Pacer features
|
|
62
52
|
|
|
63
|
-
With all the tweening and keyframing libraries already out there, why build a new one?
|
|
53
|
+
__Q__: With all the tweening and keyframing libraries already out there, why build a new one? __A__: We write _a lot_ of JavaScript and we have _strong opinions_ about the libraries we use and the code we write. Sometimes that drives us to rip it all up and start afresh. Here are some aspects we gave particular attention to:
|
|
54
|
+
|
|
55
|
+
__Goals and structure__
|
|
56
|
+
|
|
57
|
+
1. [Lightweight and _fast_](#lightweight-and-fast)
|
|
58
|
+
2. [Legible code](#legible-code)
|
|
59
|
+
3. [Function chaining](#function-chaining)
|
|
60
|
+
|
|
61
|
+
__Keyframes and tweens__
|
|
62
|
+
|
|
63
|
+
4. [Relative _and_ absolute timestamps](#relative-and-absolute-timestamps)
|
|
64
|
+
5. [__Pacer’s__ Keyframe Guarantee™](#guaranteed-keyframe-callbacks)
|
|
65
|
+
6. [Tweens: Between two ~~ferns~~ <ins>keyframes</ins>](#tweening)
|
|
66
|
+
7. [Every key, every tween](#every-key-every-tween)
|
|
67
|
+
8. [Access within callbacks](#access-within-callbacks)
|
|
68
|
+
9. [~~Thinking~~ <ins>Tweening</ins> outside the box](#outside-the-box)
|
|
69
|
+
|
|
70
|
+
__Controlling the clock__
|
|
71
|
+
|
|
72
|
+
10. [Update all instances at once](#update-all-instances-at-once)
|
|
73
|
+
11. [Update a specific instance](#update-a-specific-instance)
|
|
74
|
+
12. [Update to a specific time](#update-to-a-specific-time)
|
|
75
|
+
13. [Forward _and_ backward](#forward-and-backward)
|
|
76
|
+
|
|
77
|
+
__Keeping tidy__
|
|
78
|
+
|
|
79
|
+
14. [Looping animations (“Reduce, reuse, recycle”)](#looping-animations)
|
|
80
|
+
15. [Burn it to the ground](#burn-it-to-the-ground)
|
|
81
|
+
|
|
82
|
+
|
|
83
|
+
|
|
84
|
+
|
|
85
|
+
__Bonus__: [A verbose __Pacer__ example](#verbose-example).
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
|
|
90
|
+
<br><br>
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
|
|
95
|
+
### Goals and structure
|
|
64
96
|
|
|
65
|
-
1. [Legible code](#legible-code)
|
|
66
|
-
2. [Function chaining](#function-chaining)
|
|
67
|
-
3. [Relative _and_ absolute timestamps](#relative-and-absolute-timestamps)
|
|
68
|
-
4. [Tweening](#tweening)
|
|
69
|
-
5. [Every key, every tween](#every-key-every-tween)
|
|
70
|
-
6. [Access within callbacks](#access-within-callbacks)
|
|
71
|
-
7. [Update all instances at once](#update-all-instances-at-once)
|
|
72
|
-
8. [Updating time](#updating-time)
|
|
73
|
-
9. [Forward _and_ backward](#forward-and-backward)
|
|
74
|
-
10. [Reduce, reuse, recycle](#reduce-reuse-recycle)
|
|
75
|
-
11. [Burn it to the ground](#burn-it-to-the-ground)
|
|
76
|
-
12. [__Pacer’s__ Keyframe Guarantee™](#guaranteed-keyframe-callbacks)
|
|
77
|
-
13. [Tweening outside the box](#outside-the-box)
|
|
78
|
-
14. [A verbose example](#verbose-example)
|
|
79
97
|
|
|
80
98
|
|
|
81
|
-
<br>
|
|
82
99
|
|
|
100
|
+
#### Lightweight and _fast_
|
|
83
101
|
|
|
84
|
-
|
|
102
|
+
__Pacer__ is lightweight. It handles keyframes and the interpolation between those keyframes. That’s it. It does _not_ include CSS or SVG magic—that’s on you. (Crafting some scroll-based animations? Check out [__Scroll Pacer__](https://github.com/stewdio/scroll-pacer-js).) Other animation library APIs are written around composing a _single_ tween between two keyframes. __Pacer__ eats a zillion keyframes for breakfast. It’s like we took a vintage [AMC Pacer](https://en.wikipedia.org/wiki/AMC_Pacer), stripped it down to the atoms, rebuilt it in [graphene](https://en.wikipedia.org/wiki/Graphene), and strapped a [J58](https://en.wikipedia.org/wiki/Pratt_%26_Whitney_J58) to it for laughs. Light. Fast.
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
|
|
106
|
+
|
|
107
|
+
#### Legible code
|
|
85
108
|
|
|
86
109
|
Your __Pacer__ code says what it does. We wanted it to read like a short story. Animating is hard enough. It’s an iterative process that requires making, testing, and then _remaking._ You shouldn’t have to spend half your energy on deciphering your own code just to track down where that one keyframe is that you’re aiming to edit.
|
|
87
110
|
|
|
@@ -90,45 +113,50 @@ We did shorten some words, like “keyframe” → `key` and “between” → `
|
|
|
90
113
|
|
|
91
114
|
|
|
92
115
|
|
|
93
|
-
|
|
116
|
+
#### Function chaining
|
|
94
117
|
|
|
95
118
|
Expanding on the above, a code block should read like a normal paragraph of text—one idea following another in a logical sequence. With __Pacer__ you declare a keyframe, and [chain](https://en.wikipedia.org/wiki/Method_chaining) another right onto it. Perhaps you add an `onTween` callback _between_ those keyframes. Just about every __Pacer__ method returns its own instance, so you can chain from one method to another, to another—like writing the sentences of a short story.
|
|
96
119
|
|
|
97
120
|
|
|
98
121
|
|
|
99
122
|
|
|
100
|
-
|
|
123
|
+
<br><br>
|
|
124
|
+
|
|
125
|
+
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
### Keyframes and tweens
|
|
129
|
+
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
#### Relative _and_ absolute timestamps
|
|
101
134
|
|
|
102
135
|
By default, keyframes are specificed by _relative_ time. (“Do this two seconds after that last keyframe.”) This makes it trivial to swap pieces of an animation around—just cut and paste—without having to redo all the keyframe timings. Our TL;DR example uses the `key` command to illustrate this workflow, but we could have also used the slightly more descriptive `rel` (“relative”) alias to accomplish the exact same thing. All relative times are relative to the chronologically-latest keyframe as determined the moment the `key` or `rel` command is processed. (And yes, you can specify a _negative_ relative time—if you’re into that sort of thing.) What about your _first_ keyframe—which has no prior keyframe to be relative to? Consider it relative to _zero_—which makes it both relative _and_ absolute. Note the use of the alias `rel` here rather than `key`:
|
|
103
136
|
|
|
104
137
|
```javascript
|
|
105
|
-
var
|
|
106
|
-
now = Date.now(),
|
|
107
|
-
p = new Pacer()
|
|
138
|
+
var now = Date.now()
|
|
108
139
|
|
|
140
|
+
new Pacer()
|
|
109
141
|
.rel( now )
|
|
110
142
|
.onKey(()=> console.log( '1st keyframe' ))
|
|
111
|
-
|
|
112
143
|
.rel( 2000 )
|
|
113
144
|
.onKey(()=> console.log( '3rd keyframe' ))
|
|
114
|
-
|
|
115
145
|
.rel( -1000 )
|
|
116
146
|
.onKey(()=> console.log( '2nd keyframe' ))
|
|
117
147
|
```
|
|
118
148
|
|
|
119
|
-
|
|
149
|
+
Specifying an absolute time for your keyframe is as easy as using the `abs` command instead of `key` or `rel`.
|
|
150
|
+
|
|
120
151
|
|
|
121
152
|
```javascript
|
|
122
|
-
var
|
|
123
|
-
now = Date.now(),
|
|
124
|
-
p = new Pacer()
|
|
153
|
+
var now = Date.now()
|
|
125
154
|
|
|
155
|
+
new Pacer()
|
|
126
156
|
.abs( now )
|
|
127
157
|
.onKey(()=> console.log( '1st keyframe' ))
|
|
128
|
-
|
|
129
158
|
.abs( now + 2000 )
|
|
130
159
|
.onKey(()=> console.log( '3rd keyframe' ))
|
|
131
|
-
|
|
132
160
|
.abs( now + 1000 )
|
|
133
161
|
.onKey(()=> console.log( '2nd keyframe' ))
|
|
134
162
|
```
|
|
@@ -136,29 +164,50 @@ p = new Pacer()
|
|
|
136
164
|
Mix and match `key`, `rel`, and `abs` if it makes you smile.
|
|
137
165
|
|
|
138
166
|
```javascript
|
|
139
|
-
var
|
|
140
|
-
now = Date.now(),
|
|
141
|
-
p = new Pacer()
|
|
167
|
+
var now = Date.now()
|
|
142
168
|
|
|
169
|
+
new Pacer()
|
|
143
170
|
.key( now )
|
|
144
171
|
.onKey(()=> console.log( '1st keyframe' ))
|
|
145
|
-
|
|
146
172
|
.rel( 2000 )
|
|
147
173
|
.onKey(()=> console.log( '3rd keyframe' ))
|
|
148
|
-
|
|
149
174
|
.abs( now + 1000 )
|
|
150
175
|
.onKey(()=> console.log( '2nd keyframe' ))
|
|
151
176
|
```
|
|
152
177
|
|
|
178
|
+
When you create a keyframe, it is added to your instance’s `keys` array, and that array of keyframes is then sorted in chronological order according to each keyframe’s absolute time. Meanwhile, your instance also keeps track of the last keyframe you have “touched” via a `lastTouchedKey` property, so that subsequent commands like `onKey` or `tween` always refer to that last mentioned keyframe.
|
|
179
|
+
|
|
180
|
+
|
|
181
|
+
|
|
182
|
+
|
|
183
|
+
#### Guaranteed keyframe callbacks
|
|
184
|
+
|
|
185
|
+
We pledge to deliver all of your `onKey` callbacks with a money-back guarantee. (Reminder: You have paid zero dollars for this toolkit. And donations don’t count.) By default, each keyframe has a `guarantee` Boolean set to `true` that assures `onKey` will be called when calculating the gulf between “now” and our animation loop’s prior execution. Let’s say you have keyframes spaced very close together in time—tighter than your animation loop is able to execute. In this example, our last `update` call determined that we were between Key Frame __A__ and Key Frame __B__:
|
|
186
|
+
|
|
187
|
+
```
|
|
188
|
+
KEY KEY KEY KEY
|
|
189
|
+
FRAME FRAME FRAME FRAME
|
|
190
|
+
A B C D
|
|
191
|
+
|
|
192
|
+
┄┄┼─────────┼─────────┼─────────┼┄┄
|
|
193
|
+
|
|
194
|
+
prior ↑
|
|
195
|
+
update │ this ↑
|
|
196
|
+
update │
|
|
197
|
+
```
|
|
198
|
+
However, on this current call to `update`, we have not merely reached Key Frame __B__, but have passed both it and Key Frame __C__ to arrive between __C__ and __D__. __Pacer__ ensures that if `onKey` callbacks exist for __B__ and __C__ they will be honored—and in order. Flowing backward through time? Sleep tight knowing they’ll be called in an order that respects your flow of time, eg. __C__ _then_ __B__ when flowing backward. That’s the __Pacer__ Keyframe Guarantee™.
|
|
199
|
+
|
|
200
|
+
As you’d hope, __Pacer__ will also call `onEveryKey` when it honors `onKey` for __B__ and __C__. (Note that `onTween` and `onEveryTween` will _not_ be called for any values between __B__ and __C__ as we are not experiencing time between those keyframes.)
|
|
201
|
+
|
|
153
202
|
|
|
154
203
|
|
|
155
204
|
|
|
156
|
-
|
|
205
|
+
#### Tweening
|
|
157
206
|
|
|
158
207
|
By default your values are [linear interpolated](https://en.wikipedia.org/wiki/Linear_interpolation) (“lerped”) between keyframes. If you’re reading this and evaluating if __Pacer__ is the right solution for you, then I’m sure I don’t have to explain the importance of easing equations. We have the goods. Use `tween()` to pick from our built-in easing equations, and `onTween()` to register a callback function that will execute on each `update()` call that lands between your specified keyframes. Check how easy it is:
|
|
159
208
|
|
|
160
209
|
```javascript
|
|
161
|
-
|
|
210
|
+
new Pacer()
|
|
162
211
|
|
|
163
212
|
.key( Date.now(), { n: 0 })
|
|
164
213
|
.onKey( ( e )=> console.log( 'KEY 1:', e.n ))
|
|
@@ -190,13 +239,13 @@ Each easing equation includes its `in`, `out`, and `inOut` variants, eg. `Pacer.
|
|
|
190
239
|
|
|
191
240
|
|
|
192
241
|
|
|
193
|
-
|
|
242
|
+
#### Every key, every tween
|
|
194
243
|
|
|
195
244
|
If you find you’re running the same callback over and over, perhaps you’d prefer to declare that just once? We’ve got you covered. Use `onEveryKey` to declare a callback that will fire on _every_ keyframe, and `onEveryTween` to do the same for all tweens. [Something borrowed, something blue. Every tween callback for you](https://youtu.be/4YR_Mft7yIM).
|
|
196
245
|
|
|
197
246
|
|
|
198
247
|
```javascript
|
|
199
|
-
|
|
248
|
+
new Pacer()
|
|
200
249
|
.key( Date.now(), { n: 0 })
|
|
201
250
|
.key( 1000, { n: 100 })
|
|
202
251
|
.key( 1000, { n: 200 })
|
|
@@ -207,12 +256,12 @@ var p = new Pacer()
|
|
|
207
256
|
|
|
208
257
|
|
|
209
258
|
|
|
210
|
-
|
|
259
|
+
#### Access within callbacks
|
|
211
260
|
|
|
212
261
|
__Pacer__’s `onKey` and `onTween` methods provide a reference to its own instance as a callback argument. The instance includes potentially useful properties, like `keyIndex` which tells you which keyframe in the sequence you are currently on.
|
|
213
262
|
|
|
214
263
|
```javascript
|
|
215
|
-
|
|
264
|
+
new Pacer()
|
|
216
265
|
.key( Date.now() )
|
|
217
266
|
.key( 1000 )
|
|
218
267
|
.key( 1000 )
|
|
@@ -228,28 +277,29 @@ var p = new Pacer()
|
|
|
228
277
|
))
|
|
229
278
|
```
|
|
230
279
|
|
|
231
|
-
|
|
232
|
-
|
|
280
|
+
And because `onKey` and `onTween` provide the same callback arguments, it’s trivial to use the same callback for both. (Note that `e.n` is the normalized progress between keyframes.)
|
|
233
281
|
|
|
234
282
|
```javascript
|
|
283
|
+
var myCallback = ( e, p )=> console.log(
|
|
284
|
+
|
|
285
|
+
'Step #', p.keyIndex + 1,
|
|
286
|
+
'value:', e.n
|
|
287
|
+
)
|
|
235
288
|
new Pacer()
|
|
236
|
-
.key( Date.now() )
|
|
237
|
-
.key( 1000 )
|
|
238
|
-
.key( 1000 )
|
|
239
|
-
.onEveryKey(
|
|
240
|
-
|
|
241
|
-
'Step #', p.keyIndex + 1,
|
|
242
|
-
'of', p.keys.length
|
|
243
|
-
))
|
|
289
|
+
.key( Date.now(), { n: 0 })
|
|
290
|
+
.key( 1000, { n: 100 })
|
|
291
|
+
.key( 1000, { n: 200 })
|
|
292
|
+
.onEveryKey( myCallback )
|
|
293
|
+
.onEveryTween( myCallback )
|
|
244
294
|
```
|
|
245
295
|
|
|
246
|
-
|
|
296
|
+
You can even check on the overall progress of your __Pacer__ instance, ie. What percentage of this instance’s keyframed duration has been completed? (Note the difference between `e.n` and `p.n`. The former is the progress between the current keyframe and the next one, while the latter describes progress across all keyframes.)
|
|
297
|
+
|
|
247
298
|
|
|
248
299
|
```javascript
|
|
249
300
|
var myCallback = ( e, p )=> console.log(
|
|
250
301
|
|
|
251
|
-
'
|
|
252
|
-
'value:', e.n
|
|
302
|
+
'Pacer progress: '+ Math.round( p.n * 100 ) +'%'
|
|
253
303
|
)
|
|
254
304
|
new Pacer()
|
|
255
305
|
.key( Date.now(), { n: 0 })
|
|
@@ -262,178 +312,224 @@ new Pacer()
|
|
|
262
312
|
|
|
263
313
|
|
|
264
314
|
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
But how do you update an _unnamed_ instance? Under the hood, __Pacer__ keeps a reference to all created instances in its `Pacer.all` array. You can update every single instance at once by sticking this in your animation loop:
|
|
315
|
+
#### Outside the box
|
|
268
316
|
|
|
317
|
+
What happens outside of your declared keyframes? Nothing. Until you do this with your __Pacer__ instance:
|
|
269
318
|
```javascript
|
|
270
|
-
|
|
319
|
+
p.unclamp()
|
|
320
|
+
```
|
|
321
|
+
When your __Pacer__ instance is unclamped, it will automatically extrapolate your first and last tweens forward and backward in time, beyond your declared timeline of keyframes. You often don’t need this—but when you do, you do. Let’s say you have two keyframes, __A__ at time __0__, and __B__ at time __2__. They’re tweening a value, `n`, from `0` to `1` using the default linear interpolation easing function. As a result you can see that at time __1__, the tweened value of `n` will be `0.5`—halfway between its keyframed values of `0` and `1`. So far so good?
|
|
322
|
+
|
|
323
|
+
|
|
324
|
+
```
|
|
325
|
+
KEY KEY
|
|
326
|
+
FRAME FRAME
|
|
327
|
+
A B
|
|
328
|
+
|
|
329
|
+
┄┼┄┄┄┄┄┄┄┄┄╞═════════╪═════════╡┄┄┄┄┄┄┄┄┄┼┄
|
|
330
|
+
t 0 1 2
|
|
331
|
+
|
|
332
|
+
n 0.0 0.5 1.0
|
|
271
333
|
```
|
|
272
334
|
|
|
335
|
+
But what if we wanted to know the tweened value of `n` beyond the specified keyframes? What if we want to know `n` at time __-1__? Or at time __3__? __Pacer__ extends the value of `n` infinitely outward on either side of the timeline using the existing tweening functions on either end of the keyframe sequence. In this simple case we’re using the default linear interpolation on both ends, so it’s trivial to see that at time __-1__, `n` ought to be `-0.5`. This is consistent with its declared trajectory between time __0__ and __1__—or __0__ and __2__, for that matter. Similarly, at time __3__, the extrapolated value of `n` will be `1.5`.
|
|
273
336
|
|
|
337
|
+
```
|
|
338
|
+
KEY KEY
|
|
339
|
+
FRAME FRAME
|
|
340
|
+
unclamped A B unclamped
|
|
274
341
|
|
|
342
|
+
┄┼┄┄┄┄┄┄┄┄┄╞═════════╪═════════╡┄┄┄┄┄┄┄┄┄┼┄
|
|
343
|
+
t -1 0 1 2 3
|
|
275
344
|
|
|
276
|
-
|
|
345
|
+
n -0.5 0.0 0.5 1.0 1.5
|
|
346
|
+
```
|
|
277
347
|
|
|
278
|
-
|
|
348
|
+
Because these times exist beyond our declared keyframes, `onEveryTween()` will _not_ fire. Instead use `onBeforeAll()` and `onAfterAll()`. Here’s a pre-frames example:
|
|
279
349
|
|
|
280
350
|
```javascript
|
|
281
|
-
p.
|
|
351
|
+
p.onBeforeAll(( e, p )=> console.log(
|
|
352
|
+
|
|
353
|
+
'Pre-frames value: ', e.n,
|
|
354
|
+
'Current key index:', p.keyIndex,
|
|
355
|
+
'Current keyframe: ', p.getCurrentKey()
|
|
356
|
+
))
|
|
282
357
|
```
|
|
283
|
-
|
|
358
|
+
And here’s the post-frames complement:
|
|
284
359
|
|
|
285
|
-
|
|
360
|
+
```javascript
|
|
361
|
+
p.onAfterAll(( e, p )=> console.log(
|
|
286
362
|
|
|
363
|
+
'Post-frames value:', e.n,
|
|
364
|
+
'Current key index:', p.keyIndex,
|
|
365
|
+
'Current keyframe: ', p.getCurrentKey()
|
|
366
|
+
))
|
|
367
|
+
```
|
|
287
368
|
|
|
369
|
+
Note that for both of these, `p.keyIndex` will be _out of range_ of `p.keys` (`-1` and `keys.length`, respectively.) Consequently, `p.getCurrentKey()` will return `undefined`. This is expected behavior—you are beyond the timeline of the keyframes, after all. Here’s some pseudocode for additional clarity:
|
|
288
370
|
|
|
371
|
+
```
|
|
372
|
+
if keyIndex === -1 → onBeforeAll()
|
|
289
373
|
|
|
290
|
-
|
|
374
|
+
if keyIndex >= 0 and <= keys.length-1 → onEveryTween()
|
|
291
375
|
|
|
292
|
-
|
|
376
|
+
if keyIndex === keys.length → onAfterAll()
|
|
377
|
+
```
|
|
378
|
+
|
|
379
|
+
The combination of using these separate tween callbacks (`onBeforeAll` and `onAfterAll`) alongside `clamp()` and `unclamp()` allows us to cleanly separate animation logic for “outside the box” from whether or not that logic should use clamped or extrapolated values. Should you choose to, you can keep your values clamped, but use `onBeforeAll` and `onAfterAll` to the following effect:
|
|
380
|
+
|
|
381
|
+
|
|
382
|
+
```
|
|
383
|
+
KEY KEY
|
|
384
|
+
FRAME FRAME
|
|
385
|
+
clamped A B clamped
|
|
293
386
|
|
|
387
|
+
┄┼┄┄┄┄┄┄┄┄┄╞═════════╪═════════╡┄┄┄┄┄┄┄┄┄┼┄
|
|
388
|
+
t -1 0 1 2 3
|
|
389
|
+
|
|
390
|
+
n 0.0 0.0 0.5 1.0 1.0
|
|
391
|
+
```
|
|
392
|
+
|
|
393
|
+
|
|
394
|
+
|
|
395
|
+
|
|
396
|
+
<br><br>
|
|
294
397
|
|
|
295
398
|
|
|
296
399
|
|
|
297
|
-
### Enable / disable
|
|
298
400
|
|
|
299
|
-
|
|
401
|
+
### Controlling the clock
|
|
300
402
|
|
|
403
|
+
|
|
404
|
+
|
|
405
|
+
|
|
406
|
+
#### Update all instances at once
|
|
407
|
+
|
|
408
|
+
So far our examples have used _unnamed_ instances of __Pacer__, like so:
|
|
301
409
|
```javascript
|
|
302
|
-
|
|
410
|
+
new Pacer()
|
|
303
411
|
```
|
|
304
|
-
|
|
412
|
+
|
|
413
|
+
And our animation loop has used
|
|
305
414
|
|
|
306
415
|
```javascript
|
|
307
|
-
|
|
416
|
+
Pacer.update()
|
|
308
417
|
```
|
|
418
|
+
to update every single instance in one single command. This is possible because under the hood, __Pacer__ keeps a reference to all created instances in its static `Pacer.all` array. You call the static `Pacer.update()` and in turn it calls the instance method `update()` on each instance.
|
|
309
419
|
|
|
310
420
|
|
|
311
421
|
|
|
312
422
|
|
|
313
|
-
|
|
423
|
+
#### Update a specific instance
|
|
314
424
|
|
|
315
|
-
|
|
425
|
+
We can also _name_ our instances through assignment, like this:
|
|
316
426
|
|
|
317
427
|
```javascript
|
|
318
|
-
p
|
|
428
|
+
var p = new Pacer()
|
|
319
429
|
```
|
|
320
430
|
|
|
431
|
+
That allows us to update instances on an individual basis. You can use this in your animation loop instead to update only this named `p` instance:
|
|
321
432
|
|
|
322
|
-
|
|
433
|
+
```javascript
|
|
434
|
+
p.update()
|
|
435
|
+
```
|
|
323
436
|
|
|
324
437
|
|
|
325
|
-
### Burn it to the ground
|
|
326
438
|
|
|
327
|
-
Done with your instance for good? (We’re not talking about “pausing” your instance—we’re about to _destroy_ your instance.) Remove all of __Pacer__’s references to it and set the instance to `null` with:
|
|
328
439
|
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
Or via the class itself:
|
|
440
|
+
#### Update to a specific time
|
|
441
|
+
|
|
442
|
+
You’ve seen that you can update all instances with `Pacer.update()`, and a specific named instance with something like `p.update()`. But now you’re interested in finer control of your timing, ie. You’re ready to pass your own numeric value to `update`. When either the class or instance `update` method is called without arguments, __Pacer__ defaults to `Date.now()`, but you are free to use any numeric progression you choose. Perhaps you want to key off of `window.performance.now()` for finer accuraccy. Or maybe you’re building a scroll-based animation and you’re substituting `scrollY` (pixels) for time. Just pass your value via update:
|
|
333
443
|
|
|
334
444
|
```javascript
|
|
335
|
-
Pacer.
|
|
445
|
+
Pacer.update( numericValue )
|
|
336
446
|
```
|
|
337
|
-
|
|
447
|
+
|
|
448
|
+
Or for a specific instance (assuming you’ve named it `p`):
|
|
449
|
+
|
|
338
450
|
|
|
339
451
|
```javascript
|
|
340
|
-
|
|
452
|
+
p.update( numericValue )
|
|
341
453
|
```
|
|
454
|
+
Be sure you’re consistent with your units. __Pacer__ isn’t going to magically understand that you’ve used seconds to declare keyframes, but milliseconds in your `update` call. That’s on you. And don’t use one instance for timed animations, another for scrolling animations, and then expect the global `Pacer.update()` to cater to both. (My advice? If you’re creating instances that use different units, house each unit group in its own array. Then in your animation loop, iterate through each array and call update on its entries with whatever `numericValue` is appropriate for that group.)
|
|
342
455
|
|
|
343
456
|
|
|
457
|
+
##### Update is absolute
|
|
344
458
|
|
|
459
|
+
Another thing to note is that `update` expects an _absolute_ number, rather than a _relative_ one. (That’s “absolute” as in each number represents a distance from zero, not “absolute value” as in a non-negative number. __Pacer__’s `update` is perfectly happy to accept negative values for time.) Repeatedly calling `p.update( 1000 )` will _not_ advance your animation by one second with each call. Instead it will lock your animation at its absolute one second mark. Relative units are enormously useful for crafting (and recrafting) keyframes, but slightly less useful within the context of synchronization. It’s taken years of building projects like this to be able to feel confident in asserting this subtlety.
|
|
345
460
|
|
|
346
|
-
### Guaranteed keyframe callbacks
|
|
347
461
|
|
|
348
|
-
We pledge to deliver all of your `onKey` callbacks with a money-back guarantee. (Reminder: You have paid zero dollars for this toolkit.And donations don’t count.) By default, each keyframe has a `guarantee` Boolean set to `true` that assures `onKey` will be called when calculating the gulf between “now” and our animation loop’s prior execution. Let’s say you have keyframes spaced very close together in time—tighter than your animation loop is able to execute. In this example, our last `update` call determined that we were between Key Frame __A__ and Key Frame __B__:
|
|
349
462
|
|
|
350
|
-
```
|
|
351
|
-
KEY KEY KEY KEY
|
|
352
|
-
FRAME FRAME FRAME FRAME
|
|
353
|
-
A B C D
|
|
354
463
|
|
|
355
|
-
|
|
464
|
+
#### Forward _and_ backward
|
|
356
465
|
|
|
357
|
-
|
|
358
|
-
update │ this ↑
|
|
359
|
-
update │
|
|
360
|
-
```
|
|
361
|
-
However, on this current call to `update`, we have not merely reached Key Frame __B__, but have passed both it and Key Frame __C__ to arrive between __C__ and __D__. __Pacer__ ensures that if `onKey` callbacks exist for __B__ and __C__ they will be honored—and in order. Flowing backward through time? Sleep tight knowing they’ll be called in an order that respects your flow of time, eg. __C__ _then_ __B__ when flowing backward. That’s the __Pacer__ Keyframe Guarantee™.
|
|
466
|
+
Mathematically, [time can flow both forward _and_ backward](https://en.wikipedia.org/wiki/Tenet_(film)). Why would __Pacer__ ignore that reality? The ability to scrub a timeline back and forth is incredibly valuable, and literally the mechanism that our __ScrollPacer__ toolkit uses for scroll-based animations. (More on this to come.) Rest assured that your `update` call can handle time flowing in either direction (and at any speed). It just works.
|
|
362
467
|
|
|
363
|
-
As you’d hope, __Pacer__ will also call `onEveryKey` when it honors `onKey` for __B__ and __C__. Note that `onTween` and `onEveryTween` will _not_ be called for any values between __B__ and __C__ as we are not experiencing time between those keyframes.
|
|
364
468
|
|
|
365
469
|
|
|
366
470
|
|
|
471
|
+
#### Enable / disable
|
|
367
472
|
|
|
368
|
-
|
|
473
|
+
Need to gate your __Pacer__ instance? (Let’s again assume you’ve named it `p`.) Prevent it from chewing `update` cycles:
|
|
369
474
|
|
|
370
|
-
What happens outside of your declared keyframes? Nothing. Until you do this with your __Pacer__ instance:
|
|
371
475
|
```javascript
|
|
372
|
-
p.
|
|
476
|
+
p.disable()
|
|
373
477
|
```
|
|
374
|
-
|
|
375
|
-
|
|
478
|
+
Ready to return to service?
|
|
376
479
|
|
|
480
|
+
```javascript
|
|
481
|
+
p.enable()
|
|
377
482
|
```
|
|
378
|
-
KEY KEY
|
|
379
|
-
FRAME FRAME
|
|
380
|
-
A B
|
|
381
483
|
|
|
382
|
-
┄┼┄┄┄┄┄┄┄┄┄╞═════════╪═════════╡┄┄┄┄┄┄┄┄┄┼┄
|
|
383
|
-
t 0 1 2
|
|
384
484
|
|
|
385
|
-
n 0.0 0.5 1.0
|
|
386
|
-
```
|
|
387
485
|
|
|
388
|
-
But what if we wanted to know the tweened value of `n` beyond the specified keyframes? What if we want to know `n` at time __-1__? Or at time __3__? __Pacer__ extends the value of `n` infinitely outward on either side of the timeline using the existing tweening functions on either end of the keyframe sequence. In this simple case we’re using the default linear interpolation on both ends, so it’s trivial to see that at time __-1__ `n` ought to be `-0.5`. This is consistent with its declared trajectory between time __0__ and __1__—or __0__ and __2__, for that matter. Similarly, at time __3__, `n` will be `1.5`.
|
|
389
486
|
|
|
390
|
-
|
|
391
|
-
KEY KEY
|
|
392
|
-
FRAME FRAME
|
|
393
|
-
A B
|
|
487
|
+
<br><br>
|
|
394
488
|
|
|
395
|
-
┄┼┄┄┄┄┄┄┄┄┄╞═════════╪═════════╡┄┄┄┄┄┄┄┄┄┼┄
|
|
396
|
-
t -1 0 1 2 3
|
|
397
489
|
|
|
398
|
-
n -0.5 0.0 0.5 1.0 1.5
|
|
399
|
-
```
|
|
400
490
|
|
|
401
|
-
Because these times exist beyond our declared keyframes, `onEveryTween` will _not_ fire. (Just imagine how annoying that would become—requiring you to gate all of your `onEveryTween` callbacks based on whether or not the current time was actually within your expected range.) So how do we make use of this tween extrapolation? Here’s an example pre-history callback:
|
|
402
491
|
|
|
403
|
-
|
|
404
|
-
p.onBeforeAll(( e, p )=> console.log(
|
|
492
|
+
### Keeping tidy
|
|
405
493
|
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
494
|
+
|
|
495
|
+
|
|
496
|
+
|
|
497
|
+
#### Looping animations
|
|
498
|
+
|
|
499
|
+
Want to loop an entire animation sequence as time continues to march forward? There is no need to constantly create new instances. Re-running an animation is easy. The `reset` method recalculates the timing of all of your instance’s keyframes based on the numeric argument provided. (With no arguments, the `reset` method defaults to `Date.now()`.) Here’s an example of taking a previously used animation and restarting it two seconds from now:
|
|
500
|
+
|
|
501
|
+
```javascript
|
|
502
|
+
p.reset( Date.now() + 2000 )
|
|
410
503
|
```
|
|
411
|
-
|
|
504
|
+
|
|
505
|
+
|
|
506
|
+
|
|
507
|
+
|
|
508
|
+
#### Burn it to the ground
|
|
509
|
+
|
|
510
|
+
Done with your instance for good? (We’re not talking about “pausing” your instance—we’re about to _destroy_ your instance.) Remove all of __Pacer__’s references to it and set the instance to `null` with:
|
|
412
511
|
|
|
413
512
|
```javascript
|
|
414
|
-
p.
|
|
513
|
+
p.remove()
|
|
514
|
+
```
|
|
515
|
+
Or via the class itself:
|
|
415
516
|
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
'Current keyframe: ', p.getCurrentKey()
|
|
419
|
-
))
|
|
517
|
+
```javascript
|
|
518
|
+
Pacer.remove( p )
|
|
420
519
|
```
|
|
421
|
-
|
|
520
|
+
Seeking total destruction? (“Of all the gin joints in all the towns in all the world, she walks into mine.”)
|
|
422
521
|
|
|
522
|
+
```javascript
|
|
523
|
+
Pacer.removeAll()
|
|
423
524
|
```
|
|
424
|
-
if keyIndex === -1 → onBeforeAll()
|
|
425
525
|
|
|
426
|
-
if keyIndex 0..keys.length-1 → onEveryTween()
|
|
427
526
|
|
|
428
|
-
if keyIndex === keys.length → onAfterAll()
|
|
429
|
-
```
|
|
430
527
|
|
|
431
528
|
|
|
432
529
|
|
|
433
530
|
|
|
434
|
-
<br><br>
|
|
531
|
+
<br><br><br>
|
|
435
532
|
<hr>
|
|
436
|
-
<br><br>
|
|
437
533
|
|
|
438
534
|
|
|
439
535
|
|
|
@@ -524,27 +620,6 @@ var p = new Pacer( 'My first Pacer', 's' )
|
|
|
524
620
|
.key( 2000, { n: 700, x: -100 })
|
|
525
621
|
|
|
526
622
|
|
|
527
|
-
// Let’s look at some keyframe declaration variations.
|
|
528
|
-
|
|
529
|
-
.key(
|
|
530
|
-
|
|
531
|
-
2000,
|
|
532
|
-
{ n: 800 },
|
|
533
|
-
( e, p )=> console.log(
|
|
534
|
-
|
|
535
|
-
'💫 Did you know, '+
|
|
536
|
-
'you can actually specify an onKey callback '+
|
|
537
|
-
'right in the keyframe declaration itself?'
|
|
538
|
-
)
|
|
539
|
-
)
|
|
540
|
-
.key( 2000 )
|
|
541
|
-
.values({ n: 900 })
|
|
542
|
-
.onKey(( e, p )=> console.log(
|
|
543
|
-
|
|
544
|
-
'Or keep each argument entirely separate.'
|
|
545
|
-
))
|
|
546
|
-
|
|
547
|
-
|
|
548
623
|
// Totally commenting these out
|
|
549
624
|
// in case you copy and paste this whole thing
|
|
550
625
|
// into your console.
|
|
@@ -627,20 +702,3 @@ var p = new Pacer( 'My first Pacer', 's' )
|
|
|
627
702
|
|
|
628
703
|
|
|
629
704
|
|
|
630
|
-
<!--
|
|
631
|
-
|
|
632
|
-
## Commands
|
|
633
|
-
|
|
634
|
-
key
|
|
635
|
-
tween
|
|
636
|
-
rel
|
|
637
|
-
abs
|
|
638
|
-
etc
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
## Event hooks
|
|
642
|
-
|
|
643
|
-
onKey
|
|
644
|
-
onTween
|
|
645
|
-
|
|
646
|
-
-->
|
package/pacer.svg
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
<?xml version="1.0" encoding="UTF-8"?>
|
|
2
|
+
<svg
|
|
3
|
+
xmlns="http://www.w3.org/2000/svg"
|
|
4
|
+
version="1.1"
|
|
5
|
+
viewBox="0 0 800 600">
|
|
6
|
+
<title>Pacer</title>
|
|
7
|
+
<g id="Background">
|
|
8
|
+
<path style="fill: #f6f8fa;" d="M800,300v101.75s0,8.6,0,8.6v6.54s0,5.33,0,5.33v4.54s0,3.97,0,3.97v3.54s0,3.2,0,3.2v2.93s0,2.7,0,2.7v2.51s-.01,2.35-.01,2.35v2.21s-.01,2.09-.01,2.09v1.98s-.01,1.88-.01,1.88v1.79s-.02,1.71-.02,1.71v1.65s-.02,1.58-.02,1.58v1.52s-.02,1.47-.02,1.47v1.42s-.02,1.37-.02,1.37v1.33s-.02,1.29-.02,1.29v1.25s-.02,1.21-.02,1.21v1.18s-.02,1.15-.02,1.15v1.12s-.03,1.09-.03,1.09v1.07s-.03,1.04-.03,1.04v1.02s-.03.99-.03.99l-.02.97-.02.95-.02.93-.02.91-.02.9-.02.88-.02.86-.02.85-.02.83-.02.82-.02.8-.02.79-.02.78-.02.76-.02.75-.02.74-.02.73-.02.72-.02.71-.02.7-.02.69-.02.68-.02.67-.02.66-.03.65-.03.64-.03.64-.03.63-.03.62-.03.61-.03.6-.03.6-.03.59-.03.58-.03.58-.03.57-.03.56-.03.56-.03.55-.03.55-.03.54-.03.53-.03.53-.03.52-.03.52-.03.51-.03.51-.03.5-.03.5-.04.49-.04.49-.04.48-.04.48-.04.47-.04.47-.04.47-.04.46-.04.46-.04.45-.04.45-.04.45-.04.44-.04.44-.04.43-.04.43-.04.43-.04.42-.04.42-.04.42-.04.41-.04.41-.04.41-.05.4-.04.4-.05.4-.05.39-.05.39-.05.39-.05.39-.05.38-.05.38-.05.38-.05.38-.05.37-.05.37-.05.37-.05.37-.05.36-.05.36-.05.36-.05.35-.05.35-.05.35-.05.35-.05.35-.05.34-.05.34-.05.34-.06.34-.06.33-.06.33-.06.33-.06.33-.06.33-.06.33-.06.32-.06.32-.06.32-.06.32-.06.32-.06.31-.06.31-.06.31-.06.31-.06.31-.06.3-.06.3-.06.3-.06.3-.07.3-.07.29-.07.29-.07.29-.07.29-.07.29-.07.29-.07.29-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.27-.07.27-.07.27-.07.27-.07.27-.07.27-.07.26-.07.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.25-.08.25-.08.25-.08.25-.08.25-.08.25-.08.25-.08.24-.08.24-.08.24-.08.24-.08.24-.08.24-.08.24-.08.24-.09.24-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.09.22-.1.21-.09.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.1.2-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.18-.11.18-.11.18-.11.18-.11.18-.11.18-.11.18-.11.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.13.17-.13.17-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.15-.14.16-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.15.14-.15.15-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.16.14-.16.14-.16.13-.16.14-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.17.13-.17.13-.17.13-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.18.12-.17.12-.18.12-.18.12-.18.12-.18.12-.18.12-.18.12-.18.12-.18.12-.18.12-.18.11-.18.11-.18.11-.18.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.2.11-.2.11-.2.11-.2.11-.2.11-.2.11-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.22.1-.22.1-.22.1-.22.1-.22.09-.22.1-.22.09-.22.09-.22.09-.22.09-.22.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.24.09-.24.09-.24.09-.24.09-.24.09-.24.09-.24.09-.24.08-.24.09-.24.09-.25.08-.25.08-.25.08-.25.08-.25.08-.25.08-.25.08-.25.08-.26.08-.25.08-.26.08-.26.08-.26.08-.26.08-.26.08-.26.08-.26.08-.26.08-.27.08-.27.08-.27.08-.27.08-.27.08-.27.08-.27.08-.27.07-.27.07-.28.07-.28.07-.28.07-.28.07-.28.07-.28.07-.28.07-.28.07-.29.07-.29.07-.29.07-.29.07-.29.07-.29.07-.29.07-.3.07-.3.07-.3.07-.3.07-.3.07-.3.07-.3.07-.31.07-.31.07-.31.07-.31.07-.31.06-.31.06-.32.06-.32.06-.32.06-.32.06-.32.06-.32.06-.32.06-.33.06-.33.06-.33.06-.33.06-.33.06-.33.06-.34.06-.34.06-.34.06-.34.06-.34.06-.34.06-.35.06-.35.06-.35.06-.35.06-.35.06-.35.05-.36.05-.36.05-.36.05-.36.05-.36.05-.37.05-.37.05-.37.05-.37.05-.38.05-.38.05-.38.05-.38.05-.38.05-.38.05-.39.05-.39.05-.39.05-.39.05-.4.05-.4.05-.4.05-.4.05-.41.05-.41.05-.41.05-.41.05-.41.05-.42.05-.42.04-.42.05-.42.04-.43.04-.43.04-.43.04-.43.04-.44.04-.44.04-.44.04-.45.04-.45.04-.45.04-.45.04-.46.04-.46.04-.46.04-.47.04-.47.04-.47.04-.48.04-.48.04-.48.04-.49.04-.49.04-.49.04-.5.04-.5.04-.5.04-.51.04-.51.04-.52.04-.52.04-.52.03-.53.03-.53.03-.54.03-.54.03-.54.03-.55.03-.55.03-.56.03-.56.03-.57.03-.57.03-.58.03-.58.03-.58.03-.59.03-.6.03-.6.03-.61.03-.61.03-.62.03-.62.03-.63.03-.63.03-.64.03-.64.03-.65.03-.66.03-.66.03-.67.03-.68.03-.68.02-.69.03-.7.03-.7.02-.71.02-.72.02-.73.02-.73.02-.74.02-.75.02-.76.02-.77.02-.78.02-.79.02-.8.02-.8.02-.82.02-.83.02-.84.02-.85.02-.86.02-.87.02-.88.02-.89.02-.9.02-.92.02-.93.02-.95.02-.96.02-.97.02-.99.02-1,.02-1.02.02-1.04.02h-1.05s-1.07.03-1.07.03h-1.09s-1.11.03-1.11.03h-1.13s-1.15.03-1.15.03h-1.17s-1.2.03-1.2.03h-1.22s-1.24.02-1.24.02h-1.27s-1.3.02-1.3.02h-1.33s-1.36.02-1.36.02h-1.39s-1.42.02-1.42.02h-1.46s-1.49.02-1.49.02h-1.53s-1.57.02-1.57.02h-1.62s-1.66.02-1.66.02h-1.71s-1.77.02-1.77.02h-1.83s-1.89.01-1.89.01h-1.96s-2.03.01-2.03.01h-2.11s-2.19.01-2.19.01h-2.29s-2.39.01-2.39.01h-2.51s-2.64.01-2.64.01h-2.78s-2.94,0-2.94,0h-3.13s-3.35,0-3.35,0h-3.6s-3.9,0-3.9,0h-4.27s-4.72,0-4.72,0h-5.29s-6.05,0-6.05,0h-7.11s-8.71,0-8.71,0h-29.02s-117.38,0-117.38,0h-136.39s-11.46,0-11.46,0h-8.71s-7.11,0-7.11,0h-6.05s-5.29,0-5.29,0h-4.72s-4.27,0-4.27,0h-3.9s-3.6,0-3.6,0h-3.35s-3.13,0-3.13,0h-2.94s-2.78,0-2.78,0h-2.64s-2.51-.01-2.51-.01h-2.39s-2.29-.01-2.29-.01h-2.19s-2.11-.01-2.11-.01h-2.03s-1.96-.01-1.96-.01h-1.89s-1.83-.01-1.83-.01h-1.77s-1.71-.02-1.71-.02h-1.67s-1.62-.02-1.62-.02h-1.57s-1.53-.02-1.53-.02h-1.49s-1.46-.02-1.46-.02h-1.42s-1.39-.02-1.39-.02h-1.36s-1.32-.02-1.32-.02h-1.3s-1.27-.02-1.27-.02h-1.24s-1.22-.02-1.22-.02h-1.19s-1.17-.03-1.17-.03h-1.15s-1.13-.03-1.13-.03h-1.11s-1.09-.03-1.09-.03l-1.07-.02h-1.05s-1.04-.03-1.04-.03l-1.02-.02-1-.02-.99-.02-.97-.02-.96-.02-.95-.02-.93-.02-.92-.02-.9-.02-.89-.02-.88-.02-.87-.02-.86-.02-.85-.02-.84-.02-.83-.02-.82-.02-.81-.02-.8-.02-.79-.02-.78-.02-.77-.02-.76-.02-.75-.02-.74-.02-.74-.02-.73-.02-.72-.02-.71-.02-.7-.02-.7-.03-.69-.03-.68-.02-.68-.03-.67-.03-.66-.03-.66-.03-.65-.03-.64-.03-.64-.03-.63-.03-.63-.03-.62-.03-.62-.03-.61-.03-.6-.03-.6-.03-.59-.03-.59-.03-.58-.03-.58-.03-.57-.03-.57-.03-.57-.03-.56-.03-.56-.03-.55-.03-.55-.03-.54-.03-.54-.03-.54-.03-.53-.03-.53-.03-.52-.03-.52-.04-.52-.04-.51-.04-.51-.04-.5-.04-.5-.04-.5-.04-.49-.04-.49-.04-.49-.04-.48-.04-.48-.04-.48-.04-.47-.04-.47-.04-.47-.04-.46-.04-.46-.04-.46-.04-.46-.04-.45-.04-.45-.04-.45-.04-.44-.04-.44-.04-.44-.04-.44-.04-.43-.04-.43-.04-.43-.04-.42-.04-.42-.05-.42-.04-.42-.05-.42-.05-.41-.05-.41-.05-.41-.05-.4-.05-.4-.05-.4-.05-.4-.05-.4-.05-.39-.05-.39-.05-.39-.05-.39-.05-.38-.05-.38-.05-.38-.05-.38-.05-.38-.05-.38-.05-.37-.05-.37-.05-.37-.05-.37-.05-.36-.05-.36-.05-.36-.05-.36-.05-.36-.05-.35-.05-.35-.06-.35-.06-.35-.06-.35-.06-.35-.06-.34-.06-.34-.06-.34-.06-.34-.06-.34-.06-.33-.06-.33-.06-.33-.06-.33-.06-.33-.06-.33-.06-.33-.06-.32-.06-.32-.06-.32-.06-.32-.06-.32-.06-.32-.06-.32-.06-.31-.06-.31-.06-.31-.07-.31-.07-.31-.07-.31-.07-.3-.07-.3-.07-.3-.07-.3-.07-.3-.07-.3-.07-.3-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.27-.07-.27-.08-.27-.08-.27-.08-.27-.08-.27-.08-.27-.08-.27-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.26-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.24-.09-.24-.09-.24-.08-.24-.09-.24-.09-.24-.09-.24-.09-.24-.09-.24-.09-.24-.09-.24-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.1-.22-.09-.22-.1-.22-.1-.22-.1-.22-.1-.22-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.11-.2-.11-.2-.11-.2-.11-.2-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.18-.11-.18-.11-.18-.11-.18-.11-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.13-.17-.13-.17-.13-.17-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.14-.16-.13-.15-.14-.16-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.15-.15-.14-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.15-.14-.16-.14-.15-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.16-.13-.17-.13-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.17-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.12-.18-.11-.18-.11-.18-.11-.18-.11-.18-.11-.18-.11-.18-.11-.18-.11-.18-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.11-.19-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.2-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.21-.1-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.22-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.23-.09-.24-.08-.24-.08-.24-.08-.24-.08-.24-.08-.24-.08-.24-.08-.24-.08-.24-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.25-.08-.26-.08-.26-.08-.26-.08-.26-.07-.26-.08-.26-.07-.26-.07-.26-.07-.27-.07-.27-.07-.27-.07-.27-.07-.27-.07-.27-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.28-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.29-.07-.3-.06-.3-.06-.3-.06-.3-.06-.3-.06-.31-.06-.31-.06-.31-.06-.31-.06-.31-.06-.32-.06-.32-.06-.32-.06-.32-.06-.32-.06-.33-.06-.33-.06-.33-.06-.33-.06-.33-.06-.33-.06-.34-.06-.34-.05-.34-.06-.34-.05-.35-.05-.35-.05-.35-.05-.35-.05-.35-.05-.36-.05-.36-.05-.36-.05-.37-.05-.37-.05-.37-.05-.37-.05-.38-.05-.38-.05-.38-.05-.38-.05-.39-.05-.39-.05-.39-.05-.39-.05-.4-.05-.4-.04-.4-.04-.41-.04-.41-.04-.41-.04-.42-.04-.42-.04-.42-.04-.43-.04-.43-.04-.43-.04-.44-.04-.44-.04-.45-.04-.45-.04-.45-.04-.46-.04-.46-.04-.47-.04-.47-.04-.47-.04-.48-.04-.48-.04-.49-.03-.49-.04-.5-.03-.5-.03-.51-.03-.51-.03-.52-.03-.52-.03-.53-.03-.53-.03-.54-.03-.55-.03-.55-.03-.56-.03-.56-.03-.57-.03-.58-.03-.58-.03-.59-.03-.6-.03-.6-.03-.61-.03-.62-.03-.63-.03-.64-.02-.64-.03-.65-.02-.66-.02-.67-.02-.68-.02-.69-.02-.7-.02-.71-.02-.72-.02-.73-.02-.74-.02-.75-.02-.76-.02-.78-.02-.79-.02-.8-.02-.82-.02-.83-.02-.85-.02-.86-.02-.88-.02-.9-.02-.91-.02-.93-.02-.95-.02-.97v-.99s-.03-1.02-.03-1.02v-1.04s-.03-1.07-.03-1.07v-1.09s-.02-1.12-.02-1.12v-1.15s-.03-1.18-.03-1.18v-1.21s-.02-1.25-.02-1.25v-1.29s-.02-1.33-.02-1.33v-1.37s-.02-1.42-.02-1.42v-1.47s-.02-1.52-.02-1.52v-1.58s-.02-1.65-.02-1.65v-1.71s-.02-1.79-.02-1.79v-1.88s-.01-1.98-.01-1.98v-2.09s-.01-2.21-.01-2.21v-2.35s-.01-2.51-.01-2.51v-2.7s0-2.93,0-2.93v-3.2s0-3.54,0-3.54v-3.97s0-4.54,0-4.54v-5.33s0-6.54,0-6.54v-8.6s0-13.17,0-13.17v-190.33s0-8.6,0-8.6v-6.54s0-5.33,0-5.33v-4.54s0-3.97,0-3.97v-3.54s0-3.2,0-3.2v-2.93s0-2.7,0-2.7v-2.51s.01-2.35.01-2.35v-2.21s.01-2.09.01-2.09v-1.98s.01-1.88.01-1.88v-1.79s.02-1.71.02-1.71v-1.65s.02-1.58.02-1.58v-1.52s.02-1.47.02-1.47v-1.42s.02-1.37.02-1.37v-1.33s.02-1.29.02-1.29v-1.25s.02-1.21.02-1.21v-1.18s.03-1.15.03-1.15v-1.12s.02-1.09.02-1.09v-1.06s.03-1.04.03-1.04v-1.02s.03-.99.03-.99l.02-.97.02-.95.02-.93.02-.92.02-.9.02-.88.02-.86.02-.85.02-.83.02-.82.02-.8.02-.79.02-.78.02-.76.02-.75.02-.74.02-.73.02-.72.02-.71.02-.7.02-.69.02-.68.02-.67.02-.66.03-.65.02-.64.03-.64.03-.63.03-.62.03-.61.03-.6.03-.6.03-.59.03-.58.03-.58.03-.57.03-.56.03-.56.03-.55.03-.55.03-.54.03-.53.03-.53.03-.52.03-.52.03-.51.03-.51.03-.5.04-.5.03-.49.04-.49.04-.48.04-.48.04-.48.04-.47.04-.47.04-.46.04-.46.04-.45.04-.45.04-.45.04-.44.04-.44.04-.43.04-.43.04-.43.04-.42.04-.42.04-.42.04-.41.04-.41.04-.41.04-.4.05-.4.05-.4.05-.39.05-.39.05-.39.05-.39.05-.38.05-.38.05-.38.05-.38.05-.37.05-.37.05-.37.05-.37.05-.36.05-.36.05-.36.05-.35.05-.35.05-.35.05-.35.05-.35.06-.34.05-.34.06-.34.06-.34.06-.33.06-.33.06-.33.06-.33.06-.33.06-.33.06-.32.06-.32.06-.32.06-.32.06-.31.06-.31.06-.31.06-.31.06-.31.06-.31.06-.3.06-.3.06-.3.06-.3.07-.3.07-.3.07-.29.07-.29.07-.29.07-.29.07-.29.07-.29.07-.28.07-.28.07-.28.07-.28.07-.28.07-.28.07-.27.07-.27.07-.27.07-.27.07-.27.07-.27.07-.27.07-.26.07-.26.08-.26.07-.26.08-.26.08-.26.08-.26.08-.26.08-.25.08-.25.08-.25.08-.25.08-.25.08-.25.08-.25.08-.24.08-.25.08-.24.08-.24.08-.24.08-.24.08-.24.08-.24.09-.24.09-.24.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.23.09-.22.09-.22.09-.22.09-.22.09-.22.09-.22.09-.22.09-.22.09-.22.09-.22.1-.22.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.21.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.1-.2.11-.2.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.19.11-.18.11-.19.11-.18.11-.18.11-.18.11-.18.11-.18.11-.18.12-.18.12-.18.12-.18.12-.18.12-.18.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.12-.17.13-.17.13-.17.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.13-.16.14-.15.14-.16.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.14-.15.15-.14.15-.15.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.15-.14.16-.14.15-.14.16-.13.16-.14.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.16-.13.17-.13.17-.13.17-.13.17-.13.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.17-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.12.18-.11.18-.12.18-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.19-.11.2-.11.2-.11.2-.11.2-.11.2-.11.2-.1.2-.11.2-.1.2-.1.2-.1.2-.1.2-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.21-.1.22-.1.22-.1.22-.1.22-.1.22-.09.22-.1.22-.1.22-.1.22-.09.22-.09.22-.09.22-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.23-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.24-.09.25-.08.25-.08.25-.08.25-.08.25-.08.25-.08.25-.08.25-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.26-.08.27-.08.27-.08.27-.08.27-.08.27-.08.27-.08.27-.07.27-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.28-.07.29-.07.29-.07.29-.07.29-.07.29-.07.29-.07.29-.07.3-.07.3-.07.3-.07.3-.07.3-.07.3-.07.3-.07.31-.07.31-.07.31-.07.31-.07.31-.06.31-.06.32-.06.32-.06.32-.06.32-.06.32-.06.32-.06.32-.06.33-.06.33-.06.33-.06.33-.06.33-.06.33-.06.33-.06.34-.06.34-.06.34-.06.34-.06.34-.06.35-.06.35-.06.35-.06.35-.06.35-.06.35-.05.36-.06.36-.05.36-.05.36-.05.36-.05.37-.05.37-.05.37-.05.37-.05.38-.05.38-.05.38-.05.38-.05.38-.05.38-.05.39-.05.39-.05.39-.05.39-.05.4-.05.4-.05.4-.05.4-.05.4-.05.41-.05.41-.05.41-.05.42-.05.42-.05.42-.04.42-.05.42-.04.43-.04.43-.04.43-.04.44-.04.44-.04.44-.04.44-.04.45-.04.45-.04.45-.04.46-.04.46-.04.46-.04.46-.04.47-.04.47-.04.47-.04.48-.04.48-.04.48-.04.49-.04.49-.04.49-.04.5-.04.5-.04.5-.04.51-.04.51-.04.52-.04.52-.04.52-.03.53-.03.53-.03.54-.03.54-.03.54-.03.55-.03.55-.03.56-.03.56-.03.57-.03.57-.03.57-.03.58-.03.58-.03.59-.03.59-.03.6-.03.6-.03.61-.03.62-.03.62-.03.63-.03.63-.03.64-.03.64-.03.65-.03.66-.03.66-.03.67-.03.68-.03.68-.02.69-.02.7-.02.7-.02.71-.02.72-.02.73-.02.74-.02.74-.02.75-.02.76-.02.77-.02.78-.02.79-.02.8-.02.81-.02.82-.02.83-.02.84-.02.85-.02.86-.02.87-.02.88-.02.89-.02.9-.02.92-.02.93-.02.95-.02.96-.02.97-.02.99-.02,1-.02,1.02-.02h1.04s1.05-.03,1.05-.03l1.07-.02h1.09s1.11-.03,1.11-.03h1.13s1.15-.03,1.15-.03h1.17s1.19-.03,1.19-.03h1.22s1.24-.02,1.24-.02h1.27s1.3-.02,1.3-.02h1.32s1.36-.02,1.36-.02h1.39s1.42-.02,1.42-.02h1.46s1.49-.02,1.49-.02h1.53s1.57-.02,1.57-.02h1.62s1.67-.02,1.67-.02h1.71s1.77-.02,1.77-.02h1.83s1.89-.01,1.89-.01h1.96s2.03-.01,2.03-.01h2.11s2.19-.01,2.19-.01h2.29s2.39-.01,2.39-.01h2.51s2.64,0,2.64,0h2.78s2.94,0,2.94,0h3.13s3.35,0,3.35,0h3.6s3.9,0,3.9,0h4.27s4.72,0,4.72,0h5.29s6.05,0,6.05,0h7.11s8.71,0,8.71,0h29.02s118.96,0,118.96,0h134.81s11.46,0,11.46,0h8.71s7.11,0,7.11,0h6.05s5.29,0,5.29,0h4.72s4.27,0,4.27,0h3.9s3.6,0,3.6,0h3.35s3.13,0,3.13,0h2.94s2.78,0,2.78,0h2.64s2.51,0,2.51,0h2.39s2.29.01,2.29.01h2.19s2.11.01,2.11.01h2.03s1.96.01,1.96.01h1.89s1.83.01,1.83.01h1.77s1.71.02,1.71.02h1.66s1.62.02,1.62.02h1.57s1.53.02,1.53.02h1.49s1.46.02,1.46.02h1.42s1.39.02,1.39.02h1.36s1.33.02,1.33.02h1.3s1.27.02,1.27.02h1.24s1.22.02,1.22.02h1.2s1.17.03,1.17.03h1.15s1.13.03,1.13.03h1.11s1.09.03,1.09.03l1.07.02h1.05s1.04.03,1.04.03l1.02.02,1,.02.99.02.97.02.96.02.95.02.93.02.92.02.9.02.89.02.88.02.87.02.86.02.85.02.84.02.83.02.82.02.8.02.8.02.79.02.78.02.77.02.76.02.75.02.74.02.73.02.73.02.72.02.71.02.7.02.7.02.69.02.68.02.68.03.67.03.66.03.66.03.65.03.64.03.64.03.63.03.63.03.62.03.62.03.61.03.61.03.6.03.6.03.59.03.58.03.58.03.58.03.57.03.57.03.56.03.56.03.55.03.55.03.54.03.54.03.54.03.53.03.53.03.52.03.52.04.52.04.51.04.51.04.5.04.5.04.5.04.49.04.49.04.49.04.48.04.48.04.48.04.47.04.47.04.47.04.46.04.46.04.46.04.45.04.45.04.45.04.45.04.44.04.44.04.44.04.43.04.43.04.43.04.43.04.42.04.42.05.42.04.42.05.41.05.41.05.41.05.41.05.41.05.4.05.4.05.4.05.4.05.39.05.39.05.39.05.39.05.38.05.38.05.38.05.38.05.38.05.38.05.37.05.37.05.37.05.37.05.36.05.36.05.36.05.36.05.36.06.35.05.35.06.35.06.35.06.35.06.35.06.34.06.34.06.34.06.34.06.34.06.34.06.33.06.33.06.33.06.33.06.33.06.33.06.32.06.32.06.32.06.32.06.32.06.32.06.32.06.31.06.31.06.31.07.31.07.31.07.31.07.3.07.3.07.3.07.3.07.3.07.3.07.3.07.29.07.29.07.29.07.29.07.29.07.29.07.29.07.28.07.28.07.28.07.28.07.28.07.28.07.28.07.28.07.27.07.27.07.27.07.27.08.27.08.27.08.27.08.27.08.27.08.26.08.26.08.26.08.26.08.26.08.26.08.26.08.26.08.25.08.26.08.25.08.25.08.25.08.25.08.25.08.25.08.25.08.25.08.24.09.24.09.24.09.24.09.24.09.24.09.24.09.24.09.24.09.24.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.22.09.22.09.22.09.22.09.22.1.22.1.22.1.22.09.22.1.22.1.22.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.2.1.2.1.2.1.2.1.2.1.2.11.2.1.2.11.2.11.2.11.2.11.2.11.2.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.18.11.18.12.18.11.18.12.18.12.18.12.18.12.18.12.18.12.18.12.18.12.18.12.18.12.17.12.18.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.13.17.13.17.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.14.16.13.16.14.16.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.15.15.14.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.15.14.16.13.15.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.16.13.17.13.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.17.12.18.12.18.12.18.12.18.12.18.11.18.11.18.11.18.11.18.11.18.11.18.11.19.11.18.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.19.11.2.1.2.1.2.1.2.1.2.1.2.1.2.1.2.1.2.1.2.1.2.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.1.21.09.21.1.21.09.22.09.22.09.22.09.22.09.22.09.22.09.22.09.22.09.22.09.22.09.22.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.23.09.24.09.24.08.24.08.24.08.24.08.24.08.24.08.24.08.25.08.24.08.25.08.25.08.25.08.25.08.25.08.25.08.25.08.26.08.26.08.26.08.26.08.26.08.26.07.26.07.26.07.27.07.27.07.27.07.27.07.27.07.27.07.27.07.28.07.28.07.28.07.28.07.28.07.28.07.29.07.29.07.29.07.29.07.29.07.29.07.3.07.3.06.3.06.3.06.3.06.3.06.31.06.31.06.31.06.31.06.31.06.31.06.32.06.32.06.32.06.32.06.33.06.33.06.33.06.33.06.33.06.33.06.34.05.34.05.34.05.34.05.35.05.35.05.35.05.35.05.35.05.36.05.36.05.36.05.37.05.37.05.37.05.37.05.38.05.38.05.38.05.38.05.39.05.39.05.39.05.39.05.4.04.4.05.4.04.41.04.41.04.41.04.42.04.42.04.42.04.43.04.43.04.43.04.44.04.44.04.45.04.45.04.45.04.46.04.46.04.47.04.47.04.48.04.48.04.48.04.49.04.49.03.5.03.5.03.51.03.51.03.52.03.52.03.53.03.53.03.54.03.55.03.55.03.56.03.56.03.57.03.58.03.58.03.59.03.6.03.6.03.61.03.62.03.63.03.64.03.64.03.65.02.66.02.67.02.68.02.69.02.7.02.71.02.72.02.73.02.74.02.75.02.76.02.78.02.79.02.8.02.82.02.83.02.85.02.86.02.88.02.9.02.92.02.93.02.95.02.97.02.99v1.02s.03,1.04.03,1.04v1.06s.03,1.09.03,1.09v1.12s.02,1.15.02,1.15v1.18s.02,1.21.02,1.21v1.25s.02,1.29.02,1.29v1.33s.02,1.37.02,1.37v1.42s.02,1.47.02,1.47v1.52s.02,1.58.02,1.58v1.65s.02,1.71.02,1.71v1.79s.01,1.88.01,1.88v1.98s.01,2.09.01,2.09v2.21s.01,2.35.01,2.35v2.51s0,2.7,0,2.7v2.93s0,3.2,0,3.2v3.54s0,3.97,0,3.97v4.54s0,5.33,0,5.33v6.54s0,8.6,0,8.6v13.17s0,87.77,0,87.77v.81Z" />
|
|
9
|
+
</g>
|
|
10
|
+
<g id="Wordmark">
|
|
11
|
+
<path d="M173.2,242.16h55.79c25.89,0,37.83,10.89,27.46,37.9-10.37,27.01-30.7,38.01-56.38,38.01h-19.45l-15.56,40.98h-36.56l44.7-116.89ZM208.01,287.84c5.11,0,9.58-2.67,11.54-7.78s-.5-7.67-5.39-7.67h-16l-5.93,15.45h15.78Z"/>
|
|
12
|
+
<path d="M309.1,325.4h-35.9l-6.99,10.11h-37.67l68.95-93.35h51.12l-2.72,93.35h-37.67l.88-10.11ZM311.27,298.62l1.8-22.34h-6.11l-15.35,22.34h19.67Z"/>
|
|
13
|
+
<path d="M358.89,288.84c11.65-30.34,40.23-49.79,72.46-49.79,24.34,0,45.18,10.56,34.11,44.9h-34.67c1.83-9.11-2.4-13.45-11.51-13.45s-19.61,6.78-24.04,18.34c-4.44,11.56.63,18.34,9.96,18.34s16.71-4.45,21.96-13.78h34.67c-15.38,34.56-44.15,45.23-68.71,45.23-32.23,0-45.84-19.56-34.23-49.79Z"/>
|
|
14
|
+
<path d="M487.1,242.16h87.8l-11.13,29.01h-51.23l-2.39,6.22h49.23l-8.83,23h-49.23l-2.35,6.11h51.23l-11.13,29.01h-87.8l35.83-93.35Z"/>
|
|
15
|
+
<path d="M629.11,359.05l-17.58-45.21h-18.78l-8.32,21.67h-36.56l35.83-93.35h56.46c26.45,0,37.8,10.67,27.65,37.12-4.65,12.11-13.09,20.78-22.22,26.34l19.31,53.43h-35.79ZM603.12,286.84h17.12c5.56,0,9.11-2.89,10.77-7.22s.33-7.22-5.23-7.22h-17.12l-5.55,14.45Z"/>
|
|
16
|
+
</g>
|
|
17
|
+
</svg>
|