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

Applying tag filters to URL.

Browse Source
This commit is contained in:
ThePendulum
2020-05-27 01:40:10 +02:00
parent 86377fec5f
commit 88a88227c4
16 changed files with 210 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -288,8 +288,19 @@
:actor="actor"
/>
<FilterBar :fetch-releases="fetchActor" />
<Releases :releases="actor.releases" />
<FilterBar
:fetch-releases="fetchActor"
:items-total="totalCount"
:items-per-page="limit"
/>
<Releases :releases="releases" />
<Pagination
:items-total="totalCount"
:items-per-page="limit"
class="pagination-top"
/>
</div>
</div>
</div>
@@ -297,16 +308,23 @@
<script>
import Photos from './photos.vue';
import Pagination from '../pagination/pagination.vue';
import FilterBar from '../header/filter-bar.vue';
import Releases from '../releases/releases.vue';
import Gender from './gender.vue';
import Social from './social.vue';
async function fetchActor() {
this.actor = await this.$store.dispatch('fetchActorById', {
const { actor, releases, totalCount } = await this.$store.dispatch('fetchActorById', {
actorId: Number(this.$route.params.actorId),
limit: 10,
pageNumber: Number(this.$route.params.pageNumber),
range: this.$route.params.range,
});
this.actor = actor;
this.releases = releases;
this.totalCount = totalCount;
}
function sfw() {
@@ -328,6 +346,7 @@ async function mounted() {
export default {
components: {
FilterBar,
Pagination,
Photos,
Releases,
Gender,
@@ -337,6 +356,8 @@ export default {
return {
actor: null,
releases: null,
totalCount: 0,
limit: 10,
pageTitle: null,
expanded: false,
};
@@ -612,12 +633,9 @@ export default {
background: var(--background-dim);
}
.releases {
border-top: solid 1px var(--crease);
}
.releases {
flex-grow: 1;
border-top: solid 1px var(--crease);
padding: 1rem;
}

6
assets/components/header/filter-bar.vue
View File

@@ -2,19 +2,19 @@
<div class="filter-bar noselect">
<span class="sort">
<router-link
:to="{ name: isHome ? 'latest' : $route.name, params: { ...$route.params, range: 'latest', pageNumber: 1 } }"
:to="{ params: { range: 'latest', pageNumber: 1 } }"
:class="{ active: $route.name === 'latest' || range === 'latest' }"
class="range range-button"
>Latest</router-link>
<router-link
:to="{ name: isHome ? 'upcoming' : $route.name, params: { ...$route.params, range: 'upcoming', pageNumber: 1 } }"
:to="{ params: { range: 'upcoming', pageNumber: 1 } }"
:class="{ active: $route.name === 'upcoming' || range === 'upcoming' }"
class="range-button"
>Upcoming</router-link>
<router-link
:to="{ name: isHome ? 'new' : $route.name, params: { ...$route.params, range: 'new', pageNumber: 1 } }"
:to="{ params: { range: 'new', pageNumber: 1 } }"
:class="{ active: $route.name === 'new' || range === 'new' }"
class="range-button"
>New</router-link>

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

@@ -8,19 +8,17 @@
v-for="tag in tags"
:key="`tag-${tag}`"
class="tag"
:class="{ selected: selectedTags.has(tag) }"
>
<Icon
icon="checkmark"
class="include"
/>
<Icon
icon="cross"
class="exclude"
/>
<router-link :to="{ params: { range: getNewRange(tag) } }">
<Icon
icon="checkmark"
class="include"
/>
</router-link>
<router-link
:to="{ name: 'tag', params: { tagSlug: tag } }"
:to="{ params: { range: tag } }"
class="name"
>{{ tag }}</router-link>
</li>
@@ -31,11 +29,32 @@
<script>
const tags = [
'airtight',
'anal',
'blowjob',
'double-penetration',
'facial',
'gangbang',
'lesbian',
'mff',
'mfm',
'orgy',
];
function getNewRange(tag) {
const selected = new Set(this.selectedTags).add(tag);
if (this.selectedTags.has(tag)) {
selected.delete(tag);
}
return Array.from(selected).join('+');
}
function selectedTags() {
return new Set(this.$route.params.range.split('+'));
}
export default {
props: {
filter: {
@@ -49,10 +68,15 @@ export default {
},
data() {
return {
localFilter: this.filter,
tags,
};
},
computed: {
selectedTags,
},
methods: {
getNewRange,
},
};
</script>
@@ -82,7 +106,7 @@ export default {
width: 1rem;
height: 1rem;
padding: .5rem;
fill: var(--darken-weak);
fill: var(--darken-hint);
&:hover {
cursor: pointer;
@@ -90,15 +114,10 @@ export default {
}
.include:hover,
.include.active {
&.selected .include {
fill: var(--success);
}
.exclude:hover,
.exclude.active {
fill: var(--alert);
}
.name {
flex-grow: 1;
padding: .5rem;

2
assets/components/home/home.vue
View File

@@ -28,8 +28,8 @@ import Pagination from '../pagination/pagination.vue';
async function fetchReleases() {
const { releases, totalCount } = await this.$store.dispatch('fetchReleases', {
limit: this.limit,
range: this.$route.params.range,
pageNumber: Number(this.$route.params.pageNumber) || 1,
range: this.$route.name,
});
this.totalCount = totalCount;

2
assets/components/networks/network.vue
View File

@@ -212,10 +212,12 @@ export default {
.content-inner {
padding: 0;
overflow-y: auto;
}
.releases {
padding: 1rem 1rem 1rem .5rem;
border-top: solid 1px var(--crease);
}
.sidebar {

16
assets/components/sites/site.vue
View File

@@ -41,7 +41,11 @@
</router-link>
</div>
<FilterBar :fetch-releases="fetchSite" />
<FilterBar
:fetch-releases="fetchSite"
:items-total="totalCount"
:items-per-page="limit"
/>
<div class="content-inner">
<Releases :releases="releases" />
@@ -54,12 +58,16 @@ import FilterBar from '../header/filter-bar.vue';
import Releases from '../releases/releases.vue';
async function fetchSite() {
this.site = await this.$store.dispatch('fetchSiteBySlug', {
const { site, releases, totalCount } = await this.$store.dispatch('fetchSiteBySlug', {
siteSlug: this.$route.params.siteSlug,
range: this.$route.params.range,
pageNumber: Number(this.$route.params.pageNumber) || 1,
limit: this.limit,
});
this.releases = this.site.releases;
this.site = site;
this.releases = releases;
this.totalCount = totalCount;
}
async function route() {
@@ -81,6 +89,8 @@ export default {
return {
site: null,
releases: null,
totalCount: 0,
limit: 10,
pageTitle: null,
};
},