HeinrichApfelmus / threepenny-gui

GUI framework that uses the web browser as a display.
https://heinrichapfelmus.github.io/threepenny-gui/
Other
437 stars 77 forks source link

Access electron utilities using JavaScript FFI #200

Closed bradrn closed 6 years ago

bradrn commented 6 years ago

Following on from #111 and #169, I have discovered that by adding a custom index.html which loads jQuery, the nodeIntegration parameter in electron.js can be set to true, allowing the electron utilities to be accessed from the JavaScript FFI. For instance:

button <- UI.button # set UI.text "Click me!"
on UI.click button $ const $ runFunction $ ffi "require('electron').dialog.showOpenDialog({})"

I have been working on a library which supplies Haskell function for creating menus, dialog boxes etc. Hopefully I will be able to upload it to Hackage some time in the future.

(Side note: commit a6853b3 isn't related to the rest of the pull request, but I'm including it because I couldn't figure out how to separate it into its own PR.)

HeinrichApfelmus commented 6 years ago

That looks interesting!

Ideally, we wouldn't need a custom index.html for this use case, though. The haskell.js script includes jQuery (version 3.2.1 at the moment). Can't we just add the module stuff?

I definitely want to avoid querying google for jQuery on a local app. (As said, jQuery is bundled with Threepenny, and I'm happy to make it available under different URIs.)

I don't understand: Why do we need to load jQuery in order to activate node integration?

(Re sidenote: A pull request adds all commits in a branch. Make a new branch and cherry pick commits that you want to be pulled.)

bradrn commented 6 years ago

That looks interesting!

Ideally, we wouldn't need a custom index.html for this use case, though. The haskell.js script includes jQuery (version 3.2.1 at the moment). Can't we just add the module stuff?

Unfortunately, for some reason electron can't just use jQuery; it has to be loaded in a different way (see https://stackoverflow.com/a/37480521 and https://github.com/electron/electron/issues/254#issuecomment-183483641 for more details).

I definitely want to avoid querying google for jQuery on a local app. (As said, jQuery is bundled with Threepenny, and I'm happy to make it available under different URIs.)

You're right; it should be possible to figure out how to use the jQuery bundled with threepenny.

bradrn commented 6 years ago

I've figured out how to remove the reference to the Google CDN. It turned out that if I moved the reference to Haskell.js to where the Google CDN was, then jQuery would still work.

HeinrichApfelmus commented 6 years ago

It turned out that if I moved the reference to Haskell.js to where the Google CDN was, then jQuery would still work.

Great! I think then there is no need for a custom "index.html" anymore, we can integrate this into the default "index.html", right?

bradrn commented 6 years ago

Great! I think then there is no need for a custom "index.html" anymore, we can integrate this into the default "index.html", right?

Yes: according to this Stack Overflow question, the extra bits surrounding the call to Haskell.js won't have any effect outside Electron.

bradrn commented 6 years ago

I have tested the custom index.html with the CRUD example and it didn't break anything, so I've moved it.

HeinrichApfelmus commented 6 years ago

Thanks a lot for your contribution! The pull request is a bit of a mess, though, I have squashed everything into a single commit (3d0f808bcbac9806bdd0ebe69d0ba26c0aea733c) and commited it to the master branch. I hope this works for you!