Troplo/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

added pointer cursor for nsfw placeholder. fixed nsfw videos requiring double-click

Browse source
This commit is contained in:
Henry Jameson 2018-08-15 11:20:40 +03:00
parent 87eee191b8
commit d2ec70c323
2 changed files with 18 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

22
src/components/attachment/attachment.js
View file

@ -15,7 +15,7 @@ const Attachment = {
hideNsfwLocal: this.$store.state.config.hideNsfw, hideNsfwLocal: this.$store.state.config.hideNsfw,
showHidden: false, showHidden: false,
loading: false, loading: false,
img: document.createElement('img') img: this.type === 'image' && document.createElement('img')
} }
}, },
components: { components: {
@ -45,15 +45,19 @@ const Attachment = {
} }
}, },
toggleHidden () { toggleHidden () {
if (this.img.onload) { if (this.img) {
this.img.onload() if (this.img.onload) {
} else { this.img.onload()
this.loading = true } else {
this.img.src = this.attachment.url this.loading = true
this.img.onload = () => { this.img.src = this.attachment.url
this.loading = false this.img.onload = () => {
this.showHidden = !this.showHidden this.loading = false
this.showHidden = !this.showHidden
}
} }
} else {
this.showHidden = !this.showHidden
} }
} }
} }

6
src/components/attachment/attachment.vue
View file

@ -2,7 +2,7 @@
<div v-if="size==='hide'"> <div v-if="size==='hide'">
<a class="placeholder" v-if="type !== 'html'" target="_blank" :href="attachment.url">[{{nsfw ? "NSFW/" : ""}}{{type.toUpperCase()}}]</a> <a class="placeholder" v-if="type !== 'html'" target="_blank" :href="attachment.url">[{{nsfw ? "NSFW/" : ""}}{{type.toUpperCase()}}]</a>
</div> </div>
<div v-else class="attachment" :class="{[type]: true, loading, 'small-attachment': isSmall, 'fullwidth': fullwidth}" v-show="!isEmpty"> <div v-else class="attachment" :class="{[type]: true, loading, 'small-attachment': isSmall, 'fullwidth': fullwidth, 'nsfw-placeholder': hidden}" v-show="!isEmpty">
<a class="image-attachment" v-if="hidden" @click.prevent="toggleHidden()"> <a class="image-attachment" v-if="hidden" @click.prevent="toggleHidden()">
<img :key="nsfwImage" :src="nsfwImage"/> <img :key="nsfwImage" :src="nsfwImage"/>
</a> </a>
@ -50,6 +50,10 @@
margin-right: 0.5em; margin-right: 0.5em;
} }
.nsfw-placeholder {
cursor: pointer;
}
.small-attachment { .small-attachment {
&.image, &.video { &.image, &.video {
max-width: 35%; max-width: 35%;