forked from DebaucheryLibrarian/traxxx
Added Filthy Family and 'legacy' scraper to Bang Bros. Added trans generic avatar. Added pagination support to site actions.
This commit is contained in:
@@ -199,11 +199,11 @@
|
||||
</li>
|
||||
|
||||
<li
|
||||
v-if="actor.hair"
|
||||
v-if="actor.hairColor"
|
||||
class="bio-item hair hideable"
|
||||
>
|
||||
<dfn class="bio-label"><Icon icon="haircut" />Hair</dfn>
|
||||
<span>{{ actor.hair }}</span>
|
||||
<span><span v-if="actor.hairLength">{{ actor.hairLength }}, </span>{{ actor.hairColor }}</span>
|
||||
</li>
|
||||
|
||||
<li
|
||||
|
||||
@@ -1,119 +1,134 @@
|
||||
<template>
|
||||
<div class="filter-bar noselect">
|
||||
<span class="sort">
|
||||
<router-link
|
||||
:to="{ name: isHome ? 'latest' : $route.name, params: { ...$route.params, range: 'latest' } }"
|
||||
:class="{ active: $route.name === 'latest' || range === 'latest' }"
|
||||
class="range range-button"
|
||||
>Latest</router-link>
|
||||
<div class="filter-bar noselect">
|
||||
<span class="sort">
|
||||
<router-link
|
||||
:to="{ name: isHome ? 'latest' : $route.name, params: { ...$route.params, range: 'latest' } }"
|
||||
: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' } }"
|
||||
:class="{ active: $route.name === 'upcoming' || range === 'upcoming' }"
|
||||
class="range-button"
|
||||
>Upcoming</router-link>
|
||||
<router-link
|
||||
:to="{ name: isHome ? 'upcoming' : $route.name, params: { ...$route.params, range: 'upcoming' } }"
|
||||
: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' } }"
|
||||
:class="{ active: $route.name === 'new' || range === 'new' }"
|
||||
class="range-button"
|
||||
>New</router-link>
|
||||
<router-link
|
||||
:to="{ name: isHome ? 'new' : $route.name, params: { ...$route.params, range: 'new' } }"
|
||||
:class="{ active: $route.name === 'new' || range === 'new' }"
|
||||
class="range-button"
|
||||
>New</router-link>
|
||||
|
||||
<!--
|
||||
<!--
|
||||
<router-link
|
||||
:to="{ name: $route.name, params: { ...$route.params, range: 'all' } }"
|
||||
:class="{ active: range === 'all' }"
|
||||
class="range-button"
|
||||
>All</router-link>
|
||||
-->
|
||||
</span>
|
||||
</span>
|
||||
|
||||
<span>
|
||||
<span class="filters-container">
|
||||
<Icon icon="filter" />
|
||||
<Pagination
|
||||
:items-total="itemsTotal"
|
||||
:items-per-page="itemsPerPage"
|
||||
/>
|
||||
|
||||
<Filters
|
||||
class="filters-block"
|
||||
:filter="filter"
|
||||
@set-filter="setFilter"
|
||||
/>
|
||||
</span>
|
||||
<span class="tags">
|
||||
<span class="filters-container">
|
||||
<Icon icon="filter" />
|
||||
|
||||
<v-popover class="filters-compact">
|
||||
<Icon icon="filter" />
|
||||
<Filters
|
||||
class="filters-block"
|
||||
:filter="filter"
|
||||
@set-filter="setFilter"
|
||||
/>
|
||||
</span>
|
||||
|
||||
<div slot="popover">
|
||||
<Filters
|
||||
:compact="true"
|
||||
:filter="filter"
|
||||
@set-filter="setFilter"
|
||||
/>
|
||||
</div>
|
||||
</v-popover>
|
||||
</span>
|
||||
</div>
|
||||
<v-popover class="filters-compact">
|
||||
<Icon icon="filter" />
|
||||
|
||||
<div slot="popover">
|
||||
<Filters
|
||||
:compact="true"
|
||||
:filter="filter"
|
||||
@set-filter="setFilter"
|
||||
/>
|
||||
</div>
|
||||
</v-popover>
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex';
|
||||
import Filters from './filters.vue';
|
||||
import Pagination from '../pagination/pagination.vue';
|
||||
|
||||
function filter(state) {
|
||||
return state.ui.filter;
|
||||
return state.ui.filter;
|
||||
}
|
||||
|
||||
function range() {
|
||||
return this.$route.params.range;
|
||||
return this.$route.params.range;
|
||||
}
|
||||
|
||||
function batch(state) {
|
||||
return state.ui.batch;
|
||||
return state.ui.batch;
|
||||
}
|
||||
|
||||
async function setFilter(newFilter) {
|
||||
this.$store.dispatch('setFilter', newFilter);
|
||||
this.$store.dispatch('setFilter', newFilter);
|
||||
|
||||
await this.fetchReleases();
|
||||
await this.fetchReleases();
|
||||
}
|
||||
|
||||
async function setRange(newRange) {
|
||||
this.$store.dispatch('setRange', newRange);
|
||||
this.$store.dispatch('setRange', newRange);
|
||||
|
||||
await this.fetchReleases();
|
||||
await this.fetchReleases();
|
||||
}
|
||||
|
||||
async function setBatch(newBatch) {
|
||||
this.$store.dispatch('setBatch', newBatch);
|
||||
this.$store.dispatch('setBatch', newBatch);
|
||||
|
||||
await this.fetchReleases();
|
||||
await this.fetchReleases();
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Filters,
|
||||
},
|
||||
props: {
|
||||
fetchReleases: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
isHome: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
filter,
|
||||
range,
|
||||
batch,
|
||||
}),
|
||||
},
|
||||
methods: {
|
||||
setFilter,
|
||||
setRange,
|
||||
setBatch,
|
||||
},
|
||||
components: {
|
||||
Filters,
|
||||
Pagination,
|
||||
},
|
||||
props: {
|
||||
fetchReleases: {
|
||||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
isHome: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
itemsTotal: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
itemsPerPage: {
|
||||
type: Number,
|
||||
default: 10,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
filter,
|
||||
range,
|
||||
batch,
|
||||
}),
|
||||
},
|
||||
methods: {
|
||||
setFilter,
|
||||
setRange,
|
||||
setBatch,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
@@ -178,6 +193,10 @@ export default {
|
||||
}
|
||||
}
|
||||
|
||||
.tags {
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
@media(max-width: $breakpoint) {
|
||||
.filters-container {
|
||||
display: none;
|
||||
|
||||
@@ -3,15 +3,11 @@
|
||||
<FilterBar
|
||||
:fetch-releases="fetchReleases"
|
||||
:is-home="true"
|
||||
:items-total="totalCount"
|
||||
:items-per-page="limit"
|
||||
/>
|
||||
|
||||
<div class="content-inner">
|
||||
<Pagination
|
||||
:items-total="totalCount"
|
||||
:items-per-page="limit"
|
||||
class="pagination-top"
|
||||
/>
|
||||
|
||||
<Releases :releases="releases" />
|
||||
|
||||
<Pagination
|
||||
|
||||
@@ -110,6 +110,7 @@ export default {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: var(--shadow);
|
||||
font-size: 1rem;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
|
||||
|
||||
@@ -1,52 +1,52 @@
|
||||
<template>
|
||||
<div
|
||||
v-if="site"
|
||||
class="content site"
|
||||
>
|
||||
<FilterBar :fetch-releases="fetchSite" />
|
||||
<div
|
||||
v-if="site"
|
||||
class="content site"
|
||||
>
|
||||
<FilterBar :fetch-releases="fetchSite" />
|
||||
|
||||
<div class="header">
|
||||
<a
|
||||
v-tooltip.bottom="site.url && `Go to ${site.url}`"
|
||||
:href="site.url"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="link link-site"
|
||||
>
|
||||
<img
|
||||
:src="`/img/logos/${site.network.slug}/${site.slug}.png`"
|
||||
:title="site.name"
|
||||
:alt="site.name"
|
||||
class="logo logo-site"
|
||||
>
|
||||
</a>
|
||||
<div class="header">
|
||||
<a
|
||||
v-tooltip.bottom="site.url && `Go to ${site.url}`"
|
||||
:href="site.url"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
class="link link-site"
|
||||
>
|
||||
<img
|
||||
:src="`/img/logos/${site.network.slug}/${site.slug}.png`"
|
||||
:title="site.name"
|
||||
:alt="site.name"
|
||||
class="logo logo-site"
|
||||
>
|
||||
</a>
|
||||
|
||||
<ul class="tags nolist">
|
||||
<li
|
||||
v-for="tag in site.tags"
|
||||
:key="`tag-${tag.slug}`"
|
||||
class="tag"
|
||||
>{{ tag.name }}</li>
|
||||
</ul>
|
||||
<ul class="tags nolist">
|
||||
<li
|
||||
v-for="tag in site.tags"
|
||||
:key="`tag-${tag.slug}`"
|
||||
class="tag"
|
||||
>{{ tag.name }}</li>
|
||||
</ul>
|
||||
|
||||
<a
|
||||
v-tooltip.bottom="`Go to ${site.network.name} overview`"
|
||||
:href="`/network/${site.network.slug}`"
|
||||
class="link link-network"
|
||||
>
|
||||
<img
|
||||
:src="`/img/logos/${site.network.slug}/network.png`"
|
||||
:title="site.network.name"
|
||||
:alt="site.network.name"
|
||||
class="logo logo-network"
|
||||
>
|
||||
</a>
|
||||
</div>
|
||||
<router-link
|
||||
v-tooltip.bottom="`Go to ${site.network.name} overview`"
|
||||
:to="{ name: 'network', params: { networkSlug: site.network.slug } }"
|
||||
class="link link-network"
|
||||
>
|
||||
<img
|
||||
:src="`/img/logos/${site.network.slug}/network.png`"
|
||||
:title="site.network.name"
|
||||
:alt="site.network.name"
|
||||
class="logo logo-network"
|
||||
>
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<div class="content-inner">
|
||||
<Releases :releases="releases" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="content-inner">
|
||||
<Releases :releases="releases" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
@@ -54,43 +54,43 @@ import FilterBar from '../header/filter-bar.vue';
|
||||
import Releases from '../releases/releases.vue';
|
||||
|
||||
async function fetchSite() {
|
||||
this.site = await this.$store.dispatch('fetchSiteBySlug', {
|
||||
siteSlug: this.$route.params.siteSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
this.site = await this.$store.dispatch('fetchSiteBySlug', {
|
||||
siteSlug: this.$route.params.siteSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
|
||||
this.releases = this.site.releases;
|
||||
this.releases = this.site.releases;
|
||||
}
|
||||
|
||||
async function route() {
|
||||
await this.fetchSite();
|
||||
await this.fetchSite();
|
||||
}
|
||||
|
||||
async function mounted() {
|
||||
await this.fetchSite();
|
||||
await this.fetchSite();
|
||||
|
||||
this.pageTitle = this.site.name;
|
||||
this.pageTitle = this.site.name;
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
FilterBar,
|
||||
Releases,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
site: null,
|
||||
releases: null,
|
||||
pageTitle: null,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route: route,
|
||||
},
|
||||
mounted,
|
||||
methods: {
|
||||
fetchSite,
|
||||
},
|
||||
components: {
|
||||
FilterBar,
|
||||
Releases,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
site: null,
|
||||
releases: null,
|
||||
pageTitle: null,
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
$route: route,
|
||||
},
|
||||
mounted,
|
||||
methods: {
|
||||
fetchSite,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user