KitMaker API Docs

Handling Events

The Style Upload iFrame communicates with your parent window through postMessage events. Listen for these events to handle the result of the style creation process.

Handling Responses #

Listen for message events from the iFrame to handle success or error states.

window.addEventListener("message", event => {
  if (event.data.type === "STYLE_CREATED") {
    // Success - style was created
    console.log("Style created with ID:", event.data.styleId);
    console.log("Style data:", event.data.style);
  } else if (event.data.type === "STYLE_CREATE_ERROR") {
    // Error - style creation failed
    console.error("Style creation failed:", event.data.error);
  }
});

Response Events #

Event TypeDescription
STYLE_CREATEDFired when the style is successfully created.
STYLE_CREATE_ERRORFired if an error occurs during the creation process.

STYLE_CREATED Event Data #

PropertyTypeDescription
typestring`STYLE_CREATED`
styleIdintegerThe ID of the newly created style.
styleobjectThe complete style object with all details.

Style Object Structure:

{
  "styleId": 12345,
  "name": "Dri-FIT Polo",
  "model": "123456-78",
  "manufacturerId": 987,
  "brandName": "Nike",
  "views": [
    { "viewId": 501, "view": "Front" },
    { "viewId": 502, "view": "Back" },
    { "viewId": 503, "view": "Left" },
    { "viewId": 504, "view": "Right" }
  ]
}

STYLE_CREATE_ERROR Event Data #

PropertyTypeDescription
typestring`STYLE_CREATE_ERROR`
errorstringA description of the error that occurred.

Common Errors #

ErrorDescription
Brand name is requiredThe user did not enter a brand name.
Model name is requiredThe user did not enter a model name.
Category is requiredNo category was selected.
Front image is requiredThe user did not upload a front view image.
Valid PPCM value is requiredThe calibration step was not completed.