Import javascript used by the filepicker

Hi!

Based on what I read here: Correct way to load other js libraries from form.js - #4 by jeff.ohrstrom I was trying to import the javascript needed by the filepicker so that I don’t have to copy/past its content in the form.js of my interactive app.
I was wondering if that could be imported directly from the github release (ex. https://github.com/OSC/bc_js_filepicker/releases/download/v3.0.2/form.js ) and if anyone has an example on how to do it in the form.js.
In case I can’t get it directly from github I can download it to the public OOD path. Still, it would great to have an example because the link shared in the other discussion ( <script type="importmap"> - HTML: HyperText Markup Language | MDN ) shows how to import it using a “script” tag and how to then use a function you imported in your javascript.
My problem is that I don’t really use any function from the filepicker javascript, so I need to import it in a way the widget still works.
A side question is if there’s any plan to have the filepicker as part of OOD so that it can be directly used in the form of an interactive application without the need of any other action.

Thanks for your help

3.1 has built in support for that now. It’s the path_selector widget.

https://osc.github.io/ood-documentation/latest/how-tos/app-development/interactive/form-widgets.html?highlight=path_selector

Ok. So when updating to 3.1 we won’t need the javascript anymore.
In general I was curious how would you import things.
I saw the form.js is added in a block:

  <script>
//<![CDATA[
(function(){

CONTENT_OF_FORMJS

}());
//]]>
</script>

So I changed the form.js to close the block and add another
but I feel there should be a better way. As I said, it is not clear from the link shared in the other discussion how to use the importmap from the form.js.
Do you have an example?

I think we just patched custom_js_files to support imports, but it hasn’t been released.

That’s correct. As you ask in your first comment if there’s any plan to have the filepicker as part of OOD so that it can be directly used in the form of an interactive application without the need of any other action. The path_selector is just that - built in HTML and javascript so you don’t need that form.js anymore.

But custom_js_files are loaded in the dashboard app, right?
Would you have something for the interactive apps as well? As well as custom css for the interactive apps?
Something like you import any “*.js” and “*.css” files in the root path of the app, or you define a public/assets subfolder where you put your file.
This way there’s nothing to configure, you just ship your js and css with the app.

Interactive apps are a part of the dashboard, so they would be loaded here. You’d have to take into account that the js could run on different pages. I.e., attach handlers to specific Ids or look for a form with a specific id or similar.

I know it will work. I just think if you create an interactive app, it makes more sense the files needed by the app form (Javascripts, css, images, …) are part of the app itself. Instead here you require to have an app in a git repo you will clone but then you need to add other files into the “custom_js” and “custom_css” section of the dashboard configuration. This is not feeling completely right.

Yea I get that it’s a bit wonky, but really we’re trying to enable a lot of built-in functionality with auto_ related form fields and stuff like special widgets like path_selector which make the issue kinda moot and save you from having to write js or css.