Add pucker/bloat modifier

docs/specs/shapes.md

@@ -657,3 +657,26 @@ separately, $start$ and $end$ being applied to each shape.
 * When `m` has a value of `2` (Sequential), all the shapes MUST be considered
 as following each other in render order.  $start$ and $end$ refer to the whole
 length created by concatenating each shape.
+
+
+<h3 id="pucker-bloat">Pucker / Bloat</h3>
+
+{schema_string:shapes/pucker-bloat/description}
+
+{schema_object:shapes/pucker-bloat}
+
+When `a` is `0`, nothing changes.<br/>
+When `a` is positive, the vertices are pulled towards the center, with `100` being at the center. And the tangents are pushed away.<br/>
+When `a` is negative the vertices are pushed away from the center with `100` being twice far away from the center. And the tangents are pulled towards the center.<br/>
+
+The center is defined as the mean of the bezier vertices.
+
+<lottie-playground example="pucker_bloat.json">
+    <form>
+        <input title="Amount" type="range" min="-100" value="50" max="100"/>
+    </form>
+    <json>lottie.layers[0].shapes[0].it[1]</json>
+    <script>
+        lottie.layers[0].shapes[0].it[1].a.k = data["Amount"];
+    </script>
+</lottie-playground>

docs/static/examples/pucker_bloat.json

@@ -0,0 +1,179 @@
+{
+"v": "5.5.7",
+"ip": 0,
+"op": 180,
+"nm": "Animation",
+"mn": "{8f1618e3-6f83-4531-8f65-07dd4b68ee2e}",
+"fr": 60,
+"w": 512,
+"h": 512,
+"assets": [
+],
+"layers": [
+    {
+        "ddd": 0,
+        "ty": 4,
+        "ind": 0,
+        "st": 0,
+        "ip": 0,
+        "op": 180,
+        "nm": "Layer",
+        "mn": "{85f37d8b-1792-4a4f-82d2-1b3b6d829c07}",
+        "ks": {
+            "a": {
+                "a": 0,
+                "k": [
+                    256,
+                    256
+                ]
+            },
+            "p": {
+                "a": 0,
+                "k": [
+                    256,
+                    256
+                ]
+            },
+            "s": {
+                "a": 0,
+                "k": [
+                    100,
+                    100
+                ]
+            },
+            "r": {
+                "a": 0,
+                "k": 0
+            },
+            "o": {
+                "a": 0,
+                "k": 100
+            }
+        },
+        "shapes": [
+            {
+                "ty": "gr",
+                "nm": "PolyStar",
+                "mn": "{9199543e-3552-4e51-a802-623f2a4a2ca1}",
+                "it": [
+                    {
+                        "ty": "sr",
+                        "nm": "PolyStar",
+                        "mn": "{57cff206-c227-4a14-a679-195157be886b}",
+                        "p": {
+                            "a": 0,
+                            "k": [
+                                256,
+                                256
+                            ]
+                        },
+                        "or": {
+                            "a": 0,
+                            "k": 160
+                        },
+                        "r": {
+                            "a": 0,
+                            "k": 0
+                        },
+                        "pt": {
+                            "a": 0,
+                            "k": 5
+                        },
+                        "sy": 2,
+                        "os": {
+                            "a": 0,
+                            "k": 0
+                        }
+                    },
+                    {
+                        "ty": "pb",
+                        "nm": "Pucker / Bloat",
+                        "a": {
+                            "a": 0,
+                            "k": 50
+                        }
+                    },
+                    {
+                        "ty": "st",
+                        "nm": "Stroke",
+                        "mn": "{0930ce27-c8f9-4371-b0cf-111a859abfaf}",
+                        "o": {
+                            "a": 0,
+                            "k": 100
+                        },
+                        "c": {
+                            "a": 0,
+                            "k": [
+                                1,
+                                0.9803921568627451,
+                                0.2823529411764706
+                            ]
+                        },
+                        "lc": 2,
+                        "lj": 2,
+                        "ml": 0,
+                        "w": {
+                            "a": 0,
+                            "k": 30
+                        }
+                    },
+                    {
+                        "ty": "fl",
+                        "hd": true,
+                        "nm": "Fill",
+                        "mn": "{a1bcc159-6916-4718-841d-a99140c0e74b}",
+                        "o": {
+                            "a": 0,
+                            "k": 100
+                        },
+                        "c": {
+                            "a": 0,
+                            "k": [
+                                1,
+                                0.9803921568627451,
+                                0.2823529411764706
+                            ]
+                        },
+                        "r": 1
+                    },
+                    {
+                        "ty": "tr",
+                        "a": {
+                            "a": 0,
+                            "k": [
+                                249.3134328358209,
+                                254.47164179104476
+                            ]
+                        },
+                        "p": {
+                            "a": 0,
+                            "k": [
+                                249.3134328358209,
+                                254.47164179104476
+                            ]
+                        },
+                        "s": {
+                            "a": 0,
+                            "k": [
+                                100,
+                                100
+                            ]
+                        },
+                        "r": {
+                            "a": 0,
+                            "k": 0
+                        },
+                        "o": {
+                            "a": 0,
+                            "k": 100
+                        }
+                    }
+                ]
+            }
+        ]
+    }
+],
+"meta": {
+    "g": "Glaxnimate 0.4.6-26-g7b05e75c"
+}
+}

schema/shapes/all-graphic-elements.json

@@ -13,6 +13,7 @@
         {"$ref": "#/$defs/shapes/stroke"},
         {"$ref": "#/$defs/shapes/transform"},
         {"$ref": "#/$defs/shapes/trim-path"},
+        {"$ref": "#/$defs/shapes/pucker-bloat"},
         {"$ref": "#/$defs/shapes/unknown-shape"}
     ]
 }

schema/shapes/pucker-bloat.json

@@ -0,0 +1,30 @@
+{
+    "$schema": "https://json-schema.org/draft/2020-12/schema",
+    "type": "object",
+    "title": "Pucker Bloat",
+    "description": "Interpolates bezier vertices towards the center of the shape, and tangent handles away from it (or vice-versa)",
+    "allOf": [
+        {
+            "$ref": "#/$defs/shapes/modifier"
+        },
+        {
+            "type": "object",
+            "properties": {
+                "ty": {
+                    "title": "Shape Type",
+                    "type": "string",
+                    "const": "pb"
+                },
+                "a": {
+                    "title": "Amount",
+                    "description": "Amount as a percentage",
+                    "$ref": "#/$defs/properties/scalar-property"
+                }
+            },
+            "required": [
+                "ty"
+            ]
+        }
+    ]
+}
+