Generate card layouts automatically

[glowacki-dev]

This may be an interesting issue that would require applying some simple maths knowledge. Instead of having predefined cards layouts we could have an algorithm that would generate such layouts automatically - it's basically fitting n circles (with some margin of error since pictures are actually squares 😅) into a bigger circle with a few constraints.

Inputs:

• pictures (inner circles) count (min 6, max 12)
• picture size (width of image) (most likely a constant 100px)
• card size (circle diameter) (currently 300px but may be variable)
• seed/id (if the algorithm uses any randomization it should always give the same result for the same seed, but a different results for different seeds)

Output:

• array of objects describing parameters of each picture (that's the format we use now, but can easily be adapted):

[
  { "r": <picture rotation 0-359; this one is randomized>, "s": <picture scale 0.5-1; best looking cards seem to have both small and big pictures with very little empty space left>, "x": <x coordinate on canvas>, "y": <y coordinate on canvas> },
  ...
]

x and y coordinates are on a canvas containing the card (outer circle), so x=0, y=0 would actually place the picture outside of circle (top left)