Fix #204, fix #515 - URL truncating is now a style so copypasting is not

affected, replaced onClick handler with onMouseUp/Down to detect text
selection not trigger onClick handler then
master
Eugen Rochko 7 years ago
parent b06a375ee4
commit 80cefd5b3c
  1. 27
      app/assets/javascripts/components/components/status_content.jsx
  2. 11
      app/assets/stylesheets/components.scss
  3. 7
      app/lib/formatter.rb
  4. 2
      spec/lib/formatter_spec.rb

@ -56,12 +56,35 @@ const StatusContent = React.createClass({
e.stopPropagation();
},
handleMouseDown (e) {
this.startXY = [e.clientX, e.clientY];
},
handleMouseUp (e) {
const [ startX, startY ] = this.startXY;
const [ deltaX, deltaY ] = [Math.abs(e.clientX - startX), Math.abs(e.clientY - startY)];
if (deltaX + deltaY < 5) {
this.props.onClick();
}
this.startXY = null;
},
render () {
const { status, onClick } = this.props;
const { status } = this.props;
const content = { __html: emojify(status.get('content')) };
return <div className='status__content' style={{ cursor: 'pointer' }} dangerouslySetInnerHTML={content} onClick={onClick} />;
return (
<div
className='status__content'
style={{ cursor: 'pointer' }}
dangerouslySetInnerHTML={content}
onMouseDown={this.handleMouseDown}
onMouseUp={this.handleMouseUp}
/>
);
},
});

@ -60,6 +60,17 @@
}
}
.invisible {
font-size: 0;
line-height: 0;
}
.ellipsis {
&:after {
content: "";
}
}
.lightbox .icon-button {
color: $color1;
}

@ -65,8 +65,11 @@ class Formatter
end
def link_html(url)
link_text = truncate(url.gsub(/\Ahttps?:\/\/(www\.)?/, ''), length: 30)
"<a rel=\"nofollow noopener\" target=\"_blank\" href=\"#{url}\">#{link_text}</a>"
prefix = url.match(/\Ahttps?:\/\/(www\.)?/).to_s
text = url[prefix.length, 30]
suffix = url[prefix.length + 30..-1]
"<a rel=\"nofollow noopener\" target=\"_blank\" href=\"#{url}\"><span class=\"invisible\">#{prefix}</span><span class=\"ellipsis\">#{text}</span><span class=\"invisible\">#{suffix}</span></a>"
end
def hashtag_html(match)

@ -17,7 +17,7 @@ RSpec.describe Formatter do
end
it 'contains a link' do
expect(subject).to match('<a rel="nofollow noopener" target="_blank" href="http://google.com">google.com</a>')
expect(subject).to match('<a rel="nofollow noopener" target="_blank" href="http://google.com"><span class="invisible">http://</span><span class="ellipsis">google.com</span><span class="invisible"></span></a>')
end
end

Loading…
Cancel
Save