|
|
@ -9,6 +9,40 @@ import classNames from 'classnames';
|
|
|
|
import Icon from 'soapbox/components/icon';
|
|
|
|
import Icon from 'soapbox/components/icon';
|
|
|
|
import Blurhash from 'soapbox/components/blurhash';
|
|
|
|
import Blurhash from 'soapbox/components/blurhash';
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const MIMETYPE_ICONS = {
|
|
|
|
|
|
|
|
'application/x-freearc': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/x-bzip': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/x-bzip2': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/gzip': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/vnd.rar': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/x-tar': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/zip': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/x-7z-compressed': 'file-archive-o',
|
|
|
|
|
|
|
|
'application/x-csh': 'file-code-o',
|
|
|
|
|
|
|
|
'application/html': 'file-code-o',
|
|
|
|
|
|
|
|
'text/javascript': 'file-code-o',
|
|
|
|
|
|
|
|
'application/json': 'file-code-o',
|
|
|
|
|
|
|
|
'application/ld+json': 'file-code-o',
|
|
|
|
|
|
|
|
'application/x-httpd-php': 'file-code-o',
|
|
|
|
|
|
|
|
'application/x-sh': 'file-code-o',
|
|
|
|
|
|
|
|
'application/xhtml+xml': 'file-code-o',
|
|
|
|
|
|
|
|
'application/xml': 'file-code-o',
|
|
|
|
|
|
|
|
'application/epub+zip': 'file-epub-o',
|
|
|
|
|
|
|
|
'application/vnd.oasis.opendocument.spreadsheet': 'file-excel-o',
|
|
|
|
|
|
|
|
'application/vnd.ms-excel': 'file-excel-o',
|
|
|
|
|
|
|
|
'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet': 'file-excel-o',
|
|
|
|
|
|
|
|
'application/pdf': 'file-pdf-o',
|
|
|
|
|
|
|
|
'application/vnd.oasis.opendocument.presentation': 'file-powerpoint-o',
|
|
|
|
|
|
|
|
'application/vnd.ms-powerpoint': 'file-powerpoint-o',
|
|
|
|
|
|
|
|
'application/vnd.openxmlformats-officedocument.presentationml.presentation': 'file-powerpoint-o',
|
|
|
|
|
|
|
|
'text/plain': 'file-text-o',
|
|
|
|
|
|
|
|
'application/rtf': 'file-text-o',
|
|
|
|
|
|
|
|
'application/msword': 'file-word-o',
|
|
|
|
|
|
|
|
'application/x-abiword': 'file-word-o',
|
|
|
|
|
|
|
|
'application/vnd.openxmlformats-officedocument.wordprocessingml.document': 'file-word-o',
|
|
|
|
|
|
|
|
'application/vnd.oasis.opendocument.text': 'file-word-o',
|
|
|
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
|
|
const messages = defineMessages({
|
|
|
|
const messages = defineMessages({
|
|
|
|
description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
|
|
|
|
description: { id: 'upload_form.description', defaultMessage: 'Describe for the visually impaired' },
|
|
|
|
delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
|
|
|
|
delete: { id: 'upload_form.undo', defaultMessage: 'Delete' },
|
|
|
@ -100,6 +134,11 @@ class Upload extends ImmutablePureComponent {
|
|
|
|
const x = ((focusX / 2) + .5) * 100;
|
|
|
|
const x = ((focusX / 2) + .5) * 100;
|
|
|
|
const y = ((focusY / -2) + .5) * 100;
|
|
|
|
const y = ((focusY / -2) + .5) * 100;
|
|
|
|
const mediaType = media.get('type');
|
|
|
|
const mediaType = media.get('type');
|
|
|
|
|
|
|
|
const uploadIcon = mediaType === 'unknown' && (
|
|
|
|
|
|
|
|
<Icon
|
|
|
|
|
|
|
|
id={MIMETYPE_ICONS[media.getIn(['pleroma', 'mime_type'])] || 'paperclip'}
|
|
|
|
|
|
|
|
/>
|
|
|
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
<div className='compose-form__upload' tabIndex='0' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} onClick={this.handleClick} role='button'>
|
|
|
|
<div className='compose-form__upload' tabIndex='0' onMouseEnter={this.handleMouseEnter} onMouseLeave={this.handleMouseLeave} onClick={this.handleClick} role='button'>
|
|
|
@ -115,7 +154,7 @@ class Upload extends ImmutablePureComponent {
|
|
|
|
>
|
|
|
|
>
|
|
|
|
<div className={classNames('compose-form__upload__actions', { active })}>
|
|
|
|
<div className={classNames('compose-form__upload__actions', { active })}>
|
|
|
|
<button className='icon-button' onClick={this.handleUndoClick}><Icon id='times' /> <FormattedMessage id='upload_form.undo' defaultMessage='Delete' /></button>
|
|
|
|
<button className='icon-button' onClick={this.handleUndoClick}><Icon id='times' /> <FormattedMessage id='upload_form.undo' defaultMessage='Delete' /></button>
|
|
|
|
<button className='icon-button' onClick={this.handleOpenModal}><Icon id='search-plus' /> <FormattedMessage id='upload_form.preview' defaultMessage='Preview' /></button>
|
|
|
|
{mediaType !== 'unknown' && <button className='icon-button' onClick={this.handleOpenModal}><Icon id='search-plus' /> <FormattedMessage id='upload_form.preview' defaultMessage='Preview' /></button>}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<div className={classNames('compose-form__upload-description', { active })}>
|
|
|
|
<div className={classNames('compose-form__upload-description', { active })}>
|
|
|
@ -140,6 +179,7 @@ class Upload extends ImmutablePureComponent {
|
|
|
|
<source src={media.get('preview_url')} />
|
|
|
|
<source src={media.get('preview_url')} />
|
|
|
|
</video>
|
|
|
|
</video>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
{uploadIcon}
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|