Oden Webview SDK

When a website runs through Oden’s webview it will get access to a message pipeline which can send message to Oden as well as receiving from Oden.

Creating the Oden client

The SDK will expose a javascript class OdenLayoutClient which will open a websocket connection to Oden; therefore, only one instance of it can exist. The code below shows how to initialize the OdenLayoutClient as a singleton.

Example code on how to initialize the Oden client as a singleton
export function getOrCreateOdenLayoutClient() {
    if (typeof window === 'undefined') return null;
    if (!(window as any).odenLayoutClient) {

        (window as any).odenLayoutClient = new OdenLayoutClient();
    }
    return (window as any).odenLayoutClient as InstanceType<any>;
}

Functions

The Oden layout client is used to communicate with Oden, the client is created through getOrCreateOdenLayoutClient(). The client has the following functions which interact with Oden:

  • registerVideo(name, element) - Register a DOM element to a video name, it will automatically send positions updates when the DOM changes.

  • unregisterVideo(name) - Every registerVideo(name, element) must be paired with an unregisterVideo(name), it remove the reference to the DOM element.

  • registerUserMessageCallback(name, callback) - Register which callback that should be associated with a certain user message and will be called once per message.

  • unregisterUserMessageCallback(name, callback) - Remove the callback from being executed on incoming messages from the specified message name.

  • sendPositionUpdate() - Send position update for each registered video, is called internally when you register a video but can be called manually.

  • registerCallback(callback) - This register a callback that is ran for every video position update coming from Oden. This contain all videos that can be layout, the message is sent when a change has been detected or once every second. The argument in the callback takes a json blob with the following format:

{
    "VideoName1": { width: number, height: number },
    "VideoName2": { width: number, height: number },
}
  • unregisterCallback(callback) - Removes the callback from being executed.

  • sendNamedUserMessage(name, data) - Sends a messages to Oden, data should be a json blob.

Incoming Message Ids

  • fleet_online_vehicles - List of all online vehicles and their status, is only sent after a fleet_list_vehicles was sent. Data has the following structure:

{[
    {
        "id": string,
        "name": string,
        "availability": string // Can be Controlled, Monitored, Available
    }
]}
  • ocp_vehicle_user_data - Message containing control pipeline information such as controller input and information about each connected vehicle. See Control Pipeline chapter for data structure.

Outgoing Message Ids

  • ocp_client_user_data - User data that should be passed along the control pipeline to the vehicle. Data sent is defined by users.

  • fleet_list_vehicles - Request a list of all vehicles online, the list will arrive through the fleet_online_vehicles message. No data is sent.

  • video_position_update - Send a manual position update where the video should be rendered. Data sent is of json format

{
    name: string,
    position: {
        x: number,
        y: number
    },
    size: {
        width: number,
        height: number
    }
}