Hi, everybody @OSC
I’m a new comer on OOD and i’m looking for a file browser object available in the form.yml to avoid mistakes in workdir or filename writing. How can i do ? Thanks a lot
Jean-marie
Welcome! To clarify, do you mean a file browser that searches for files in the user’s home directory, project space, scratch space or other remote files and directories mounted on the web node serving OnDemand, rather than a normal file upload form field for choosing a local file on the user’s computer?
Yes, it’s exactly what i want to do : access to the hpc file systems.
We will look into a possible solution for this. We will post here next week on an update.
Hi, everybody
Have you some ideas on this topic ? is there some solution with Javascript ?
thanks
jean-marie
@jms27000 my colleague was working on a solution but he is out of the country right now and I’m not sure of the status of his work on this. It might be next week till we have a solution. I’ll let you know if I find an interim solution that might work for you.
@jms27000 greetings from Bretagne, as @efranz mentioned I have been working on solution: https://github.com/OSC/bc_js_filepicker.
Download the latest release of form.js and place it in the root directory of your Batch Connect application. For example /var/www/ood/apps/sys/bc_jupyter/form.js .
Edit your Batch Connect form.yml so that the input you want to add a file picker to has a data attribute named data-filepicker with a value of true :
# form.yml
input_file:
label: 'Input File'
data-filepicker: true
readonly: true # optionally only allow editing through the file picker
Hi, and thanks a lot to work on this topic
i just have tried your solution in a simple forml.yml example. i can see the new button “Select File” and when i ckick on it, a “download” message is turning and nothing appends…
Then, i have done a second test with a form.yml.erb, which is our target of usage, and i seems than the form.js file doesn’t load. no “Select File” button etc.
is this code can select a directory ? with which option ?
again, thanks a lot.
jean-marie
I am curious if there is an error message in the Console, or if the AJAX request which populates the files list is encountering problems. To diagnose this would you please post screenshots of this app with Firefox’s developer tools open to the Console? To get the best diagnostic information please:
- Navigate to the page
- Open the Console tab
- Ensure that the Console tab is set to show:
- Errors, Warnings, Logs, Info, Debug
- XHR
- Reload / refresh the page
- Expand the XHR GET request by clicking on the triangle on the left side of the page
- Take the screen shot
For reference I am looking for something like this:
As for form.yml.erb I am not certain that we support both ERB and using custom JavaScript.
@jms27000 I see that you got a 401 Unauthorized response from Apache. I have looked into how I am performing the request to list the contents of the directory, and have learned that older versions of Firefox (version < 61) have different defaults for the API I am using. I have uploaded a pre-release for you to test that corrects that oversight: https://github.com/OSC/bc_js_filepicker/releases/tag/v0.0.2.
This should correct the error you are seeing where the directory’s contents never finish loading. As for file selection: once the list on the right is populated the user would then left click on a file or directory to select a target and then click the Select button. That will close the modal dialog and set the value of the input to the selected file path. Double clicking on a directory navigates into that directory.
Hi, everybody
i have tested the new version of form.js with firefox 68. not working yet…
thanks
jean-marie
Jean-marie,
Apologies I accidentally uploaded a testing copy that was intended to help me duplicate the error. I just updated the pre-release with the intended version.
- Morgan
Hi, Morgan,
I have tested successfully the filepicker with a CentOS 7.6 / firefox 60.7. good job.
two questions more :
- is it possible to initialize the root tree of the filepicker with the “value” field.
- what’s the usage of the left part “Favorites” ? is it possible to add any “favorites”
and one again :
- we plan to used form with erb codes. it seems the the form.js is not loaded in that case. how to proceed to have a file browser working ?
again, thanks for your time;
jean-marie
I works too with Windows 10 / Edge v17 !
1 Like
That’s a good idea. I’ll add it, currently it defaults to the first entry in your “Favorites”. One thing to be aware is that Batch Connect applications save their context so they will remember the last submitted value, and I do not have an easy way to always return to an original directory.
The Favorites list is taken directly from the Dashboard’s File’s dropdown. That can be set by following the steps detailed here: Customization — Open OnDemand 1.6.7 documentation.
I have confirmed that form.yml.erb does work with form.js. If you are willing to post your form.yml.erb we can help troubleshoot it.
Morgan,
it works with erb form files ! you’re the best ! if you can implement the initialization of the tree in the filepicker, coming from the form.yml.erb, it would be great !
see you
jean-marie
Jean-marie,
I finalized a release for the file picker: https://github.com/OSC/bc_js_filepicker/releases/tag/v0.1.0.
By setting a value attribute for your inputs you can set a default value. I made a number of other improvements while I was working on this including adding filtering which should come in handy for large directories. Please let me know if you find any bugs.
- Morgan
Nice. I had just the time to test it before leaving for my vacations. to my point of view, there’s missing 2 or 3 things :
- an argument to indicate a file or a directory target to integrate in the form parameters
- according to this option, the button text will change to “File Select” or “Dir Select”
- in the select view, add the current dir where we are (as an option too ?)
I will test more when i’ll be back at the beginning of September.
thanks again for the job.
jean-marie
Hi, Morgan & everybody@osc,
i have tested the file-picker. it works fine ! 
i have found one situation which makes problem : when the value is not set in the form.yml.erb, the filepicker shows the / tree by default. i suggest to show the homedir by default
some addings if possible :
- add an argument to indicate a file or a directory target to integrate in the form parameters
- according to this option, the button text will change to “File Select” or “Dir Select”
this adding will avoid to test the existence of the file choosen and its type (file or the directory) in the submit.yum.erb file
question : do you plan to integrate this file-picker function in the next OOD release ?
Jean-Marie