Account notes (bios) can now contain links. Character limit upped to 160

This commit is contained in:
Eugen Rochko 2016-11-07 01:14:12 +01:00
parent b835f4aa1c
commit 23fc424b7a
6 changed files with 42 additions and 7 deletions

View file

@ -24,6 +24,8 @@ const Header = React.createClass({
info = <span style={{ position: 'absolute', top: '10px', right: '10px', opacity: '0.7', display: 'inline-block', verticalAlign: 'top', background: 'rgba(0, 0, 0, 0.4)', color: '#fff', textTransform: 'uppercase', fontSize: '11px', fontWeight: '500', padding: '4px', borderRadius: '4px' }}>Follows you</span> info = <span style={{ position: 'absolute', top: '10px', right: '10px', opacity: '0.7', display: 'inline-block', verticalAlign: 'top', background: 'rgba(0, 0, 0, 0.4)', color: '#fff', textTransform: 'uppercase', fontSize: '11px', fontWeight: '500', padding: '4px', borderRadius: '4px' }}>Follows you</span>
} }
const content = { __html: account.get('note') };
return ( return (
<div style={{ flex: '0 0 auto', background: '#2f3441', textAlign: 'center', backgroundImage: `url(${account.get('header')})`, backgroundSize: 'cover', position: 'relative' }}> <div style={{ flex: '0 0 auto', background: '#2f3441', textAlign: 'center', backgroundImage: `url(${account.get('header')})`, backgroundSize: 'cover', position: 'relative' }}>
<div style={{ background: 'rgba(47, 52, 65, 0.8)', padding: '20px 10px' }}> <div style={{ background: 'rgba(47, 52, 65, 0.8)', padding: '20px 10px' }}>
@ -36,7 +38,7 @@ const Header = React.createClass({
</a> </a>
<span style={{ fontSize: '14px', fontWeight: '400', display: 'block', color: '#2b90d9', marginBottom: '10px' }}>@{account.get('acct')}</span> <span style={{ fontSize: '14px', fontWeight: '400', display: 'block', color: '#2b90d9', marginBottom: '10px' }}>@{account.get('acct')}</span>
<p style={{ color: '#616b86', fontSize: '14px' }}>{account.get('note')}</p> <div style={{ color: '#616b86', fontSize: '14px' }} className='account__header__content' dangerouslySetInnerHTML={content} />
{info} {info}
</div> </div>

View file

@ -118,6 +118,29 @@
} }
} }
.account__header__content {
word-wrap: break-word;
font-weight: 300;
overflow: hidden;
p {
margin-bottom: 20px;
&:last-child {
margin-bottom: 0;
}
}
a {
color: inherit;
text-decoration: underline;
&:hover {
text-decoration: none;
}
}
}
.status__display-name, .status__relative-time, .detailed-status__display-name, .detailed-status__datetime, .account__display-name { .status__display-name, .status__relative-time, .detailed-status__display-name, .detailed-status__datetime, .account__display-name {
text-decoration: none; text-decoration: none;
} }

View file

@ -8,7 +8,7 @@ class Formatter
include ActionView::Helpers::SanitizeHelper include ActionView::Helpers::SanitizeHelper
def format(status) def format(status)
return reformat(status) unless status.local? return reformat(status.content) unless status.local?
html = status.text html = status.text
html = encode(html) html = encode(html)
@ -20,8 +20,17 @@ class Formatter
html.html_safe html.html_safe
end end
def reformat(status) def reformat(html)
sanitize(status.content, tags: %w(a br p), attributes: %w(href rel)) sanitize(html, tags: %w(a br p), attributes: %w(href rel))
end
def simplified_format(account)
return reformat(account.note) unless account.local?
html = encode(account.note)
html = link_urls(html)
html.html_safe
end end
private private

View file

@ -21,7 +21,7 @@ class Account < ApplicationRecord
# Local user profile validations # Local user profile validations
validates :display_name, length: { maximum: 30 }, if: 'local?' validates :display_name, length: { maximum: 30 }, if: 'local?'
validates :note, length: { maximum: 124 }, if: 'local?' validates :note, length: { maximum: 160 }, if: 'local?'
# Timelines # Timelines
has_many :stream_entries, inverse_of: :account, dependent: :destroy has_many :stream_entries, inverse_of: :account, dependent: :destroy

View file

@ -12,7 +12,7 @@
%small= "@#{@account.username}" %small= "@#{@account.username}"
.details .details
.bio .bio
%p= @account.note .account__header__content= Formatter.instance.simplified_format(@account)
.details-counters .details-counters
.counter{ class: active_nav_class(account_url(@account)) } .counter{ class: active_nav_class(account_url(@account)) }

View file

@ -1,7 +1,8 @@
object @account object @account
attributes :id, :username, :acct, :display_name, :note attributes :id, :username, :acct, :display_name
node(:note) { |account| Formatter.instance.simplified_format(account) }
node(:url) { |account| TagManager.instance.url_for(account) } node(:url) { |account| TagManager.instance.url_for(account) }
node(:avatar) { |account| full_asset_url(account.avatar.url(:large, false)) } node(:avatar) { |account| full_asset_url(account.avatar.url(:large, false)) }
node(:header) { |account| full_asset_url(account.header.url(:medium, false)) } node(:header) { |account| full_asset_url(account.header.url(:medium, false)) }