boiii/traxxx
1
0
Fork 0
forked from DebaucheryLibrarian/traxxx
Code Issues Pull Requests Projects Releases Wiki Activity

Added stash menu to release page, returning stashes from stash API to avoid reloading or local interpolation.

Browse Source
This commit is contained in:
DebaucheryLibrarian
2021-03-21 03:23:58 +01:00
parent de5d104e1e
commit 348aa91832
18 changed files with 309 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

125
assets/components/releases/release.vue
View File

@@ -51,19 +51,52 @@
/>
</h2>
<Icon
v-show="me && stashed"
icon="heart7"
class="stash stashed noselect"
@click="unstashScene"
/>
<span>
<Tooltip class="stash-trigger">
<Icon
v-show="me"
icon="menu"
class="stash noselect"
:class="{ stashed, stashing }"
/>
<Icon
v-show="me && !stashed"
icon="heart8"
class="stash unstashed noselect"
@click="stashScene"
/>
<template v-slot:tooltip>
<StashMenu
v-if="$route.name === 'scene'"
:item="release"
:stashed-by="stashedBy"
:class="{ stashing }"
@stash="(stashId) => stashScene(stashId)"
@unstash="(stashId) => unstashScene(stashId)"
/>
<StashMenu
v-if="$route.name === 'movie'"
:item="release"
:stashed-by="stashedBy"
:class="{ stashing }"
@stash="(stashId) => stashScene(stashId)"
@unstash="(stashId) => unstashScene(stashId)"
/>
</template>
</Tooltip>
<Icon
v-show="me && favorited"
:class="{ stashing }"
icon="heart7"
class="stash stashed noselect"
@click="() => unstashScene()"
/>
<Icon
v-show="me && !favorited"
:class="{ stashing }"
icon="heart8"
class="stash unstashed noselect"
@click="() => stashScene()"
/>
</span>
</div>
<div class="row associations">
@@ -230,6 +263,7 @@
<script>
import Details from './details.vue';
import Banner from './banner.vue';
import StashMenu from '../stashes/menu.vue';
import Album from '../album/album.vue';
import Tags from './tags.vue';
import Chapters from './chapters.vue';
@@ -250,41 +284,44 @@ async function fetchRelease(scroll = true) {
this.$refs.content.scrollTop = 0;
}
this.stashed = this.release.isStashed;
this.stashedBy = this.release.stashes;
this.stashing = false;
}
async function stashScene() {
this.stashed = true;
async function stashScene(stash) {
this.stashing = true;
this.stashedBy = await this.$store.dispatch(this.$route.name === 'movie' ? 'stashMovie' : 'stashScene', {
sceneId: this.release.id,
movieId: this.release.id,
stashId: stash?.id || this.$store.getters.favorites.id,
});
try {
this.$store.dispatch(this.$route.name === 'movie' ? 'stashMovie' : 'stashScene', {
sceneId: this.release.id,
movieId: this.release.id,
stashId: this.$store.getters.favorites.id,
});
} catch (error) {
this.stashed = false;
}
this.stashing = false;
}
async function unstashScene() {
this.stashed = false;
async function unstashScene(stash) {
this.stashing = true;
this.stashedBy = await this.$store.dispatch(this.$route.name === 'movie' ? 'unstashMovie' : 'unstashScene', {
sceneId: this.release.id,
movieId: this.release.id,
stashId: stash?.id || this.$store.getters.favorites.id,
});
try {
this.$store.dispatch(this.$route.name === 'movie' ? 'unstashMovie' : 'unstashScene', {
sceneId: this.release.id,
movieId: this.release.id,
stashId: this.$store.getters.favorites.id,
});
} catch (error) {
this.stashed = true;
}
this.stashing = false;
}
function me() {
return this.$store.state.auth.user;
}
function favorited() {
return this.stashedBy.some(stash => stash.primary);
}
function stashed() {
return this.stashedBy.some(stash => !stash.primary);
}
function bannerBackground() {
return (this.release.poster && this.getBgPath(this.release.poster, 'thumbnail'))
|| (this.release.covers.length > 0 && this.getBgPath(this.release.covers[0], 'thumbnail'));
@@ -304,17 +341,19 @@ export default {
components: {
Actor,
Album,
Details,
Banner,
Scroll,
Releases,
Chapters,
Details,
Releases,
Scroll,
StashMenu,
Tags,
},
data() {
return {
release: null,
stashed: false,
stashedBy: [],
stashing: false,
};
},
computed: {
@@ -322,6 +361,8 @@ export default {
bannerBackground,
me,
showAlbum,
favorited,
stashed,
},
watch: {
$route: fetchRelease,
@@ -408,7 +449,7 @@ export default {
.stash.icon {
width: 1.5rem;
height: 1.5rem;
padding: 0 1rem;
padding: 0 .75rem;
fill: var(--shadow);
&.stashed {
@@ -421,6 +462,10 @@ export default {
}
}
.stash-trigger {
display: inline-block;
}
.album-toggle {
height: fit-content;
display: inline-flex;