Problem with imageJ api using imjoy-core in React

[ppsdev-elias]

Im trying to make a simple image operation with imageJ, but ImageJ.JS argument isnt working when connecting to imjoy api.

import * as imjoyCore from 'imjoy-core'

export const consoleImjoyCore = async () => {
  const imjoy = new imjoyCore.ImJoy({
    imjoy_api: {}
  })

  console.log('imjoy', imjoy)

  imjoy.start({ workspace: 'default' }).then(async () => {
    const ij = await imjoy.api.getPlugin("ImageJ.JS")
    console.log(ij);
  })
}

This code gives me error Uncaught (in promise) Plugin not found: ImageJ.JS and logs null. It works if I call Jupyter-Engine-Manager plugin instead.

I've tried many different ways of using this api, including passing {src:"https://ij.imjoy.io/"} as argument, changing getPlugin to createWindow and getWindow. None of them worked. Also tried using just javascript and html by using this imjoy script: <script src="https://lib.imjoy.io/imjoy-loader.js"></script> and calling loadImJoyCore, which it also didnt work.

When I tried replicating the code in Chrome DevTools, in ij.imjoy.io, using imjoy instance in window, it worked as expected, even by using the same method as the function above (...getPlugin("ImageJ.JS"...)

I should also say im running the application in my localhost, not in production.

[oeway]

Hi, you should do 'const ij = await api.createWindow({src: "https://ij.imjoy.io"})' as documented in the docs.

[ppsdev-elias]

Hi, you should do 'const ij = await api.createWindow({src: "https://ij.imjoy.io"})' as documented in the docs.

Im getting api property from imjoy instance, api variable doesnt exist. And I've also used imjoy.api to get Jupyter-Engine-Manager plugin, which worked.

[oeway]

Hi, you should do 'const ij = await api.createWindow({src: "https://ij.imjoy.io"})' as documented in the docs.

Im getting api property from imjoy instance, api variable doesnt exist. And I've also used imjoy.api to get Jupyter-Engine-Manager plugin, which worked.

You should get imjoy.api.createWindow object, it might not work as expected if you don’t actually create a div for the window, see here: https://github.com/imjoy-team/imjoy-core/blob/master/docs/integration.md#display-window-plugins

Alternatively, if you can also use the ImJoyBasicApp: https://github.com/imjoy-team/imjoy-core/blob/master/docs/integration.md#load-imjoy-basic-app

A complete example here: https://github.com/imjoy-team/imjoy-core/blob/e586a9fb8bd8195acd9a61d0b5928259f076ea17/src/simple-app-example.html

Once you have the imjoy setup ready, you can do api.createWindow to load imagej.js, it won’t work with getPlugin since that’s only for headless plugins, for window plugins you need to use api.createWindow.

Also see here: https://imjoy.io/docs/#/api?id=apicreatewindow