serenity icon indicating copy to clipboard operation
serenity copied to clipboard

LibWeb: Process JS keyframe objects

Open mattco98 opened this issue 2 years ago • 0 comments

Keyframes can be given in two separate forms:

  • As an array of separate keyframe objects, where the keys of each keyframe represent CSS properties, and their values represents the values that those CSS properties should take, e.x.: [{ color: 'red', offset: 0.3 }, { color: 'blue', offset: 0.7 }]
  • As a single monolithic keyframe object, where the keys of each keyframe represent CSS properties, and their values are arrays of values, where each index k represents the value of the given property at the k'th frame, e.x.: { color: ['red', 'blue'], offset: [0.3, 0.7] }

This PR adds processing of both forms, and implements get/set_keyframes based on that processing.

Also, I believe I filled out the animatable property of Properties.json correctly, but I figured it wasn't worth spending a ton of time to verify. Any mistakes can easily be fixed later.

Work towards #21570.

mattco98 avatar Feb 06 '24 00:02 mattco98