This commit is contained in:
tamaina 2018-09-04 20:01:15 +09:00
parent 1595683904
commit 2555e23b10
2 changed files with 69 additions and 0 deletions

View file

@ -3,6 +3,7 @@
<div :data-count="mediaList.length" ref="grid"> <div :data-count="mediaList.length" ref="grid">
<template v-for="media in mediaList"> <template v-for="media in mediaList">
<mk-media-video :video="media" :key="media.id" v-if="media.type.startsWith('video')" :inline-playable="mediaList.length === 1"/> <mk-media-video :video="media" :key="media.id" v-if="media.type.startsWith('video')" :inline-playable="mediaList.length === 1"/>
<mk-media-audio :video="media" :key="media.id" v-if="media.type.startsWith('audio')" :inline-playable="mediaList.length === 1"/>
<mk-media-image :image="media" :key="media.id" v-else :raw="raw"/> <mk-media-image :image="media" :key="media.id" v-else :raw="raw"/>
</template> </template>
</div> </div>

View file

@ -0,0 +1,68 @@
<template>
<div class="abunaiaudionankasirankedoichioux" v-if="audio.isSensitive && hide" @click="hide = false">
<div>
<b>%fa:exclamation-triangle% %i18n:@sensitive%</b>
<span>%i18n:@click-to-show%</span>
</div>
</div>
<div class="komeijiokayusabanomisoniohitashi" v-else>
<audio class="audio"
:src="audio.url"
:title="audio.name"
controls
ref="audio"
v-if="inlinePlayable" />
</div>
</template>
<script lang="ts">
import Vue from 'vue';
export default Vue.extend({
props: {
audio: {
type: Object,
required: true
},
inlinePlayable: {
default: false
},
hide: {
type: Boolean,
default: true
}
},
computed: {
imageStyle(): any {
return {
'background-image': `url(${this.audio.url})`
};
}
}
})
</script>
<style lang="stylus" scoped>
.komeijiokayusabanomisoniohitashi
.audio
display block
width 100%
height 100%
border-radius 4px
.abunaiaudionankasirankedoichioux
display flex
justify-content center
align-items center
background #111
color #fff
> div
display table-cell
text-align center
font-size 12px
> b
display block
</style>