Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
avatar-initials
Advanced tools
avatar-initials - npm Package Compare versions
Comparing version 3.0.2 to 4.0.0
@@ -1,14 +0,66 @@ | ||
| 'use strict'; | ||
| function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; } | ||
| var md5 = _interopDefault(require('md5')); | ||
| function _interopDefault(ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex.default : ex; } | ||
| var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); | ||
| const md5 = _interopDefault(require('md5')); | ||
| function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } | ||
| function _classCallCheck(instance, Constructor) { | ||
| if (!(instance instanceof Constructor)) { | ||
| throw new TypeError('Cannot call a class as a function'); | ||
| } | ||
| } | ||
| var Avatar = function () { | ||
| function _defineProperties(target, props) { | ||
| for (let i = 0; i < props.length; i++) { | ||
| const descriptor = props[i]; | ||
| descriptor.enumerable = descriptor.enumerable || false; | ||
| descriptor.configurable = true; | ||
| if ('value' in descriptor) descriptor.writable = true; | ||
| Object.defineProperty(target, descriptor.key, descriptor); | ||
| } | ||
| } | ||
| function _createClass(Constructor, protoProps, staticProps) { | ||
| if (protoProps) _defineProperties(Constructor.prototype, protoProps); | ||
| if (staticProps) _defineProperties(Constructor, staticProps); | ||
| return Constructor; | ||
| } | ||
| function _defineProperty(obj, key, value) { | ||
| if (key in obj) { | ||
| Object.defineProperty(obj, key, { | ||
| value, | ||
| enumerable: true, | ||
| configurable: true, | ||
| writable: true, | ||
| }); | ||
| } else { | ||
| obj[key] = value; | ||
| } | ||
| return obj; | ||
| } | ||
| function _objectSpread(target) { | ||
| for (let i = 1; i < arguments.length; i++) { | ||
| var source = arguments[i] != null ? arguments[i] : {}; | ||
| let ownKeys = Object.keys(source); | ||
| /* istanbul ignore next */ | ||
| if (typeof Object.getOwnPropertySymbols === 'function') { | ||
| ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(sym => Object.getOwnPropertyDescriptor(source, sym).enumerable)); | ||
| } | ||
| ownKeys.forEach((key) => { | ||
| _defineProperty(target, key, source[key]); | ||
| }); | ||
| } | ||
| return target; | ||
| } | ||
| const Avatar = | ||
| /* #__PURE__ */ | ||
| (function () { | ||
| function Avatar(element) { | ||
| var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
| const options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
@@ -22,3 +74,3 @@ _classCallCheck(this, Avatar); | ||
| this.element = element; | ||
| this.settings = Object.assign({ | ||
| this.settings = _objectSpread({ | ||
| useGravatar: true, | ||
@@ -47,7 +99,7 @@ allowGravatarFallback: false, | ||
| instagram: null, | ||
| size: 'medium' | ||
| } | ||
| size: 'medium', | ||
| }, | ||
| }, options); | ||
| let source = this.settings.fallbackImage; | ||
| var source = this.settings.fallbackImage; | ||
| if (this.settings.useGravatar && this.settings.allowGravatarFallback) { | ||
@@ -66,3 +118,2 @@ source = Avatar.gravatarUrl(this.settings); | ||
| this.setSource(source); | ||
| return this; | ||
@@ -77,19 +128,20 @@ } | ||
| } | ||
| if (source) { | ||
| this.element.src = source; | ||
| } | ||
| } | ||
| }, | ||
| }, { | ||
| key: 'initialAvatar', | ||
| value: function initialAvatar() { | ||
| var canvas = document.createElement('canvas'); | ||
| var width = this.element.width || this.settings.size; | ||
| var height = this.element.height || this.settings.size; | ||
| var devicePixelRatio = Math.max(window.devicePixelRatio, 1); | ||
| const canvas = document.createElement('canvas'); | ||
| const width = this.element.width || this.settings.size; | ||
| const height = this.element.height || this.settings.size; | ||
| const devicePixelRatio = Math.max(window.devicePixelRatio, 1); | ||
| canvas.width = width * devicePixelRatio; | ||
| canvas.height = height * devicePixelRatio; | ||
| canvas.style.width = width + 'px'; | ||
| canvas.style.height = height + 'px'; | ||
| canvas.style.width = ''.concat(width, 'px'); | ||
| canvas.style.height = ''.concat(height, 'px'); | ||
| const context = canvas.getContext('2d'); | ||
| var context = canvas.getContext('2d'); | ||
| if (context) { | ||
@@ -100,3 +152,3 @@ context.scale(devicePixelRatio, devicePixelRatio); | ||
| context.fill(); | ||
| context.font = this.settings.initial_weight + ' ' + (this.settings.initial_size || height / 2) + 'px ' + this.settings.initial_font_family; | ||
| context.font = ''.concat(this.settings.initial_weight, ' ').concat(this.settings.initial_size || height / 2, 'px ').concat(this.settings.initial_font_family); | ||
| context.textAlign = 'center'; | ||
@@ -109,3 +161,3 @@ context.textBaseline = 'middle'; | ||
| return canvas.toDataURL('image/png') || 'data:'; | ||
| } | ||
| }, | ||
| }, { | ||
@@ -117,14 +169,18 @@ key: 'gravatarValid', | ||
| } | ||
| var image_source = void 0; | ||
| let image_source; | ||
| if (this.settings.email) { | ||
| image_source = 'https://secure.gravatar.com/avatar/' + md5(this.settings.email) + '?d=404'; | ||
| image_source = 'https://secure.gravatar.com/avatar/'.concat(md5(this.settings.email), '?d=404'); | ||
| } | ||
| if (this.settings.hash) { | ||
| image_source = 'https://secure.gravatar.com/avatar/' + this.settings.hash + '?d=404'; | ||
| image_source = 'https://secure.gravatar.com/avatar/'.concat(this.settings.hash, '?d=404'); | ||
| } | ||
| var image = new Image(); | ||
| const image = new Image(); | ||
| image.onload = this.gravatarValidOnLoad.bind(this); | ||
| image.onerror = this.gravatarValidOnError.bind(this); | ||
| image.src = image_source; | ||
| } | ||
| }, | ||
| }, { | ||
@@ -134,3 +190,3 @@ key: 'gravatarValidOnLoad', | ||
| this.setSource(Avatar.gravatarUrl(this.settings)); | ||
| } | ||
| }, | ||
| }, { | ||
@@ -143,39 +199,39 @@ key: 'gravatarValidOnError', | ||
| } | ||
| this.setSource(this.settings.fallbackImage); | ||
| } | ||
| }, | ||
| }], [{ | ||
| key: 'gravatarUrl', | ||
| value: function gravatarUrl() { | ||
| var settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| const settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| const size = settings.size >= 1 && settings.size <= 2048 ? settings.size : 80; | ||
| let email_or_hash = settings.hash || settings.email; | ||
| var size = settings.size >= 1 && settings.size <= 2048 ? settings.size : 80; | ||
| var email_or_hash = settings.hash || settings.email; | ||
| if (!email_or_hash || typeof email_or_hash !== 'string') { | ||
| email_or_hash = '00000000000000000000000000000000'; | ||
| } | ||
| email_or_hash = email_or_hash.toLowerCase().trim(); | ||
| var hash = email_or_hash.match(/@/g) !== null ? md5(email_or_hash) : email_or_hash; | ||
| var fallback = settings.fallback ? encodeURIComponent(settings.fallback) : 'mm'; | ||
| var rating = settings.rating || 'x'; | ||
| var forcedefault = settings.forcedefault ? '&f=y' : ''; | ||
| return 'https://secure.gravatar.com/avatar/' + hash + '?s=' + size + '&d=' + fallback + '&r=' + rating + forcedefault; | ||
| } | ||
| const hash = email_or_hash.match(/@/g) !== null ? md5(email_or_hash) : email_or_hash; | ||
| const fallback = settings.fallback ? encodeURIComponent(settings.fallback) : 'mm'; | ||
| const rating = settings.rating || 'x'; | ||
| const forcedefault = settings.forcedefault ? '&f=y' : ''; | ||
| return 'https://secure.gravatar.com/avatar/'.concat(hash, '?s=').concat(size, '&d=').concat(fallback, '&r=').concat(rating) | ||
| .concat(forcedefault); | ||
| }, | ||
| }, { | ||
| key: 'githubAvatar', | ||
| value: function githubAvatar() { | ||
| var settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| var cdn_min = 0; | ||
| var cdn_max = 3; | ||
| var cdn = Math.floor(Math.random() * (cdn_max - (cdn_min + 1))) + cdn_min; | ||
| return 'https://avatars' + cdn + '.githubusercontent.com/u/' + (settings.github_id || 0) + '?v=3&s=' + (settings.size || 80); | ||
| } | ||
| const settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| const cdn_min = 0; | ||
| const cdn_max = 3; | ||
| const cdn = Math.floor(Math.random() * (cdn_max - (cdn_min + 1))) + cdn_min; | ||
| return 'https://avatars'.concat(cdn, '.githubusercontent.com/u/').concat(settings.github_id || 0, '?v=3&s=').concat(settings.size || 80); | ||
| }, | ||
| }, { | ||
| key: 'avatarsioAvatar', | ||
| value: function avatarsioAvatar() { | ||
| var settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| const settings = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; | ||
| let avatars_io_url = 'https://avatars.io/'; | ||
| var avatars_io_url = 'https://avatars.io/'; | ||
| if (!settings.avatars_io) { | ||
@@ -185,19 +241,22 @@ return avatars_io_url; | ||
| /* istanbul ignore else */ | ||
| if (settings.avatars_io.user_id && settings.avatars_io.identifier) { | ||
| avatars_io_url += settings.avatars_io.user_id + '/' + settings.avatars_io.identifier; | ||
| avatars_io_url += ''.concat(settings.avatars_io.user_id, '/').concat(settings.avatars_io.identifier); | ||
| } else if (settings.avatars_io.twitter) { | ||
| avatars_io_url += 'twitter/' + settings.avatars_io.twitter; | ||
| avatars_io_url += 'twitter/'.concat(settings.avatars_io.twitter); | ||
| } else if (settings.avatars_io.facebook) { | ||
| avatars_io_url += 'facebook/' + settings.avatars_io.facebook; | ||
| avatars_io_url += 'facebook/'.concat(settings.avatars_io.facebook); | ||
| } else if (settings.avatars_io.instagram) { | ||
| avatars_io_url += 'instagram/' + settings.avatars_io.instagram; | ||
| avatars_io_url += 'instagram/'.concat(settings.avatars_io.instagram); | ||
| } | ||
| avatars_io_url += '?size=' + settings.avatars_io.size; | ||
| avatars_io_url += '?size='.concat(settings.avatars_io.size); | ||
| return avatars_io_url; | ||
| } | ||
| }, | ||
| }]); | ||
| return Avatar; | ||
| }(); | ||
| }()); | ||
| module.exports = Avatar; |
@@ -0,1 +1,10 @@ | ||
| ## 4.0.0 (May 13th, 2018) | ||
| * Update dependencies. | ||
| * Use Babel 7 with `@babel/preset-env` targeting `last 2 versions", "ie 11"` | ||
| * Use Object Spread instead of `Object.assign` | ||
| * Remove Leakages tests | ||
| * Add `module` and `jsnext:main` to the `package.json` | ||
| * Remove Code Climate | ||
| ## 3.0.2 (April 2nd, 2018) | ||
@@ -2,0 +11,0 @@ |
| { | ||
| "name": "avatar-initials", | ||
| "version": "3.0.2", | ||
| "version": "4.0.0", | ||
| "description": "JavaScript library for showing Gravatars or generating user avatars from initials.", | ||
@@ -23,2 +23,4 @@ "author": "Matthew Callis <matthew.callis@gmail.com>", | ||
| ], | ||
| "module": "src/avatar.js", | ||
| "jsnext:main": "src/avatar.js", | ||
| "homepage": "http://matthewcallis.github.io/avatar/", | ||
@@ -42,29 +44,27 @@ "repository": { | ||
| "devDependencies": { | ||
| "ava": "^0.25.0", | ||
| "babel-cli": "^6.24.1", | ||
| "babel-plugin-external-helpers": "^6.22.0", | ||
| "babel-preset-es2015": "^6.24.1", | ||
| "babel-preset-es2016": "^6.24.1", | ||
| "babel-register": "^6.24.1", | ||
| "@babel/cli": "7.0.0-beta.44", | ||
| "@babel/core": "7.0.0-beta.44", | ||
| "@babel/plugin-proposal-object-rest-spread": "7.0.0-beta.44", | ||
| "@babel/polyfill": "7.0.0-beta.44", | ||
| "@babel/preset-env": "7.0.0-beta.44", | ||
| "ava": "^1.0.0-beta.4", | ||
| "browser-env": "^3.2.5", | ||
| "canvas-prebuilt": "^1.6.5-prerelease.1", | ||
| "codeclimate-test-reporter": "^0.5.0", | ||
| "coveralls": "^3.0.0", | ||
| "canvas-prebuilt": "2.0.0-alpha.2", | ||
| "coveralls": "^3.0.1", | ||
| "eslint": "^4.19.1", | ||
| "eslint-config-airbnb": "^16.1.0", | ||
| "eslint-plugin-ava": "^4.5.1", | ||
| "eslint-plugin-import": "^2.10.0", | ||
| "eslint-plugin-import": "^2.11.0", | ||
| "eslint-plugin-jsx-a11y": "^6.0.3", | ||
| "eslint-plugin-no-inferred-method-name": "^1.0.2", | ||
| "eslint-plugin-react": "^7.7.0", | ||
| "eslint-plugin-react": "^7.8.2", | ||
| "eslint-plugin-xss": "^0.1.9", | ||
| "leakage": "^0.3.0", | ||
| "nock": "^9.2.3", | ||
| "nock": "^9.2.5", | ||
| "npm-bump": "^0.0.23", | ||
| "nyc": "^11.6.0", | ||
| "nyc": "^11.7.3", | ||
| "precommit-hook-eslint": "^3.0.0", | ||
| "rollup": "^0.57.1", | ||
| "rollup-plugin-babel": "^3.0.3", | ||
| "rollup-plugin-json": "^2.1.1", | ||
| "sinon": "^4.5.0" | ||
| "rollup": "^0.58.2", | ||
| "rollup-plugin-babel": "4.0.0-beta.4", | ||
| "rollup-plugin-json": "^3.0.0", | ||
| "sinon": "^5.0.7" | ||
| }, | ||
@@ -87,3 +87,3 @@ "directories": {}, | ||
| "test-watch": "npm test -- --watch", | ||
| "test": "NODE_ENV=test nyc ava --serial", | ||
| "test": "NODE_ENV=test nyc ava", | ||
| "validate": "npm ls" | ||
@@ -96,3 +96,3 @@ }, | ||
| ], | ||
| "source": [ | ||
| "sources": [ | ||
| "src/**/*.js" | ||
@@ -105,3 +105,2 @@ ], | ||
| "require": [ | ||
| "babel-register", | ||
| "./test/setup-browser-env.js" | ||
@@ -108,0 +107,0 @@ ], |
@@ -12,3 +12,3 @@ # [Avatar](http://matthewcallis.github.io/avatar/) | ||
| Avatar is a JavaScript library for showing Gravatars or generating user avatars. | ||
| Avatar is a JavaScript library for showing [Gravatars](https://en.gravatar.com/) or generating user avatars. | ||
@@ -35,35 +35,38 @@ ## Examples | ||
| ```coffeescript | ||
| useGravatar: true # Allow Gravatars or not. | ||
| fallbackImage: '' # URL or Data URI used when no initials are provided and not using Gravatars. | ||
| size: 80 # Size in pixels, fallback for hidden images and Gravatar | ||
| ```js | ||
| { | ||
| useGravatar: true, // Allow Gravatars or not. | ||
| fallbackImage: '', // URL or Data URI used when no initials are provided and not using Gravatars. | ||
| size: 80, // Size in pixels, fallback for hidden images and Gravatar | ||
| # Initial Avatars Specific | ||
| initials: '' # Initials to be used. | ||
| initial_fg: '#888888' # Text Color | ||
| initial_bg: '#f4f6f7' # Background Color | ||
| initial_size: null # Text Size in pixels | ||
| initial_weight: 100 | ||
| initial_font_family: "'Lato', 'Lato-Regular', 'Helvetica Neue'" | ||
| // Initial Avatars Specific | ||
| initials: '', // Initials to be used. | ||
| initial_fg: '#888888', // Text Color | ||
| initial_bg: '#f4f6f7', // Background Color | ||
| initial_size: null, // Text Size in pixels | ||
| initial_weight: 100, // Font weight (numeric value for light, bold, etc.) | ||
| initial_font_family: "'Lato', 'Lato-Regular', 'Helvetica Neue'", | ||
| # Gravatar Specific | ||
| hash: null # Precalculated MD5 string of an email address | ||
| email: null # Email used for the Gravatar | ||
| fallback: 'mm' # Fallback Type | ||
| rating: 'x' # Gravatar Rating | ||
| forcedefault: false # Force Gravatar Defaults | ||
| allowGravatarFallback: false # Use Gravatars fallback, not fallbackImage | ||
| // Gravatar Specific | ||
| hash: null, // Precalculated MD5 string of an email address | ||
| email: null, // Email used for the Gravatar | ||
| fallback: 'mm', // Fallback Type | ||
| rating: 'x', // Gravatar Rating | ||
| forcedefault: false, // Force Gravatar Defaults | ||
| allowGravatarFallback: false, // Use Gravatars fallback, not fallbackImage | ||
| # GitHub Specific | ||
| github_id: null # GitHub User ID. | ||
| // GitHub Specific | ||
| github_id: null, // GitHub User ID. | ||
| # Avatars.io Specific | ||
| use_avatars_io: false # Enable Avatars.io Support | ||
| avatars_io: | ||
| user_id: null # Avatars.io User ID | ||
| identifier: null # Avatars.io Avatar Identifier | ||
| twitter: null # Twitter ID or Username | ||
| facebook: null # Facebook ID or Username | ||
| instagram: null # Instagram ID or Username | ||
| size: 'medium' # Size: small, medium, large | ||
| // Avatars.io Specific | ||
| use_avatars_io: false, // Enable Avatars.io Support | ||
| avatars_io: { | ||
| user_id: null, // Avatars.io User ID | ||
| identifier: null, // Avatars.io Avatar Identifier | ||
| twitter: null, // Twitter ID or Username | ||
| facebook: null, // Facebook ID or Username | ||
| instagram: null, // Instagram ID or Username | ||
| size: 'medium', // Size: small, medium, large | ||
| } | ||
| } | ||
| ``` | ||
@@ -84,3 +87,3 @@ | ||
| Avatar expects a `window.md5()` function to be defined in order to generate the hashes needed for Gravatar. | ||
| Avatar expects a `window.md5()` function to be defined in order to generate the hashes needed for [Gravatars](https://en.gravatar.com/). | ||
@@ -110,7 +113,7 @@ ### jQuery Support | ||
| If you used any version less than 3 and still need to use it, you can stick to v2.6.0 or use the new `build/avatar.browser.js` build. If you are using Webpack or similar the npm version should work fine. | ||
| If you used any version less than 3 and still need to use it, you can stick to v2.6.0 or use the new `build/avatar.browser.js` build. If you are using [Parcel](https://parceljs.org/) or Webpack or similar the npm version should work fine. | ||
| ## Browser Support | ||
| These are the browsers I have tested on personally: | ||
| I build with the [Babel Env Preset](https://babeljs.io/docs/plugins/preset-env/) and target `"browsers": ["last 2 versions", "ie 11"]`. If you need to support older browsers, you will need to use older versions or polyfill yourself. The ES201X versions are exposed on `module` and `jsnext:main`. Below are the browsers I have tested on personally: | ||
@@ -134,15 +137,8 @@ ### v1.2.0 | ||
| Pretty styles and design support kindly provided by [Andrew Crocker](https://github.com/andrewcrocker). | ||
| Built with love at [Apptentive](https://github.com/apptentive). | ||
| Pretty styles and design support kindly provided by [Andrew Crocker](https://twitter.com/andrewcrocker). | ||
| Originally built with love at [Apptentive](https://github.com/apptentive). | ||
| ## Package Managers | ||
| There are a lot of these and keeping up with them is hard, so here's a list: | ||
| * [npm](https://www.npmjs.com/) - [avatar-initials](https://www.npmjs.com/package/avatar-initials) - `package.json` | ||
| ### Releasing | ||
| * [npm](https://www.npmjs.com/) - `npm-bump major/minor/patch` | ||
| * [bower](http://bower.io/) - `bower info avatar` | ||
@@ -149,0 +145,0 @@ ### License |
New alerts
License Policy Violation
LicenseThis 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
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by8.29%
20794
- Dev dependency count
- decreased by-7.41%
25
- Lines of code
- increased by25.14%
224
Worsened metrics
- Number of lines in readme file
- decreased by-2.72%
143
No dependency changes