Integration with eLabFTW ELN

[NicolasCARPi]

Hello,

I am the lead dev of eLabFTW, an electronic lab notebook.

In my software, users can attach files to their experimental results. I'm thinking it would be great to:

1. Detect that the file is an NMR Spectra based on extension (that's the easy part)
2. Display a link next to that file: "Open in NMRium"
3. The link is a GET to https://www.nmrium.org/nmrium with a query parameter containing the (base64/json?) encoded file
4. The user then can display the file, and use all the tools of nmrium

What do you think about this workflow and is it something that would be feasible?

The other option would be to integrate nmrium into eLabFTW but I honestly don't want to add all the required dependencies into the software, I'd rather use an external service for that.

Best, ~Nico

[jliermann]

Hi Nicolas,

I am a member of the NMRium team but not a developer. Some methods of simply opening Files in NMRium via URL are described here: Loading files from URL.

Maybe that already helps in what you are trying?

Kind regards, Johannes Liermann

[lpatiny]

@NicolasCARPi If the documentation is not clear just tell us but it should be relatively straightforward.

[NicolasCARPi]

Thank you. The problem with that approach is that your server needs to access the content via URL, and most of the time eLab is installed on the internal network and cannot be accessed from outside. That's why having the possibility to directly insert content in the URL would solve this problem.

Example of such service: link to json crack with all data in URL

I really like that you considered privacy and added the URL in the hash/anchor part of the URL. :+1:

There are also issues with CORS policy.

If you can already fetch JSON, I believe it would be trivial to directly interpret JSON, maybe with a rawjson parameter, or detect if the value starts with http to determine if it needs to be fetched. What do you think?

[hamed-musallam]

@NicolasCARPi

As a temporary solution, you can use this project https://github.com/NFDI4Chem/nmrium-react-wrapper which works as a wrapper for the NMRium, you can use the iframe to embed the NMrium (https://nmrium.nmrxiv.org/), and contact with the NMrium by custom event

 yourIframe.contentWindow.postMessage({ type: 'nmr-wrapper:load', {
   data: [File1,File2, ..... File n],
   type: "file"
 }}, '*');

Hope this solves your problem.

[targos]

That's why having the possibility to directly insert content in the URL would solve this problem.

I'm not sure that's really feasible. For example, Chrome limits the length of the URL to 2MB and Safari to 80'000 characters.

[lpatiny]

Thank you. The problem with that approach is that your server needs to access the content via URL, and most of the time eLab is installed on the internal network and cannot be accessed from outside. That's why having the possibility to directly insert content in the URL would solve this problem.

It is not the server that needs to access the data but the client. All the data are processed in NMRium on the client.

[NicolasCARPi]

@hamed-musallam , thanks I'll look into that. My app uses Docker, so maybe having an nmrium docker side process could be a solution here. But that's not my preference.

I'm not sure that's really feasible. For example, Chrome limits the length of the URL to 2MB and Safari to 80'000 characters.

I do not support Safari, and 2 Mb is already quite a lot, no? How big are typical files? Also, it would be easy to propose the link for smaller files and not big ones, or display a message that the user needs to upload it manually.

It is not the server that needs to access the data but the client

I see. So one issue is with CORS. Your examples from the doc work because the response headers contain access-control-allow-origin: *. Which is not something I'd want to add to my responses.

Another issue is that even if this CORS setting is added, the request is blocked by the login page because cookies are not sent (SameSite attribute is set to Lax). And again, that's not something I can change without impacting security.

So I still think having the possibility to directly encode the file in the URL would be a good help. I currently don't see other approaches that would work.

[hamed-musallam]

@NicolasCARPi

As far as I know, I'm afraid to say that the 2 MB is not enough, for example, if we have a single spectrum (1H) and export it as JSON, The size of the JSON is more than 2.3 MB which is not constant and it changes based on the experiment.

[lpatiny]

A jcamp-dx for 1D is ok and we could check how to implement this on www.nmrium.org

[lpatiny]

It is now possible to have the link in the URL. The documentation is available here:

https://docs.nmrium.org/for-developers/using-nmrium#loading-an-inline-jcamp-dx

And here is an example: https://www.nmrium.org/nmrium#?rawJcamp=%23%23TITLE%3Dnmrdb.org%20predicted%20spectrum%0A%23%23JCAMP-DX%3D4.24%0A%23%23DATA%20TYPE%3DNMR%20spectrum%0A%23%23ORIGIN%3D%0A%23%23OWNER%3D%0A%23%23XUNITS%3DPPM%0A%23%23YUNITS%3DIntensity%0A%23%23.OBSERVE%20NUCLEUS%3D1H%0A%23%23.OBSERVE%20FREQUENCY%3D400%0A%23%23.SOLVENT%20NAME%3DCDCl3%0A%23%23NPOINTS%3D4096%0A%23%23FIRSTX%3D0%0A%23%23LASTX%3D10%0A%23%23FIRSTY%3D0%0A%23%23LASTY%3D0%0A%23%23DELTAX%3D0.002442002442002442%0A%23%23XFACTOR%3D0.0002442002442002442%0A%23%23YFACTOR%3D0.04656612875245797%0A%23%23XYDATA%3D(X%2B%2B(Y..Y))%0A0%40%25U35J09J4043j063N20351L24890417J102150285j380896898m6637165L76865l12787N726828J427526472P14126190%0A3480B147483647k127793739j9603060L21883l62463J8196794J251617896o37026629o30606648k220537J5730k2205%0A3590F69o69%25T41J532Q239774K61645794k12043877n7764889p8333jN0786Q3414764Q88897618p29005510k41406037%0A6130A951621j801989j13946M29184K17984147J103898599j024407249k96961351r10129L9422R30143J69219093%0A6240A70257545P65696425q23313836j12521546j18587jL5635L7729380K13319243k40149273j0932065k920%25V47K88%0A10830B88K026J28854L3295055R527266m2675447k77904K4211K3188k2496L4651338K46473251k68584579j2560706%0A10960D345N8397O6550j18832P045523L48738343k54416733j01214051j22857Q7473j11527K98378J03362707Q2761305%0A11090A86439021j84604682j828406M3370m1977m912N659112O1556977o3198320m018777L70j644j32%25S780Q94J0642%0A29030A1536J1691j0095j3000O343N018J7079J7124J7324M9973n9893M7201r8618Q98J43201l172P9920n2933j49172%0A29210B0425j6377L47610n4511k58199l2196j268K6635N228009M586255Q8257103J50429487J57790376j98468521%0A29340B07854828j64430383m3324465M644151P4168737J14744447K82952059o6822782j41816674k64401468l566560%0A29440A890j890O259P41142J5118196N336918M5502934m3599962J1711k2913524L20934J4393000Q2316873J9568738%0A29570A16803219j4139860L1368368p8562915n4892422R2588L9439555J06999486M2494535r6772434J0489657%0A29670A03319777r2566153P8782599k1378266L0735126Q6202833j03489830q0513862q17477J769284J29689999%0A29770A31734030K20184784j31948372M1675090k26658762l0001609m506848J8136675J75219514K8598128r9217667%0A29870A23214963L6744824j31992074k7884882K52787K2140457K9738173j0710521j2357549J5667425m4191870o21689%0A29980D4RN9742K81141l08769J128p893k3937R885J65894Q2847k45268j4726J012K3240o660O4123o0058k1725k9%25S078%0A40950%40%0A%23%23END%3D%0A%0A

[NicolasCARPi]

@lpatiny This is great and I have added a button to load into NMRium when the uploaded file is .jdx:

Seems to work fine on the test file I have. :tada:

Are there other extensions/file formats that could be loaded this way?

[lpatiny]

Great ! For the extensions the other file format are binaries or a zip file containing many files so you should check what you have for NMR spectra in your database.