Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Problem with imageJ api using imjoy-core in React #82

Open
ppsdev-elias opened this issue Sep 4, 2023 · 3 comments
Open

Problem with imageJ api using imjoy-core in React #82

ppsdev-elias opened this issue Sep 4, 2023 · 3 comments

Comments

@ppsdev-elias
Copy link

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
Copy link
Contributor

oeway commented Sep 4, 2023

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

@ppsdev-elias
Copy link
Author

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
Copy link
Contributor

oeway commented Sep 4, 2023

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants