Backup: copy-paste support with refactor of java side events handling

.run/Build java.run.xml

@@ -1,6 +1,6 @@
 <component name="ProjectRunConfigurationManager">
   <configuration default="false" name="Build java" type="ShConfigurationType">
-    <option name="SCRIPT_TEXT" value="npm run build-full-pretty" />
+    <option name="SCRIPT_TEXT" value="npm run build-full-pretty -- --verbose" />
     <option name="INDEPENDENT_SCRIPT_PATH" value="true" />
     <option name="SCRIPT_PATH" value="" />
     <option name="SCRIPT_OPTIONS" value="" />

lib/canvas_editor/clipboard_handler.js

@@ -1,14 +1,9 @@
 'use strict';
 
 class ClipboardHandler {
-  copyMolecule(molecule) {
-    const data = molecule.getIDCodeAndCoordinates();
-    navigator.clipboard.writeText(`${data.idCode} ${data.coordinates}`);
-  }
-
-  pasteMolecule() {
-    // TODO: find a way to implement this in a synchronous way.
-    return null;
+  putString(data) {
+    void navigator.clipboard.writeText(data);
+    return true;
   }
 }
 

lib/canvas_editor/create_editor.js

@@ -2,7 +2,11 @@
 
 const EditorArea = require('./editor_area');
 const getEditorStylesheet = require('./editor_stylesheet');
-const { addPointerListeners, addKeyboardListeners } = require('./events');
+const {
+  addPointerListeners,
+  addKeyboardListeners,
+  addClipboardListeners,
+} = require('./events');
 const Toolbar = require('./toolbar');
 const UIHelper = require('./ui_helper');
 
@@ -72,6 +76,7 @@ function createEditor(
     new EditorArea(editorCanvas, onChange),
     uiHelper,
   );
+
   if (initialFragment) {
     if (initialMode === 'molecule') {
       const fragmentMolecule = new Molecule(0, 0);
@@ -125,12 +130,20 @@ function createEditor(
     );
   }
 
+  const removeClipboardListeners = addClipboardListeners(
+    rootElement,
+    editorArea,
+    readOnly,
+    JavaEditorArea,
+  );
+
   function destroy() {
     rootElement.remove();
     resizeObserver.disconnect();
     removePointerListeners?.();
     removeKeyboardListeners?.();
     removeToolbarPointerListeners?.();
+    removeClipboardListeners?.();
   }
 
   return { editorArea, toolbar, uiHelper, destroy };

lib/canvas_editor/events.js

@@ -11,7 +11,7 @@
 
   function fireMouseEvent(what, ev, clickCount = 0) {
     if (ev.button > 0) {
       // TODO: remove this to implement popup menu.
       return;
     }
     drawArea.fireMouseEvent(
@@ -70,23 +70,27 @@
 function addKeyboardListeners(canvasElement, editorArea, JavaEditorArea) {
   const isMac =
     typeof navigator !== 'undefined' && navigator.platform === 'MacIntel';
+  const isMenuKey = (ev) => (isMac && ev.metaKey) || (!isMac && ev.ctrlKey);
 
   function fireKeyEvent(what, ev) {
     const key = getKeyFromEvent(ev, JavaEditorArea);
     if (key === null) return;
-    ev.stopPropagation();
-    ev.preventDefault();
+
     editorArea.fireKeyEvent(
       what,
       key,
       ev.altKey,
       ev.ctrlKey,
       ev.shiftKey,
-      (isMac && ev.metaKey) || (!isMac && ev.ctrlKey),
+      isMenuKey(ev),
     );
   }
 
   canvasElement.addEventListener('keydown', (ev) => {
+    // copy-paste is handled by the clipboard event
+    if (isMenuKey(ev) && ev.key === 'c') return;
+    if (isMenuKey(ev) && ev.key === 'v') return;
+
     fireKeyEvent(JavaEditorArea.KEY_EVENT_PRESSED, ev);
   });
   canvasElement.addEventListener('keyup', (ev) => {
@@ -129,7 +133,55 @@
   }
 }
 
+/**
+ *
+ * @param {HTMLDivElement} rootElement
+ * @param editorArea
+ * @param {boolean} readOnly
+ * @param JavaEditorArea
+ */
+function addClipboardListeners(
+  rootElement,
+  editorArea,
+  readOnly,
+  JavaEditorArea,
+) {
+  /**
+   * @param {ClipboardEvent} event
+   */
+  function onCopy(event) {
+    editorArea.fireClipboardEvent(JavaEditorArea.CLIPBOARD_EVENT_COPY, null);
+
+    event.preventDefault();
+    event.stopPropagation();
+  }
+
+  /**
+   * @param {ClipboardEvent} event
+   */
+  function onPaste(event) {
+    const idcode = event.clipboardData.getData('text/plain');
+    if (!idcode) return;
+
+    editorArea.fireClipboardEvent(JavaEditorArea.CLIPBOARD_EVENT_PASTE, idcode);
+
+    event.preventDefault();
+    event.stopPropagation();
+  }
+
+  rootElement.addEventListener('copy', onCopy);
+  if (!readOnly) {
+    rootElement.addEventListener('paste', onPaste);
+  }
+
+  return () => {
+    rootElement.removeEventListener('copy', onCopy);
+    rootElement.removeEventListener('paste', onPaste);
+  };
+}
+
 module.exports = {
   addPointerListeners,
   addKeyboardListeners,
+  addClipboardListeners,
 };