fancy-canvas - npm Package Compare versions

Comparing version 0.1.2 to 0.2.1

coordinate-space.d.ts

@@ -12,3 +12,4 @@ export declare type Size = {
     */
-    canvasSize: Size;
+    readonly canvasSize: Size;
+    resizeCanvas(size: Size): void;
     readonly pixelRatio: number;
@@ -15,0 +16,0 @@ subscribeCanvasConfigured(listener: CanvasConfiguredListener): void;

coordinate-space.js

@@ -10,6 +10,6 @@ export function bindToDevicePixelRatio(canvas) {
         this._canvasConfiguredListeners = [];
-        this._canvas = canvas;
+        this.canvas = canvas;
         this._canvasSize = {
-            width: this._canvas.clientWidth,
-            height: this._canvas.clientHeight,
+            width: this.canvas.clientWidth,
+            height: this.canvas.clientHeight,
         };
@@ -22,33 +22,30 @@ this._configureCanvas();
         this._uninstallResolutionListener();
-        this._canvasSize = null;
-        this._canvas = null;
+        this.canvas = null;
     };
-    Object.defineProperty(DevicePixelRatioBinding.prototype, "canvas", {
-        get: function () {
-            return this._canvas;
-        },
-        enumerable: true,
-        configurable: true
-    });
     Object.defineProperty(DevicePixelRatioBinding.prototype, "canvasSize", {
         get: function () {
-            return this._canvasSize;
+            return {
+                width: this._canvasSize.width,
+                height: this._canvasSize.height,
+            };
         },
-        set: function (size) {
-            this._canvasSize = size;
-            this._configureCanvas();
-        },
         enumerable: true,
         configurable: true
     });
+    DevicePixelRatioBinding.prototype.resizeCanvas = function (size) {
+        this._canvasSize = {
+            width: size.width,
+            height: size.height,
+        };
+        this._configureCanvas();
+    };
     Object.defineProperty(DevicePixelRatioBinding.prototype, "pixelRatio", {
         get: function () {
-            if (this._canvas.ownerDocument == null) {
-                throw new Error('Invalid owner document specified for canvas');
-            }
-            var window = this._canvas.ownerDocument.defaultView;
-            if (window == null) {
+            // According to DOM Level 2 Core specification, ownerDocument should never be null for HTMLCanvasElement
+            // see https://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html#node-ownerDoc
+            var win = this.canvas.ownerDocument.defaultView;
+            if (win == null) {
                 throw new Error('No window is associated with the canvas');
             }
-            return window.devicePixelRatio;
+            return win.devicePixelRatio;
         },
@@ -66,6 +63,6 @@ enumerable: true,
         var ratio = this.pixelRatio;
-        this._canvas.style.width = this._canvasSize.width + "px";
-        this._canvas.style.height = this._canvasSize.height + "px";
-        this._canvas.width = this._canvasSize.width * ratio;
-        this._canvas.height = this._canvasSize.height * ratio;
+        this.canvas.style.width = this._canvasSize.width + "px";
+        this.canvas.style.height = this._canvasSize.height + "px";
+        this.canvas.width = this._canvasSize.width * ratio;
+        this.canvas.height = this._canvasSize.height * ratio;
         this._emitCanvasConfigured();
@@ -81,12 +78,10 @@ };
         }
-        if (this._canvas.ownerDocument == null) {
-            throw new Error('Invalid owner document specified for canvas');
-        }
-        var window = this._canvas.ownerDocument.defaultView;
-        if (window == null) {
+        // According to DOM Level 2 Core specification, ownerDocument should never be null for HTMLCanvasElement
+        // see https://www.w3.org/TR/2000/REC-DOM-Level-2-Core-20001113/core.html#node-ownerDoc
+        var win = this.canvas.ownerDocument.defaultView;
+        if (win == null) {
             throw new Error('No window is associated with the canvas');
         }
-        var dppx = window.devicePixelRatio;
-        var dpi = dppx * 96;
-        this._resolutionMediaQueryList = window.matchMedia("screen and (min-resolution: " + (dpi - 0.001) + "dpi) and (max-resolution: " + (dpi + 0.001) + "dpi)");
+        var dppx = win.devicePixelRatio;
+        this._resolutionMediaQueryList = win.matchMedia("all and (resolution: " + dppx + "dppx)");
         // IE and some versions of Edge do not support addEventListener/removeEventListener, and we are going to use the deprecated addListener/removeListener
@@ -93,0 +88,0 @@ this._resolutionMediaQueryList.addListener(this._resolutionListener);

package.json

 {
   "name": "fancy-canvas",
-  "version": "0.1.2",
+  "version": "0.2.1",
   "author": "[e-mail]",
@@ -14,5 +14,2 @@ "description": "Functionality on top of HTML canvas element, including support for HiDPI and pixel-perfect rendering",
   "license": "MIT",
-  "dependencies": {
-    "tslib": "^1.6.0"
-  },
   "files": [
@@ -19,0 +16,0 @@ "**/*.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Dependency count

0

decreased by-100%

Worsened metrics

Total package byte prevSize

5908

decreased by-0.51%

Lines of code

120

decreased by-3.23%

Dependency changes

• - Removedtslib@^1.6.0

• - Removedtslib@1.14.1(transitive)