Communicator

The Infigo Iframe Communicator facilitates communication between the iframe containing the editor and the parent page. This allows for seamless interaction and event handling between the editor and the hosting application.

CatfishEditorCommunication Object

The CatfishEditorCommunication object serves as a wrapper between the Infigo Iframe and your application, handling communication and data parsing between these two systems; it essentially acts as a bridge. In the Iframe demo app, you can see the Communicator.Attach, which demonstrates how to pass data and utilize the XD and Communicator library.

The CatfishEditorCommunication object provides methods and constants for communicating with the editor iframe. Ensure you pass the correct Infigo Origin URL to the RegisterForCatfishEditorEvent method to listen for messages from the editor.

MessageConstants

The MessageConstants property contains predefined constants for different types of messages that can be sent or received between the iframe and the parent page. These constants include:

InfigoItemAddedToBasket: Indicates that an item has been added to the basket by Infigo.
InfigoItemAddedToSavedProjects: Indicates that an item has been added to saved projects by Infigo.
EditorLoaded: Indicates that the editor has been loaded.
ExternalDataUpdate: Indicates that external data has been updated.
Cancel: Indicates a cancellation event.
Unknown: Indicates an unknown or unsupported message.
ExternalDataUpdate: Event that can be used to pass information from the Merchant into the ME scripting.

RegisterForCatfishEditorEvent(callback, source_origin)

This method registers a callback function to handle editor events. It listens for messages sent from the editor iframe and triggers the appropriate callback based on the received message.

callback: The function to be called when an editor event occurs.
source_origin: The origin of the messages to listen for.

PostMessage(messageId, data, target_url, target)

This method sends a message to the editor iframe.

messageId: The identifier for the message.
data: The data to be sent with the message.
target_url: The URL of the target iframe.
target: The target window of the message.

Usage

To utilize the Infigo Iframe Communicator, follow these steps:

Include the provided JavaScript file in your project.
Use the RegisterForCatfishEditorEvent method to register callback functions for handling editor events.
Use the PostMessage method to send messages to the editor iframe when necessary.

Example

// Register callback for editor events
CatfishEditorCommunication.RegisterForCatfishEditorEvent(function (eventType, eventData) {
    // Handle editor event
    console.log("Received event:", eventType, "Data:", eventData);
}, "https://example.com");

// Register iframe for keyboard interaction
CatfishEditorCommunication.RegisterForKeyboardInteraction("editorIframe", "https://editor.example.com");

Last modified: 29 October 2024