Commit 378a15f4 authored by Haelwenn's avatar Haelwenn

app/javascript/mastodon/components/media_gallery.js: Add support for audio attachements

parent 30f4f1d1
......@@ -171,6 +171,21 @@ class Item extends React.PureComponent {
/>
</a>
);
} else if (attachment.get('type') === 'audio') {
thumbnail = (
<div
className='media-gallery__audio'
aria-label={attachment.get('description')}
role='application'
>
<span><p>sound<br/>only</p></span>
<span><p>{attachment.get('description')}</p></span>
<audio
src={attachment.get('url')}
controls
/>
</div>
);
} else if (attachment.get('type') === 'gifv') {
const autoPlay = !isIOS() && autoPlayGif;
......
......@@ -74,6 +74,28 @@
}
}
.media-gallery__audio {
height: 100%;
display: flex;
flex-direction: column;
span {
text-align: center;
color: $darker-text-color;
display: flex;
height: 100%;
align-items: center;
p {
width: 100%;
}
}
audio {
width: 100%;
}
}
.media-gallery {
box-sizing: border-box;
margin-top: 8px;
......
......@@ -150,6 +150,18 @@ class Item extends React.PureComponent {
/>
</a>
);
} else if (attachment.get('type') === 'audio') {
thumbnail = (
<div className='media-gallery__audio'>
<audio
className='media-gallery__item-audio-thumbnail'
aria-label={attachment.get('description')}
role='application'
src={attachment.get('url')}
controls
/>
</div>
);
} else if (attachment.get('type') === 'gifv') {
const autoPlay = !isIOS() && autoPlayGif;
......
......@@ -4216,6 +4216,14 @@ a.status-card.compact:hover {
}
}
.media-gallery__audio {
margin-top: 32px;
audio {
width: 100%;
}
}
.attachment-list {
display: flex;
font-size: 14px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment