Text boxes in Marvin JS

Hi everyone,

I would like to be able to use Text Boxes inside MarvinJS (like in Marvin Desktop). Thus my questions are:

1- How can I have the text box function in Marvin JS (with the corresponding toolbar button)?

2- Can I paste structures and text boxes from the desktop Marvin inside MarvinJS?

3- Can I export the text boxes data with the structure data in mol or rxn format?

Thanks in advance,

Lionel

Hi Lionel,

Textbox function is not implemented in Marvin JS yet. If you have a file containing text we will not import the text part, just the structure. May I ask what would be your requirements? Would you need simple one line text editing, or would like to use formating options such as superscript, subscript, bolt, italics etc. as well?

Best regards,

Efi

Hi Efi,

Thanks for your reply.

I mainly need text boxes for reaction sketches where we want to add "Step 1" / "Step 2" etc.. over each arrow, for yield and for other comments.

Thus strictly onli editing text could be ok

BUT my idea is to be able to copy reaction scheme from Marvin desktop into the MarvinJS editor and store the scheme into a DB. After that the scheme should be able to be edited and to be paste into a word document or an other Marvin desktop. Thus in this pipeline the formating available in marvinJS should be equal to those available in Marvin desktop.

Same idea is applicable to simple molecules (not reaction).

Regards,

Lionel

Hi Efi,

Just an UP on this post to know if you have an idea on when such Text Label will be supported in MarvinJS.

Thanks in advance, Lionel

Unfortunately we still not have a planned date for this feature.

Best regards,

Efi

Lionel, I have worked around this problem by using the pseudoatom feature. On the bottom of the eastern toolbar, bring up the menu for A, and press the ? button. Enter your text in the box, then put the pseudoatom on the canvas.

There are a couple of disadvantages. One, the number is subscripted. Two, space characters are omitted. (But that's a bug, which they will presumably fix.) Three, you have an additional atom in your MRV, which may or may not screw up any searches you may do on the molecule. However, you can solve the last problem by sending the MRV to a Java method that finds the pseudoatom and converts it to a textbox.

Yes I was thinking of this solution.

But as you said there is some troubles, especially the use of the structures in searches. And I can already use in the structure pseudo atoms (as to represent PS/polystyren). Thus it could lead to confusion with pseudo atoms used instead of text boxes.

However I am curious on how you will search pseudo atoms and convert them in text boxes.

We use JChem methods to get the alias of each pseudoatom that has no bonds to other atoms. 

for (int molNum = numStageMols - 1; molNum >= 0; molNum--) {

    final Molecule stageMol = stageMols.get(molNum);

    if (stageMol.getAtomCount() == 1) {

        final MolAtom atom = stageMol.getAtom(0);

        if (atom.isPseudo()) {

            stageMols.remove(molNum);

            String aliasStr = atom.getAliasstr();

            ...

        } // if is pseudoatom

    } // if the molecule has one atom

} // for each molecule in the stage

In our case, the alias is always a number, and we don't convert it to a textbox, but it should be easy enough to do that.

If you have bondless pseudoatoms for other purposes, so you need to differentiate pseudoatoms being used as textboxes, you can start the pseudoatom alias with a particular character, like ~. 

You are going to need JChem if you want to compensate for MarvinJS's deficiencies before ChemAxon gets around to fixing them.

Yes clearly, Thanks!

Actually, I take it back. You *could* do operations directly on the MRV. But I wouldn't recommend it.

We understand that this functionality is greatly needed, we try to develop Marvin JS fast, but it needs time to fulfil all the requests.

Best regards,

Efi

Hi Efi,

After the "Repeating group" function, do you will develop the function to support the "text boxes"? Do you know when it could be available?

Thanks in advance,

Best regards,

Lionel

We are working on the very last testing before the release. Based on the result of this test we will release the textbox in version 15.4.6-15.4.20. 

Best regards,

Efi

It will be wonderful!!

Waiting to test it.

Best regards,

Lionel

I am happy to inform you that the text box feature has been released in version 15.5.4.

Best regards,

Efi

Many thanks to the development team! I will try it ASAP! Thanks!

I'm trying to upgrade to MarvinJS 15.5.4. I am getting a 404 error in the Javascript console that is preventing MarvinJS from loading:

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (B755248E7BCCA6979900D02B758C8D6F.cache.js, line 0)

The missing resource is apparently called from gui.nocache.js. If I look at gui.nocache.js in the browser's Web inspector, I see this line of code:

function gui() {var O = 'bootstrap', P = 'begin', Q = 'gwt.codesvr.gui=', R = 'gwt.codesvr=', 

S = 'gui', T = 'startup', U = 'DUMMY', V = 0, W = 1, X = 'iframe', Y = 'javascript:""', 

Z = 'position:absolute; width:0; height:0; border:none; left: -1000px;', 

$ = ' top: -1000px;', _ = 'CSS1Compat', ab = '<!doctype html>', bb = '', 

cb = '<html><head><\/head><body><\/body><\/html>', db = 'undefined', 

eb = 'DOMContentLoaded', fb = 50, gb = 'Chrome', hb = 'eval("', ib = '");', 

jb = 'script', kb = 'javascript', lb = 'moduleStartup', mb = 'moduleRequested', 

nb = 'Failed to load ', ob = 'head', pb = 'meta', qb = 'name', rb = 'gui::', 

sb = '::', tb = 'gwt:property', ub = 'content', vb = '=', wb = 'gwt:onPropertyErrorFn', 

xb = 'Bad handler "', yb = '" for "gwt:onPropertyErrorFn"', zb = 'gwt:onLoadErrorFn', 

Ab = '" for "gwt:onLoadErrorFn"', Bb = '#', Cb = '?', Db = '/', Eb = 'img', 

Fb = 'clear.cache.gif', Gb = 'baseUrl', Hb = 'gui.nocache.js', Ib = 'base', Jb = '//', 

Kb = 'clipboardData.access', Lb = 'window', Mb = 'event', Nb = 'gecko.variant', 

Ob = 'user.agent', Pb = 'gecko1_8', Qb = 'none', Rb = 'trident', Sb = 'ie11', Tb = 'std', 

Ub = 2, Vb = 'onLoad', Wb = 'default', Xb = 'webkit', Yb = 'safari', Zb = 'msie', $b = 10, 

_b = 11, ac = 'ie10', bc = 9, cc = 'ie9', dc = 8, ec = 'ie8', fc = 'gecko', gc = 3, 

hc = 4, ic = 'selectingPermutation', jc = 'gui.devmode.js', 

kc = 'B5CE164BB1A3439CF1C917FAC9722DEF', lc = 'foobar', mc = ':1', nc = ':2', oc = ':3', 

pc = 'B755248E7BCCA6979900D02B758C8D6F', 

qc = 'DE52D56DE290E2181EBBE348E0ADAC5B', 

rc = 'E1AC3A4AE08AE791E30A20A8675F4CD0', 

sc = 'E23A1CE5299E78BE128DD3CEFC5EC9D4', 

tc = ':4', uc = ':5', vc = ':6', wc = ':7', xc = ':', yc = '.cache.js', zc = 'link', 

Ac = 'rel', Bc = 'stylesheet', Cc = 'href', Dc = 'loadExternalRefs', 

Ec = 'css/auto/clean.css', Fc = 'css/auto/gui.css', Gc = 'end', Hc = 'http:', Ic = 'file:', 

Jc = '_gwt_dummy_', Kc = '__gwtDevModeHook:gui', Lc = 'Ignoring non-whitelisted Dev Mode URL: ', 

Mc = ':moduleBase';

However, if I look at marvinJS15.5.4/gui/gui/nocache.js, I see:

function gui(){var O='bootstrap',

P='begin', Q='gwt.codesvr.gui=', R='gwt.codesvr=', S='gui', T='startup', U='DUMMY',

V=0,W=1,X='iframe', Y='javascript:""', 

Z='position:absolute; width:0; height:0; border:none; left: -1000px;',

$=' top: -1000px;', _='CSS1Compat', ab='<!doctype html>', bb='',

cb='<html><head><\/head><body><\/body><\/html>', db='undefined', eb='DOMContentLoaded',

fb=50,gb='Chrome', hb='eval("', ib='");', jb='script', kb='javascript', lb='moduleStartup',

mb='moduleRequested', nb='Failed to load ', ob='head', pb='meta', qb='name', rb='gui::',

sb='::', tb='gwt:property', ub='content', vb='=', wb='gwt:onPropertyErrorFn', 

xb='Bad handler "', yb='" for "gwt:onPropertyErrorFn"', zb='gwt:onLoadErrorFn',

Ab='" for "gwt:onLoadErrorFn"', Bb='#', Cb='?', Db='/', Eb='img', Fb='clear.cache.gif',

Gb='baseUrl', Hb='gui.nocache.js', Ib='base', Jb='//', Kb='clipboardData.access',

Lb='window', Mb='event', Nb='gecko.variant', Ob='user.agent', Pb='gecko1_8', Qb='none',

Rb='trident', Sb='ie11', Tb='std', Ub=2,Vb='onLoad', Wb='default', Xb='webkit',

Yb='safari', Zb='msie', $b=10,_b=11,ac='ie10', bc=9,cc='ie9', dc=8,ec='ie8', fc='gecko',

gc=3,hc=4,ic='selectingPermutation', jc='gui.devmode.js',

kc='00F0FE502E984A4DC2A26427DA2584B7', lc='foobar', mc=':1', nc=':2', oc=':3',

pc='0B44E82B503DAC044BFFDBC26F7933FA',

qc='47DEB9983FD63E323B31878DD5B8DAEA', rc=':4', sc=':5', tc=':6', uc=':7',

vc='BDB1685D55F104661737FE95D87A8597',

wc='E1836994B823A7DA81874961CB7BCD35', xc=':', yc='.cache.js', zc='link', Ac='rel',

Bc='stylesheet', Cc='href', Dc='loadExternalRefs', Ec='css/auto/clean.css', 

Fc='css/auto/gui.css', Gc='end', Hc='http:', Ic='file:', Jc='_gwt_dummy_',

Kc='__gwtDevModeHook:gui', Lc='Ignoring non-whitelisted Dev Mode URL: ',

Mc=':moduleBase';var o=window;var p=document;r(O,P);function q(){var a=o.location.search;

return a.indexOf(Q)!=-1||a.indexOf(R)!=-1}

Note the different values assigned to the variable pc. Now, if I look at marvinJS15.3.30/gui/gui.nocache.js, an earlier version, I see what I see in the browser (disregard the differences in line returns), namely:

function gui(){var O='bootstrap', P='begin', Q='gwt.codesvr.gui=', R='gwt.codesvr=',

S='gui', T='startup', U='DUMMY', V=0,W=1,X='iframe', Y='javascript:""',

Z='position:absolute; width:0; height:0; border:none; left: -1000px;', $=' top: -1000px;', 

_='CSS1Compat', ab='<!doctype html>', bb='', cb='<html><head><\/head><body><\/body><\/html>',

db='undefined', eb='DOMContentLoaded', fb=50,gb='Chrome', hb='eval("', ib='");', jb='script',

kb='javascript', lb='moduleStartup', mb='moduleRequested', nb='Failed to load ', ob='head',

pb='meta', qb='name', rb='gui::', sb='::', tb='gwt:property', ub='content', vb='=',

wb='gwt:onPropertyErrorFn', xb='Bad handler "', yb='" for "gwt:onPropertyErrorFn"',

zb='gwt:onLoadErrorFn', Ab='" for "gwt:onLoadErrorFn"', Bb='#', Cb='?', Db='/', Eb='img',

Fb='clear.cache.gif', Gb='baseUrl', Hb='gui.nocache.js', Ib='base', Jb='//',

Kb='clipboardData.access', Lb='window', Mb='event', Nb='gecko.variant', Ob='user.agent',

Pb='gecko1_8', Qb='none', Rb='trident', Sb='ie11', Tb='std', Ub=2,Vb='onLoad', Wb='default',

Xb='webkit', Yb='safari', Zb='msie', $b=10,_b=11,ac='ie10', bc=9,cc='ie9', dc=8,ec='ie8',

fc='gecko', gc=3,hc=4,ic='selectingPermutation', jc='gui.devmode.js',

kc='B5CE164BB1A3439CF1C917FAC9722DEF', lc='foobar', mc=':1', nc=':2', oc=':3',

pc='B755248E7BCCA6979900D02B758C8D6F',

qc='DE52D56DE290E2181EBBE348E0ADAC5B',

rc='E1AC3A4AE08AE791E30A20A8675F4CD0',

sc='E23A1CE5299E78BE128DD3CEFC5EC9D4', tc=':4', uc=':5', vc=':6', wc=':7', xc=':', 

yc='.cache.js', zc='link', Ac='rel', Bc='stylesheet', Cc='href', Dc='loadExternalRefs',

Ec='css/auto/clean.css', Fc='css/auto/gui.css', Gc='end', Hc='http:', Ic='file:',

Jc='_gwt_dummy_', Kc='__gwtDevModeHook:gui', Lc='Ignoring non-whitelisted Dev Mode URL: ',

Mc=':moduleBase';var o=window;var p=document;r(O,P);

So it looks like the web page is loading marvinJS15.3.30/gui/gui.nocache.js even though we are pointing to marvinJS15.5.4. I have repeatedly refreshed the page, emptied the cache, etc., but no joy. Any idea what is going on?

BTW, we have two versions of our web app running, one pointing to MarvinJS 15.5.4, the other to MarvinJS 15.3.30, but both of which are using the same version of JChem Web Services. Could this have anything to do with the problem?

Hi Bob,

It is a caching issue.

gui.nocache.js is only a bootstrap stuff. It loads a unique JS file that encapsulates the full Marvin JS library.

The name of this file is unique (different at each release).

The reported issue may come up after upgrading of Marvin JS. When the old gui.nocache.js is stuck in the browser cache, the loading of the application can fail. In this case, the deprecated gui.nocache.js attemps to load the deprecated resources that are not available anymore.

After gui.nocache.js was refreshed in the browser cache, the issue is resolved automatically.

The caching policy of the browsers may be different. Please consult the manual of your browser how to purge its cache.

To avoid this issue, switch off the caching of gui.nocache.js in the settings of your web server.

See more details about it in the Troubleshoot section of the Marvin JS documentation:

https://marvinjs-demo.chemaxon.com/latest/docs/troubleshoot.html

As I mentioned below, I have already emptied the browser cache (option-command-E in Safari for Mac). No joy.

My collaborator Raphael has this to say:

As you noticed, even if the browser cache is emptied, the problem
persists.  The new gui.nocache.js script is calling for
/nosession/marvinJS/gui/E23A1CE5299E78BE128DD3CEFC5EC9D4.cache.js
which doesn't exist.
I am pretty sure of this, because I watched what the browser got when I
did a <shift><reload>.  It clearly got a fresh copy of gui.nocache.js
(8928 bytes; the previous one was 9516 bytes), and soon thereafter
tried but failed to get the E23A1CE5299E78BE128DD3CEFC5EC9D4 file.
The server is already, so far as I can tell, suggesting that the
browser not cache the gui.nocache.js file.  Even if it isn't suggesting
that, when the browser got a fresh copy of gui.nocache.js, it still was
directed to a nonexistent file.  The problem is not in the server
configuration.

Upgrading to Marvin JS 15.6.1 fixed the problem, and we can now use the textbox function. Great!

Hi Bob,

Thank you for notifying us about the solution. We are happy to hear that the problem has been resolved.

Regards,

Eszter

We just upgraded to Marvin 15.6.29, and we are again getting a fatal Javascript runtime error when we try to load MarvinJS.

[Error] Failed to load resource: the server responded with a status of 404 (Not Found) (A1B274194BD0949DC5EB865ABAEBA625.cache.js, line 0)

The toolbars fail to load. The reference to the resource that is not found is located in editorws.html, which, according to the browser debugger, contains:

<link rel="stylesheet" href="https://epoch.uky.edu:9339/nosession/marvinJS/gui/css/auto/clean.css">

<link rel="stylesheet" href="https://epoch.uky.edu:9339/nosession/marvinJS/gui/css/auto/gui.css">

<script src="https://epoch.uky.edu:9339/nosession/marvinJS/gui/A1B274194BD0949DC5EB865ABAEBA625.cache.js"></script>

However, when I look at the original marvinJS/editorws.html on the server, I don't see these lines at all. Do you add them dynamically?

I note that the previous version of Marvin JS that we used, 15.6.1, does include the missing file in its directory.

Hi Bob, 

Sorry for the late reply. The referred css files are loaded automatically by Marvin JS.

I hope that this answers your question.

Best Regards,
Eszter

It appears that my browser had cached some instructions from the previous version of Marvin JS to load the CSS file in question. When we upgraded Marvin JS to a new version, the instructions for the old version remained, and that was causing the fatal runtime error.