If I were you, I would look at making a MIME renderer extension. Relevant resources: - Extensions docs ( https://jupyterlab.readthedocs.io/en/stable/developer/extension_dev.html), particularly the chapter on MIME renderers ( https://jupyterlab.readthedocs.io/en/stable/developer/extension_dev.html#mime-renderer-extensions ) - The example PDF-renderer extension ( https://github.com/jupyterlab/jupyterlab/tree/master/packages/pdf-extension) - The cookie-cutter for setting up boiler plate for such an extension (see https://github.com/jupyterlab/mimerender-cookiecutter/)
With this, you could register your extension as an editor for .mol files. On Mon, Mar 26, 2018 at 10:48 PM, Christian Schafmeister < [email protected]> wrote: > > How would I go about porting older javascript code to work with jupyter > lab? > > We are using some old javascript code that implements an editor for > sketching molecular structures. > > http://peter-ertl.com/jsme/ > > This editor can be embedded within web pages per the instructions on that > website - but it's not modularized in the style of CommonJS. > > I can embed this editor within a jupyter notebook output cell and sketch a > molecule within it and make the output available to the jupyter notebook > kernel. > > https://i.imgur.com/d2I1LeM.png > > I'd like to move to Jupyter lab - it looks fantastic! But I can't figure > out how to get this molecular sketching javascript code to work with > Jupyter lab. Does anyone have any pointers - or can you tell me that it > simply can't be done and we need javascript that is more modern? > > This is the code that I use to hack this editor into a Jupyter notebook: > > <script type="text/javascript" src="jsme/jsme.nocache.js"></script> > <script type="text/javascript"> > function jsmeOnLoad() { > //arguments: HTML id, width, height (must be string not number!) > jsmeApplet12345 = new JSApplet.JSME("appletContainer12345", "640px", > "400px", { > //optional parameters > "options" : > "number,query,hydrogens,paste,zoom,atommovebutton,border" > }); > var jme = `~A`; > jsmeApplet12345.readMolFile(jme); > } > function onSubmit() { > var drawing = jsmeApplet12345.molFile(); > // document.getElementById('jsme_smiles12345').value = drawing; > var command = '(defparameter jsme::*sketch* "' + drawing + '")'; > console.log("Executing Command: " + command); > var kernel = IPython.notebook.kernel; > kernel.execute(command); > } > </script> > <table align="left" style="border: none;"> > <tr style="border: none;"> > <td id="appletContainer12345" style="border: none;"></td> > <td style="vertical-align: bottom; border: none;"> > <button onclick="onSubmit()">done !</button> > </td> > </tr> > </table> > > > > > > Best, > > Christian Schafmeister, > Professor, > Chemistry, > Temple University > > -- > You received this message because you are subscribed to the Google Groups > "Project Jupyter" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To post to this group, send email to [email protected]. > To view this discussion on the web visit https://groups.google.com/d/ > msgid/jupyter/446d1ab8-59f1-416b-9178-3272dba38473%40googlegroups.com > <https://groups.google.com/d/msgid/jupyter/446d1ab8-59f1-416b-9178-3272dba38473%40googlegroups.com?utm_medium=email&utm_source=footer> > . > For more options, visit https://groups.google.com/d/optout. > -- You received this message because you are subscribed to the Google Groups "Project Jupyter" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/CADZ1C%3DyPSYb3n0rdfmy4FWMzySUToCa0qZwiCcWmvYoaSaZYUg%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
