Explain how this Fabricjs Mockup Generator work

Job ID: 37107035

Budget: $30 – $250 USD

I would like someone to investigate how this mockup generator works in this website
https://www.inkpodfulfillment.com/custom-products/kids-youth/hoodies-sweatshirts/all-over-print-sweater-sf-f5

Here are my findings so far:
The mockup generators relies on Fabricjs to generate a json payload to be sent to a server to render the payload in a images and returns urls of mockups.

Inside that json code, the code of the website generates a svg code to be a part of the payload too based on what was placed in the mockup editor.

if this was just one scene mockup it would be easy to figure out and understood, but the hard part of it is how when I place an image on a one part of the mockup and I see it on the previews in different areas (Check attached images to know what Im referring to - Look at the blue design I put there, on the from it covers an area and it also on the back mockup it covers the back area as well like real).

Im also attaching an example of Json data sent to the server generate mockups.

You can also check it by yourself via Network in your browser.

Im asking for explanation with details and technologies i will use. (No vague explanations)
Related categories: JSON API SVG Three.js