Automation API

Connector is a class that allows editing text documents, spreadsheets, presentations, and fillable forms from an external source. The examples of using Automation API can be found here.

To create the connector, use the createConnector method of the document editor object:

const connector = docEditor.createConnector()

Please note that the connector is available only for ONLYOFFICE Developer Edition.

This class is an additional feature which is available at extra cost. If you have any questions, please contact our sales team at sales@onlyoffice.com.

The connector has the same interface as plugins. Below you can find methods that are available for this class.

• addContextMenuItem - add an item to the context menu.
• addToolbarMenuItem - add an item to the toolbar menu.
• attachEvent - add an event listener.
• callCommand - send the data back to the editor.
• connect - connect the connector to the editor.
• createWindow - create the connector modal window to display the additional information inside the editor.
• detachEvent - remove an event listener.
• disconnect - disconnect the connector from the editor.
• executeMethod - execute certain editor methods using the connector.
• updateContextMenuItem - update an item in the context menu with the specified items.

addContextMenuItem

The function called to add an item to the context menu. The process of working with the context menu is the same as for plugins except for the onClick method, which is used instead of subscribing by ID.

Parameters:

ContextMenuItem

Example:

connector.attachEvent("onContextMenuShow", (options) => {
  connector.addContextMenuItem([{
    text: "mainItem",
    onClick: () => {
      console.log("[CONTEXTMENUCLICK] menuSubItem1")
    },
  }])
})

addToolbarMenuItem

The function called to add an item to the toolbar menu. The process of working with the toolbar menu is the same as for plugins except for the onClick method, which is used instead of subscribing by ID.

Parameters:

ToolbarMenuMainItem

ToolbarMenuTab

ToolbarMenuItem

ToolbarMenuItemType

The toolbar menu item type. The button and big-button values are the same and can be equally used to specify the toolbar button.

Type: "button" | "big-button"

Example:

connector.addToolbarMenuItem({
  tabs: [
    {
      text: "Connector",
      items: [
        {
          id: "toolConnector1",
          type: "button",
          text: "Meaning",
          hint: "Meaning",
          lockInViewMode: true,
          icons: "./icon.svg",
          items: [
            {
              id: "toolC1",
              text: "Text",
              data: "Hello",
              onClick: (data) => {
                console.log(`[TOOLBARMENUCLICK]: ${data}`)
              },
            },
          ],
        },
      ],
    },
  ],
})

attachEvent

The function called to add an event listener, a function that will be called whenever the specified event is delivered to the target. The list of all the available events is the same as for the plugins.

Parameters:

Example:

connector.attachEvent("onChangeContentControl", (obj) => {
  console.log(`[EVENT] onChangeContentControl: ${JSON.stringify(obj)}`)
})

callCommand

The function called to send the data back to the editor. It allows the connector to send structured data that can be inserted into the resulting document file (formatted paragraphs, tables, text parts, and separate words, etc.).

ONLYOFFICE Document Builder commands can be only used to create content and insert it into the document editor (using the Api.GetDocument().InsertContent(...)). This limitation exists due to the co-editing feature in the online editors.

Parameters:

This method is executed in its context isolated from other JavaScript data. If some parameters or other data need to be passed to this method, use Asc.scope object.

Example:

connector.callCommand(() => {
  const oDocument = Api.GetDocument()
  const oParagraph = Api.CreateParagraph()
  oParagraph.AddText("Hello")
  oDocument.InsertContent([oParagraph])
}, () => {
  console.log("[COMMAND] Callback command")
})

connect

The function called to connect the connector to the editor.

Please note that this method should only be called if you have disconnected the connector with the disconnect method and need to connect it to the editor again. When creating a connector, you do not need to use the connect method, as it is called automatically along with the createConnector method.

Example:

connector.connect()

createWindow

The function called to create the connector modal window to display the additional information inside the editor.

Example:

const testConnectorWindow = connector.createWindow()

detachEvent

The function called to remove an event listener.

Parameters:

Example:

connector.detachEvent("onChangeContentControl")

disconnect

The function called to disconnect the connector from the editor.

Example:

connector.disconnect()

executeMethod

The function called to execute certain editor methods using the connector. The full list of these methods is the same as for the plugins.

Parameters:

Example:

connector.executeMethod("GetCurrentWord", [], (word) => {
  console.log(`[METHOD] GetCurrentWord: ${word}`)
})

updateContextMenuItem

The function called to update an item in the context menu with the specified items.

Parameters:

ContextMenuItem

Example:

const items = [
  {
    id: "onConvert",
    text: "Convert to Markdown or HTML",
  },
]

connector.updateContextMenuItem(items)

Connector window

Connector window is a class that represents the connector window. To create it, use the createWindow method of the connector object.

Below you can find methods that are available for this class.

attachEvent

The function called to add an event listener to the modal window frame. This function will be called whenever the specified event is delivered to the target. The list of all the available events is the same as for the plugins.

Parameters:

Example:

testConnectorWindow.attachEvent("onWindowMessage", (message) => {
  console.log(`panel message: ${message}`)
})

dispatchEvent

The function called to send an event to the modal window frame. The list of all the available events is the same as for the plugins.

Parameters:

Example:

testConnectorWindow.dispatchEvent("messageName", {
  prop: "value",
})

show

The function called to show a modal window inside the editor.

Parameters:

Example:

testConnectorWindow.show({
  url: "./window/panel.html",
  description: "Panel example!",
  type: "panel",
  buttons: [],
  icons: "./icon.svg",
})

In the connector window code, you can also use the following methods:

attachEvent

The function called to subscribe to the messages from the plugin.

Parameters:

Returns: This method doesn't return any data.

Example:

window.Asc.plugin.attachEvent("messageName", (message) => {
  console.log(message)
})

sendToPlugin

The function called to send a message to the editor from the modal window.

Parameters:

Example:

window.Asc.plugin.sendToPlugin("onWindowMessage", {type: "onWindowReady"})