about summary refs log tree commit diff
path: root/app/assets/javascripts/components
diff options
context:
space:
mode:
authorEugen Rochko <eugen@zeonfederated.com>2017-01-31 19:16:35 +0100
committerEugen Rochko <eugen@zeonfederated.com>2017-01-31 19:16:35 +0100
commit8ef79d8dc9de33975bd793587020a259ef020276 (patch)
tree39180c8f413aa5ae1d745dec25a18cbc2268cb26 /app/assets/javascripts/components
parent8b9c537d5af531e140fc42d60cba1530e4e27839 (diff)
Revert to animating avatars by default
Diffstat (limited to 'app/assets/javascripts/components')
-rw-r--r--app/assets/javascripts/components/components/avatar.jsx19
1 files changed, 17 insertions, 2 deletions
diff --git a/app/assets/javascripts/components/components/avatar.jsx b/app/assets/javascripts/components/components/avatar.jsx
index 8f407ee5f..0237a1904 100644
--- a/app/assets/javascripts/components/components/avatar.jsx
+++ b/app/assets/javascripts/components/components/avatar.jsx
@@ -91,7 +91,14 @@ const Avatar = React.createClass({
   propTypes: {
     src: React.PropTypes.string.isRequired,
     size: React.PropTypes.number.isRequired,
-    style: React.PropTypes.object
+    style: React.PropTypes.object,
+    animated: React.PropTypes.bool
+  },
+
+  getDefaultProps () {
+    return {
+      animated: true
+    };
   },
 
   getInitialState () {
@@ -129,9 +136,17 @@ const Avatar = React.createClass({
   render () {
     const { hovering } = this.state;
 
+    if (this.props.animated) {
+      return (
+        <div style={{ ...this.props.style, width: `${this.props.size}px`, height: `${this.props.size}px` }}>
+          <img src={this.props.src} width={this.props.size} height={this.props.size} alt='' style={{ borderRadius: '4px' }} />
+        </div>
+      );
+    }
+
     return (
       <div onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} style={{ ...this.props.style, width: `${this.props.size}px`, height: `${this.props.size}px`, position: 'relative' }}>
-        <img ref={this.setImageRef} crossOrigin='anonymous' onLoad={this.handleLoad} src={this.props.src} width={this.props.size} height={this.props.size} alt='' style={{ position: 'absolute', top: '0', left: '0', opacity: hovering ? '1' : '0', borderRadius: '4px' }} />
+        <img ref={this.setImageRef} onLoad={this.handleLoad} src={this.props.src} width={this.props.size} height={this.props.size} alt='' style={{ position: 'absolute', top: '0', left: '0', opacity: hovering ? '1' : '0', borderRadius: '4px' }} />
         <canvas ref={this.setCanvasRef} style={{ borderRadius: '4px', width: this.props.size, height: this.props.size, opacity: hovering ? '0' : '1' }} />
       </div>
     );