Added filter bar to all pages. Added 'upcoming' marker. Improved date tidbit.

This commit is contained in:
ThePendulum 2019-11-15 05:10:59 +01:00
parent a612045ee0
commit 5620dfcb65
18 changed files with 180 additions and 55 deletions

View File

@ -3,6 +3,8 @@
v-if="actor"
class="content actor"
>
<FilterBar :fetch-releases="fetchReleases" />
<div class="header">
<h2 class="title">{{ actor.name }}</h2>
</div>
@ -61,17 +63,25 @@
</template>
<script>
import FilterBar from '../header/filter-bar.vue';
import ReleaseTile from '../tile/release.vue';
async function mounted() {
[this.actor] = await this.$store.dispatch('fetchActors', this.$route.params.actorSlug);
async function fetchReleases() {
this.releases = await this.$store.dispatch('fetchActorReleases', this.$route.params.actorSlug);
}
async function mounted() {
[[this.actor]] = await Promise.all([
this.$store.dispatch('fetchActors', this.$route.params.actorSlug),
this.fetchReleases(),
]);
this.pageTitle = this.actor.name;
}
export default {
components: {
FilterBar,
ReleaseTile,
},
data() {
@ -82,6 +92,9 @@ export default {
};
},
mounted,
methods: {
fetchReleases,
},
};
</script>

View File

@ -96,8 +96,7 @@ export default {
}
.item {
height: 100%;
max-height: 18rem;
height: 18rem;
vertical-align: middle;
}
</style>

View File

@ -9,28 +9,27 @@
<div class="column">
<a
v-if="release.date"
v-tooltip.bottom="`View scene on ${release.site.name}`"
:title="`View scene on ${release.site.name}`"
v-tooltip.bottom="release.url && `View scene on ${release.site.name}`"
:title="release.url && `View scene on ${release.site.name}`"
:href="release.url"
:class="{ link: release.url }"
target="_blank"
rel="noopener noreferrer"
class="tidbit date link hideable"
class="tidbit date"
>
<Icon icon="calendar2" />
{{ formatDate(release.date, 'MMMM D, YYYY') }}
</a>
<Icon
v-if="isAfter(new Date(), release.date)"
icon="calendar2"
/>
<a
v-if="release.date"
v-tooltip.bottom="`View scene on ${release.site.name}`"
:title="`View scene on ${release.site.name}`"
:href="release.url"
target="_blank"
rel="noopener noreferrer"
class="tidbit date link showable"
>
<Icon icon="calendar2" />
{{ formatDate(release.date, 'MMM D, YYYY') }}
<Icon
v-else
v-tooltip.bottom="'To be released'"
icon="sun3"
/>
<span class="showable">{{ formatDate(release.date, 'MMM D, YYYY') }}</span>
<span class="hideable">{{ formatDate(release.date, 'MMMM D, YYYY') }}</span>
</a>
<span
@ -379,10 +378,14 @@ export default {
display: none;
}
.showable {
.row .showable {
display: block;
}
.tidbit .showable {
display: inline-block;
}
.logo-site {
width: 15rem;
max-width: 100%;

View File

@ -3,6 +3,8 @@
v-if="site"
class="content site"
>
<FilterBar :fetch-releases="fetchReleases" />
<div class="content-inner">
<div class="header">
<a
@ -60,17 +62,25 @@
</template>
<script>
import FilterBar from '../header/filter-bar.vue';
import ReleaseTile from '../tile/release.vue';
async function mounted() {
[this.site] = await this.$store.dispatch('fetchSites', this.$route.params.siteSlug);
async function fetchReleases() {
this.releases = await this.$store.dispatch('fetchSiteReleases', this.$route.params.siteSlug);
}
async function mounted() {
[[this.site]] = await Promise.all([
this.$store.dispatch('fetchSites', this.$route.params.siteSlug),
this.fetchReleases(),
]);
this.pageTitle = this.site.name;
}
export default {
components: {
FilterBar,
ReleaseTile,
},
data() {
@ -81,6 +91,9 @@ export default {
};
},
mounted,
methods: {
fetchReleases,
},
};
</script>

View File

@ -3,6 +3,8 @@
v-if="tag"
class="content tag"
>
<FilterBar :fetch-releases="fetchReleases" />
<div class="header">
<span>
<h2 class="title">
@ -30,17 +32,25 @@
</template>
<script>
import FilterBar from '../header/filter-bar.vue';
import ReleaseTile from '../tile/release.vue';
async function mounted() {
[this.tag] = await this.$store.dispatch('fetchTags', this.$route.params.tagSlug);
async function fetchReleases() {
this.releases = await this.$store.dispatch('fetchTagReleases', this.$route.params.tagSlug);
}
async function mounted() {
[[this.tag]] = await Promise.all([
this.$store.dispatch('fetchTags', this.$route.params.tagSlug),
this.fetchReleases(),
]);
this.pageTitle = this.tag.name;
}
export default {
components: {
FilterBar,
ReleaseTile,
},
data() {
@ -51,6 +61,9 @@ export default {
};
},
mounted,
methods: {
fetchReleases,
},
};
</script>

View File

@ -18,9 +18,10 @@
<a
v-if="release.date"
v-tooltip.bottom="`View scene on ${release.site.name}`"
:title="`View scene on ${release.site.name}`"
v-tooltip.bottom="release.url && `View scene on ${release.site.name}`"
:title="release.url && `View scene on ${release.site.name}`"
:href="release.url"
:class="{ upcoming: isAfter(release.date, new Date()) }"
target="_blank"
rel="noopener noreferrer"
class="date"
@ -29,6 +30,7 @@
<a
v-else
:href="release.url"
:class="{ upcoming: isAfter(release.date, new Date()) }"
title="Scene date N/A, showing date added"
target="_blank"
rel="noopener noreferrer"
@ -166,17 +168,34 @@ export default {
align-items: center;
justify-content: space-between;
position: absolute;
font-size: 0;
}
.site,
.date {
color: #fff;
background: rgba(0, 0, 0, .5);
background: $shadow;
position: relative;
font-size: .8rem;
padding: .25rem;
text-decoration: none;
}
.date.upcoming:before {
content: '';
color: $text-contrast;
background: $primary;
width: .25rem;
display: inline-block;
position: absolute;
top: 0;
bottom: 0;
left: -.75rem;
padding: .25rem;
font-size: .8rem;
font-weight: bold;
}
.site {
font-weight: bold;
}

5
assets/img/female.svg Normal file
View File

@ -0,0 +1,5 @@
<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<title>female</title>
<path d="M9 9.9c2.282-0.463 4-2.481 4-4.9 0-2.761-2.239-5-5-5s-5 2.239-5 5c0 2.419 1.718 4.437 4 4.9v2.1h-3v2h3v2h2v-2h3v-2h-3v-2.1zM4.7 5c0-1.823 1.477-3.3 3.3-3.3s3.3 1.478 3.3 3.3c0 1.822-1.477 3.3-3.3 3.3s-3.3-1.478-3.3-3.3z"></path>
</svg>

After

Width:  |  Height:  |  Size: 398 B

5
assets/img/male.svg Normal file
View File

@ -0,0 +1,5 @@
<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<title>male</title>
<path d="M10 0v2h2.586l-3.829 3.829c-0.79-0.524-1.738-0.829-2.757-0.829-2.761 0-5 2.239-5 5s2.239 5 5 5 5-2.239 5-5c0-1.019-0.305-1.967-0.829-2.757l3.829-3.829v2.586h2v-6h-6zM6 13.3c-1.823 0-3.3-1.477-3.3-3.3s1.477-3.3 3.3-3.3c1.822 0 3.3 1.477 3.3 3.3s-1.477 3.3-3.3 3.3z"></path>
</svg>

After

Width:  |  Height:  |  Size: 440 B

5
assets/img/sun3.svg Normal file
View File

@ -0,0 +1,5 @@
<!-- Generated by IcoMoon.io -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
<title>sun3</title>
<path d="M14.374 8l1.425-1.78-2.056-0.986 0.512-2.222-2.28 0.004-0.503-2.224-2.053 0.993-1.418-1.786-1.418 1.786-2.053-0.993-0.503 2.224-2.28-0.004 0.512 2.222-2.056 0.986 1.425 1.78-1.425 1.78 2.056 0.986-0.512 2.222 2.28-0.004 0.503 2.224 2.053-0.993 1.418 1.786 1.418-1.786 2.053 0.993 0.503-2.224 2.28 0.004-0.512-2.222 2.056-0.986-1.425-1.78zM8 13.141c-2.743 0-4.966-2.302-4.966-5.141s2.223-5.141 4.966-5.141c2.743 0 4.966 2.302 4.966 5.141s-2.223 5.141-4.966 5.141zM4 8c0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.209-1.791 4-4 4s-4-1.791-4-4z"></path>
</svg>

After

Width:  |  Height:  |  Size: 709 B

View File

@ -1,6 +1,6 @@
import { get } from '../api';
function initActorActions(_store, _router) {
function initActorActions(store, _router) {
async function fetchActors({ _commit }, actorId) {
const networks = await get(`/actors/${actorId || ''}`);
@ -8,7 +8,11 @@ function initActorActions(_store, _router) {
}
async function fetchActorReleases({ _commit }, actorId) {
const releases = await get(`/actors/${actorId}/releases`);
const releases = await get(`/actors/${actorId}/releases`, {
filter: store.state.ui.filter,
after: store.getters.after,
before: store.getters.before,
});
return releases;
}

View File

@ -29,6 +29,8 @@ function init() {
},
methods: {
formatDate: (date, format) => dayjs(date).format(format),
isAfter: (dateA, dateB) => dayjs(dateA).isAfter(dateB),
isBefore: (dateA, dateB) => dayjs(dateA).isBefore(dateB),
},
});

View File

@ -1,6 +1,6 @@
import { get } from '../api';
function initSitesActions(_store, _router) {
function initSitesActions(store, _router) {
async function fetchSites({ _commit }, siteId) {
const sites = await get(`/sites/${siteId || ''}`);
@ -8,7 +8,11 @@ function initSitesActions(_store, _router) {
}
async function fetchSiteReleases({ _commit }, siteId) {
const releases = await get(`/sites/${siteId}/releases`);
const releases = await get(`/sites/${siteId}/releases`, {
filter: store.state.ui.filter,
after: store.getters.after,
before: store.getters.before,
});
return releases;
}

View File

@ -1,6 +1,6 @@
import { get } from '../api';
function initTagsActions(_store, _router) {
function initTagsActions(store, _router) {
async function fetchTags({ _commit }, tagId) {
const tags = await get(`/tags/${tagId || ''}`);
@ -8,7 +8,11 @@ function initTagsActions(_store, _router) {
}
async function fetchTagReleases({ _commit }, tagId) {
const releases = await get(`/tags/${tagId}/releases`);
const releases = await get(`/tags/${tagId}/releases`, {
filter: store.state.ui.filter,
after: store.getters.after,
before: store.getters.before,
});
return releases;
}

View File

@ -132,15 +132,31 @@
align-items: center;
justify-content: space-between;
position: absolute;
font-size: 0;
}
.site[data-v-3abcf101],
.date[data-v-3abcf101] {
color: #fff;
background: rgba(0, 0, 0, 0.5);
position: relative;
font-size: .8rem;
padding: .25rem;
text-decoration: none;
}
.date.upcoming[data-v-3abcf101]:before {
content: '';
color: #fff;
background: #ff6c88;
width: .25rem;
display: inline-block;
position: absolute;
top: 0;
bottom: 0;
left: -.75rem;
padding: .25rem;
font-size: .8rem;
font-weight: bold;
}
.site[data-v-3abcf101] {
font-weight: bold;
}
@ -245,8 +261,7 @@
max-width: 100%;
}
.item[data-v-cbb14462] {
height: 100%;
max-height: 18rem;
height: 18rem;
vertical-align: middle;
}
@ -377,9 +392,12 @@
.hideable[data-v-2bc41e74] {
display: none;
}
.showable[data-v-2bc41e74] {
.row .showable[data-v-2bc41e74] {
display: block;
}
.tidbit .showable[data-v-2bc41e74] {
display: inline-block;
}
.logo-site[data-v-2bc41e74] {
width: 15rem;
max-width: 100%;

View File

@ -103,7 +103,7 @@ async function storeRelease(release) {
likes: release.rating && release.rating.likes,
dislikes: release.rating && release.rating.dislikes,
rating: release.rating && release.rating.stars && Math.floor(release.rating.stars),
deep: argv.deep,
deep: Boolean(argv.deep && release.url && !release.upcoming),
};
const releaseEntries = await knex('releases')
@ -201,13 +201,15 @@ async function fetchReleases() {
const [newReleases, upcomingReleases] = await Promise.all([
fetchNewReleases(scraper, site, afterDate),
scraper.fetchUpcoming ? await scraper.fetchUpcoming(site) : [],
scraper.fetchUpcoming ? scraper.fetchUpcoming(site) : [],
]);
console.log(`${site.name}: Found ${newReleases.length} recent releases, ${upcomingReleases.length} upcoming releases`);
const markedUpcomingReleases = upcomingReleases.map(release => ({ ...release, upcoming: true }));
const finalReleases = argv.deep
? await Promise.map(newReleases, async (release) => {
? await Promise.map([...newReleases, ...markedUpcomingReleases], async (release) => {
if (release.url) {
const scene = await fetchScene(release.url, release);

View File

@ -7,6 +7,8 @@ const moment = require('moment');
const { matchTags } = require('../tags');
const pluckPhotos = require('../utils/pluck-photos');
async function fetchPhotos(url) {
const res = await bhttp.get(url);
@ -23,7 +25,7 @@ function scrapePhotos(html) {
return photos;
}
async function getPhotos(entryId, page = 1) {
async function getPhotos(entryId, site, page = 1) {
const albumUrl = `https://www.julesjordan.com/trial/gallery.php?id=${entryId}&type=highres&page=${page}`;
const html = await fetchPhotos(albumUrl);
@ -41,7 +43,14 @@ async function getPhotos(entryId, page = 1) {
concurrency: 2,
});
return photos.concat(otherPhotos.flat());
const allPhotos = photos.concat(otherPhotos.flat());
const photoLimit = (site.network.parameters && site.network.parameters.photoLimit) || 25;
const photoIndexes = pluckPhotos(allPhotos.length - 1, photoLimit);
const pluckedPhotos = photoIndexes.map(photoIndex => allPhotos[photoIndex]);
return pluckedPhotos;
}
function scrapeLatest(html, site) {
@ -51,7 +60,7 @@ function scrapeLatest(html, site) {
return scenesElements.map((element) => {
const photoElement = $(element).find('a img.thumbs');
const photoCount = Number(photoElement.attr('cnt'));
const photos = Array.from({ length: photoCount }, (value, index) => photoElement.attr(`src${index}_1x`)).filter(photoUrl => photoUrl !== undefined);
const [poster, ...photos] = Array.from({ length: photoCount }, (value, index) => photoElement.attr(`src${index}_1x`)).filter(photoUrl => photoUrl !== undefined);
const sceneLinkElement = $(element).children('a').eq(1);
const url = sceneLinkElement.attr('href');
@ -73,8 +82,9 @@ function scrapeLatest(html, site) {
title,
actors,
date,
site,
poster,
photos,
site,
};
});
}
@ -84,10 +94,6 @@ function scrapeUpcoming(html, site) {
const scenesElements = $('#coming_soon_carousel').find('.table').toArray();
return scenesElements.map((element) => {
const photoElement = $(element).find('a img.thumbs');
const photoCount = Number(photoElement.attr('cnt'));
const photos = Array.from({ length: photoCount }, (value, index) => photoElement.attr(`src${index}_1x`)).filter(photoUrl => photoUrl !== undefined);
const entryId = $(element).find('.upcoming_updates_thumb').attr('id').match(/\d+/)[0];
const details = $(element).find('.update_details_comingsoon')
@ -109,13 +115,23 @@ function scrapeUpcoming(html, site) {
.utc($(element).find('.update_date_comingsoon').text().slice(7), 'MM/DD/YYYY')
.toDate();
const photoElement = $(element).find('a img.thumbs');
const poster = photoElement.attr('src');
const videoClass = $(element).find('.update_thumbnail div').attr('class');
const videoScript = $(element).find(`script:contains(${videoClass})`).html();
const trailer = videoScript.slice(videoScript.indexOf('https://'), videoScript.indexOf('.mp4') + 4);
return {
url: null,
entryId,
title,
date,
actors,
photos,
poster,
trailer: {
src: trailer,
},
rating: null,
site,
};
@ -148,7 +164,7 @@ async function scrapeScene(html, url, site) {
const trailerLine = infoLines.find(line => line.match('movie["Trailer_720"]'));
const trailer = trailerLine.slice(trailerLine.indexOf('path:"') + 6, trailerLine.indexOf('",movie'));
const photos = await getPhotos(entryId);
const photos = await getPhotos(entryId, site);
const rawTags = $('.update_tags a').map((tagIndex, tagElement) => $(tagElement).text()).toArray();
const tags = await matchTags(rawTags);

View File

@ -2,7 +2,7 @@
// pick {photoLimit} photos evenly distributed photos from a set with {photoTotal} photos, return array of indexes starting at 1
function pluckPhotos(photoTotal, photoLimit) {
return [1].concat(Array.from({ length: photoLimit - 1 }, (value, index) => Math.floor((index + 1) * (photoTotal / (photoLimit - 1)))));
return [1].concat(Array.from({ length: photoLimit - 1 }, (value, index) => Math.round((index + 1) * (photoTotal / (photoLimit - 1)))));
}
module.exports = pluckPhotos;

View File

@ -29,7 +29,7 @@ async function fetchActorReleasesApi(req, res) {
const releases = await fetchActorReleases({
id: actorId,
slug: actorSlug,
});
}, req.query);
res.send(releases);
}
@ -53,7 +53,7 @@ async function fetchSiteReleasesApi(req, res) {
const releases = await fetchSiteReleases({
id: siteId,
slug: siteSlug,
});
}, req.query);
res.send(releases);
}
@ -65,7 +65,7 @@ async function fetchTagReleasesApi(req, res) {
const releases = await fetchTagReleases({
id: tagId,
slug: tagSlug,
});
}, req.query);
res.send(releases);
}