Changed range filter to routes for every view.
This commit is contained in:
parent
525995615a
commit
de5b729c0b
|
@ -254,7 +254,7 @@ import Social from './social.vue';
|
|||
|
||||
async function fetchActor() {
|
||||
this.actor = await this.$store.dispatch('fetchActorBySlug', {
|
||||
slug: this.$route.params.actorSlug,
|
||||
actorSlug: this.$route.params.actorSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
}
|
||||
|
|
|
@ -2,26 +2,26 @@
|
|||
<div class="filter-bar noselect">
|
||||
<span class="sort">
|
||||
<router-link
|
||||
:to="{ name: $route.name, params: { ...$route.params, range: 'latest' } }"
|
||||
:class="{ active: range === 'latest' }"
|
||||
: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: $route.name, params: { ...$route.params, range: 'upcoming' } }"
|
||||
:class="{ active: range === 'upcoming' }"
|
||||
: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: $route.name, params: { ...$route.params, range: 'new' } }"
|
||||
:class="{ active: range === 'new' }"
|
||||
: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: 'home', params: { range: 'all' } }"
|
||||
:to="{ name: $route.name, params: { ...$route.params, range: 'all' } }"
|
||||
:class="{ active: range === 'all' }"
|
||||
class="range-button"
|
||||
>All</router-link>
|
||||
|
@ -97,6 +97,10 @@ export default {
|
|||
type: Function,
|
||||
default: null,
|
||||
},
|
||||
isHome: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
...mapState({
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
/>
|
||||
|
||||
<router-link
|
||||
to="/home"
|
||||
to="/"
|
||||
class="logo-link"
|
||||
><h1 class="header-logo">
|
||||
<div
|
||||
|
|
|
@ -1,6 +1,9 @@
|
|||
<template>
|
||||
<div class="content">
|
||||
<FilterBar :fetch-releases="fetchReleases" />
|
||||
<FilterBar
|
||||
:fetch-releases="fetchReleases"
|
||||
:is-home="true"
|
||||
/>
|
||||
|
||||
<div class="content-inner">
|
||||
<Releases :releases="releases" />
|
||||
|
@ -15,7 +18,7 @@ import Releases from '../releases/releases.vue';
|
|||
async function fetchReleases() {
|
||||
this.releases = await this.$store.dispatch('fetchReleases', {
|
||||
limit: (this.$route.query && this.$route.query.limit && Number(this.$route.query.limit)) || 30,
|
||||
range: this.$route.params.range,
|
||||
range: this.$route.name,
|
||||
});
|
||||
}
|
||||
|
||||
|
|
|
@ -128,7 +128,10 @@ import Sites from '../sites/sites.vue';
|
|||
import Network from '../tile/network.vue';
|
||||
|
||||
async function fetchNetwork() {
|
||||
this.network = await this.$store.dispatch('fetchNetworks', this.$route.params.networkSlug);
|
||||
this.network = await this.$store.dispatch('fetchNetworkBySlug', {
|
||||
networkSlug: this.$route.params.networkSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
|
||||
if (this.network.studios) {
|
||||
this.studios = this.network.studios.map(studio => ({
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
><span class="range">{{ range }}</span> releases for '{{ context }}'</h3>
|
||||
|
||||
<ul
|
||||
:key="sfw"
|
||||
v-lazy-container="{ selector: '.thumbnail' }"
|
||||
class="nolist tiles"
|
||||
>
|
||||
|
@ -40,6 +41,10 @@ function range() {
|
|||
return this.$store.state.ui.range;
|
||||
}
|
||||
|
||||
function sfw() {
|
||||
return this.$store.state.ui.sfw;
|
||||
}
|
||||
|
||||
export default {
|
||||
components: {
|
||||
ReleaseTile,
|
||||
|
@ -60,6 +65,7 @@ export default {
|
|||
},
|
||||
computed: {
|
||||
range,
|
||||
sfw,
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
|
|
@ -54,7 +54,11 @@ import FilterBar from '../header/filter-bar.vue';
|
|||
import Releases from '../releases/releases.vue';
|
||||
|
||||
async function fetchSite() {
|
||||
this.site = await this.$store.dispatch('fetchSites', { siteSlug: this.$route.params.siteSlug });
|
||||
this.site = await this.$store.dispatch('fetchSiteBySlug', {
|
||||
siteSlug: this.$route.params.siteSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
|
||||
this.releases = this.site.releases;
|
||||
}
|
||||
|
||||
|
|
|
@ -62,7 +62,10 @@ import Releases from '../releases/releases.vue';
|
|||
const converter = new Converter();
|
||||
|
||||
async function fetchReleases() {
|
||||
this.tag = await this.$store.dispatch('fetchTags', { tagSlug: this.$route.params.tagSlug });
|
||||
this.tag = await this.$store.dispatch('fetchTagBySlug', {
|
||||
tagSlug: this.$route.params.tagSlug,
|
||||
range: this.$route.params.range,
|
||||
});
|
||||
|
||||
this.hasMedia = this.tag.poster || this.tag.photos.length > 0;
|
||||
this.description = this.tag.description && converter.makeHtml(escapeHtml(this.tag.description));
|
||||
|
|
|
@ -82,8 +82,8 @@
|
|||
<img
|
||||
v-for="cover in release.covers"
|
||||
:key="cover.id"
|
||||
:data-src="`/media/${cover.thumbnail}`"
|
||||
:data-loading="`/media/${cover.lazy}`"
|
||||
:data-src="sfw ? `/img/${cover.sfw.thumbnail}` : `/media/${cover.thumbnail}`"
|
||||
:data-loading="sfw ? `/img/${cover.sfw.lazy}` : `/media/${cover.lazy}`"
|
||||
:alt="release.title"
|
||||
class="thumbnail cover"
|
||||
>
|
||||
|
|
|
@ -46,7 +46,7 @@ function curateActor(actor) {
|
|||
}
|
||||
|
||||
function initActorActions(store, _router) {
|
||||
async function fetchActorBySlug({ _commit }, { slug, limit = 100, range = 'latest' }) {
|
||||
async function fetchActorBySlug({ _commit }, { actorSlug, limit = 100, range = 'latest' }) {
|
||||
const { before, after, orderBy } = getDateRange(range);
|
||||
|
||||
const { actor } = await graphql(`
|
||||
|
@ -171,7 +171,7 @@ function initActorActions(store, _router) {
|
|||
}
|
||||
}
|
||||
`, {
|
||||
actorSlug: slug,
|
||||
actorSlug,
|
||||
limit,
|
||||
after,
|
||||
before,
|
||||
|
|
|
@ -84,6 +84,7 @@ const releasePosterFragment = `
|
|||
sfw: sfwMedia {
|
||||
id
|
||||
thumbnail
|
||||
lazy
|
||||
path
|
||||
comment
|
||||
}
|
||||
|
@ -102,6 +103,7 @@ const releaseCoversFragment = `
|
|||
sfw: sfwMedia {
|
||||
id
|
||||
thumbnail
|
||||
lazy
|
||||
path
|
||||
comment
|
||||
}
|
||||
|
@ -115,10 +117,12 @@ const releasePhotosFragment = `
|
|||
index
|
||||
path
|
||||
thumbnail
|
||||
lazy
|
||||
comment
|
||||
sfw: sfwMedia {
|
||||
id
|
||||
thumbnail
|
||||
lazy
|
||||
path
|
||||
comment
|
||||
}
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
import { graphql } from '../api';
|
||||
import { sitesFragment, releaseFields } from '../fragments';
|
||||
import { curateNetwork } from '../curate';
|
||||
import getDateRange from '../get-date-range';
|
||||
|
||||
function initNetworksActions(store, _router) {
|
||||
async function fetchNetworkBySlug(networkSlug, limit = 100) {
|
||||
async function fetchNetworkBySlug({ _commit }, { networkSlug, limit = 100, range = 'latest' }) {
|
||||
const { before, after, orderBy } = getDateRange(range);
|
||||
|
||||
const { network, releases } = await graphql(`
|
||||
query Network(
|
||||
$networkSlug: String!
|
||||
|
@ -106,22 +109,18 @@ function initNetworksActions(store, _router) {
|
|||
`, {
|
||||
networkSlug,
|
||||
limit,
|
||||
after: store.getters.after,
|
||||
before: store.getters.before,
|
||||
after,
|
||||
before,
|
||||
orderBy,
|
||||
afterTime: store.getters.after,
|
||||
beforeTime: store.getters.before,
|
||||
orderBy: store.getters.orderBy,
|
||||
exclude: store.state.ui.filter,
|
||||
});
|
||||
|
||||
return curateNetwork(network, releases);
|
||||
}
|
||||
|
||||
async function fetchNetworks({ _commit }, networkSlug) {
|
||||
if (networkSlug) {
|
||||
return fetchNetworkBySlug(networkSlug);
|
||||
}
|
||||
|
||||
async function fetchNetworks({ _commit }) {
|
||||
const { networks } = await graphql(`
|
||||
query Networks {
|
||||
networks(orderBy: NAME_ASC) {
|
||||
|
@ -138,6 +137,7 @@ function initNetworksActions(store, _router) {
|
|||
}
|
||||
|
||||
return {
|
||||
fetchNetworkBySlug,
|
||||
fetchNetworks,
|
||||
};
|
||||
}
|
||||
|
|
|
@ -19,25 +19,29 @@ const routes = [
|
|||
{
|
||||
path: '/',
|
||||
redirect: {
|
||||
name: 'home',
|
||||
params: {
|
||||
range: 'latest',
|
||||
},
|
||||
name: 'latest',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/home',
|
||||
redirect: {
|
||||
name: 'home',
|
||||
params: {
|
||||
range: 'latest',
|
||||
},
|
||||
name: 'latest',
|
||||
},
|
||||
},
|
||||
{
|
||||
path: '/:range',
|
||||
path: '/latest',
|
||||
component: Home,
|
||||
name: 'home',
|
||||
name: 'latest',
|
||||
},
|
||||
{
|
||||
path: '/upcoming',
|
||||
component: Home,
|
||||
name: 'upcoming',
|
||||
},
|
||||
{
|
||||
path: '/new',
|
||||
component: Home,
|
||||
name: 'new',
|
||||
},
|
||||
{
|
||||
path: '/scene/:releaseId/:releaseSlug?',
|
||||
|
@ -69,16 +73,52 @@ const routes = [
|
|||
path: '/site/:siteSlug',
|
||||
component: Site,
|
||||
name: 'site',
|
||||
redirect: from => ({
|
||||
name: 'siteRange',
|
||||
params: {
|
||||
...from.params,
|
||||
range: 'latest',
|
||||
},
|
||||
}),
|
||||
},
|
||||
{
|
||||
path: '/site/:siteSlug/:range',
|
||||
component: Site,
|
||||
name: 'siteRange',
|
||||
},
|
||||
{
|
||||
path: '/network/:networkSlug',
|
||||
component: Network,
|
||||
name: 'network',
|
||||
redirect: from => ({
|
||||
name: 'networkRange',
|
||||
params: {
|
||||
...from.params,
|
||||
range: 'latest',
|
||||
},
|
||||
}),
|
||||
},
|
||||
{
|
||||
path: '/network/:networkSlug/:range',
|
||||
component: Network,
|
||||
name: 'networkRange',
|
||||
},
|
||||
{
|
||||
path: '/tag/:tagSlug',
|
||||
component: Tag,
|
||||
name: 'tag',
|
||||
redirect: from => ({
|
||||
name: 'tagRange',
|
||||
params: {
|
||||
...from.params,
|
||||
range: 'latest',
|
||||
},
|
||||
}),
|
||||
},
|
||||
{
|
||||
path: '/tag/:tagSlug/:range',
|
||||
component: Tag,
|
||||
name: 'tagRange',
|
||||
},
|
||||
{
|
||||
path: '/actors/:gender?/:letter?',
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
import { graphql } from '../api';
|
||||
import { releasesFragment } from '../fragments';
|
||||
import { curateSite } from '../curate';
|
||||
import getDateRange from '../get-date-range';
|
||||
|
||||
function initSitesActions(store, _router) {
|
||||
async function fetchSiteBySlug(siteSlug, limit = 100) {
|
||||
async function fetchSiteBySlug({ _commit }, { siteSlug, limit = 100, range = 'latest' }) {
|
||||
const { before, after, orderBy } = getDateRange(range);
|
||||
|
||||
const { site } = await graphql(`
|
||||
query Site(
|
||||
$siteSlug: String!,
|
||||
|
@ -36,21 +39,17 @@ function initSitesActions(store, _router) {
|
|||
`, {
|
||||
siteSlug,
|
||||
limit,
|
||||
after: store.getters.after,
|
||||
before: store.getters.before,
|
||||
after,
|
||||
before,
|
||||
orderBy,
|
||||
isNew: store.getters.isNew,
|
||||
orderBy: store.getters.orderBy,
|
||||
exclude: store.state.ui.filter,
|
||||
});
|
||||
|
||||
return curateSite(site);
|
||||
}
|
||||
|
||||
async function fetchSites({ _commit }, { siteSlug, limit = 100 }) {
|
||||
if (siteSlug) {
|
||||
return fetchSiteBySlug(siteSlug, limit);
|
||||
}
|
||||
|
||||
async function fetchSites({ _commit }, { limit = 100 }) {
|
||||
const { sites } = await graphql(`
|
||||
query Sites(
|
||||
$actorSlug: String!
|
||||
|
@ -102,6 +101,7 @@ function initSitesActions(store, _router) {
|
|||
}
|
||||
|
||||
return {
|
||||
fetchSiteBySlug,
|
||||
fetchSites,
|
||||
searchSites,
|
||||
};
|
||||
|
|
|
@ -3,9 +3,12 @@ import {
|
|||
releaseFields,
|
||||
} from '../fragments';
|
||||
import { curateTag } from '../curate';
|
||||
import getDateRange from '../get-date-range';
|
||||
|
||||
function initTagsActions(store, _router) {
|
||||
async function fetchTagBySlug(tagSlug, limit = 100) {
|
||||
async function fetchTagBySlug({ _commit }, { tagSlug, limit = 100, range = 'latest' }) {
|
||||
const { before, after, orderBy } = getDateRange(range);
|
||||
|
||||
const { tagBySlug } = await graphql(`
|
||||
query Tag(
|
||||
$tagSlug:String!
|
||||
|
@ -84,9 +87,9 @@ function initTagsActions(store, _router) {
|
|||
`, {
|
||||
tagSlug,
|
||||
limit,
|
||||
after: store.getters.after,
|
||||
before: store.getters.before,
|
||||
orderBy: store.getters.isNew,
|
||||
after,
|
||||
before,
|
||||
orderBy: orderBy === 'DATE_DESC' ? 'RELEASE_BY_RELEASE_ID__DATE_DESC' : 'RELEASE_BY_RELEASE_ID__DATE_ASC',
|
||||
exclude: store.state.ui.filter,
|
||||
});
|
||||
|
||||
|
@ -94,16 +97,11 @@ function initTagsActions(store, _router) {
|
|||
}
|
||||
|
||||
async function fetchTags({ _commit }, {
|
||||
tagSlug,
|
||||
limit = 100,
|
||||
slugs = [],
|
||||
_group,
|
||||
_priority,
|
||||
}) {
|
||||
if (tagSlug) {
|
||||
return fetchTagBySlug(tagSlug);
|
||||
}
|
||||
|
||||
const { tags } = await graphql(`
|
||||
query Tags(
|
||||
$slugs: [String!] = [],
|
||||
|
@ -153,9 +151,9 @@ function initTagsActions(store, _router) {
|
|||
}
|
||||
|
||||
return {
|
||||
fetchTagBySlug,
|
||||
fetchTags,
|
||||
fetchTagReleases,
|
||||
fetchTagBySlug,
|
||||
};
|
||||
}
|
||||
|
||||
|
|
|
@ -1,29 +1,16 @@
|
|||
function initUiObservers(store, _router) {
|
||||
let keyHistory = [];
|
||||
|
||||
document.addEventListener('keypress', (event) => {
|
||||
if (event.target.tagName === 'INPUT') {
|
||||
return;
|
||||
}
|
||||
|
||||
keyHistory = keyHistory
|
||||
.concat({
|
||||
key: event.key,
|
||||
time: new Date().getTime(),
|
||||
})
|
||||
.slice(-3);
|
||||
|
||||
if (keyHistory.length === 3
|
||||
&& keyHistory.every(input => input.key === 's')
|
||||
&& new Date().getTime() - keyHistory[0].time < 1000
|
||||
) {
|
||||
store.dispatch('setSfw', false);
|
||||
return;
|
||||
}
|
||||
|
||||
if (event.key === 's') {
|
||||
store.dispatch('setSfw', true);
|
||||
}
|
||||
|
||||
if (event.key === 'n') {
|
||||
store.dispatch('setSfw', false);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue