Marvin JS Example - Copy As MRV

This example demonstrates how to control what is placed to the clipboard at copy. When MRV as copy format checkbox is checked, the structure is placed as MRV to the clipboard at copy. When the checkbox is unchecked, the default copy format is MDL molfile. To see the difference, draw something into the editor, select it and press CTR+C shortcut to copy the structure to the clipboard. After that, click into the textbox and press CTRL+V to paste the clipboard content into the editor. The format of the pasted content (MRV or MDL molfile) depend on the state of the above checkbox.

If you would like to clear the textbox content, press apply the Reset textbox button.

At startup, the copyasmrv parameter of Marvin JS editor is setup.

<iframe src="../editorws.html" id="sketch" class="sketcher-frame" data-toolbars="reporting" data-copyasmrv=true></iframe>

First of all, you need a reference for the editor. MarvinJSUtil.getEditor(String) provides a Promise object for you to get it when the editor is ready.

After the editor is loaded, run the initcontrol() function to bind actions to the MRV as copy format checkbox and to the Reset textbox button.

		var marvinSketcherInstance;

		$(document).ready(function handleDocumentReady (e) {
			MarvinJSUtil.getEditor("#sketch").then(function (sketcherInstance) {
				marvinSketcherInstance = sketcherInstance;
				initControl();
			},function (error) {
				alert("Cannot retrieve sketcher instance from iframe:"+error);
			});
		});

Changing of the checkbox value, trigger update settings of the editor. In the change event handler, the target of the change event is the checkbox. If the checkbox is checked, setup copyasmrv property to true else false. You can update settings of the editor with its setDisplaySettings(settings) function. At update, specify also the toolbars property to preserve current toolbar layout.

		function initControl () {
			$("#chbx-copyasmrv").on("change", function (e) {
				var settings = {}
				settings.copyasmrv = e.target.checked;
				settings.toolbars = "reporting";
				marvinSketcherInstance.setDisplaySettings(settings);
			});
			$("#btn-reset").on("click", function (e) {
				$("#txt").val("");
			});
		}