MolPress with built in sketcher

molpress_edit2A little bit of tinkering with the WordPress plugin mechanisms for the TinyMCE editor has been fruitful: the web-based sketcher from WebMolKit and SketchEl2 is now integrated into the MolPress plugin.

The core feature of MolPress is to provide a way to render inline chemical data objects, which are referenced by HTML-like “shortcodes”. These are the interpreted by the plugin at rendering time to show the molecule/reaction/collection content in a way that is meaningful to chemists. Originally, the only way to embed the data was to type in these shortcodes manually, and generate the data with some other application, but now there is another way, for individual molecules: using the sketcher.

The quasi-visual editor now has an extra button, which is the iconic benzene ring:

molpress_edit1

Clicking on this brings up the sketcher, which is from the WebMolKit library (open source on GitHub), and runs in pure JavaScript:

molpress_edit2

Once the sketching is done (and this includes the option of pasting or dragging content from elsewhere), hitting the Save button inserts the necessary content into the current article:

molpress_edit3

This isn’t expecially pretty, even in so-called Visual mode, although the next item on the to-do list is to figure out how to render it in WYSIWYG form. Nonetheless, when switching to Preview mode, it displays the content how a chemist would expect to see it:

molpress_edit4

If any of this technology is interesting to your projects, you can integrate it in: the sketcher can be invoked with a few lines of code, and there are examples of how to do this within both WebMolKit and MolPress. You will of course have to abide by the terms of the license, which is GPL 3.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s