You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
50 lines
1.0 KiB
JavaScript
50 lines
1.0 KiB
JavaScript
'use strict'
|
|
const React = require('react')
|
|
const ReactDOM = require('react-dom')
|
|
const create = require('create-react-class')
|
|
const jdenticon = require('jdenticon')
|
|
|
|
jdenticon.config = {
|
|
lightness: {
|
|
color: [0.58, 0.66],
|
|
grayscale: [0.30, 0.90]
|
|
},
|
|
saturation: {
|
|
color: 0.66,
|
|
grayscale: 0.00
|
|
},
|
|
backColor: "#00000000"
|
|
};
|
|
|
|
let User = create({
|
|
displayName: "user",
|
|
|
|
getInitialState: function() {
|
|
let icon = jdenticon.toSvg(this.props.user.userId, 200)
|
|
let match = icon.match(/#([a-f0-9]{6})/g)
|
|
let color = '#ff0000'
|
|
for(let i=match.length-1; i>= 0; i--) {
|
|
color = match[i]
|
|
let r = color.substr(1, 2)
|
|
let g = color.substr(3, 2)
|
|
let b = color.substr(5, 2)
|
|
if (r != g && g != b) { // not greyscale
|
|
break
|
|
}
|
|
}
|
|
return {
|
|
color: color
|
|
}
|
|
},
|
|
|
|
render: function() {
|
|
return (
|
|
<div className="user" style={{color: this.state.color}}>
|
|
{this.props.user.displayName}
|
|
</div>
|
|
)
|
|
}
|
|
})
|
|
|
|
module.exports = User
|