ctx-polyfill - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

ctx-polyfill.js

@@ -162,3 +162,2 @@ (function() {
 
-
   if(!('imageSmoothingEnabled' in CanvasRenderingContext2D.prototype)) {
@@ -200,2 +199,13 @@ Object.defineProperty(CanvasRenderingContext2D.prototype, 'imageSmoothingEnabled', {
 
+  if(!('ellipse' in CanvasRenderingContext2D.prototype)) {
+    CanvasRenderingContext2D.prototype.ellipse = function(x, y, radiusX, radiusY, rotation, startAngle, endAngle, antiClockwise) {
+      this.save();
+      this.translate(x, y);
+      this.rotate(rotation);
+      this.scale(radiusX, radiusY);
+      this.arc(0, 0, 1, startAngle, endAngle, antiClockwise);
+      this.restore();
+    }
+  }
+
   CanvasRenderingContext2D.arrayToSVGMatrix = arrayToSVGMatrix;
@@ -202,0 +212,0 @@

ctx-polyfill.min.js

@@ -1,1 +0,1 @@
-(function(){var t=function(t){var e=document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGMatrix();e.a=t[0];e.b=t[1];e.c=t[2];e.d=t[3];e.e=t[4];e.f=t[5];return e};if(!("resetTransform"in CanvasRenderingContext2D.prototype)){CanvasRenderingContext2D.prototype.resetTransform=function(){this.setTransform(1,0,0,1,0,0)}}if(!("currentTransform"in CanvasRenderingContext2D.prototype)){if("mozCurrentTransform"in CanvasRenderingContext2D.prototype){Object.defineProperty(CanvasRenderingContext2D.prototype,"currentTransform",{get:function(){return this.mozCurrentTransform},set:function(t){this.mozCurrentTransform=t},enumerable:true,configurable:true})}else{var e=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(t,n){var r=e.call(this,t,n);switch(t){case"2d":r._transformStack=[];r._transformMatrix=[1,0,0,1,0,0];break}return r};Object.defineProperty(CanvasRenderingContext2D.prototype,"currentTransform",{get:function(){return this._transformMatrix},set:function(t){this._transformMatrix=t;this.setTransform(t[0],t[1],t[2],t[3],t[4],t[5])},enumerable:true,configurable:true});var n=CanvasRenderingContext2D.prototype.translate;CanvasRenderingContext2D.prototype.translate=function(t,e){var r=this._transformMatrix;r[4]=r[0]*t+r[2]*e+r[4];r[5]=r[1]*t+r[3]*e+r[5];n.call(this,t,e)};var r=CanvasRenderingContext2D.prototype.scale;CanvasRenderingContext2D.prototype.scale=function(t,e){var n=this._transformMatrix;n[0]*=t;n[1]*=t;n[2]*=e;n[3]*=e;r.call(this,t,e)};var a=CanvasRenderingContext2D.prototype.rotate;CanvasRenderingContext2D.prototype.rotate=function(t){var e=Math.cos(t);var n=Math.sin(t);var r=this._transformMatrix;this._transformMatrix=[r[0]*e+r[2]*n,r[1]*e+r[3]*n,r[0]*-n+r[2]*e,r[1]*-n+r[3]*e,r[4],r[5]];a.call(this,t)};var o=CanvasRenderingContext2D.prototype.transform;CanvasRenderingContext2D.prototype.transform=function(t,e,n,r,a,i){var s=this._transformMatrix;this._transformMatrix=[s[0]*t+s[2]*e,s[1]*t+s[3]*e,s[0]*n+s[2]*r,s[1]*n+s[3]*r,s[0]*a+s[2]*i+s[4],s[1]*a+s[3]*i+s[5]];o.call(this,t,e,n,r,a,i)};var i=CanvasRenderingContext2D.prototype.setTransform;CanvasRenderingContext2D.prototype.setTransform=function(t,e,n,r,a,o){this._transformMatrix=[t,e,n,r,a,o];i.call(this,t,e,n,r,a,o)};var s=CanvasRenderingContext2D.prototype.resetTransform;CanvasRenderingContext2D.prototype.resetTransform=function(){this._transformMatrix=[1,0,0,1,0,0];s.call(this)};var m=CanvasRenderingContext2D.prototype.save;CanvasRenderingContext2D.prototype.save=function(){this._transformStack.push(this._transformMatrix);this._transformMatrix=this._transformMatrix.slice(0,6);m.call(this)};var f=CanvasRenderingContext2D.prototype.restore;CanvasRenderingContext2D.prototype.restore=function(){var t=this._transformStack.pop();if(t){this._transformMatrix=t}f.call(this)}}}if(!("imageSmoothingEnabled"in CanvasRenderingContext2D.prototype)){Object.defineProperty(CanvasRenderingContext2D.prototype,"imageSmoothingEnabled",{get:function(){if(this.mozImageSmoothingEnabled!==void 0){return this.mozImageSmoothingEnabled}else if(this.webkitImageSmoothingEnabled!==void 0){return this.webkitImageSmoothingEnabled}else if(this.msImageSmoothingEnabled!==void 0){return this.msImageSmoothingEnabled}else{return true}},set:function(t){if(this.mozImageSmoothingEnabled!==void 0){this.mozImageSmoothingEnabled=t}else if(this.webkitImageSmoothingEnabled!==void 0){this.webkitImageSmoothingEnabled=t}else if(this.msImageSmoothingEnabled!==void 0){this.msImageSmoothingEnabled=t}},enumerable:true,configurable:true})}CanvasRenderingContext2D.arrayToSVGMatrix=t})();
+(function(){var t=function(t){var e=document.createElementNS("http://www.w3.org/2000/svg","svg").createSVGMatrix();e.a=t[0];e.b=t[1];e.c=t[2];e.d=t[3];e.e=t[4];e.f=t[5];return e};if(!("resetTransform"in CanvasRenderingContext2D.prototype)){CanvasRenderingContext2D.prototype.resetTransform=function(){this.setTransform(1,0,0,1,0,0)}}if(!("currentTransform"in CanvasRenderingContext2D.prototype)){if("mozCurrentTransform"in CanvasRenderingContext2D.prototype){Object.defineProperty(CanvasRenderingContext2D.prototype,"currentTransform",{get:function(){return this.mozCurrentTransform},set:function(t){this.mozCurrentTransform=t},enumerable:true,configurable:true})}else{var e=HTMLCanvasElement.prototype.getContext;HTMLCanvasElement.prototype.getContext=function(t,n){var r=e.call(this,t,n);switch(t){case"2d":r._transformStack=[];r._transformMatrix=[1,0,0,1,0,0];break}return r};Object.defineProperty(CanvasRenderingContext2D.prototype,"currentTransform",{get:function(){return this._transformMatrix},set:function(t){this._transformMatrix=t;this.setTransform(t[0],t[1],t[2],t[3],t[4],t[5])},enumerable:true,configurable:true});var n=CanvasRenderingContext2D.prototype.translate;CanvasRenderingContext2D.prototype.translate=function(t,e){var r=this._transformMatrix;r[4]=r[0]*t+r[2]*e+r[4];r[5]=r[1]*t+r[3]*e+r[5];n.call(this,t,e)};var r=CanvasRenderingContext2D.prototype.scale;CanvasRenderingContext2D.prototype.scale=function(t,e){var n=this._transformMatrix;n[0]*=t;n[1]*=t;n[2]*=e;n[3]*=e;r.call(this,t,e)};var a=CanvasRenderingContext2D.prototype.rotate;CanvasRenderingContext2D.prototype.rotate=function(t){var e=Math.cos(t);var n=Math.sin(t);var r=this._transformMatrix;this._transformMatrix=[r[0]*e+r[2]*n,r[1]*e+r[3]*n,r[0]*-n+r[2]*e,r[1]*-n+r[3]*e,r[4],r[5]];a.call(this,t)};var o=CanvasRenderingContext2D.prototype.transform;CanvasRenderingContext2D.prototype.transform=function(t,e,n,r,a,i){var s=this._transformMatrix;this._transformMatrix=[s[0]*t+s[2]*e,s[1]*t+s[3]*e,s[0]*n+s[2]*r,s[1]*n+s[3]*r,s[0]*a+s[2]*i+s[4],s[1]*a+s[3]*i+s[5]];o.call(this,t,e,n,r,a,i)};var i=CanvasRenderingContext2D.prototype.setTransform;CanvasRenderingContext2D.prototype.setTransform=function(t,e,n,r,a,o){this._transformMatrix=[t,e,n,r,a,o];i.call(this,t,e,n,r,a,o)};var s=CanvasRenderingContext2D.prototype.resetTransform;CanvasRenderingContext2D.prototype.resetTransform=function(){this._transformMatrix=[1,0,0,1,0,0];s.call(this)};var m=CanvasRenderingContext2D.prototype.save;CanvasRenderingContext2D.prototype.save=function(){this._transformStack.push(this._transformMatrix);this._transformMatrix=this._transformMatrix.slice(0,6);m.call(this)};var f=CanvasRenderingContext2D.prototype.restore;CanvasRenderingContext2D.prototype.restore=function(){var t=this._transformStack.pop();if(t){this._transformMatrix=t}f.call(this)}}}if(!("imageSmoothingEnabled"in CanvasRenderingContext2D.prototype)){Object.defineProperty(CanvasRenderingContext2D.prototype,"imageSmoothingEnabled",{get:function(){if(this.mozImageSmoothingEnabled!==void 0){return this.mozImageSmoothingEnabled}else if(this.webkitImageSmoothingEnabled!==void 0){return this.webkitImageSmoothingEnabled}else if(this.msImageSmoothingEnabled!==void 0){return this.msImageSmoothingEnabled}else{return true}},set:function(t){if(this.mozImageSmoothingEnabled!==void 0){this.mozImageSmoothingEnabled=t}else if(this.webkitImageSmoothingEnabled!==void 0){this.webkitImageSmoothingEnabled=t}else if(this.msImageSmoothingEnabled!==void 0){this.msImageSmoothingEnabled=t}},enumerable:true,configurable:true})}if(!("ellipse"in CanvasRenderingContext2D.prototype)){CanvasRenderingContext2D.prototype.ellipse=function(t,e,n,r,a,o,i,s){this.save();this.translate(t,e);this.rotate(a);this.scale(n,r);this.arc(0,0,1,o,i,s);this.restore()}}CanvasRenderingContext2D.arrayToSVGMatrix=t})();

package.json

 {
   "name": "ctx-polyfill",
-  "version": "1.0.3",
-  "description": "Polyfill CanvasRenderingContext2D : currentTransform, resetTransform",
+  "version": "1.0.4",
+  "description": "Polyfill CanvasRenderingContext2D : currentTransform, resetTransform, imageSmoothingEnabled, etc...",
   "main": "ctx-polyfill.js",
@@ -6,0 +6,0 @@ "scripts": {

README.md

 ### Polyfill CanvasRenderingContext2D to match last ES7 specifications
 
-Tested on IE 10+
+Tested on  EDGE, CHROME, FIREFOX, OPERA and IE 10+.
 
@@ -12,5 +12,6 @@ #### Install
 
-- [currentTransform](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/currentTransform) : (set and get) return the transform matrix as array [a, b, c, d, e, f]
+- [currentTransform](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/currentTransform) : (set and get) return the transform matrix as array [a, b, c, d, e, f].
 - [resetTransform](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/resetTransform) : resets the current transform by the identity matrix.
-- [imageSmoothingEnabled](https://developer.mozilla.org/fr/docs/Web/API/CanvasRenderingContext2D/imageSmoothingEnabled) : enable or disabled image Smoothing
+- [imageSmoothingEnabled](https://developer.mozilla.org/fr/docs/Web/API/CanvasRenderingContext2D/imageSmoothingEnabled) : enable or disable image smoothing (only if natively supported).
+- [ellipse](https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/ellipse) : draw an ellipse.
 
@@ -17,0 +18,0 @@ #### Helper

tests/test.js

@@ -55,3 +55,3 @@ const Tester = require('./Tester.class');
         ${testCurrentTransForm}
-        
+
         ctx.translate(250, 250);
@@ -76,5 +76,5 @@ ctx.rotate(Math.PI / 4);
         var ctx = canvas.getContext('2d');
-        
+
         ${testCurrentTransForm}
-       
+
         ctx.translate(250, 250);
@@ -86,3 +86,3 @@ ctx.rotate(Math.PI / 4);
         ctx.resetTransform();
-        
+
         testCurrentTransForm(ctx, [1, 0, 0, 1, 0, 0]);
@@ -98,16 +98,16 @@ `);
         var ctx = canvas.getContext('2d');
-        
+
         ${testCurrentTransForm}
-       
+
         ctx.save();
         ctx.translate(10, 10);
         testCurrentTransForm(ctx, [ 1, 0, 0, 1, 10, 10 ]);
-    
+
         ctx.scale(2, 2);
         testCurrentTransForm(ctx, [ 2, 0, 0, 2, 10, 10 ]);
- 
+
         ctx.rotate(90 * Math.PI / 180);
         ctx.translate(5, 5);
         testCurrentTransForm(ctx, [ -8.742277657347586e-8, 2, -2, -8.742277657347586e-8, 0, 20 ]);
-    
+
         ctx.transform(1, 2, 3, 4, 5, 6);
@@ -127,3 +127,3 @@ testCurrentTransForm(ctx, [ -4, 1.9999998807907104, -8, 5.999999523162842, -12, 30 ]);
         var ctx = canvas.getContext('2d');
-        
+
         if(!('imageSmoothingEnabled' in ctx)) throw new Error('imageSmoothingEnabled not present in ctx');
@@ -134,3 +134,19 @@ ctx.imageSmoothingEnabled = true;
 
+    test.it('Test ellipse', () => {
+      driver.wait(until.elementLocated(By.css('#canvas')));
 
+      return tester.executeScript(driver, `
+        var canvas = document.getElementById('canvas');
+        var ctx = canvas.getContext('2d');
+        
+        if(!('ellipse' in ctx)) throw new Error('Ellipse not present in ctx');
+        // ctx.lineWidth = 10;
+        ctx.beginPath();
+        ctx.ellipse(100, 100, 50, 75, 45 * Math.PI/180, 0, 2 * Math.PI);
+        ctx.stroke();
+        if(ctx.getImageData(122, 36, 1, 1).data[3] === 0) throw new Error('Ellipse draw failed');
+      `);
+    });
+
+
     test.after(() => {
@@ -137,0 +153,0 @@ driver.quit();

Fixed alerts

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

22157

increased by7.13%

Lines of code

419

increased by5.81%

Number of lines in readme file

23

increased by4.55%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes