openfin/platform-api-project-seed

Platform API Project seed

Platform API Project Seed

This project seed includes the following Platform API capabilites:

• Examples of the configuration required to use the Platform API and apply customizations
• Usage of the Platform API to group, tab, and rearrange application windows
• API examples of View management and creation
• API examples of Snapshot saving and applying
• Examples of visual customization via CSS
• Examples of visual customization by providing a custom Platform Window
• Examples of behavioral customization by overriding the Platform APIs

Launch in OpenFin

Running the code

Basic Usage:

• Clone this repository
• Install the dependencies: npm install
• Start the live-server and launch the application: npm start

Advanced Usage:

For users who would like to test features with a different OpenFin Runtime, configure your workspace as follows:

• Generate a local manifest file, local.json, with the specified Runtime version, e.g. canary: npm start -- canary
• Subsequent launches will automatically use local.json; delete this file to revert to app.json

Understanding the code

Platform configuration

• Platform configuration has been included in the provided app.json file.
• The defaultWindowOptions key in the provided app.json will instruct the platform to replace our Standard Window with the provided platform-window.html file.
• The commands key in the provided app.json will allow keyboard access to the next tab command.
• The providerUrl key in the provided app.json will allow you to make custom changes to the Platform APIs, by pointing to a hosted provider.html file. (STARTING IN v15.80.50.x)

CSS Customization

• A stylesheet is linked in the platform-window.html file, and allows for visual customization. For a complete view of all properties, please refer to the example stylesheet

Platform Window

The platform-window.html file contains the layout-container element and two custom elements: left-menu and title-bar. These elements, in conjunction with the js/platform-window.js file, enable the following functionality:

left-menu

Provides examples of the following functionality:

• Adding a View to an existing Window
• Adding a View in a new Window
• Saving the Window's current Layout
• Restoring the Window's current Layout
• Creating a regular OpenFin Window
• Saving/Restoring Platform Snapshots
• Applying a preset arrangement on the current window (Grid, Tabs, Rows)

title-bar

Provides examples of the following functionality:

• Draggable area
• Close/Maximize/Minimize buttons

Provider

Our custom Provider includes an extension that will look for a pre-configured list of externalWindows (the default being the provided my_platform_notes.txt file opened in notepad.exe) and:

• Override getSnapshot to include a externalWindows section containing information on any any external window included in the configuration.
• Override applySnapshot to look for an externalWindows section and restore the position and state of any external window included in the configuration.

platform-api-project-seed's Issues

restoreExternalWindowPositionAndState throws error.

Saved the snapshot json from java adapter(doesn't matter from where), which has "externalWindows: [null]" that caused the error below.

snapshot file attached.

[2020-07-23 08:20:45.502]-[VERBOSE1:electron_api_app.cc(1604)] sent in-runtime <= 1 {"action":"ack","correlationId":"19f63b0a-cd63-4a54-93d5-ff9dfc7b75df","payload":{"success":true,"data":{"deviceScaleFactor":1,"dpi":{"x":96,"y":96},"nonPrimaryMonitors":[],"primaryMonitor":{"available":{"dipRect":{"top":0,"bottom":1040,"left":0,"right":1920},"scaledRect":{"top":0,"bottom":1040,"left":0,"right":1920}},"availableRect":{"top":0,"bottom":1040,"left":0,"right":1920},"deviceId":"\\?\DISPLAY#LGD0533#4&396877a2&0&UID265988#{e6f07b5f-ee97-4a90-b076-33f57bf4eaa7}","deviceScaleFactor":1,"displayDeviceActive":true,"dpi":{"x":96,"y":96},"monitor":{"dipRect":{"top":0,"bottom":1080,"left":0,"right":1920},"scaledRect":{"top":0,"bottom":1080,"left":0,"right":1920}},"monitorRect":{"top":0,"bottom":1080,"left":0,"right":1920},"name":"\\.\DISPLAY1"},"reason":"api-query","taskbar":{"dipRect":{"top":1040,"bottom":1080,"left":0,"right":1920},"edge":"bottom","rect":{"top":1040,"bottom":1080,"left":0,"right":1920},"scaledRect":{"top":1040,"bottom":1080,"left":0,"right":1920}},"virtualScreen":{"top":0,"bottom":1080,"left":0,"right":1920,"dipRect":{"top":0,"bottom":1080,"left":0,"right":1920},"scaledRect":{"top":0,"bottom":1080,"left":0,"right":1920}}}}}
[2020-07-23 08:20:45.502]-[INFO:CONSOLE(30549)] "Error on action apply-snapshot sent by {"uuid":"e1640246-93da-41e7-aa0a-052df57d984e","name":"e1640246-93da-41e7-aa0a-052df57d984e","runtimeUuid":"16.83.51.26/9696/"}: {"stack":"TypeError: Cannot read property 'name' of null\n at restoreExternalWindowPositionAndState (https://openfin.github.io/platform-api-project-seed/js/external-window-snapshot.js:26:59)\n at https://openfin.github.io/platform-api-project-seed/js/platform-provider.js:32:87\n at Array.map ()\n at Override.applySnapshot (https://openfin.github.io/platform-api-project-seed/js/platform-provider.js:32:64)\n at ChannelProvider.processAction (:27099:43)\n at ChannelProvider.processAction (:27466:22)\n at Channel.processChannelMessage (:27390:35)\n at Channel.onmessage (:27228:22)\n at Transport.onmessage (:34504:15)\n at EventEmitter. (:34279:26)","message":"Cannot read property 'name' of null"}", source: (30549)

snapshot2.zip

develop exits early, preventing diagnostics from sending

Project seed doesn't start.

I performed the following steps:

• forked the repo (as I'm intending to use it for a separate bug report)
• npm ci - so I keep using your original package-lock.json
• npm start

This is what I get:

balazs.edes@C02FFKLMMD6M platform-api-project-seed % npm start

> [email protected] start /Users/balazs.edes/code/platform-api-project-seed
> node server.js

Launching application from: http://localhost:5555/app.json
(node:53715) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated
(Use `node --trace-deprecation ...` to show where the warning was created)
Failed to launch
 Error: Could not resolve runtime version
    at Object.resolveRuntimeVersion (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/util.js:75:15)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async install (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/nix-launch.js:42:21)
    at async Object.launch [as default] (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/nix-launch.js:69:29)
    at async /Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/transport/port-discovery.js:151:37
    at async PortDiscovery.retrievePort (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/transport/port-discovery.js:149:25)
    at async /Users/balazs.edes/code/platform-api-project-seed/server.js:40:22
Error: Could not resolve runtime version
    at Object.resolveRuntimeVersion (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/util.js:75:15)
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async install (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/nix-launch.js:42:21)
    at async Object.launch [as default] (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/launcher/nix-launch.js:69:29)
    at async /Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/transport/port-discovery.js:151:37
    at async PortDiscovery.retrievePort (/Users/balazs.edes/code/platform-api-project-seed/node_modules/hadouken-js-adapter/src/transport/port-discovery.js:149:25)
    at async /Users/balazs.edes/code/platform-api-project-seed/server.js:40:22

Could you give me any hints what's missing?

Chart uses bootstrap grid incorrectly, causing permanent horizontal scrollbar

I realise you are only using chart.html as a URL, but I cannot find the source repo for that, so I am reporting this issue here; feel free to point me in the correct direction.

The OF Chart component renders with a permanent horizontal scrollbar, because it is misusing Bootstrap Grid layout, nesting a row within a row. Bootstrap rows have negative margins to counteract the padding on child columns, so nesting a row within a row leads to a double negative margin, thus as the SVG chart has width: 100% it will always overflow its bounds.

The solution is to use columns within rows, in this case, one full-width column for the chart, and another for the jumbotron.

Might seem like a small issue, but this chart seems to be widely used in tutorials and seed projects, and it's not a good look.