react-avatar-generator - npm Package Compare versions

Comparing version 0.0.1 to 1.0.0

build/index.js

@@ -1,1 +0,1 @@
-module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var a=t[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,r),a.l=!0,a.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)r.d(n,a,function(t){return e[t]}.bind(null,a));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),a=l(r(1)),o=l(r(2)),i=l(r(5)),s=l(r(6)),u=r(7);function l(e){return e&&e.__esModule?e:{default:e}}var c=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return r.canvas=null,r}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,a.default.PureComponent),n(t,[{key:"componentDidMount",value:function(){0===this.props.colors.length&&console.warn("You need to add some colors in the color array!"),this.randomize()}},{key:"componentDidUpdate",value:function(e){var t=this.props.colors;JSON.stringify(e.colors)!==JSON.stringify(t)&&this.randomize()}},{key:"collectCanvasSettings",value:function(){var e=this.canvas,t=this.props,r=t.width,n=t.height;e.width=4*r,e.height=4*n,e.style.width=1.5*r+"px",e.style.height=1.5*n+"px";var a=e.getContext("2d"),o=document.createElement("canvas"),i=o.getContext("2d"),s=document.createElement("canvas"),u=s.getContext("2d"),l=e.width,c=e.height,f=l/2,p=c/2,d=2*Math.PI;return o.width=e.width,o.height=e.height,s.width=o.width,s.height=o.height,{canvas:e,mainCtx:a,bufferCtx:i,textureCtx:u,W:l,H:c,CX:f,CY:p,PI2:d,textureCanvas:s,bufferCanvas:o}}},{key:"randomize",value:function(){var e=this.props,t=e.mirrors,r=e.fade,n=e.zoom,a=e.rotation,o=e.amount,s=e.spacing,u=e.opacity,l=e.backgroundColor,c=e.backgroundOpacity,f=1e5*Math.random(),p=Math.pow(2,Math.ceil(t)),d=p/2,h=this.collectCanvasSettings(),g=h.canvas,b=h.mainCtx,v=h.bufferCtx,y=h.textureCtx,m=h.W,w=h.H,x=h.CX,O=h.CY,_=h.PI2,P=h.textureCanvas,C=h.bufferCanvas;b.clearRect(0,0,g.width,g.height),v.clearRect(0,0,m,w),y.clearRect(0,0,m,w),v.globalAlpha=r,v.save(),v.translate(x,O),v.scale(1+n/100,1+n/100),v.rotate(a/100),v.translate(-x,-O),v.drawImage(g,0,0),v.restore(),y.save(),y.translate(x,O),y.beginPath(),y.moveTo(0,0),y.arc(0,0,m,0,_/p),y.lineTo(0,0),y.clip(),y.translate(-x,-O),y.globalAlpha=u;for(var T=0;T<o;T++){var M=f+T*s*1e3;this.draw(y,M,T)}y.restore(),y.globalAlpha=1,y.save(),y.translate(0,w),y.scale(1,-1),y.drawImage(P,0,0,m,w),y.restore(),v.save(),v.globalAlpha=1;for(var k=0;k<d;k++)v.translate(x,O),v.rotate(_/d),v.translate(-x,-O),v.drawImage(P,0,0,m,w,0,0,m,w);v.restore(),b.save();var j=(0,i.default)(l),S=j.red,E=j.green,I=j.blue;b.fillStyle="rgba("+S+", "+E+", "+I+", "+c+")",b.fillRect(0,0,g.width,g.height),b.translate(x,O),b.translate(-x,-O),b.drawImage(C,0,0),b.restore()}},{key:"draw",value:function(e,t,r){var n=this.props,a=n.wavelength,o=n.sizing,i=n.shape,u=n.colors,l=this.canvas,c=l.width/2,f=l.height/2,p=u[Math.floor(Math.random()*u.length-1)+0],d=t/2e3;e.save(),e.translate(c,f),e.rotate(d),e.fillStyle=p;var h=a,g=o/10*((1+Math.sin(t/911*h))*c*.3+(1+Math.cos(t/701*h))*c*.2+(1+Math.sin(t/503*h))*c*.1),b=Math.sin(t/(r+787)*h)*c*.37,v=Math.sin(t/(r+997)*h)*f*.13;s.default[i](e,b,v,g),e.fill(),e.restore()}},{key:"isValidHex",value:function(e){return(0,u.isValidHex)(e)}},{key:"render",value:function(){var e=this;return a.default.createElement("canvas",{ref:function(t){e.canvas=t}})}}]),t}();c.defaultProps={width:200,height:200,mirrors:3,zoom:.2,rotation:.3,fade:1,opacity:.3,amount:16,spacing:20,wavelength:2,sizing:4,shape:"circle",backgroundColor:"#fff",backgroundOpacity:.3,colors:[]},c.propTypes={colors:o.default.array,width:o.default.number,height:o.default.number,mirrors:o.default.number,zoom:o.default.number,rotation:o.default.number,fade:o.default.number,opacity:o.default.number,amount:o.default.number,spacing:o.default.number,wavelength:o.default.number,sizing:o.default.number,shape:o.default.string,backgroundColor:o.default.string,backgroundOpacity:o.default.number},t.default=c},function(e,t){e.exports=require("react")},function(e,t,r){e.exports=r(3)()},function(e,t,r){"use strict";var n=r(4);function a(){}e.exports=function(){function e(e,t,r,a,o,i){if(i!==n){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function t(){return e}e.isRequired=e;var r={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return r.checkPropTypes=a,r.PropTypes=r,r}},function(e,t,r){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,r){"use strict";const n=new RegExp("[^#a-f\\d]","gi"),a=new RegExp("^#?[a-f\\d]{3}[a-f\\d]?$|^#?[a-f\\d]{6}([a-f\\d]{2})?$","i");e.exports=function(e,t={}){if("string"!=typeof e||n.test(e)||!a.test(e))throw new TypeError("Expected a valid hex string");let r=255;8===(e=e.replace(/^#/,"")).length&&(r=parseInt(e.slice(6,8),16)/255,e=e.substring(0,6)),4===e.length&&(r=parseInt(e.slice(3,4).repeat(2),16)/255,e=e.substring(0,3)),3===e.length&&(e=e[0]+e[0]+e[1]+e[1]+e[2]+e[2]);const o=parseInt(e,16),i=o>>16,s=o>>8&255,u=255&o;return"array"===t.format?[i,s,u,r]:{red:i,green:s,blue:u,alpha:r}}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default={circle:function(e,t,r,n){var a=2*Math.PI;n=Math.abs(n),e.save(),e.beginPath(),e.arc(t,r,n,0,a),e.restore()},triangle:function(e,t,r,n){e.save(),e.translate(t,r),e.beginPath(),e.moveTo(0,n),e.lineTo(n/2,0),e.lineTo(-n/2,0),e.lineTo(0,n),e.restore()},square:function(e,t,r,n){e.save(),e.translate(t,r),e.beginPath(),e.moveTo(0,n),e.lineTo(n,n),e.lineTo(n,0),e.lineTo(0,0),e.lineTo(0,n),e.restore()}}},function(e,t,r){"use strict";e.exports={isValidHex:function(e){if(!e||"string"!=typeof e)return!1;switch("#"===e.substring(0,1)&&(e=e.substring(1)),e.length){case 3:return/^[0-9A-F]{3}$/i.test(e);case 6:return/^[0-9A-F]{6}$/i.test(e);case 8:return/^[0-9A-F]{8}$/i.test(e);default:return!1}}}}]);
+module.exports=function(e){var t={};function r(n){if(t[n])return t[n].exports;var a=t[n]={i:n,l:!1,exports:{}};return e[n].call(a.exports,a,a.exports,r),a.l=!0,a.exports}return r.m=e,r.c=t,r.d=function(e,t,n){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:n})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var n=Object.create(null);if(r.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var a in e)r.d(n,a,function(t){return e[t]}.bind(null,a));return n},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var n=function(){function e(e,t){for(var r=0;r<t.length;r++){var n=t[r];n.enumerable=n.enumerable||!1,n.configurable=!0,"value"in n&&(n.writable=!0),Object.defineProperty(e,n.key,n)}}return function(t,r,n){return r&&e(t.prototype,r),n&&e(t,n),t}}(),a=l(r(1)),o=l(r(2)),i=l(r(5)),s=l(r(6)),u=r(7);function l(e){return e&&e.__esModule?e:{default:e}}var c=function(e){function t(e){!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,t);var r=function(e,t){if(!e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return!t||"object"!=typeof t&&"function"!=typeof t?e:t}(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));return r.canvas=null,r}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function, not "+typeof t);e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,enumerable:!1,writable:!0,configurable:!0}}),t&&(Object.setPrototypeOf?Object.setPrototypeOf(e,t):e.__proto__=t)}(t,a.default.PureComponent),n(t,[{key:"componentDidMount",value:function(){0===this.props.colors.length&&console.warn("You need to add some colors in the color array!"),this.randomize()}},{key:"componentDidUpdate",value:function(e){var t=this.props.colors;JSON.stringify(e.colors)!==JSON.stringify(t)&&this.randomize()}},{key:"getImageData",value:function(){return this.canvas.toDataURL("image/png")}},{key:"collectCanvasSettings",value:function(){var e=this.canvas,t=this.props,r=t.width,n=t.height;e.width=4*r,e.height=4*n,e.style.width=1.5*r+"px",e.style.height=1.5*n+"px";var a=e.getContext("2d"),o=document.createElement("canvas"),i=o.getContext("2d"),s=document.createElement("canvas"),u=s.getContext("2d"),l=e.width,c=e.height,f=l/2,p=c/2,d=2*Math.PI;return o.width=e.width,o.height=e.height,s.width=o.width,s.height=o.height,{canvas:e,mainCtx:a,bufferCtx:i,textureCtx:u,W:l,H:c,CX:f,CY:p,PI2:d,textureCanvas:s,bufferCanvas:o}}},{key:"randomize",value:function(){var e=this.props,t=e.mirrors,r=e.fade,n=e.zoom,a=e.rotation,o=e.amount,s=e.spacing,u=e.opacity,l=e.backgroundColor,c=e.backgroundOpacity,f=1e5*Math.random(),p=Math.pow(2,Math.ceil(t)),d=p/2,h=this.collectCanvasSettings(),g=h.canvas,b=h.mainCtx,v=h.bufferCtx,y=h.textureCtx,m=h.W,w=h.H,x=h.CX,O=h.CY,_=h.PI2,P=h.textureCanvas,C=h.bufferCanvas;b.clearRect(0,0,g.width,g.height),v.clearRect(0,0,m,w),y.clearRect(0,0,m,w),v.globalAlpha=r,v.save(),v.translate(x,O),v.scale(1+n/100,1+n/100),v.rotate(a/100),v.translate(-x,-O),v.drawImage(g,0,0),v.restore(),y.save(),y.translate(x,O),y.beginPath(),y.moveTo(0,0),y.arc(0,0,m,0,_/p),y.lineTo(0,0),y.clip(),y.translate(-x,-O),y.globalAlpha=u;for(var T=0;T<o;T++){var M=f+T*s*1e3;this.draw(y,M,T)}y.restore(),y.globalAlpha=1,y.save(),y.translate(0,w),y.scale(1,-1),y.drawImage(P,0,0,m,w),y.restore(),v.save(),v.globalAlpha=1;for(var k=0;k<d;k++)v.translate(x,O),v.rotate(_/d),v.translate(-x,-O),v.drawImage(P,0,0,m,w,0,0,m,w);v.restore(),b.save();var j=(0,i.default)(l),I=j.red,S=j.green,E=j.blue;b.fillStyle="rgba("+I+", "+S+", "+E+", "+c+")",b.fillRect(0,0,g.width,g.height),b.translate(x,O),b.translate(-x,-O),b.drawImage(C,0,0),b.restore()}},{key:"draw",value:function(e,t,r){var n=this.props,a=n.wavelength,o=n.sizing,i=n.shape,u=n.colors,l=this.canvas,c=l.width/2,f=l.height/2,p=u[Math.floor(Math.random()*u.length-1)+0],d=t/2e3;e.save(),e.translate(c,f),e.rotate(d),e.fillStyle=p;var h=a,g=o/10*((1+Math.sin(t/911*h))*c*.3+(1+Math.cos(t/701*h))*c*.2+(1+Math.sin(t/503*h))*c*.1),b=Math.sin(t/(r+787)*h)*c*.37,v=Math.sin(t/(r+997)*h)*f*.13;s.default[i](e,b,v,g),e.fill(),e.restore()}},{key:"isValidHex",value:function(e){return(0,u.isValidHex)(e)}},{key:"render",value:function(){var e=this;return a.default.createElement("canvas",{ref:function(t){e.canvas=t}})}}]),t}();c.defaultProps={width:200,height:200,mirrors:3,zoom:.2,rotation:.3,fade:1,opacity:.3,amount:16,spacing:20,wavelength:2,sizing:4,shape:"circle",backgroundColor:"#fff",backgroundOpacity:.3,colors:[]},c.propTypes={colors:o.default.array,width:o.default.number,height:o.default.number,mirrors:o.default.number,zoom:o.default.number,rotation:o.default.number,fade:o.default.number,opacity:o.default.number,amount:o.default.number,spacing:o.default.number,wavelength:o.default.number,sizing:o.default.number,shape:o.default.string,backgroundColor:o.default.string,backgroundOpacity:o.default.number},t.default=c},function(e,t){e.exports=require("react")},function(e,t,r){e.exports=r(3)()},function(e,t,r){"use strict";var n=r(4);function a(){}e.exports=function(){function e(e,t,r,a,o,i){if(i!==n){var s=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw s.name="Invariant Violation",s}}function t(){return e}e.isRequired=e;var r={array:e,bool:e,func:e,number:e,object:e,string:e,symbol:e,any:e,arrayOf:t,element:e,instanceOf:t,node:e,objectOf:t,oneOf:t,oneOfType:t,shape:t,exact:t};return r.checkPropTypes=a,r.PropTypes=r,r}},function(e,t,r){"use strict";e.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"},function(e,t,r){"use strict";const n=new RegExp("[^#a-f\\d]","gi"),a=new RegExp("^#?[a-f\\d]{3}[a-f\\d]?$|^#?[a-f\\d]{6}([a-f\\d]{2})?$","i");e.exports=function(e,t={}){if("string"!=typeof e||n.test(e)||!a.test(e))throw new TypeError("Expected a valid hex string");let r=255;8===(e=e.replace(/^#/,"")).length&&(r=parseInt(e.slice(6,8),16)/255,e=e.substring(0,6)),4===e.length&&(r=parseInt(e.slice(3,4).repeat(2),16)/255,e=e.substring(0,3)),3===e.length&&(e=e[0]+e[0]+e[1]+e[1]+e[2]+e[2]);const o=parseInt(e,16),i=o>>16,s=o>>8&255,u=255&o;return"array"===t.format?[i,s,u,r]:{red:i,green:s,blue:u,alpha:r}}},function(e,t,r){"use strict";Object.defineProperty(t,"__esModule",{value:!0});t.default={circle:function(e,t,r,n){var a=2*Math.PI;n=Math.abs(n),e.save(),e.beginPath(),e.arc(t,r,n,0,a),e.restore()},triangle:function(e,t,r,n){e.save(),e.translate(t,r),e.beginPath(),e.moveTo(0,n),e.lineTo(n/2,0),e.lineTo(-n/2,0),e.lineTo(0,n),e.restore()},square:function(e,t,r,n){e.save(),e.translate(t,r),e.beginPath(),e.moveTo(0,n),e.lineTo(n,n),e.lineTo(n,0),e.lineTo(0,0),e.lineTo(0,n),e.restore()}}},function(e,t,r){"use strict";e.exports={isValidHex:function(e){if(!e||"string"!=typeof e)return!1;switch("#"===e.substring(0,1)&&(e=e.substring(1)),e.length){case 3:return/^[0-9A-F]{3}$/i.test(e);case 6:return/^[0-9A-F]{6}$/i.test(e);case 8:return/^[0-9A-F]{8}$/i.test(e);default:return!1}}}}]);

package.json

 {
   "name": "react-avatar-generator",
-  "version": "0.0.1",
+  "version": "1.0.0",
   "description": "React component which allows your users to generate random kaleidoscope avatars.",
@@ -9,2 +9,5 @@ "main": "build/index.js",
   },
+  "repository": {
+    "url": "https://github.com/JosephSmith127/react-avatar-generator"
+  },
   "dependencies": {
@@ -11,0 +14,0 @@ "hex-rgb": "^3.0.0",

README.md

@@ -48,2 +48,3 @@ # React Avatar Generator
 | isValidHex          | function           | Passing in a string will return true of false if that string is a valid hex, a helpful function to have when working with colors             |
+| getImageData          | function           | Calling this function returns the raw image/png data you can then use to save into a .png file.             |
 
@@ -50,0 +51,0 @@ ## Using Methods

src/index.js

@@ -31,2 +31,8 @@ import React from 'react';
 
+  getImageData() {
+    const { canvas } = this;
+    const dataURL = canvas.toDataURL('image/png');
+    return dataURL;
+  }
+
   collectCanvasSettings() {
@@ -33,0 +39,0 @@ const { canvas } = this;

Fixed alerts

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No repository

Supply chain risk

Package does not have a linked source code repository. Without this field, a package will have no reference to the location of the source code use to generate the package.

Found 1 instance in 1 package

No v1

Quality

Package is not semver >=1. This means it is not stable and does not support ^ ranges.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

178259

increased by0.26%

Lines of code

304

increased by1.67%

Number of low maintenance alerts

1

decreased by-50%

Number of low quality alerts

2

decreased by-50%

Number of lines in readme file

79

increased by1.28%

Number of low supply chain risk alerts

0

decreased by-100%

No dependency changes