2017-02-28 21:32:23 +00:00
|
|
|
import React, {PureComponent, PropTypes} from 'react';
|
2016-10-21 17:20:36 +00:00
|
|
|
import crypto from 'crypto';
|
|
|
|
|
2017-02-28 21:32:23 +00:00
|
|
|
class GravatarImg extends PureComponent {
|
2016-10-21 17:20:36 +00:00
|
|
|
render () {
|
2017-03-28 22:45:23 +00:00
|
|
|
const {email, size: rawSize, className} = this.props;
|
|
|
|
const size = rawSize || 100;
|
2016-10-21 17:20:36 +00:00
|
|
|
const sanitizedEmail = email.trim().toLowerCase();
|
|
|
|
const hash = crypto
|
|
|
|
.createHash('md5')
|
|
|
|
.update(sanitizedEmail)
|
|
|
|
.digest('hex');
|
|
|
|
const url = `https://www.gravatar.com/avatar/${hash}?s=${size * 2}`;
|
|
|
|
const cssSize = `${size}px`;
|
|
|
|
return (
|
|
|
|
<img src={url}
|
|
|
|
alt="Profile picture"
|
|
|
|
className={className}
|
|
|
|
title={sanitizedEmail}
|
|
|
|
style={{width: cssSize, height: cssSize}}/>
|
2017-03-03 20:09:08 +00:00
|
|
|
);
|
2016-10-21 17:20:36 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
GravatarImg.propTypes = {
|
2017-03-08 05:52:17 +00:00
|
|
|
// Required
|
2016-10-21 17:20:36 +00:00
|
|
|
email: PropTypes.string.isRequired,
|
2017-03-08 05:52:17 +00:00
|
|
|
|
|
|
|
// Optional
|
|
|
|
size: PropTypes.number,
|
|
|
|
className: PropTypes.string
|
2016-10-21 17:20:36 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
export default GravatarImg;
|