tarrien/Mastodon
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'master' into glitch-soc/merge-upstream

Browse Source
This commit is contained in:
Thibaut Girka
2020-04-25 15:19:32 +02:00
parent 60f8a63a76 be637146f3
commit 8b2823b7b6
15 changed files with 89 additions and 91 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
app/javascript/mastodon/components/dropdown_menu.js
View File

@@ -68,20 +68,14 @@ class DropdownMenu extends React.PureComponent {
handleKeyDown = e => {
const items = Array.from(this.node.getElementsByTagName('a'));
const index = items.indexOf(document.activeElement);
let element;
let element = null;
switch(e.key) {
case 'ArrowDown':
element = items[index+1];
if (element) {
element.focus();
}
element = items[index+1] || items[0];
break;
case 'ArrowUp':
element = items[index-1];
if (element) {
element.focus();
}
element = items[index-1] || items[items.length-1];
break;
case 'Tab':
if (e.shiftKey) {
@@ -89,28 +83,23 @@ class DropdownMenu extends React.PureComponent {
} else {
element = items[index+1] || items[0];
}
if (element) {
element.focus();
e.preventDefault();
e.stopPropagation();
}
break;
case 'Home':
element = items[0];
if (element) {
element.focus();
}
break;
case 'End':
element = items[items.length-1];
if (element) {
element.focus();
}
break;
case 'Escape':
this.props.onClose();
break;
}
if (element) {
element.focus();
e.preventDefault();
e.stopPropagation();
}
}
handleItemKeyPress = e => {

6
app/javascript/mastodon/components/status.js
View File

@@ -176,8 +176,8 @@ class Status extends ImmutablePureComponent {
return <div className='audio-player' style={{ height: '110px' }} />;
}
handleOpenVideo = (media, startTime) => {
this.props.onOpenVideo(media, startTime);
handleOpenVideo = (media, options) => {
this.props.onOpenVideo(media, options);
}
handleHotkeyOpenMedia = e => {
@@ -190,7 +190,7 @@ class Status extends ImmutablePureComponent {
if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
// TODO: toggle play/paused?
} else if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
onOpenVideo(status.getIn(['media_attachments', 0]), 0);
onOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 });
} else {
onOpenMedia(status.get('media_attachments'), 0);
}

4
app/javascript/mastodon/containers/status_container.js
View File

@@ -150,8 +150,8 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(openModal('MEDIA', { media, index }));
},
onOpenVideo (media, time) {
dispatch(openModal('VIDEO', { media, time }));
onOpenVideo (media, options) {
dispatch(openModal('VIDEO', { media, options }));
},
onBlock (status) {

35
app/javascript/mastodon/features/compose/components/privacy_dropdown.js
View File

@@ -50,7 +50,7 @@ class PrivacyDropdownMenu extends React.PureComponent {
const index = items.findIndex(item => {
return (item.value === value);
});
let element;
let element = null;
switch(e.key) {
case 'Escape':
@@ -60,18 +60,10 @@ class PrivacyDropdownMenu extends React.PureComponent {
this.handleClick(e);
break;
case 'ArrowDown':
element = this.node.childNodes[index + 1];
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
}
element = this.node.childNodes[index + 1] || this.node.firstChild;
break;
case 'ArrowUp':
element = this.node.childNodes[index - 1];
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
}
element = this.node.childNodes[index - 1] || this.node.lastChild;
break;
case 'Tab':
if (e.shiftKey) {
@@ -79,28 +71,21 @@ class PrivacyDropdownMenu extends React.PureComponent {
} else {
element = this.node.childNodes[index + 1] || this.node.firstChild;
}
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
e.preventDefault();
e.stopPropagation();
}
break;
case 'Home':
element = this.node.firstChild;
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
}
break;
case 'End':
element = this.node.lastChild;
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
}
break;
}
if (element) {
element.focus();
this.props.onChange(element.getAttribute('data-index'));
e.preventDefault();
e.stopPropagation();
}
}
handleClick = e => {

4
app/javascript/mastodon/features/status/components/detailed_status.js
View File

@@ -48,8 +48,8 @@ export default class DetailedStatus extends ImmutablePureComponent {
e.stopPropagation();
}
handleOpenVideo = (media, startTime) => {
this.props.onOpenVideo(media, startTime);
handleOpenVideo = (media, options) => {
this.props.onOpenVideo(media, options);
}
handleExpandedToggle = () => {

4
app/javascript/mastodon/features/status/containers/detailed_status_container.js
View File

@@ -129,8 +129,8 @@ const mapDispatchToProps = (dispatch, { intl }) => ({
dispatch(openModal('MEDIA', { media, index }));
},
onOpenVideo (media, time) {
dispatch(openModal('VIDEO', { media, time }));
onOpenVideo (media, options) {
dispatch(openModal('VIDEO', { media, options }));
},
onBlock (status) {

6
app/javascript/mastodon/features/status/index.js
View File

@@ -277,8 +277,8 @@ class Status extends ImmutablePureComponent {
this.props.dispatch(openModal('MEDIA', { media, index }));
}
handleOpenVideo = (media, time) => {
this.props.dispatch(openModal('VIDEO', { media, time }));
handleOpenVideo = (media, options) => {
this.props.dispatch(openModal('VIDEO', { media, options }));
}
handleHotkeyOpenMedia = e => {
@@ -290,7 +290,7 @@ class Status extends ImmutablePureComponent {
if (status.getIn(['media_attachments', 0, 'type']) === 'audio') {
// TODO: toggle play/paused?
} else if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
this.handleOpenVideo(status.getIn(['media_attachments', 0]), 0);
this.handleOpenVideo(status.getIn(['media_attachments', 0]), { startTime: 0 });
} else {
this.handleOpenMedia(status.get('media_attachments'), 0);
}

13
app/javascript/mastodon/features/ui/components/video_modal.js
View File

@@ -14,7 +14,11 @@ export default class VideoModal extends ImmutablePureComponent {
static propTypes = {
media: ImmutablePropTypes.map.isRequired,
status: ImmutablePropTypes.map,
time: PropTypes.number,
options: PropTypes.shape({
startTime: PropTypes.number,
autoPlay: PropTypes.bool,
defaultVolume: PropTypes.number,
}),
onClose: PropTypes.func.isRequired,
};
@@ -52,7 +56,8 @@ export default class VideoModal extends ImmutablePureComponent {
}
render () {
const { media, status, time, onClose } = this.props;
const { media, status, onClose } = this.props;
const options = this.props.options || {};
return (
<div className='modal-root__modal video-modal'>
@@ -61,7 +66,9 @@ export default class VideoModal extends ImmutablePureComponent {
preview={media.get('preview_url')}
blurhash={media.get('blurhash')}
src={media.get('url')}
startTime={time}
startTime={options.startTime}
autoPlay={options.autoPlay}
defaultVolume={options.defaultVolume}
onCloseVideo={onClose}
detailed
alt={media.get('description')}

17
app/javascript/mastodon/features/video/index.js
View File

@@ -109,6 +109,8 @@ class Video extends React.PureComponent {
intl: PropTypes.object.isRequired,
blurhash: PropTypes.string,
link: PropTypes.node,
autoPlay: PropTypes.bool,
defaultVolume: PropTypes.number,
};
state = {
@@ -367,6 +369,13 @@ class Video extends React.PureComponent {
handleLoadedData = () => {
if (this.props.startTime) {
this.video.currentTime = this.props.startTime;
}
if (this.props.defaultVolume !== undefined) {
this.video.volume = this.props.defaultVolume;
}
if (this.props.autoPlay) {
this.video.play();
}
}
@@ -393,8 +402,14 @@ class Video extends React.PureComponent {
height,
});
const options = {
startTime: this.video.currentTime,
autoPlay: !this.state.paused,
defaultVolume: this.state.volume,
};
this.video.pause();
this.props.onOpenVideo(media, this.video.currentTime);
this.props.onOpenVideo(media, options);
}
handleCloseVideo = () => {

4
app/javascript/mastodon/utils/resize_image.js
View File

@@ -138,7 +138,7 @@ const resizeImage = (img, type = 'image/png') => new Promise((resolve, reject) =
.catch(reject);
});
export default inputFile => new Promise((resolve, reject) => {
export default inputFile => new Promise((resolve) => {
if (!inputFile.type.match(/image.*/) || inputFile.type === 'image/gif') {
resolve(inputFile);
return;
@@ -153,5 +153,5 @@ export default inputFile => new Promise((resolve, reject) => {
resizeImage(img, inputFile.type)
.then(resolve)
.catch(() => resolve(inputFile));
}).catch(reject);
}).catch(() => resolve(inputFile));
});

7
app/javascript/styles/mastodon/components.scss
View File

@@ -5575,6 +5575,13 @@ a.status-card.compact:hover {
}
}
.gifv {
video {
max-width: 100vw;
max-height: 80vh;
}
}
.directory {
&__list {
width: 100%;