@@ -283,18 +283,27 @@ animation logic. It consists of:
283
283
- : <dfn>state function</dfn>
284
284
:: A <a>Function</a> <a>callback function</a> type.
285
285
286
- - : <dfn>stateful flag</dfn>
286
+ - : <dfn for="animator definition" >stateful flag</dfn>
287
287
:: A boolean flag
288
288
289
289
290
- A <dfn>stateful animator definition</dfn> is an <a>animator definition</a> whose <a>stateful
291
- flag</a> is <b> true</b> .
290
+ A <dfn>stateful animator definition</dfn> is an <a>animator definition</a> whose
291
+ <a for="animator definition">stateful flag</a> is <b> true</b> .
292
292
293
293
294
+ A <dfn>document animator definition</dfn> is a <a>struct</a> which describes the information needed
295
+ by the <a>document</a> about the author defined custom animation. It consists of:
296
+
297
+ - : <dfn for="document animator definition">stateful flag</dfn>
298
+ :: A boolean flag
299
+
294
300
Registering an Animator Definition {#registering-animator-definition}
295
301
---------------------------------------------------------------------
296
- An {{AnimationWorkletGlobalScope}} has a <dfn>animator name to animator definition map</dfn> .
297
- The map gets populated when {{registerAnimator(name, animatorCtor)}} is called.
302
+ The <a>document</a> has a <a>map</a> of <dfn>document animator definitions</dfn> . The map gets
303
+ populated when {{registerAnimator(name, animatorCtor)}} is called.
304
+
305
+ An {{AnimationWorkletGlobalScope}} has a <a>map</a> of <dfn>animator definitions</dfn> . The map gets
306
+ populated when {{registerAnimator(name, animatorCtor)}} is called.
298
307
299
308
Note that to register a <a>stateful animator definition</a> it is simply enough for the registered
300
309
class to have a <code> state</code> function.
@@ -308,29 +317,30 @@ following steps:
308
317
1. If |name| is not a valid <<ident>> , <a>throw</a> a <a>TypeError</a> and abort all these
309
318
steps.
310
319
311
- 2. If |name| exists as a key in the <a>animator name to animator definition map</a> ,
312
- <a>throw</a> a <a>NotSupportedError</a> and abort all these steps.
313
-
314
- 3. If the result of <a>IsConstructor</a> (|animatorCtor|) is <b> false</b> , <a>throw</a> a
315
- <a>TypeError</a> and abort all these steps.
320
+ 2. Let |animatorDefinitions| be the {{AnimationWorkletGlobalScope}} 's
321
+ <a>animator definitions</a> <a>map</a> .
316
322
323
+ 3. If |animatorDefinitions|[|name|] <a for=map>exists</a> , <a>throw</a> a <a>NotSupportedError</a>
324
+ and abort all these steps.
317
325
318
- 4. Let |prototype| be the result of <a>Get</a> (|animatorCtor|, "prototype").
326
+ 4. If the result of <a>IsConstructor</a> (|animatorCtor|) is <b> false</b> , <a>throw</a> a
327
+ <a>TypeError</a> and abort all these steps.
319
328
329
+ 5. Let |prototype| be the result of <a>Get</a> (|animatorCtor|, "prototype").
320
330
321
- 5 . Let |animateFuncValue| be the result of <a>Get</a> (|prototype|, "animate").
331
+ 6 . Let |animateFuncValue| be the result of <a>Get</a> (|prototype|, "animate").
322
332
323
- 6 . Let |animateFunc| be the result of <a>converting</a> |animateFuncValue| to the <a>Function</a>
333
+ 7 . Let |animateFunc| be the result of <a>converting</a> |animateFuncValue| to the <a>Function</a>
324
334
<a>callback function</a> type. If an exception is thrown, rethrow the exception and abort
325
335
all these steps.
326
336
327
- 7 . Let |stateFuncValue| be the result of <a>Get</a> (|prototype|, "state").
337
+ 8 . Let |stateFuncValue| be the result of <a>Get</a> (|prototype|, "state").
328
338
329
- 8 . Let |stateFunc| be the result of <a>converting</a> |stateFuncValue| to the <a>Function</a>
339
+ 9 . Let |stateFunc| be the result of <a>converting</a> |stateFuncValue| to the <a>Function</a>
330
340
<a>callback function</a> type, If an exception is thrown, set |stateful| to be <b> false</b> ,
331
341
otherwise set |stateful| to be <b> true</b> and |stateFunc| to be undefined.
332
342
333
- 9 . Let |definition| be a new <a>animator definition</a> with:
343
+ 10 . Let |definition| be a new <a>animator definition</a> with:
334
344
335
345
- <a>animator name</a> being |name|
336
346
@@ -340,11 +350,39 @@ following steps:
340
350
341
351
- <a>state function</a> being |stateFunc|
342
352
343
- - <a>stateful flag</a> being |stateful|
353
+ - <a for="animator definition">stateful flag</a> being |stateful|
354
+
355
+
356
+ 9. <a for=map>set</a> the |animatorDefinitions|[|name|] to |definition|.
357
+
358
+ 10. <a>Queue a task</a> to run the following steps:
359
+
360
+ 1. Let |documentAnimatorDefinitions| be the associated <a>document's</a>
361
+ <a>document animator definitions</a> <a>map</a> .
362
+
363
+ 2. Let |documentDefinition| be a new <a>document animator definition</a> with:
344
364
365
+ - <a for="animator definition">stateful flag</a> being |stateful|
366
+
367
+ 3. If |documentAnimatorDefinitions|[|name|] <a for=map>exists</a> , run the following steps:
368
+
369
+ 1. Let |existingDocumentDefinition| be the result of <a for=map>get</a>
370
+ |documentAnimatorDefinitions|[|name|] .
371
+
372
+ 2. If |existingDocumentDefinition| is <code> "invalid"</code> , abort all these steps.
373
+
374
+ 3. If |existingDocumentDefinition| and |documentDefinition| are not equivalent, (that is
375
+ their <a for="document animator definition">stateful flag</a> s are
376
+ different), then:
377
+
378
+ <a for=map>set</a> |documentAnimatorDefinitions|[|name|] to <code> "invalid"</code> .
379
+
380
+ Log an error to the debugging console stating that the same class was registered
381
+ with different <code> stateful flag</code> .
382
+
383
+ 4. Otherwise, <a for=map>set</a> |documentAnimatorDefinitions|[|name|] to
384
+ |documentDefinition|.
345
385
346
- 9. Add the key-value pair (|name| - |definition|) to the <a>animator name to animator
347
- definition map</a> .
348
386
</div>
349
387
350
388
@@ -457,7 +495,7 @@ To <dfn>create a new animator instance</dfn> given a |name|, |timeline|, |effect
457
495
the following steps:
458
496
459
497
1. Let the |definition| be the result of looking up |name| on the |workletGlobalScope|'s
460
- <a>animator name to animator definition map </a> .
498
+ <a>animator definitions </a> .
461
499
462
500
If |definition| does not exist abort the following steps.
463
501
@@ -510,7 +548,7 @@ When the user agent wants to <dfn>run animators</dfn> in a given |workletGlobalS
510
548
1. Let |animatorName| be |animator|'s <a>animator name</a>
511
549
512
550
2. Let the |definition| be the result of looking up |animatorName| on the
513
- |workletGlobalScope|'s <a>animator name to animator definition map </a> .
551
+ |workletGlobalScope|'s <a>animator definitions </a> .
514
552
515
553
If |definition| does not exist then abort the following steps.
516
554
@@ -576,11 +614,11 @@ given |animator|, |sourceWorkletGlobalScope|, |destinationWorkletGlobalScope|, t
576
614
1. Let |animatorName| be |animator|'s <a>animator name</a>
577
615
578
616
2. Let |definition| be the result of looking up |animatorName| on |sourceWorkletGlobalScope|'s
579
- <a>animator name to animator definition map </a> .
617
+ <a>animator definitions </a> .
580
618
581
619
If |definition| does not exist then abort the following steps.
582
620
583
- 3. Let |stateful| be the <a>stateful flag</a> of |definition|.
621
+ 3. Let |stateful| be the <a for="animator definition" >stateful flag</a> of |definition|.
584
622
585
623
4. If |stateful| is <b> false</b> then abort the following steps.
586
624
@@ -691,29 +729,38 @@ Creating a Worklet Animation {#creating-worklet-animation}
691
729
692
730
Creates a new {{WorkletAnimation}} object using the following procedure:
693
731
694
- 1. Let |workletAnimation| be a new {{WorkletAnimation}} object.
732
+ 1. Let |documentAnimatorDefinitions| be the associated <a>document's</a> <a>document animator
733
+ definitions</a> <a>map</a> .
734
+
735
+ 2. If |documentAnimatorDefinitions|[|animatorName|] does not <a for=map>exists</a> , <a>throw</a> an
736
+ <a>TypeError</a> and abort the following steps.
737
+
738
+ 3. If |documentAnimatorDefinitions|[|animatorName|] is <code> "invalid"</code> , <a>throw</a> an
739
+ <a>TypeError</a> and abort the following steps.
695
740
696
- 2. Run the procedure to <a>set the timeline of an animation</a> on |workletAnimation| passing
741
+ 4. Let |workletAnimation| be a new {{WorkletAnimation}} object.
742
+
743
+ 5. Run the procedure to <a>set the timeline of an animation</a> on |workletAnimation| passing
697
744
|timeline| as the new timeline or, if a |timeline| argument is not provided,
698
745
passing the <a>default document timeline</a> of the {{Document}} associated with the
699
746
{{Window}} that is the <a>current global object</a> .
700
747
701
- 3 . Let |effect| be the result corresponding to the first matching condition from below.
748
+ 6 . Let |effect| be the result corresponding to the first matching condition from below.
702
749
: If |effects| is a {{AnimationEffect}} object,
703
750
:: Let effect be |effects|.
704
751
: If |effects| is a <a>list</a> of {{AnimationEffect}} </a> objects,
705
752
:: Let |effect| be a new {{WorkletGroupEffect}} with its children set to |effects|.
706
753
: Otherwise,
707
754
:: Let |effect| be undefined.
708
755
709
- 4 . Let |serializedOptions| be the result of <a>StructuredSerialize</a> (|options|).
756
+ 7 . Let |serializedOptions| be the result of <a>StructuredSerialize</a> (|options|).
710
757
Rethrow any exceptions.
711
758
712
- 5 . Set the <a>serialized options</a> of |workletAnimation| to |serializedOptions|.
759
+ 8 . Set the <a>serialized options</a> of |workletAnimation| to |serializedOptions|.
713
760
714
- 6 . Set the <a>animation animator name</a> of |workletAnimation| to |animatorName|.
761
+ 9 . Set the <a>animation animator name</a> of |workletAnimation| to |animatorName|.
715
762
716
- 7 . Run the procedure to <a>set the target effect of an animation</a> on |workletAnimation|
763
+ 10 . Run the procedure to <a>set the target effect of an animation</a> on |workletAnimation|
717
764
passing |effect| as the new effect. Note that this may trigger action to
718
765
<a>set animator instance of worklet animation</a> . See [[#web-animation-overrides]] for more
719
766
details.
@@ -821,6 +868,7 @@ To <dfn>sync animation timings to worklet</dfn> for a given |workletAnimation| t
821
868
* [=playback direction=] , and
822
869
* [=timing function=] .
823
870
871
+
824
872
</div>
825
873
826
874
0 commit comments