Merge branch 'refactor_for_angular9'

# Conflicts:
#	README.md
#	package.json
#	src/index.ts
#	src/lib/ngx-image-zoom.component.ts

.editorconfig

@@ -1,4 +1,4 @@
-# Editor configuration, see http://editorconfig.org
+# Editor configuration, see https://editorconfig.org
 root = true
 
 [*]

.gitignore

@@ -1,36 +1,30 @@
-# Node
-node_modules/*
-npm-debug.log
-
-# TypeScript
-src/*.js
-src/*.map
-src/*.d.ts
+# See http://help.github.com/ignore-files/ for more about ignoring files.
 
-# JetBrains
-.idea
-.project
-.settings
-.idea/*
-*.iml
+# compiled output
+/dist
+/tmp
+/out-tsc
 
-# Windows
-Thumbs.db
-Desktop.ini
+# dependencies
+/node_modules
 
-# Ngc generated files
-**/*.ngfactory.ts
+# profiling files
+chrome-profiler-events*.json
+speed-measure-plugin*.json
 
-# Build files
-dist/*
-.tmp/*
+# IDEs and editors
+/.idea
 
-# Playground tmp files
-.playground
-playground/*
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+yarn-error.log
+testem.log
+/typings
 
-# Probably not needed either
-.travis.yml
-.yo-rc.json
-bs-config.json
-package-lock.json
+# System Files
+.DS_Store
+Thumbs.db

CHANGELOG.md

@@ -0,0 +1,17 @@
+<a name="0.5.0"></a>
+# 0.5.0
+
+### Breaking changes
+* To comply with recommendaing naming conventions the follow name changes have been done:
+    * Changed tag name from *ngx-image-zoom* to *lib-ngx-image-zoom* ([style 02-07](https://angular.io/guide/styleguide#style-02-07))
+    * Changed output *onZoomScroll* to *zoomScroll* ([style 05-16](https://angular.io/guide/styleguide#style-05-16))
+    * Changed output *onZoomPosition* to *zoomPosition* ([style 05-16](https://angular.io/guide/styleguide#style-05-16))
+* With the upgrade *.forRoot()* is no longer needed when importing the NgxImageZoomModule in your project.
+
+### Features
+* Completely redid the library wrapping for Angular 9 support.
+* Library is now in Angular Package Format for better compatibility.
+* Added a new input scrollParentSelector to further control zooming in complex layouts.
+
+### Bugfixes
+* Clean up event listeners when component is destroyed.

README.md

@@ -4,6 +4,10 @@
 
 ## Project status
 
+**Breaking changes** in version 0.5.0, see [changelog](CHANGELOG.md) for details. This version is only tested
+with Angular9, I'll try to test and make compatible with a few versions back too for a later version. As far
+as I can tell 0.5.0 is Ivy compatible too.
+
 Still in early development, more features are planned and incoming. Should be in a working 
 state right now but it's not tested in lots of different setups yet.
 
@@ -36,7 +40,7 @@ lensHeight | 100 | Height of the lens, if enabled.
 circularLens | false | Make the lens circular instead of square. This will only look good if width and height are equal.
 minZoomRatio | *baseRatio* | Lower limit on how much zoom can be applied with scrollZoom enabled. See below for details.
 maxZoomRatio | 2 | Upper limit on how much zoom can be applied with scrollZoom enabled. See below for details.
-scrollParentSelector | *none* | Selector of parent scrolling view as string. This avoid zoom gap with cursor when the scrolling view is not the main window. Example : '#scrolling-frame'
+scrollParentSelector | *none* | Selector of parent scrolling view as string. This avoid zoom gap with cursor when the scrolling view is not the main window. Example : `#scrolling-frame`
 isInsideStaticContainer | false | Set to `true` if the thumbnail is inside a container, to which `position: static` is applied (e.g. a modal window). This is required to avoid zoom position being calculated incorrectly.
 
 ### Zoom modes
@@ -60,8 +64,8 @@ The component outputs the follow events that can be triggered on.
 
 Event name | Description
 :---:|---
-onZoomScroll | Whenever the user changes the zoom level using the scroll wheel this event will fire with the current zoom ratio (see above).
-onZoomPosition | When the point on where the zoom is focused changes this event emits a Coord event (interface exported from the module) with X/Y in pixels relative thumbnails top left corner. Practically whenever the user moves the mouse cursor over the image.
+zoomScroll | Whenever the user changes the zoom level using the scroll wheel this event will fire with the current zoom ratio (see above).
+zoomPosition | When the point on where the zoom is focused changes this event emits a Coord event (interface exported from the module) with X/Y in pixels relative thumbnails top left corner. Practically whenever the user moves the mouse cursor over the image.
 
 ## Installation
 
@@ -90,7 +94,7 @@ import { NgxImageZoomModule } from 'ngx-image-zoom';
   ],
   imports: [
     BrowserModule,
-    NgxImageZoomModule.forRoot() // <-- Add this line
+    NgxImageZoomModule // <-- Add this line
   ],
   providers: [],
   bootstrap: [AppComponent]
@@ -105,10 +109,10 @@ Once the library is imported, you can use its component in your Angular applicat
 <h1>
   {{title}}
 </h1>
-<ngx-image-zoom
+<lib-ngx-image-zoom
     [thumbImage]=myThumbnail
     [fullImage]=myFullresImage
-></ngx-image-zoom>
+></lib-ngx-image-zoom>
 ```
 
 ## License

angular.json

@@ -0,0 +1,47 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "./",
+  "projects": {
+    "ngx-image-zoom": {
+      "projectType": "library",
+      "root": "./",
+      "sourceRoot": "src",
+      "prefix": "lib",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-ng-packagr:build",
+          "options": {
+            "tsConfig": "tsconfig.lib.json",
+            "project": "ng-package.json"
+          },
+          "configurations": {
+            "production": {
+              "tsConfig": "tsconfig.lib.prod.json"
+            }
+          }
+        },
+        "test": {
+          "builder": "@angular-devkit/build-angular:karma",
+          "options": {
+            "main": "src/test.ts",
+            "tsConfig": "tsconfig.spec.json",
+            "karmaConfig": "karma.conf.js"
+          }
+        },
+        "lint": {
+          "builder": "@angular-devkit/build-angular:tslint",
+          "options": {
+            "tsConfig": [
+              "tsconfig.lib.json",
+              "tsconfig.spec.json"
+            ],
+            "exclude": [
+              "**/node_modules/**"
+            ]
+          }
+        }
+      }
+    }},
+  "defaultProject": "ngx-image-zoom"
+}