Skip to main content

Support Browser windows with Platform API windows

In Here™ Core UI Components v15 or later, you can configure Window objects created with the Platform API to run together with Browser Window objects in a single Here Core UI platform.

How it works

You can add the workspacePlatform.windowType property to your existing Platform Window definition, with the value set to platform. You can also define a Platform Window entirely with the methods and properties of the Workspace Platform API. See the API reference for BrowserWindowFactory.createWindow.

The workspacePlatform object is a property of the BrowserCreateWindowRequest interface. You can also set windowType to browser (the default value).

See the API reference for browserInitConfig. Note that the defaultWindowOptions property of this interface takes a BrowserCreateWindowRequest object as its value.

You must first initialize your Here Core UI platform with Browser.

How to do it

For more information about platform windows, see Platform API.

  1. Initialize your Here Core UI platform with Browser explicitly enabled:

    import * as WorkspacePlatform from '@openfin/workspace-platform';

    // initialize Workspace Platform with Browser
    await WorkspacePlatform.init(
    {
    // enable browser without any initial configuration
    // in production you'd more typically pass config details here
    browser: { }
    });
  2. Create a Platform window and specify the workspacePlatform.windowType property.

    To work with windows you create with the Platform API:

    // define your Platform
    const examplePlatform = fin.Platform.getCurrentSync();

    // Create the Platform Window with two Views
    examplePlatform.createWindow(
    {
    layout:
    {
    content: [
    {
    type: 'stack',
    content: [
    {
    type: 'component',
    componentName: 'view',
    componentState:
    {
    name: 'test_view_1',
    url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
    }
    },
    {
    type: 'component',
    componentName: 'view',
    componentState:
    {
    name: 'test_view_2',
    url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
    }
    }
    ]
    }
    ]
    }
    // allow the Platform Window to work with Browser Window objects
    workspacePlatform:
    {
    windowType: "platform"
    }
    });

    Or you can create Platform windows entirely with the Workspace Platform API:

    import * as WorkspacePlatform from '@openfin/workspace-platform';

    const examplePlatform = WorkspacePlatform.getCurrentSync();

    // Create the Platform Window with two Views
    examplePlatform.createWindow(
    {
    layout:
    {
    content: [
    {
    type: 'stack',
    content: [
    {
    type: 'component',
    componentName: 'view',
    componentState:
    {
    name: 'test_view_1',
    url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
    }
    },
    {
    type: 'component',
    componentName: 'view',
    componentState:
    {
    name: 'test_view_2',
    url: 'https://cdn.openfin.co/docs/javascript/canary/Platform.html'
    }
    }
    ]
    }
    ]
    }
    // allow the Platform Window to work with Browser Window objects
    workspacePlatform:
    {
    windowType: "platform"
    }
    });

If you set workspacePlatform.windowType to browser in your Platform window definition, you create a Browser window that ignores the url property and treats each layout as a Page object.

Table of Contents