動画もNSFW
This commit is contained in:
		
							parent
							
								
									ec2b1ec3f0
								
							
						
					
					
						commit
						738ced81ec
					
				
					 3 changed files with 101 additions and 25 deletions
				
			
		| 
						 | 
					@ -383,6 +383,10 @@ desktop/views/components/media-image.vue:
 | 
				
			||||||
  sensitive: "閲覧注意"
 | 
					  sensitive: "閲覧注意"
 | 
				
			||||||
  click-to-show: "クリックして表示"
 | 
					  click-to-show: "クリックして表示"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					desktop/views/components/media-video.vue:
 | 
				
			||||||
 | 
					  sensitive: "閲覧注意"
 | 
				
			||||||
 | 
					  click-to-show: "クリックして表示"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
desktop/views/components/follow-button.vue:
 | 
					desktop/views/components/follow-button.vue:
 | 
				
			||||||
  following: "フォロー中"
 | 
					  following: "フォロー中"
 | 
				
			||||||
  follow: "フォロー"
 | 
					  follow: "フォロー"
 | 
				
			||||||
| 
						 | 
					@ -863,6 +867,10 @@ mobile/views/components/media-image.vue:
 | 
				
			||||||
  sensitive: "閲覧注意"
 | 
					  sensitive: "閲覧注意"
 | 
				
			||||||
  click-to-show: "クリックして表示"
 | 
					  click-to-show: "クリックして表示"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					mobile/views/components/media-video.vue:
 | 
				
			||||||
 | 
					  sensitive: "閲覧注意"
 | 
				
			||||||
 | 
					  click-to-show: "クリックして表示"
 | 
				
			||||||
 | 
					
 | 
				
			||||||
mobile/views/components/follow-button.vue:
 | 
					mobile/views/components/follow-button.vue:
 | 
				
			||||||
  following: "フォロー中"
 | 
					  following: "フォロー中"
 | 
				
			||||||
  follow: "フォロー"
 | 
					  follow: "フォロー"
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,12 +1,19 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
	<video class="mk-media-video"
 | 
					<div class="uofhebxjdgksfmltszlxurtjnjjsvioh" v-if="video.isSensitive && hide" @click="hide = false">
 | 
				
			||||||
 | 
						<div>
 | 
				
			||||||
 | 
							<b>%fa:exclamation-triangle% %i18n:@sensitive%</b>
 | 
				
			||||||
 | 
							<span>%i18n:@click-to-show%</span>
 | 
				
			||||||
 | 
						</div>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 | 
					<div class="vwxdhznewyashiknzolsoihtlpicqepe" v-else>
 | 
				
			||||||
 | 
						<video class="video"
 | 
				
			||||||
		:src="video.url"
 | 
							:src="video.url"
 | 
				
			||||||
		:title="video.name"
 | 
							:title="video.name"
 | 
				
			||||||
		controls
 | 
							controls
 | 
				
			||||||
		@dblclick.prevent="onClick"
 | 
							@dblclick.prevent="onClick"
 | 
				
			||||||
		ref="video"
 | 
							ref="video"
 | 
				
			||||||
		v-if="inlinePlayable" />
 | 
							v-if="inlinePlayable" />
 | 
				
			||||||
	<a class="mk-media-video-thumbnail"
 | 
						<a class="thumbnail"
 | 
				
			||||||
		:href="video.url"
 | 
							:href="video.url"
 | 
				
			||||||
		:style="imageStyle"
 | 
							:style="imageStyle"
 | 
				
			||||||
		@click.prevent="onClick"
 | 
							@click.prevent="onClick"
 | 
				
			||||||
| 
						 | 
					@ -14,6 +21,7 @@
 | 
				
			||||||
		v-else>
 | 
							v-else>
 | 
				
			||||||
		%fa:R play-circle%
 | 
							%fa:R play-circle%
 | 
				
			||||||
	</a>
 | 
						</a>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
</template>
 | 
					</template>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script lang="ts">
 | 
					<script lang="ts">
 | 
				
			||||||
| 
						 | 
					@ -21,7 +29,19 @@ import Vue from 'vue';
 | 
				
			||||||
import MkMediaVideoDialog from './media-video-dialog.vue';
 | 
					import MkMediaVideoDialog from './media-video-dialog.vue';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default Vue.extend({
 | 
					export default Vue.extend({
 | 
				
			||||||
	props: ['video', 'inlinePlayable'],
 | 
						props: {
 | 
				
			||||||
 | 
							video: {
 | 
				
			||||||
 | 
								type: Object,
 | 
				
			||||||
 | 
								required: true
 | 
				
			||||||
 | 
							},
 | 
				
			||||||
 | 
							inlinePlayable: {
 | 
				
			||||||
 | 
								default: false
 | 
				
			||||||
 | 
							},
 | 
				
			||||||
 | 
							hide: {
 | 
				
			||||||
 | 
								type: Boolean,
 | 
				
			||||||
 | 
								default: true
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
						},
 | 
				
			||||||
	computed: {
 | 
						computed: {
 | 
				
			||||||
		imageStyle(): any {
 | 
							imageStyle(): any {
 | 
				
			||||||
			return {
 | 
								return {
 | 
				
			||||||
| 
						 | 
					@ -47,13 +67,14 @@ export default Vue.extend({
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<style lang="stylus" scoped>
 | 
					<style lang="stylus" scoped>
 | 
				
			||||||
.mk-media-video
 | 
					.vwxdhznewyashiknzolsoihtlpicqepe
 | 
				
			||||||
 | 
						.video
 | 
				
			||||||
		display block
 | 
							display block
 | 
				
			||||||
		width 100%
 | 
							width 100%
 | 
				
			||||||
		height 100%
 | 
							height 100%
 | 
				
			||||||
		border-radius 4px
 | 
							border-radius 4px
 | 
				
			||||||
 | 
					
 | 
				
			||||||
.mk-media-video-thumbnail
 | 
						.thumbnail
 | 
				
			||||||
		display flex
 | 
							display flex
 | 
				
			||||||
		justify-content center
 | 
							justify-content center
 | 
				
			||||||
		align-items center
 | 
							align-items center
 | 
				
			||||||
| 
						 | 
					@ -65,4 +86,20 @@ export default Vue.extend({
 | 
				
			||||||
		background-size cover
 | 
							background-size cover
 | 
				
			||||||
		width 100%
 | 
							width 100%
 | 
				
			||||||
		height 100%
 | 
							height 100%
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.uofhebxjdgksfmltszlxurtjnjjsvioh
 | 
				
			||||||
 | 
						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>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,5 +1,11 @@
 | 
				
			||||||
<template>
 | 
					<template>
 | 
				
			||||||
	<a class="mk-media-video"
 | 
					<div class="icozogqfvdetwohsdglrbswgrejoxbdj" v-if="video.isSensitive && hide" @click="hide = false">
 | 
				
			||||||
 | 
						<div>
 | 
				
			||||||
 | 
							<b>%fa:exclamation-triangle% %i18n:@sensitive%</b>
 | 
				
			||||||
 | 
							<span>%i18n:@click-to-show%</span>
 | 
				
			||||||
 | 
						</div>
 | 
				
			||||||
 | 
					</div>
 | 
				
			||||||
 | 
					<a class="kkjnbbplepmiyuadieoenjgutgcmtsvu" v-else
 | 
				
			||||||
	:href="video.url"
 | 
						:href="video.url"
 | 
				
			||||||
	target="_blank"
 | 
						target="_blank"
 | 
				
			||||||
	:style="imageStyle"
 | 
						:style="imageStyle"
 | 
				
			||||||
| 
						 | 
					@ -11,7 +17,16 @@
 | 
				
			||||||
<script lang="ts">
 | 
					<script lang="ts">
 | 
				
			||||||
import Vue from 'vue'
 | 
					import Vue from 'vue'
 | 
				
			||||||
export default Vue.extend({
 | 
					export default Vue.extend({
 | 
				
			||||||
	props: ['video'],
 | 
						props: {
 | 
				
			||||||
 | 
							video: {
 | 
				
			||||||
 | 
								type: Object,
 | 
				
			||||||
 | 
								required: true
 | 
				
			||||||
 | 
							},
 | 
				
			||||||
 | 
							hide: {
 | 
				
			||||||
 | 
								type: Boolean,
 | 
				
			||||||
 | 
								default: true
 | 
				
			||||||
 | 
							}
 | 
				
			||||||
 | 
						},
 | 
				
			||||||
	computed: {
 | 
						computed: {
 | 
				
			||||||
		imageStyle(): any {
 | 
							imageStyle(): any {
 | 
				
			||||||
			return {
 | 
								return {
 | 
				
			||||||
| 
						 | 
					@ -22,7 +37,7 @@ export default Vue.extend({
 | 
				
			||||||
</script>
 | 
					</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<style lang="stylus" scoped>
 | 
					<style lang="stylus" scoped>
 | 
				
			||||||
.mk-media-video
 | 
					.kkjnbbplepmiyuadieoenjgutgcmtsvu
 | 
				
			||||||
	display flex
 | 
						display flex
 | 
				
			||||||
	justify-content center
 | 
						justify-content center
 | 
				
			||||||
	align-items center
 | 
						align-items center
 | 
				
			||||||
| 
						 | 
					@ -33,4 +48,20 @@ export default Vue.extend({
 | 
				
			||||||
	background-size cover
 | 
						background-size cover
 | 
				
			||||||
	width 100%
 | 
						width 100%
 | 
				
			||||||
	height 100%
 | 
						height 100%
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.icozogqfvdetwohsdglrbswgrejoxbdj
 | 
				
			||||||
 | 
						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>
 | 
					</style>
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue