|
|
@ -75,35 +75,38 @@ export default class StatusContent extends React.PureComponent { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
_updateStatusEmojis () { |
|
|
|
const node = this.node; |
|
|
|
|
|
|
|
if (!node || autoPlayGif) { |
|
|
|
handleMouseEnter = ({ currentTarget }) => { |
|
|
|
if (autoPlayGif) { |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
const emojis = node.querySelectorAll('.custom-emoji'); |
|
|
|
const emojis = currentTarget.querySelectorAll('.custom-emoji'); |
|
|
|
|
|
|
|
for (var i = 0; i < emojis.length; i++) { |
|
|
|
let emoji = emojis[i]; |
|
|
|
if (emoji.classList.contains('status-emoji')) { |
|
|
|
continue; |
|
|
|
} |
|
|
|
emoji.classList.add('status-emoji'); |
|
|
|
emoji.src = emoji.getAttribute('data-original'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
handleMouseLeave = ({ currentTarget }) => { |
|
|
|
if (autoPlayGif) { |
|
|
|
return; |
|
|
|
} |
|
|
|
|
|
|
|
const emojis = currentTarget.querySelectorAll('.custom-emoji'); |
|
|
|
|
|
|
|
emoji.addEventListener('mouseenter', this.handleEmojiMouseEnter, false); |
|
|
|
emoji.addEventListener('mouseleave', this.handleEmojiMouseLeave, false); |
|
|
|
for (var i = 0; i < emojis.length; i++) { |
|
|
|
let emoji = emojis[i]; |
|
|
|
emoji.src = emoji.getAttribute('data-static'); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
componentDidMount () { |
|
|
|
this._updateStatusLinks(); |
|
|
|
this._updateStatusEmojis(); |
|
|
|
} |
|
|
|
|
|
|
|
componentDidUpdate () { |
|
|
|
this._updateStatusLinks(); |
|
|
|
this._updateStatusEmojis(); |
|
|
|
} |
|
|
|
|
|
|
|
onMentionClick = (mention, e) => { |
|
|
@ -122,14 +125,6 @@ export default class StatusContent extends React.PureComponent { |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
handleEmojiMouseEnter = ({ target }) => { |
|
|
|
target.src = target.getAttribute('data-original'); |
|
|
|
} |
|
|
|
|
|
|
|
handleEmojiMouseLeave = ({ target }) => { |
|
|
|
target.src = target.getAttribute('data-static'); |
|
|
|
} |
|
|
|
|
|
|
|
handleMouseDown = (e) => { |
|
|
|
this.startXY = [e.clientX, e.clientY]; |
|
|
|
} |
|
|
@ -219,7 +214,7 @@ export default class StatusContent extends React.PureComponent { |
|
|
|
} |
|
|
|
|
|
|
|
return ( |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0' onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp}> |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0' onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp} onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}> |
|
|
|
<p style={{ marginBottom: hidden && status.get('mentions').isEmpty() ? '0px' : null }}> |
|
|
|
<span dangerouslySetInnerHTML={spoilerContent} className='translate' /> |
|
|
|
{' '} |
|
|
@ -237,7 +232,7 @@ export default class StatusContent extends React.PureComponent { |
|
|
|
); |
|
|
|
} else if (this.props.onClick) { |
|
|
|
const output = [ |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0' onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp} key='status-content'> |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0' onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp} key='status-content' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}> |
|
|
|
<div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} /> |
|
|
|
|
|
|
|
{!!status.get('poll') && <PollContainer pollId={status.get('poll')} />} |
|
|
@ -253,7 +248,7 @@ export default class StatusContent extends React.PureComponent { |
|
|
|
return output; |
|
|
|
} else { |
|
|
|
return ( |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0'> |
|
|
|
<div className={classNames} ref={this.setRef} tabIndex='0' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave}> |
|
|
|
<div className='status__content__text status__content__text--visible translate' dangerouslySetInnerHTML={content} /> |
|
|
|
|
|
|
|
{!!status.get('poll') && <PollContainer pollId={status.get('poll')} />} |
|
|
|