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

Added 'match all' tag filter for actors and toggle to 'match any'.

Browse Source
This commit is contained in:
DebaucheryLibrarian
2020-07-19 03:52:36 +02:00
parent f147d0f3b3
commit 2bb511cd99
45 changed files with 124 additions and 108 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
assets/components/actors/actor.vue
View File

@@ -291,6 +291,7 @@
</Scroll>
<FilterBar
ref="filter"
:fetch-releases="fetchActor"
:items-total="totalCount"
:items-per-page="limit"
@@ -322,7 +323,7 @@ import Social from './social.vue';
async function fetchActor() {
const { actor, releases, totalCount } = await this.$store.dispatch('fetchActorById', {
actorId: Number(this.$route.params.actorId),
limit: 10,
limit: this.limit,
pageNumber: Number(this.$route.params.pageNumber),
range: this.$route.params.range,
});
@@ -330,6 +331,10 @@ async function fetchActor() {
this.actor = actor;
this.releases = releases;
this.totalCount = totalCount;
if (this.$refs.filter) {
this.$refs.filter.$el.scrollIntoView();
}
}
function sfw() {
@@ -364,7 +369,7 @@ export default {
actor: null,
releases: null,
totalCount: 0,
limit: 10,
limit: 15,
pageTitle: null,
bioExpanded: false,
photosExpanded: false,

33
assets/components/header/filters.vue
View File

@@ -15,6 +15,21 @@
</div>
<div slot="popover">
<select
v-model="mode"
class="mode"
@change="$router.push({ query: { ...$route.query, mode } })"
>
<option
value="all"
class="option"
>match all selected</option>
<option
value="any"
class="option"
>match any selected</option>
</select>
<ul class="tags nolist">
<li
v-for="tag in availableTags"
@@ -22,7 +37,7 @@
class="tag"
:class="{ selected: selectedTags.includes(tag.slug) }"
>
<router-link :to="{ query: { ...getNewRange(tag.slug) } }">
<router-link :to="{ query: { ...getNewRange(tag.slug), mode } }">
<Icon
icon="checkmark"
class="include"
@@ -30,7 +45,7 @@
</router-link>
<router-link
:to="{ query: { ...(selectedTags.length === 1 && selectedTags.includes(tag.slug) ? null : { tags: tag.slug }) } }"
:to="{ query: { ...(selectedTags.length === 1 && selectedTags.includes(tag.slug) ? null : { tags: tag.slug }), mode }, params: { pageNumber: 1 } }"
class="name"
>{{ tag.name }}</router-link>
</li>
@@ -71,6 +86,11 @@ export default {
default: () => [],
},
},
data() {
return {
mode: 'all',
};
},
computed: {
selectedTags,
},
@@ -119,6 +139,15 @@ export default {
}
}
.mode {
width: 100%;
background: none;
padding: .75rem;
font-size: 1rem;
border: none;
border-bottom: solid 1px var(--shadow-hint);
}
.tags {
padding: .5rem 0;
}

11
assets/components/releases/tile.vue
View File

@@ -255,16 +255,16 @@ export default {
}
.labels {
padding: .25rem .5rem 1rem .5rem;
padding: 0 .5rem 1rem .25rem;
max-height: .5rem;
overflow-y: hidden;
}
.shoot {
display: inline;
padding: .25rem;
background: var(--shadow-hint);
color: var(--shadow);
padding: .25rem .5rem .25rem .25rem;
border-right: solid 1px var(--shadow-hint);
color: var(--shadow-strong);
font-size: 0.8rem;
font-weight: bold;
}
@@ -275,7 +275,7 @@ export default {
}
.tag {
margin: 0 .25rem .25rem 0;
margin: 0 0 .25rem 0;
}
.tag-link {
@@ -286,7 +286,6 @@ export default {
font-weight: bold;
text-decoration: none;
line-height: 1;
border: solid 1px var(--shadow-hint);
&:hover {
color: var(--primary);

12
assets/components/tags/tags.vue
View File

@@ -3,6 +3,7 @@
<div
v-for="(tags, category) in categories"
:key="category"
class="category"
>
<h3 class="heading">{{ category }}</h3>
@@ -47,12 +48,13 @@ async function mounted() {
'creampie',
'squirting',
],
appearance: [
ethnicity: [
'asian',
'ebony',
'latina',
'caucasian',
'indian',
],
appearance: [
'natural-boobs',
'fake-boobs',
'blonde',
@@ -155,7 +157,11 @@ export default {
}
.heading {
font-size: 1.3rem;
display: inline-block;
background: var(--primary);
color: var(--text-light);
padding: .5rem;
font-size: 1rem;
text-transform: capitalize;
}

104
assets/js/actors/actions.js
View File

@@ -1,11 +1,6 @@
import config from 'config';
import { graphql, get } from '../api';
import {
releaseFields,
releasePosterFragment,
releaseActorsFragment,
releaseTagsFragment,
} from '../fragments';
import { releaseFields } from '../fragments';
import { curateActor, curateRelease } from '../curate';
import getDateRange from '../get-date-range';
@@ -18,18 +13,18 @@ function initActorActions(store, router) {
}) {
const { before, after, orderBy } = getDateRange(range);
const includeTags = router.currentRoute.query.tags ? router.currentRoute.query.tags.split(',') : [];
const mode = router.currentRoute.query.mode || 'all';
const { actor, connection: { releases, totalCount } } = await graphql(`
const { actor } = await graphql(`
query Actor(
$actorId: Int!
$limit:Int = 10,
$offset:Int = 0,
$after:Datetime = "1900-01-01",
$before:Datetime = "2100-01-01",
$orderBy:[ReleasesActorsOrderBy!]
$orderBy:[ReleasesOrderBy!]
$selectableTags: [String],
$excludeTags: [String!]
${includeTags.length > 0 ? '$includeTags: [String!]' : ''}
$includeTags: [String!],
) {
actor(id: $actorId) {
id
@@ -150,92 +145,35 @@ function initActorActions(store, router) {
slug
priority
}
releasesConnection: releasesActorsConnection(
scenesConnection(
filter: {
release: {
date: {
lessThan: $before,
greaterThan: $after,
}
date: {
lessThan: $before,
greaterThan: $after,
}
${mode === 'any' ? `
releasesTagsConnection: {
none: {
some: {
tag: {
slug: {
in: $excludeTags
in: $includeTags
}
}
}
}
}
` : ''}
}
${mode === 'all' ? 'selectedTags: $includeTags' : ''}
first: $limit
offset: $offset
orderBy: $orderBy
) {
releases: nodes {
release {
id
url
title
date
slug
${releaseActorsFragment}
${releaseTagsFragment}
${releasePosterFragment}
entity {
id
name
slug
url
parent {
id
name
slug
url
}
}
}
}
}
}
connection: releasesActorsConnection(
first: $limit
offset: $offset
orderBy: $orderBy
condition: {
actorId: $actorId
}
filter: {
or: [
{
release: {
date: {
lessThan: $before,
greaterThan: $after
}
}
},
]
${includeTags.length > 0 ? `release: {
releasesTagsConnection: {
some: {
tag: {
slug: {
in: $includeTags
}
}
}
}
}` : ''}
}
) {
releases: nodes {
release {
${releaseFields}
}
}
totalCount
}
totalCount
}
}
}
`, {
actorId,
@@ -244,15 +182,15 @@ function initActorActions(store, router) {
after,
before,
selectableTags: config.selectableTags,
orderBy: orderBy === 'DATE_DESC' ? 'RELEASE_BY_RELEASE_ID__DATE_DESC' : 'RELEASE_BY_RELEASE_ID__DATE_ASC',
orderBy,
excludeTags: store.state.ui.filter,
includeTags,
});
return {
actor: curateActor(actor, null, curateRelease),
releases: releases.map(release => curateRelease(release.release)),
totalCount,
releases: actor.scenesConnection.releases.map(release => curateRelease(release)),
totalCount: actor.scenesConnection.totalCount,
};
}

8
assets/js/config/default.js
View File

@@ -5,12 +5,13 @@ export default {
selectableTags: [
'airtight',
'anal',
'blowbang',
'blowjob',
'creampie',
'deepthroat',
'double-anal',
'double-penetration',
'double-vaginal',
'dap',
'dp',
'dvp',
'facefucking',
'facial',
'fisting',
@@ -18,6 +19,7 @@ export default {
'gangbang',
'interracial',
'lesbian',
'threesome',
'mff',
'mfm',
'orgy',

6
assets/js/main.js
View File

@@ -57,7 +57,11 @@ function init() {
},
});
Vue.use(VTooltip);
Vue.use(VTooltip, {
popover: {
defaultContainer: '.container',
},
});
Vue.use(VueLazyLoad, {
throttleWait: 0,
});