DebaucheryLibrarian/traxxx
2
1
Fork 1
Code Issues 39 Pull Requests 1 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;