mastofe

commit: 1c17b932fe85680ee65e53c09351adb353840235
parent: 82fd74d101838396fc6462d15106624294b78868
Author: Eugen Rochko <eugen@zeonfederated.com>
Date:   Thu, 10 Nov 2016 23:30:42 +0100

Enable emojis in reply indicator as well

Diffstat:
M
app/assets/javascripts/components/components/display_name.jsx
2
+-
M
app/assets/javascripts/components/components/status.jsx
2
--
M
app/assets/javascripts/components/features/ui/components/reply_indicator.jsx
28
++++++++++++++++++++++------

3 files changed, 23 insertions(+), 9 deletions(-)
diff --git a/app/assets/javascripts/components/components/display_name.jsx b/app/assets/javascripts/components/components/display_name.jsx
@@ -1,5 +1,5 @@
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import PureRenderMixin    from 'react-addons-pure-render-mixin';
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 
 const DisplayName = React.createClass({
 
diff --git a/app/assets/javascripts/components/components/status.jsx b/app/assets/javascripts/components/components/status.jsx
@@ -38,8 +38,6 @@ const Status = React.createClass({
       e.preventDefault();
       this.context.router.push(`/accounts/${id}`);
     }
-
-    e.stopPropagation();
   },
 
   render () {
diff --git a/app/assets/javascripts/components/features/ui/components/reply_indicator.jsx b/app/assets/javascripts/components/features/ui/components/reply_indicator.jsx
@@ -1,11 +1,20 @@
-import PureRenderMixin    from 'react-addons-pure-render-mixin';
+import PureRenderMixin from 'react-addons-pure-render-mixin';
 import ImmutablePropTypes from 'react-immutable-proptypes';
-import Avatar             from '../../../components/avatar';
-import IconButton         from '../../../components/icon_button';
-import DisplayName        from '../../../components/display_name';
+import Avatar from '../../../components/avatar';
+import IconButton from '../../../components/icon_button';
+import DisplayName from '../../../components/display_name';
+import emojione from 'emojione';
+
+emojione.imageType = 'png';
+emojione.sprites = false;
+emojione.imagePathPNG = '/emoji/';
 
 const ReplyIndicator = React.createClass({
 
+  contextTypes: {
+    router: React.PropTypes.object
+  },
+
   propTypes: {
     status: ImmutablePropTypes.map.isRequired,
     onCancel: React.PropTypes.func.isRequired
@@ -17,15 +26,22 @@ const ReplyIndicator = React.createClass({
     this.props.onCancel();
   },
 
+  handleAccountClick (e) {
+    if (e.button === 0) {
+      e.preventDefault();
+      this.context.router.push(`/accounts/${this.props.status.getIn(['account', 'id'])}`);
+    }
+  },
+
   render () {
-    let content = { __html: this.props.status.get('content') };
+    let content = { __html: emojione.unicodeToImage(this.props.status.get('content')) };
 
     return (
       <div style={{ background: '#9baec8', padding: '10px' }}>
         <div style={{ overflow: 'hidden', marginBottom: '5px' }}>
           <div style={{ float: 'right', lineHeight: '24px' }}><IconButton title='Cancel' icon='times' onClick={this.handleClick} /></div>
 
-          <a href={this.props.status.getIn(['account', 'url'])} className='reply-indicator__display-name' style={{ display: 'block', maxWidth: '100%', paddingRight: '25px', color: '#282c37', textDecoration: 'none', overflow: 'hidden', lineHeight: '24px' }}>
+          <a href={this.props.status.getIn(['account', 'url'])} onClick={this.handleAccountClick} className='reply-indicator__display-name' style={{ display: 'block', maxWidth: '100%', paddingRight: '25px', color: '#282c37', textDecoration: 'none', overflow: 'hidden', lineHeight: '24px' }}>
             <div style={{ float: 'left', marginRight: '5px' }}><Avatar size={24} src={this.props.status.getIn(['account', 'avatar'])} /></div>
             <DisplayName account={this.props.status.get('account')} />
           </a>