feat(praparat): feat(praparat): add ability to zoom to fit

Closes #6

projects/praparat/src/lib/praparat.component.scss

@@ -1,9 +1,25 @@
+:host {
+  position: relative;
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
 .praparat-wrapper {
   width: 100%;
   height: 100%;
+}
+
+.praparat-wrapper,
+.praparat-zoom-element {
+  position: absolute;
+  top: 0;
+  left: 0;
   overflow: hidden;
+  z-index: 0;
 }
+
 .praparat-zoom-element {
   transform-origin: 0 0;
-  will-change: transform;
+  // will-change: transform;
 }

projects/praparat/src/lib/praparat.component.ts

@@ -22,6 +22,7 @@ import { DEFAULT_PRAPARAT_CONFIG, PraparatConfig } from './praparat-config';
  */
 @Component({
   selector: 'praparat',
+  exportAs: 'praparat',
   templateUrl: './praparat.component.html',
   styleUrls: ['./praparat.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush
@@ -191,6 +192,37 @@ export class PraparatComponent implements OnDestroy, AfterViewInit {
     });
   }
 
+  zoomToFit(element: HTMLElement) {
+    const {
+      width: viewportWidth,
+      height: viewportHeight,
+    } = this.elementRef.nativeElement.getBoundingClientRect();
+
+    let {
+      top: targetTop,
+      left: targetLeft,
+      width: targetWidth,
+      height: targetHeight,
+    } = element.getBoundingClientRect();
+
+    const currentScale = this.model.scale;
+    const currentPan = this.model.panPoint;
+
+    targetTop = targetTop / currentScale - currentPan.y;
+    targetLeft = targetLeft / currentScale - currentPan.x;
+    targetWidth = targetWidth / currentScale;
+    targetHeight = targetHeight / currentScale;
+
+    this.model.zoom(Math.min(viewportWidth / targetWidth, viewportHeight / targetHeight));
+
+    const newScale = this.model.scale;
+
+    this.model.pan({
+      x: (viewportWidth - targetWidth * newScale) / newScale / 2 - targetLeft,
+      y: (viewportHeight - targetHeight * newScale) / newScale / 2 - targetTop,
+    });
+  }
+
   private touchListToPoints(touchList: TouchList): Point[] {
     const touches: Point[] = [];