#2128 Automatically adjust zoom when opening a structure (#2802)

- added method in editor to zoom according content - added this method execution after drawing opened structure Co-authored-by: Roman Rodionov <[email protected]>
epam · Jul 6, 2023 · f30bccb · f30bccb
1 parent ff31db4
commit f30bccb
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 0 deletions.
diff --git a/packages/ketcher-react/src/script/editor/Editor.ts b/packages/ketcher-react/src/script/editor/Editor.ts
@@ -330,6 +330,27 @@ class Editor implements KetcherEditor {
     return this.render.options.zoom
   }
 
+  zoomAccordingContent() {
+    this.zoom(1)
+    const clientAreaBoundingBox = this.render.clientArea.getBoundingClientRect()
+    const paper = this.render.paper
+    const MIN_ZOOM_VALUE = 0.1
+    const MAX_ZOOM_VALUE = 1
+    const newZoomValue =
+      paper.height - clientAreaBoundingBox.height >
+      paper.width - clientAreaBoundingBox.width
+        ? clientAreaBoundingBox.height / paper.height
+        : clientAreaBoundingBox.width / paper.width
+
+    if (newZoomValue < MAX_ZOOM_VALUE) {
+      this.zoom(
+        newZoomValue < MIN_ZOOM_VALUE
+          ? MIN_ZOOM_VALUE
+          : Number(newZoomValue.toFixed(2))
+      )
+    }
+  }
+
   selection(ci?: any) {
     if (arguments.length === 0) {
       return this._selection // eslint-disable-line

diff --git a/packages/ketcher-react/src/script/ui/state/shared.ts b/packages/ketcher-react/src/script/ui/state/shared.ts
@@ -169,6 +169,9 @@ export function load(struct: Struct, options?) {
       } else {
         editor.struct(parsedStruct)
       }
+
+      editor.zoomAccordingContent()
+
       dispatch(setAnalyzingFile(false))
       dispatch({ type: 'MODAL_CLOSE' })
     } catch (err: any) {