Merge pull request #3121 from h3poteto/iss-2954

refs #2954 Support sound file as media attachment
This commit is contained in:
AkiraFukushima 2022-02-12 16:09:29 +09:00 committed by GitHub
commit ec3b4e49d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 4 deletions

View File

@ -2,6 +2,7 @@
<div id="current-media" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.8)"> <div id="current-media" v-loading="loading" element-loading-background="rgba(0, 0, 0, 0.8)">
<video :src="src" v-if="isMovieFile()" autoplay loop controls v-on:loadstart="loaded()"></video> <video :src="src" v-if="isMovieFile()" autoplay loop controls v-on:loadstart="loaded()"></video>
<video :src="src" v-else-if="isGIF()" autoplay loop v-on:loadstart="loaded()"></video> <video :src="src" v-else-if="isGIF()" autoplay loop v-on:loadstart="loaded()"></video>
<video :src="src" v-else-if="isAudio()" autoplay loop controls v-on:loadstart="loaded()"></video>
<img :src="imageSrc" v-else v-on:load="loaded()" /> <img :src="imageSrc" v-else v-on:load="loaded()" />
</div> </div>
</template> </template>
@ -27,7 +28,7 @@ export default {
} }
}, },
watch: { watch: {
src: async function(newSrc, _oldSrc) { src: async function (newSrc, _oldSrc) {
this.imageSrc = newSrc this.imageSrc = newSrc
if (newSrc && !this.isMovieFile() && !this.isGIF()) { if (newSrc && !this.isMovieFile() && !this.isGIF()) {
try { try {
@ -51,6 +52,9 @@ export default {
isGIF() { isGIF() {
return ['gifv'].includes(this.type) return ['gifv'].includes(this.type)
}, },
isAudio() {
return ['audio'].includes(this.type)
},
async loaded() { async loaded() {
this.$store.dispatch('TimelineSpace/Modals/ImageViewer/loaded') this.$store.dispatch('TimelineSpace/Modals/ImageViewer/loaded')
} }

View File

@ -95,13 +95,14 @@
</el-button> </el-button>
<div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments"> <div class="media" v-bind:key="media.preview_url" v-for="media in mediaAttachments">
<FailoverImg <FailoverImg
:src="media.preview_url" :src="media.preview_url ? media.preview_url : originalMessage.account.avatar"
@click="openImage(media.url, mediaAttachments)" @click="openImage(media.url, mediaAttachments)"
:title="media.description" :title="media.description"
:readExif="true" :readExif="true"
/> />
<el-tag class="media-label" size="mini" v-if="media.type == 'gifv'">GIF</el-tag> <el-tag class="media-label" size="mini" v-if="media.type === 'gifv'">GIF</el-tag>
<el-tag class="media-label" size="mini" v-else-if="media.type == 'video'">VIDEO</el-tag> <el-tag class="media-label" size="mini" v-else-if="media.type === 'video'">VIDEO</el-tag>
<el-tag class="media-label" size="mini" v-else-if="media.type === 'audio'">AUDIO</el-tag>
</div> </div>
</div> </div>
<div class="clearfix"></div> <div class="clearfix"></div>