diff --git a/app/assets/javascripts/components/components/status_content.jsx b/app/assets/javascripts/components/components/status_content.jsx index f2c88cee0..68224b7ba 100644 --- a/app/assets/javascripts/components/components/status_content.jsx +++ b/app/assets/javascripts/components/components/status_content.jsx @@ -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
; + return ( +
+ ); }, }); diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss index e1710580c..4a3a7df5f 100644 --- a/app/assets/stylesheets/components.scss +++ b/app/assets/stylesheets/components.scss @@ -60,6 +60,17 @@ } } +.invisible { + font-size: 0; + line-height: 0; +} + +.ellipsis { + &:after { + content: "…"; + } +} + .lightbox .icon-button { color: $color1; } diff --git a/app/lib/formatter.rb b/app/lib/formatter.rb index 3565611bc..1fa5b83fb 100644 --- a/app/lib/formatter.rb +++ b/app/lib/formatter.rb @@ -65,8 +65,11 @@ class Formatter end def link_html(url) - link_text = truncate(url.gsub(/\Ahttps?:\/\/(www\.)?/, ''), length: 30) - "#{link_text}" + prefix = url.match(/\Ahttps?:\/\/(www\.)?/).to_s + text = url[prefix.length, 30] + suffix = url[prefix.length + 30..-1] + + "#{prefix}#{text}#{suffix}" end def hashtag_html(match) diff --git a/spec/lib/formatter_spec.rb b/spec/lib/formatter_spec.rb index 7b8259fa6..6ec28f5d8 100644 --- a/spec/lib/formatter_spec.rb +++ b/spec/lib/formatter_spec.rb @@ -17,7 +17,7 @@ RSpec.describe Formatter do end it 'contains a link' do - expect(subject).to match('google.com') + expect(subject).to match('google.com') end end