API Reference

JavaScript Appmixer SDK API reference. Unless otherwise stated, all methods return a promise that resolves on success and rejects on error with error object containing further details.

Appmixer

Method

Description

Appmixer({ baseUrl })

A constructor function to create an instance of the Appmixer SDK. Pass the base URL of the engine (Appmixer API).

appmixer.set(key, value)

Set a property on the appmixer SDK object. Currently only accessToken should be set to be able to make calls to the Appmixer API.

appmixer.api

Method

Description

appmixer.api.authenticateUser(username, password)

Authenticate a user to Appmixer. Note that this can be a "virtual" user that exists for the sole purpose of associating a real user of your own product to a user in Appmixer. Each user in Appmixer can have a set of flows, can run and stop flows and can see data going through their flows. The returned promise is either resolved with an object that contains token (which you need to set with appmixer.set('accessToken', token) to be able to make calls to the API backend. Or the promise is rejected with an error object. If the error object returns 403 status code (i.e. err.response.status === 403), the user does not exist in Appmixer.

appmixer.api.signupUser(username, password)

Create a new user in Appmixer. The returned promise is either resolved with an authentication object (containing the token property) or rejected if the sign-up fails.

appmixer.api.createFlow(name, [descriptor])

Create a new flow in Appmixer. The returned promise resolves to the ID of the newly created flow.

appmixer.api.deleteFlow(flowId)

Delete an existing flow identified by flowId.

appmixer.api.getFlow(flowId)

Get flow. The returned promise resolves to an object with the following information: { id, flow, name, stage, btime, mtime, thumbnail }, where flow is the Flow Descriptor, stage is either 'running' or 'stopped', btime is the time the flow was created ("birth" time), mtime is the time the flow was modified and thumbnail contains a thumbnail image (self-contained, in the Data URI format).

appmixer.api.getFlows(query)

Get all flows of the user or filter them by query. query is an object with the following properties: limit, offset, pattern (a string to filter flows containing pattern in their names), sort, projection (allows you to exclude properties from the returned flow objects). Example: { limit: 20, offset: 0, pattern: "slack", projection: "-flow,-thumbnail", sort: "mtime:-1" }

appmixer.api.getFlowsCount(query)

Get the number of all flows of the user or filter them by query. query is an object with pattern property that can include a string to filter flows containing a pattern in their names. Example: { "pattern": "dropbox" }.

appmixer.api.updateFlow(flowId, update)

Update an existing flow. update can contain the following information: { flow, name }, where flow is the Flow Descriptor of the flow.

appmixer.api.startFlow(flowId)

Start a flow.

appmixer.api.stopFlow(flowId)

Stop a flow.

appmixer.api.cloneFlow(flowId)

Create a copy of an existing flow. The returned promise resolves to the ID of the newly created flow.

appmixer.api.getUser()

Get current user. The returned promise resolves to an object with username.

appmixer.api.getStores()

Get all the data stores. The returned promise resolves to an array of stores each an object with name and storeId properties.

appmixer.api.getStore(storeId)

Get one store. The returned promise resolves to an object with name and storeId properties.

appmixer.api.getStoreRecordsCount(query)

Get the number of records in a store. query is an object with storeId and pattern properties where pattern is a string to filter records that contain the string in their keys or values.

appmixer.api.getStoreRecords(query)

Get store records. query is an object with storeId, pattern (string to search for in keys/values), limit , offset and sort properties. Example: { limit: 30, offset: 0, pattern: “foo”, sort: “updatedAt:-1", storeId: “5c6d643f4849f447eba55c1d” }

appmixer.api.createStore(name)

Create a new store. The returned promise resolves to the ID of the newly created store.

appmixer.api.deleteStore(storeId)

Delete a store.

appmixer.api.renameStore(storeId, newName)

Rename an existing store.

appmixer.api.createStoreItem(storeId, key, value)

Create a new record in a store.

appmixer.api.deleteStoreItems(items)

Delete store items. items is an array of objects each having a key and storeId properties identifying the item and store from which the item should be removed.

appmixer.api.getAccountsInfo()

Get a list of connected accounts of the user. The returned promise resolves to an array of objects of the form { accountId, name, displayName, service, icon, profileInfo }.

appmixer.api.getAccountFlows(accountId)

Get a list of flows this account is used in. The returned promise resolves to a an array of objects with flowId and name properties.

appmixer.api.setAccountName(accountId, newName)

Rename a connected account. Note that this name is displayed in the Accounts widget and also in the Inspector UI of the Designer.

appmixer.api.getLogs(query)

Get logs. query is an object of the form { from, size, sort, query }. Example: { from: 0, size: 30, sort: "@timestamp:desc", query: "@timestamp:[2018-01-01 TO 2018-01-01]" }. To get logs of a specific flow, use e.g. { from: 0, size: 30, sort: "@timestamp:desc", query: "@timestamp:[2018-01-01 TO 2018-01-01] AND +flowId:FLOW_ID" }

appmixer.api.getLog(logId, index)

Get one log. logId and index are values returned from getLogs().

appmixer.ui.FlowManager

The appmixer.ui.FlowManager is a UI widget that displays a list of flows the user created.

Method

Description

appmixer.ui.FlowManager(config)

A function that accepts a config object and returns an instance of flow manager. The config object must contain at least the el property that points to a container DOM element where the flow manager will be rendered. el can either be a CSS selector or a reference to a DOM element.

open()

Render the flow manager inside its container.

close()

Close the flow manager.

on(event, handler)

React on events of the flow manager. See below for the list of events the flow manager supports.

off([event, handler])

Remove event listeners. If no arguments are provided, remove all event listeners. If only the event is provided, remove all listeners for that event. If both event and handler are given, remove the listener for that specific handler only.

state(name, value)

Change the state of the UI. Currently, only "loader" and "error" states are supported. For example, in order to show a loader in the flow manager UI, just call state("loader", true). If you want to display an error in the flow manager UI, call state("error", "Something went wrong.").

reload()

Re-render the flow manager. Call this when you changed the state of a flow (e.g. renamed a flow, started a flow, ...) to make sure the flow manager reflects the new changes.

Flow Manager Events

Event

Callback

Triggered when...

flow:open

function(flowId)

the user clicks on a flow to open it.

flow:create

function()

the user clicks the "Create Flow" button.

flow:start

function(flowId)

the user clicks the button to start the flow.

flow:stop

function(flowId)

the user clicks the button to stop the flow.

flow:insights

function(flowId)

the user clicks the button to open Insights for the flow.

flow:clone

function(flowId)

the user clicks the button to clone the flow.

flow:remove

function(flowId)

the user clicks the button to delete the flow.

appmixer.ui.Designer

The appmixer.ui.Designer is a UI widget that displays the drag&drop Flow Designer.

Method

Description

appmixer.ui.Designer(config)

Constructor function that accepts config object. The config object must contain at least the el property that points to a container DOM element where the Designer will be rendered. el can either be a CSS selector or a reference to a DOM element. Note that the recommended width of your container is at least 1200px for best Designer UI/UX. config.options.menu can optionally define the flow menu inside Designer. For example: { options: { menu: [ { label: 'Rename', event: 'flow:rename' }, { label: 'Insights', event: 'flow:insights' }, { label: 'Clone', event: 'flow:clone' }, { label: 'Export to SVG', event: 'flow:export-svg' }, { label: 'Export to PNG', event: 'flow:export-png' }, { label: 'Print', event: 'flow:print' } ] } defines a menu with 6 items. Note that each item can also optionally contain icon property (which we omitted from the example above to save space. The icon property is a URL of an image. It's important to note that the designer supports built-in events: "flow:rename", "flow:export-svg", "flow:export-png" and "flow:print". These events cannot be re-defined. These events trigger built-in UX for renaming, exporting to SVG and PNG and printing flows. If you don't want to use this built-in behaviour, just redefine your menu with your own custom events.

set(property, value)

Set a property of the designer. Currently only "flowId" is supported. Use it to set the flow the designer should open for (set("flowId", "123abc456")). You can also call this to change the currently opened flow in the designer dynamically.

get(property)

Return a property value.

open()

Render the Designer inside its container.

close()

Close the designer.

on(event, handler)

React on events of the designer. See below for the list of events the designer supports.

off([event, handler])

Remove event listeners. If no arguments are provided, remove all event listeners. If only the event is provided, remove all listeners for that event. If both event and handler are given, remove the listener for that specific handler only.

state(name, value)

Change the state of the UI. Currently, only "loader" and "error" states are supported. For example, in order to show a loader in the flow manager UI, just call state("loader", true). If you want to display an error in the flow manager UI, call state("error", "Something went wrong.").

Designer Events

Event

Callback

Triggered when...

flow:insights

function(flowId)

the user clicks the insights menu item.

flow:clone

function(flowId)

the user clicks the clone menu item.

appmixer.ui.Insights

The appmixer.ui.Insights is a UI widget that displays logs and histogram of all messages that passed through the user's flows. It can display logs of one flow or combine logs of all the user's flows.

Method

Description

appmixer.ui.Insights(config)

Constructor function that accepts config object. The config object must contain at least the el property that points to a container DOM element where the Insights will be rendered.

set(property, value)

Set a property value. Currently only "flowId" is supported. Use it to set the flow for which you want to display logs. If you don't set the "flowId", logs of all the flows of the user will be displayed.

get(property)

Get a property value.

open()

Render the Insights inside its container.

close()

Close the Insights.

state(name, value)

Change the state of the UI. Currently, only "loader" and "error" states are supported. For example, in order to show a loader in the flow manager UI, just call state("loader", true). If you want to display an error in the flow manager UI, call state("error", "Something went wrong.").

appmixer.ui.Accounts

The appmixer.ui.Accounts is a UI widget that displays the user's connected accounts.

Method

Description

appmixer.ui.Accounts(config)

Constructor function that accepts config object. The config object must contain at least the el property that points to a container DOM element where the Accounts will be rendered.

open()

Render the Accounts inside its container.

close()

Close the Accounts.

on(event, handler)

React on events of the accounts widget. See below for the list of events the accounts widget supports.

off([event, handler])

Remove event listeners. If no arguments are provided, remove all event listeners. If only the event is provided, remove all listeners for that event. If both event and handler are given, remove the listener for that specific handler only.

Accounts Events

Event

Callback

Triggered when...

flow:open

function(flowId)

the user clicks to open a flow the account is associated with.

appmixer.ui.Storage

The appmixer.ui.Storage is a UI widget that displays the user's data stores.

Method

Description

appmixer.ui.Storage(config)

Constructor function that accepts config object. The config object must contain at least the el property that points to a container DOM element where the Storage widget will be rendered.

open()

Render the Storage inside its container.

close()

Close the Storage widget.

state(name, value)

Change the state of the UI. Currently, only "loader" and "error" states are supported. For example, in order to show a loader in the flow manager UI, just call state("loader", true). If you want to display an error in the flow manager UI, call state("error", "Something went wrong.").