1) Product Attributes Changed Event : “skuchanged”
Whenever any of the Product attributes is changed inside an Artifi iframe, an event is triggered from Artifi carrying couple of values. Event must be listened at clientend ((Topmost Parent (window.top) element of Artifi iframe) and further processing of Price section should be done.
Data will be as follows:
Event.data will carry below sample data with it :
{"data":{"sku":"ABC","attributes":[{"attr_1":"val_abc"},{"attr_2":"val_pqr"} ]},"action":"skuchanged"}
Over here, sku key carries selected attributes sku through which price section needs to be updated. attributes is the array of attributes and its selected values. And “action”:”skuchanged” signifies that one of the attributes has been changed inside an Artifi Iframe.
Sample code snippet:
// Implement the event “receiveArtifiMessage” function receiveArtifiMessage(event) { var origin = event.origin || event.originalEvent.origin; if (Artifi && !Artifi.isValidArtifiDomain(origin)) return; /* This code is used for validating domain*/ // “event” will be the response from Artifi. // This event will contain the type of action performed and the details of // customized product. var eventObj = event.data; //eventObj will contain the object structure as mentioned below: //{"data":{"sku":"ABC","attributes":[{"attr_1":"val_abc"},{"attr_2":"val_pqr"}]},"action ":"skuchanged"} var action = eventObj.action; // action represent the type of action performed for posting the iframe. switch (action) { case “skuchanged”: { // perform your functionality for SKU Changed action } Other case statement goes here..... } }
The above snippet will be written at clientend. Meaning, whenever any of the Attributes is changed inside an Artifi iframe then an event will be triggered. The respective event must be listened. In order to get latest SKU , action must be matched against the string 'skuchanged', if it results out to be true then data should extracted.
2) Custom Attributes Changed Event : “customattributeschanged”
Whenever any of the Custom attributes is changed inside an Artifi iframe, an event is triggered from Artifi carrying all current selected custom atribute values. Event must be listened at clientend ((Topmost Parent (window.top) element of Artifi iframe) and further processing of Price section should be done.
Data will be as follows:
Event.data will carry below sample data with it :
"{"data":{"customAttributes":[{"Attribute_1":"abc"},{"Attribute_2":"xyz"}]},"actio n":"customattributeschanged"}"
Over here, customAttributes key carries array of selected custom attributes attributes through which price section may or may not be updated. And
“action”:”customattributeschanged” signifies that one of the custom attributes has been changed inside an Artifi Iframe.
Sample code snippet:
// Implement the event “receiveArtifiMessage” function receiveArtifiMessage(event) { var origin = event.origin || event.originalEvent.origin; if (Artifi && !Artifi.isValidArtifiDomain(origin)) return; /* This code is used for validating domain*/ // “event” will be the response from Artifi. // This event will contain the type of action performed and the details of // customized product. var eventObj = event.data; //eventObj will contain the object structure as specified below: //"{"data":{"customAttributes":[{"Attribute_1":"abc"},{"Attribute_2":"xyz"}]},"action":" customattributeschanged"}" var action = eventObj.action; // action represent the type of action performed for posting the iframe. switch (action) { case “customattributeschanged”: { // perform your functionality for Custom Attributes Changed action } Other case statement goes here..... } }
The above snippet will be written at clientend. Meaning, whenever any of the Custom Attributes is changed inside an Artifi iframe then an event will be triggered. The respective event must be listened. In order to get latest selected Custom Attributes, action must be matched against the string 'customattributeschanged', if it results out to be true then data should extracted.
3) Artifi Initialized Event : “artifiinitialized”
Whenever any of the Product launched inside an Artifi iframe, an event is triggered from Artifi carrying couple of values. Event must be listened at clientend ((Topmost Parent (window.top) element of Artifi iframe).
Data will be as follows:
Event.data will carry below sample data with it :
"{"action":"artifiinitialized","data":""}"
Sample code snippet:
// Implement the event “receiveArtifiMessage” function receiveArtifiMessage(event) { var origin = event.origin || event.originalEvent.origin; if (Artifi && !Artifi.isValidArtifiDomain(origin)) return; // “event” will be the response from Artifi. // This event will contain the type of action performed and the details of // customized product. var eventObj = event.data; //eventObj will contain the object structure as mentioned below: //{"action":"artifi‐initialized","data":""} var action = eventObj.action; // action represent the type of action performed for posting the iframe. switch (action) { Case “artifiinitialized”: { // perform your functionality for Custom Attributes Changed action } Other case statement goes here..... } }
4) Artifi Error Event : “error” Whenever Artifi is not initialized inside an artifi iframe, an event is triggered from Artifi carrying message which contain reason why Artifi is not initialized. Event must be listened at clientend((Topmost Parent (window.top) element of Artifi iframe).
Data will be as follows:
Event.data will carry below sample data with it :
"{"action":"error","message":"Invalid website Id."}"
Sample code snippet:
// Implement the event “receiveArtifiMessage” function receiveArtifiMessage(event) { var origin = event.origin || event.originalEvent.origin; if (Artifi && !Artifi.isValidArtifiDomain(origin)) return; // “event” will be the response from Artifi. // This event will contain the type of action performed and the details of // customized product. var eventObj = event.data; //eventObj will contain the object structure as mentioned below: //{"action":"error","message":"Invalid website Id."} Artifi Integration Steps var action = eventObj.action; // action represent the type of action performed for posting the iframe. switch (action) { case “error”: { // perform your functionality for “error” action } Other case statement goes here..... } }