Allowing HTML in disclaimer.

Reviewed-on: http://gitea.unknown.name/DebaucheryLibrarian/traxxx/pulls/44

.eslintrc

@@ -2,7 +2,7 @@
     "root": true,
     "extends": ["airbnb-base", "plugin:vue/recommended"],
     "parserOptions": {
-        "parser": "babel-eslint",
+        "parser": "@babel/eslint-parser",
         "ecmaVersion": 2019,
         "sourceType": "module"
     },
@@ -17,10 +17,11 @@
         "vue/html-indent": ["error", "tab"],
         "vue/multiline-html-element-content-newline": 0,
         "vue/singleline-html-element-content-newline": 0,
+		"vue/multi-word-component-names": 0,
         "no-param-reassign": ["error", {
             "props": true,
             "ignorePropertyModificationsFor": ["state", "acc"]
-        }],
+        }]
     },
     "globals": {
         "CONFIG": true

.gitignore

@@ -2,9 +2,12 @@ node_modules/
 dist/
 log/
 media/
+html/
 public/js/*
 public/css/*
 config/*
 !config/default.js
 assets/js/config/
 !assets/js/config/default.js
+*.heapprofile
+*.heapsnapshot

.nvmrc

@@ -1 +1 @@
-14.15.4
+16.13.0

assets/components/actors/actor.vue

@@ -6,7 +6,7 @@
 		<div class="actor-header">
 			<h2 class="header-name">
 				<span v-if="actor.entity">{{ actor.name }} ({{ actor.entity.name }})</span>
-				<span v-else="">{{ actor.name }}</span>
+				<span v-else>{{ actor.name }}</span>
 
 				<Gender
 					:gender="actor.gender"
@@ -361,7 +361,10 @@
 					:available-actors="actor.actors"
 				/>
 
-				<Releases :releases="releases" />
+				<Releases
+					:releases="releases"
+					:done="done"
+				/>
 
 				<Pagination
 					:items-total="totalCount"
@@ -389,6 +392,8 @@ import Social from './social.vue';
 import StashButton from '../stashes/button.vue';
 
 async function fetchActor(scroll = true) {
+	this.done = false;
+
 	const { actor, releases, totalCount } = await this.$store.dispatch('fetchActorById', {
 		actorId: Number(this.$route.params.actorId),
 		limit: this.limit,
@@ -400,6 +405,7 @@ async function fetchActor(scroll = true) {
 	this.releases = releases;
 	this.totalCount = totalCount;
 	this.stashedBy = actor.stashes;
+	this.done = true;
 
 	if (this.$refs.filter && scroll) {
 		this.$refs.filter.$el.scrollIntoView();
@@ -463,6 +469,7 @@ export default {
 		return {
 			actor: null,
 			releases: null,
+			done: false,
 			totalCount: 0,
 			limit: 20,
 			pageTitle: null,

assets/components/actors/actors.vue

@@ -1,216 +1,246 @@
 <template>
-	<div class="actors">
+	<div
+		ref="content"
+		class="actors"
+	>
 		<nav
-			ref="filter"
-			class="filter"
+			ref="filters"
+			class="filters"
 		>
-			<ul class="genders nolist">
-				<li class="gender">
-					<router-link
-						:to="{ name: 'actors', params: { gender: 'all', letter, pageNumber: 1 } }"
-						:class="{ selected: gender === 'all' }"
-						class="gender-link all"
-					>all</router-link>
-				</li>
-				<li class="gender">
-					<router-link
-						:to="{ name: 'actors', params: { gender: 'female', letter, pageNumber: 1 } }"
-						:class="{ selected: gender === 'female' }"
-						class="gender-link female"
-					><Gender gender="female" /></router-link>
-				</li>
-				<li class="gender">
-					<router-link
-						:to="{ name: 'actors', params: { gender: 'male', letter, pageNumber: 1 } }"
-						:class="{ selected: gender === 'male' }"
-						class="gender-link male"
-						replace
-					><Gender gender="male" /></router-link>
-				</li>
-				<li class="gender">
-					<router-link
-						:to="{ name: 'actors', params: { gender: 'trans', letter, pageNumber: 1 } }"
-						:class="{ selected: gender === 'trans' }"
-						class="gender-link transsexual"
-						replace
-					><Gender gender="transsexual" /></router-link>
-				</li>
-				<li class="gender">
-					<router-link
-						:to="{ name: 'actors', params: { gender: 'other', letter, pageNumber: 1 } }"
-						:class="{ selected: gender === 'other' }"
-						class="gender-link other"
-						replace
-					><Icon icon="question5" /></router-link>
-				</li>
-			</ul>
+			<div class="filters-row">
+				<ul class="genders nolist">
+					<li class="gender">
+						<router-link
+							:to="{ name: 'actors', params: { gender: 'all', pageNumber: 1 }, query: $route.query }"
+							:class="{ selected: gender === 'all' }"
+							class="gender-link all"
+						>all</router-link>
+					</li>
+					<li class="gender">
+						<router-link
+							:to="{ name: 'actors', params: { gender: 'female', pageNumber: 1 }, query: $route.query }"
+							:class="{ selected: gender === 'female' }"
+							class="gender-link female"
+						><Gender gender="female" /></router-link>
+					</li>
+					<li class="gender">
+						<router-link
+							:to="{ name: 'actors', params: { gender: 'male', pageNumber: 1 }, query: $route.query }"
+							:class="{ selected: gender === 'male' }"
+							class="gender-link male"
+							replace
+						><Gender gender="male" /></router-link>
+					</li>
+					<li class="gender">
+						<router-link
+							:to="{ name: 'actors', params: { gender: 'trans', pageNumber: 1 }, query: $route.query }"
+							:class="{ selected: gender === 'trans' }"
+							class="gender-link transsexual"
+							replace
+						><Gender gender="transsexual" /></router-link>
+					</li>
+					<li class="gender">
+						<router-link
+							:to="{ name: 'actors', params: { gender: 'other', pageNumber: 1 }, query: $route.query }"
+							:class="{ selected: gender === 'other' }"
+							class="gender-link other"
+							replace
+						><Icon icon="question5" /></router-link>
+					</li>
+				</ul>
 
-			<ul class="letters nolist">
-				<li
-					v-for="letterX in letters"
-					:key="letterX"
-					class="letter"
-				>
-					<router-link
-						:to="{ name: 'actors', params: { gender, letter: letterX, pageNumber: 1 } }"
-						:class="{ selected: letterX === letter }"
-						class="letter-link"
-						replace
-					>{{ letterX || 'All' }}</router-link>
-				</li>
-			</ul>
-		</nav>
+				<ul class="filters-attributes nolist">
+					<li>
+						<Tooltip class="filter boobs">
+							<span
+								class="filter-trigger"
+								:class="{ enabled: ageRequired }"
+							><Icon icon="vcard" />Age</span>
 
-		<nav class="filter">
-			<ul class="nolist">
-				<li>
-					<Tooltip class="filter boobs">
-						<span
-							class="filter-trigger"
-							:class="{ enabled: ageRequired }"
-						><Icon icon="vcard" />Age</span>
-
-						<template v-slot:tooltip>
-							<RangeFilter
-								label="age"
-								:min="18"
-								:max="100"
-								:value="age"
-								:disabled="!ageRequired"
-								@enable="(checked) => updateValue('ageRequired', checked, true)"
-								@input="(range) => updateValue('age', range, false)"
-								@change="(range) => updateValue('age', range, true)"
-							>
-								<template v-slot:start><Icon icon="leaf" /></template>
-								<template v-slot:end><Icon icon="tree3" /></template>
-							</RangeFilter>
-
-							<div class="filter-section">
-								<label class="filter-label">
-									<span class="label">
-										<Checkbox
-											:checked="dobRequired"
-											class="checkbox"
-											@change="(checked) => updateValue('dobRequired', checked, true)"
-										/>Date of birth
-									</span>
-								</label>
-
-								<div
-									class="input-container"
-									@click="() => updateValue('dobRequired', true, true)"
+							<template v-slot:tooltip>
+								<RangeFilter
+									label="age"
+									:min="18"
+									:max="100"
+									:value="age"
+									:disabled="!ageRequired"
+									@enable="(checked) => updateValue('ageRequired', checked, true)"
+									@input="(range) => updateValue('age', range, false)"
+									@change="(range) => updateValue('age', range, true)"
 								>
-									<input
-										v-model="dob"
-										:disabled="!dobRequired"
-										type="date"
-										class="input"
-										@change="updateFilters"
+									<template v-slot:start><Icon icon="leaf" /></template>
+									<template v-slot:end><Icon icon="tree3" /></template>
+								</RangeFilter>
+
+								<div class="filter-section">
+									<label class="filter-label">
+										<span class="label">
+											<Checkbox
+												:checked="dobRequired"
+												class="checkbox"
+												@change="(checked) => updateValue('dobRequired', checked, true)"
+											/>Date of birth
+										</span>
+									</label>
+
+									<div
+										class="input-container"
+										@click="() => updateValue('dobRequired', true, true)"
 									>
+										<input
+											v-model="dob"
+											:disabled="!dobRequired"
+											type="date"
+											class="input"
+											@change="updateFilters"
+										>
+									</div>
 								</div>
-							</div>
-						</template>
-					</Tooltip>
-				</li>
+							</template>
+						</Tooltip>
+					</li>
 
-				<li>
-					<Tooltip class="filter">
-						<span
-							class="filter-trigger boobs"
-							:class="{ enabled: boobSizeRequired || naturalBoobs !== 1 }"
-						><Icon icon="boobs" />Boobs</span>
+					<li>
+						<Tooltip class="filter">
+							<span
+								class="filter-trigger boobs"
+								:class="{ enabled: boobSizeRequired || naturalBoobs !== 1 }"
+							><Icon icon="boobs" />Boobs</span>
 
-						<template v-slot:tooltip>
-							<RangeFilter
-								label="size"
-								:min="0"
-								:max="boobSizes.length - 1"
-								:value="boobSize"
-								:values="boobSizes"
-								:disabled="!boobSizeRequired"
-								@enable="(checked) => updateValue('boobSizeRequired', checked, true)"
-								@input="(range) => updateValue('boobSize', range, false)"
-								@change="(range) => updateValue('boobSize', range, true)"
-							>
-								<template v-slot:start><Icon icon="boobs-small" /></template>
-								<template v-slot:end><Icon icon="boobs-big" /></template>
-							</RangeFilter>
-
-							<div class="filter-section">
-								<span class="filter-label">Enhanced</span>
-
-								<span
-									:class="{ [['off', 'default', 'on'][naturalBoobs]]: true }"
-									class="toggle-container noclick"
+							<template v-slot:tooltip>
+								<RangeFilter
+									label="size"
+									:min="0"
+									:max="boobSizes.length - 1"
+									:value="boobSize"
+									:values="boobSizes"
+									:disabled="!boobSizeRequired"
+									@enable="(checked) => updateValue('boobSizeRequired', checked, true)"
+									@input="(range) => updateValue('boobSize', range, false)"
+									@change="(range) => updateValue('boobSize', range, true)"
 								>
-									<span
-										class="toggle-label off"
-										@click="updateValue('naturalBoobs', 0)"
-									><Icon icon="leaf" /></span>
+									<template v-slot:start><Icon icon="boobs-small" /></template>
+									<template v-slot:end><Icon icon="boobs-big" /></template>
+								</RangeFilter>
 
-									<input
-										v-model.number="naturalBoobs"
-										class="toggle"
-										type="range"
-										min="0"
-										max="2"
-										@change="updateFilters"
+								<div class="filter-section">
+									<span class="filter-label">Enhanced</span>
+
+									<span
+										:class="{ [['off', 'default', 'on'][naturalBoobs]]: true }"
+										class="toggle-container noclick"
 									>
+										<span
+											class="toggle-label off"
+											@click="updateValue('naturalBoobs', 0)"
+										><Icon icon="leaf" /></span>
 
-									<span
-										class="toggle-label on"
-										@click="updateValue('naturalBoobs', 2)"
-									><Icon icon="magic-wand2" /></span>
-								</span>
-							</div>
-						</template>
-					</Tooltip>
-				</li>
+										<input
+											v-model.number="naturalBoobs"
+											class="toggle"
+											type="range"
+											min="0"
+											max="2"
+											@change="updateFilters"
+										>
 
-				<li>
-					<Tooltip class="filter boobs">
-						<span
-							class="filter-trigger"
-							:class="{ enabled: heightRequired || weightRequired }"
-						><Icon icon="rulers" />Physique</span>
+										<span
+											class="toggle-label on"
+											@click="updateValue('naturalBoobs', 2)"
+										><Icon icon="magic-wand2" /></span>
+									</span>
+								</div>
+							</template>
+						</Tooltip>
+					</li>
 
-						<template v-slot:tooltip>
-							<RangeFilter
-								label="height"
-								:min="50"
-								:max="220"
-								:value="height"
-								:disabled="!heightRequired"
-								unit="cm"
-								@enable="(checked) => updateValue('heightRequired', checked, true)"
-								@input="(range) => updateValue('height', range, false)"
-								@change="(range) => updateValue('height', range, true)"
-							>
-								<template v-slot:start><Icon icon="height-short" /></template>
-								<template v-slot:end><Icon icon="height" /></template>
-							</RangeFilter>
+					<li>
+						<Tooltip class="filter boobs">
+							<span
+								class="filter-trigger"
+								:class="{ enabled: heightRequired || weightRequired }"
+							><Icon icon="rulers" />Physique</span>
 
-							<RangeFilter
-								label="weight"
-								:min="30"
-								:max="200"
-								:value="weight"
-								:disabled="!weightRequired"
-								unit="kg"
-								@enable="(checked) => updateValue('weightRequired', checked, true)"
-								@input="(range) => updateValue('weight', range, false)"
-								@change="(range) => updateValue('weight', range, true)"
-							>
-								<template v-slot:start><Icon icon="meter-slow" /></template>
-								<template v-slot:end><Icon icon="meter-fast" /></template>
-							</RangeFilter>
-						</template>
-					</Tooltip>
-				</li>
-			</ul>
+							<template v-slot:tooltip>
+								<RangeFilter
+									label="height"
+									:min="50"
+									:max="220"
+									:value="height"
+									:disabled="!heightRequired"
+									unit="cm"
+									@enable="(checked) => updateValue('heightRequired', checked, true)"
+									@input="(range) => updateValue('height', range, false)"
+									@change="(range) => updateValue('height', range, true)"
+								>
+									<template v-slot:start><Icon icon="height-short" /></template>
+									<template v-slot:end><Icon icon="height" /></template>
+								</RangeFilter>
+
+								<RangeFilter
+									label="weight"
+									:min="30"
+									:max="200"
+									:value="weight"
+									:disabled="!weightRequired"
+									unit="kg"
+									@enable="(checked) => updateValue('weightRequired', checked, true)"
+									@input="(range) => updateValue('weight', range, false)"
+									@change="(range) => updateValue('weight', range, true)"
+								>
+									<template v-slot:start><Icon icon="meter-slow" /></template>
+									<template v-slot:end><Icon icon="meter-fast" /></template>
+								</RangeFilter>
+							</template>
+						</Tooltip>
+					</li>
+
+					<li>
+						<Tooltip class="filter">
+							<span
+								:class="{ enabled: country }"
+								class="filter-trigger"
+							><img
+								v-if="$route.query.c"
+								:src="`/img/flags/${$route.query.c.toLowerCase()}.svg`"
+								class="flag"
+							><Icon
+								v-else
+								icon="earth2"
+							/>Country</span>
+
+							<template v-slot:tooltip>
+								<input
+									v-model="countryQuery"
+									placeholder="Search"
+									class="input"
+								>
+
+								<Countries
+									v-if="!countryQuery"
+									:countries="topCountries"
+									:selected-country="country"
+									:update-value="updateValue"
+								/>
+
+								<Countries
+									:countries="filteredCountries"
+									:selected-country="country"
+									:update-value="updateValue"
+								/>
+							</template>
+						</Tooltip>
+					</li>
+				</ul>
+			</div>
+
+			<SearchBar :placeholder="`Search ${totalCount} actors`" />
 		</nav>
 
-		<div class="tiles">
+		<div
+			ref="tiles"
+			class="tiles"
+		>
 			<Actor
 				v-for="actor in actors"
 				:key="`actor-${actor.id}`"
@@ -235,11 +265,14 @@ import dayjs from 'dayjs';
 import Actor from './tile.vue';
 import Gender from './gender.vue';
 import Checkbox from '../form/checkbox.vue';
+import Countries from './countries.vue';
 import RangeFilter from './filter-range.vue';
+import SearchBar from '../search/bar.vue';
 import Pagination from '../pagination/pagination.vue';
 
 const toggleValues = [true, null, false];
-const boobSizes = 'ABCDEFGHZ'.split('');
+const boobSizes = 'ABCDEFGHIJKZ'.split('');
+const topCountries = ['AU', 'BR', 'CZ', 'DE', 'JP', 'RU', 'GB', 'US'];
 
 function updateFilters() {
 	this.$router.push({
@@ -247,15 +280,16 @@ function updateFilters() {
 		params: {
 			pageNumber: 1,
 			gender: this.gender,
-			letter: this.letter,
 		},
 		query: {
 			nb: this.naturalBoobs !== 1 ? this.naturalBoobs : undefined,
 			bs: this.boobSizeRequired ? this.boobSize.join(',') : undefined,
 			h: this.heightRequired ? this.height.join(',') : undefined,
 			w: this.weightRequired ? this.weight.join(',') : undefined,
+			c: this.country ? this.country : undefined,
 			age: this.ageRequired ? this.age.join(',') : undefined,
 			dob: this.dobRequired ? this.dob : undefined,
+			query: this.$route.query.query,
 		},
 	});
 }
@@ -271,29 +305,39 @@ function updateValue(prop, value, load = true) {
 async function fetchActors(scroll) {
 	const curatedGender = this.gender.replace('trans', 'transsexual');
 
-	const { actors, totalCount } = await this.$store.dispatch('fetchActors', {
+	const { actors, countries, totalCount } = await this.$store.dispatch('fetchActors', {
 		limit: this.limit,
 		pageNumber: Number(this.$route.params.pageNumber) || 1,
-		letter: this.letter.replace('all', ''),
+		query: this.$route.query.query,
 		gender: curatedGender === 'other' ? null : curatedGender,
 		age: this.ageRequired && this.age,
 		dob: this.dobRequired && this.dob,
 		boobSize: this.boobSizeRequired && this.boobSize,
+		country: this.country,
 		naturalBoobs: toggleValues[this.naturalBoobs] ?? null,
 		height: this.heightRequired && this.height,
 		weight: this.weightRequired && this.weight,
 	});
 
+	const countriesByAlpha2 = countries.reduce((acc, country) => ({ ...acc, [country.alpha2]: country }), {});
+
 	this.actors = actors;
 	this.totalCount = totalCount;
 
+	this.countries = countries;
+	this.topCountries = [...(this.country && !topCountries.includes(this.country) ? [this.country] : []), ...topCountries].map(alpha2 => countriesByAlpha2[alpha2]);
+
 	if (scroll) {
-		this.$refs.filter?.scrollIntoView();
+		this.$refs.tiles?.scrollIntoView();
 	}
 }
 
-function letter() {
-	return this.$route.params.letter || 'all';
+function filteredCountries() {
+	const countryQueryExpression = new RegExp(this.countryQuery, 'i');
+
+	return this.countryQuery?.length > 0
+		? this.countries.filter(country => countryQueryExpression.test(country.name) || countryQueryExpression.test(country.alpha2))
+		: this.countries;
 }
 
 function gender() {
@@ -302,8 +346,7 @@ function gender() {
 
 async function route(to, from) {
 	const scroll = to.params.pageNumber !== from.params.pageNumber
-		|| to.params.gender !== from.params.gender
-		|| to.params.letter !== from.params.letter;
+		|| to.params.gender !== from.params.gender;
 
 	await this.fetchActors(scroll);
 }
@@ -318,17 +361,21 @@ export default {
 	components: {
 		Actor,
 		Checkbox,
+		Countries,
 		Gender,
 		RangeFilter,
+		SearchBar,
 		Pagination,
 	},
 	data() {
 		return {
 			actors: [],
+			countries: [],
+			topCountries: [],
+			countryQuery: null,
 			pageTitle: null,
 			totalCount: 0,
 			limit: 50,
-			letters: ['all'].concat(Array.from({ length: 26 }, (value, index) => String.fromCharCode(index + 97).toUpperCase())),
 			age: this.$route.query.age?.split(',') || [18, 100],
 			ageRequired: !!this.$route.query.age,
 			dob: this.$route.query.dob || dayjs().subtract(21, 'years').format('YYYY-MM-DD'),
@@ -336,6 +383,7 @@ export default {
 			boobSizes,
 			boobSize: this.$route.query.bs?.split(',') || ['A', 'Z'],
 			boobSizeRequired: !!this.$route.query.bs,
+			country: this.$route.query.c || null,
 			naturalBoobs: Number(this.$route.query.nb) || 1,
 			height: this.$route.query.h?.split(',').map(Number) || [50, 220],
 			heightRequired: !!this.$route.query.h,
@@ -344,8 +392,8 @@ export default {
 		};
 	},
 	computed: {
-		letter,
 		gender,
+		filteredCountries,
 	},
 	watch: {
 		$route: route,
@@ -393,42 +441,53 @@ export default {
 .actors {
     display: flex;
     flex-direction: column;
+	flex-grow: 1;
+	overflow-y: auto;
 }
 
 .tiles {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
+	grid-template-rows: min-content;
     grid-gap: .5rem;
     padding: 1rem;
     flex-grow: 1;
 }
 
-.filter {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 0 1rem;
-    margin: 0 0 1rem 0;
+.search {
+	width: 0;
+	justify-content: flex-end;
+	flex-grow: 1;
+	box-sizing: border-box;
+	padding: 0 1rem;
+}
 
-	&:first-child {
-		margin: 1rem 0;
-	}
+.filters,
+.filters-row {
+    display: flex;
+    justify-content: flex-end;
+    align-items: center;
+}
+
+.filters {
+	margin: 1rem 0 .5rem 0;
+}
+
+.filters-row,
+.filter {
+	padding: 0 1rem;
 }
 
 .genders {
     display: flex;
     flex-shrink: 0;
     padding: 0 .5rem 0 0;
-    border-right: solid 1px var(--shadow-hint);
-    margin: 0 1rem 0 0;
 }
 
-.letter,
 .gender {
     display: inline-block;
 }
 
-.letter-link,
 .gender-link {
     width: 2.5rem;
     height: 2.5rem;
@@ -478,7 +537,8 @@ export default {
 	color: var(--shadow);
 	font-weight: bold;
 
-	.icon {
+	.icon,
+	.flag {
 		fill: var(--shadow);
 		width: 1rem;
 		height: 1rem;
@@ -661,10 +721,45 @@ export default {
 	}
 }
 
-@media(max-width: $breakpoint) {
-    .genders {
-        flex-direction: column;
+@media(max-width: $breakpoint-mega) {
+    .filters {
+        flex-direction: column-reverse;
     }
+
+	::v-deep(.search) {
+		width: 100%;
+		justify-content: center;
+		margin: 0 0 1rem 0;
+	}
+}
+
+@media(max-width: $breakpoint-kilo) {
+	.filters {
+		margin: 1rem 0 0 0;
+	}
+
+    .filters-row {
+        flex-direction: column;
+
+		.filter {
+			padding: 0 1rem 1rem 1rem;
+		}
+    }
+
+	.filters-attributes {
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: center;
+	}
+
+	.genders {
+		padding: 0;
+		margin: 0 0 1.5rem 0;
+	}
+
+	.tiles {
+		padding: .5rem 1rem 1rem 1rem;
+	}
 }
 
 @media(max-width: $breakpoint-micro) {

assets/components/actors/countries.vue

@@ -0,0 +1,88 @@
+<template>
+	<ul class="countries nolist">
+		<li
+			v-for="country in countries"
+			:key="country.alpha2"
+			:title="country.name"
+			:class="{ selected: selectedCountry === country.alpha2 }"
+			class="country"
+			@click="updateValue('country', country.alpha2, true)"
+		>
+			<img
+				:src="`/img/flags/${country.alpha2.toLowerCase()}.svg`"
+				class="flag"
+			>
+
+			<span class="country-name">{{ country.alias || country.name }}</span>
+
+			<Icon
+				v-if="selectedCountry === country.alpha2"
+				icon="cross2"
+				@click.native.stop="updateValue('country', null, true)"
+			/>
+		</li>
+	</ul>
+</template>
+
+<script>
+export default {
+	props: {
+		countries: {
+			type: Array,
+			default: () => [],
+		},
+		selectedCountry: {
+			type: String,
+			default: null,
+		},
+		updateValue: {
+			type: Function,
+			default: null,
+		},
+	},
+};
+</script>
+
+<style lang="scss" scoped>
+.countries:not(:last-child) {
+	border-bottom: solid 1px var(--shadow-hint);
+}
+
+.country {
+	width: 15rem;
+	display: flex;
+	align-items: center;
+	overflow: hidden;
+
+	.flag {
+		width: 1.25rem;
+		padding: .25rem .5rem;
+	}
+
+	.icon {
+		padding: .25rem .5rem;;
+		fill: var(--shadow);
+
+		&:hover {
+			fill: var(--shadow-strong);
+		}
+	}
+
+	&:hover {
+		background: var(--shadow-hint);
+		cursor: pointer;
+	}
+
+	&.selected {
+		font-weight: bold;
+	}
+}
+
+.country-name {
+	flex-grow: 1;
+	white-space: nowrap;
+	overflow: hidden;
+	text-overflow: ellipsis;
+	padding: .25rem .5rem;
+}
+</style>

assets/components/actors/tile.vue

@@ -3,7 +3,7 @@
 		v-if="actor"
 		class="actor"
 	>
-		<router-link
+		<RouterLink
 			:to="{ name: 'actor', params: { actorId: actor.id, actorSlug: actor.slug } }"
 			class="link"
 		>
@@ -15,7 +15,7 @@
 					class="name"
 				>{{ actor.name }}</span>
 
-				<router-link
+				<RouterLink
 					v-if="actor.entity"
 					v-tooltip="actor.entity.name"
 					:to="{ name: actor.entity.type, params: { entitySlug: actor.entity.slug, range: 'new', pageNumber: 1 } }"
@@ -25,7 +25,7 @@
 						:src="`/img/logos/${actor.entity.slug}/favicon_dark.png`"
 						class="favicon-icon"
 					>
-				</router-link>
+				</RouterLink>
 
 				<Icon
 					v-if="alias"
@@ -60,19 +60,26 @@
 				></span>
 
 				<Icon
-					v-show="favorited"
+					v-show="(!stash || stash.primary) && favorited"
 					icon="heart7"
 					class="stash stashed"
 					@click.prevent.native="unstashActor"
 				/>
 
 				<Icon
-					v-show="favorited === false"
+					v-show="(!stash || stash.primary) && favorited === false"
 					icon="heart8"
 					class="stash unstashed"
 					@click.prevent.native="stashActor"
 				/>
 
+				<Icon
+					v-show="stash && !stash.primary"
+					icon="cross2"
+					class="stash unstash"
+					@click.prevent.native="unstashActor"
+				/>
+
 				<span
 					class="details"
 				>
@@ -122,7 +129,7 @@
 					/>
 				</span>
 			</div>
-		</router-link>
+		</RouterLink>
 	</div>
 </template>
 
@@ -145,12 +152,14 @@ async function stashActor() {
 }
 
 async function unstashActor() {
-	this.favorited = false;
+	if (!this.stash || this.stash.primary) {
+		this.favorited = false;
+	}
 
 	try {
 		await this.$store.dispatch('unstashActor', {
 			actorId: this.actor.id,
-			stashId: this.$store.getters.favorites.id,
+			stashId: this.stash?.id || this.$store.getters.favorites.id,
 		});
 
 		this.$emit('stash', false);
@@ -176,6 +185,10 @@ export default {
 			type: Object,
 			default: null,
 		},
+		stash: {
+			type: Object,
+			default: null,
+		},
 	},
 	emits: ['stash'],
 	data() {
@@ -201,7 +214,7 @@ export default {
     display: inline-block;
     position: relative;
     box-shadow: 0 0 3px var(--darken-weak);
-    background: var(--background);
+    background: var(--info);
 	overflow: hidden;
 
     &::before {
@@ -209,6 +222,11 @@ export default {
         display: inline-block;
         padding-bottom: 150%;
     }
+
+	&:hover .unstashed,
+	&:hover .unstash {
+		fill: var(--lighten);
+	}
 }
 
 .link {
@@ -219,12 +237,8 @@ export default {
     position: absolute;
     top: 0;
     left: 0;
-    color: var(--text);
+    color: var(--text-light);
     text-decoration: none;
-
-    &:hover {
-        color: var(--primary);
-    }
 }
 
 .handle {
@@ -235,7 +249,8 @@ export default {
 	box-shadow: 0 0 3px var(--shadow);
 
 	.name {
-		padding: .5rem;
+		padding: .25rem .5rem;
+		font-size: .9rem;
 	}
 
 	.alias {
@@ -298,8 +313,8 @@ export default {
 }
 
 .stash {
-	width: 1.25rem;
-	height: 1.25rem;
+	width: 1.5rem;
+	height: 1.5rem;
 	padding: .25rem .25rem .5rem .5rem;
 	position: absolute;
 	top: 0;
@@ -307,10 +322,15 @@ export default {
 	fill: var(--lighten-weak);
 	filter: drop-shadow(0 0 2px var(--darken));
 
-	&:hover,
+	&:hover.unstashed,
 	&.stashed {
 		fill: var(--primary);
 	}
+
+	&:hover.unstash {
+		fill: var(--text-light);
+		filter: drop-shadow(0 0 2px var(--darken-weak));
+	}
 }
 
 .details {

assets/components/alerts/add.vue

@@ -46,7 +46,7 @@
 								/>
 							</li>
 
-							<template v-slot:tooltip>
+							<template #tooltip>
 								<Search
 									content="actors"
 									@select="actor => addActor(actor)"
@@ -88,7 +88,7 @@
 								/>
 							</li>
 
-							<template v-slot:tooltip>
+							<template #tooltip>
 								<Search
 									content="tags"
 									:defaults="['anal', 'blowbang', 'mfm', 'dp', 'gangbang', 'airtight']"
@@ -126,7 +126,7 @@
 								/>
 							</div>
 
-							<template v-slot:tooltip>
+							<template #tooltip>
 								<Search
 									label="Search channels"
 									content="entities"
@@ -181,7 +181,7 @@
 								/>
 							</li>
 
-							<template v-slot:tooltip>
+							<template #tooltip>
 								<Search
 									content="stashes"
 									@select="stash => addStash(stash)"
@@ -194,6 +194,7 @@
 
 			<div class="dialog-actions right">
 				<button
+					:disabled="actors.length === 0 && tags.length === 0 && !entity"
 					type="submit"
 					class="button button-primary"
 				>Add alert</button>
@@ -210,19 +211,19 @@ import Search from './search.vue';
 
 async function addAlert() {
 	await this.$store.dispatch('addAlert', {
-		actors: this.actors.map(actor => actor.id),
-		tags: this.tags.map(tag => tag.id),
+		actors: this.actors.map((actor) => actor.id),
+		tags: this.tags.map((tag) => tag.id),
 		entity: this.entity?.id,
 		notify: this.notify,
 		email: this.email,
-		stashes: this.stashes.map(stash => stash.id),
+		stashes: this.stashes.map((stash) => stash.id),
 	});
 
 	this.$emit('close', true);
 }
 
 function addActor(actor) {
-	if (!this.actors.some(selectedActor => selectedActor.id === actor.id)) {
+	if (!this.actors.some((selectedActor) => selectedActor.id === actor.id)) {
 		this.actors = this.actors.concat(actor);
 	}
 
@@ -235,7 +236,7 @@ function addEntity(entity) {
 }
 
 function addTag(tag) {
-	if (!this.tags.some(selectedTag => selectedTag.id === tag.id)) {
+	if (!this.tags.some((selectedTag) => selectedTag.id === tag.id)) {
 		this.tags = this.tags.concat(tag);
 	}
 
@@ -243,7 +244,7 @@ function addTag(tag) {
 }
 
 function removeActor(actor) {
-	this.actors = this.actors.filter(listedActor => listedActor.id !== actor.id);
+	this.actors = this.actors.filter((listedActor) => listedActor.id !== actor.id);
 }
 
 function removeEntity() {
@@ -251,11 +252,11 @@ function removeEntity() {
 }
 
 function removeTag(tag) {
-	this.tags = this.tags.filter(listedTag => listedTag.id !== tag.id);
+	this.tags = this.tags.filter((listedTag) => listedTag.id !== tag.id);
 }
 
 function addStash(stash) {
-	if (!this.stashes.some(selectedStash => selectedStash.id === stash.id)) {
+	if (!this.stashes.some((selectedStash) => selectedStash.id === stash.id)) {
 		this.stashes = this.stashes.concat(stash);
 	}
 
@@ -263,7 +264,7 @@ function addStash(stash) {
 }
 
 function removeStash(stash) {
-	this.stashes = this.stashes.filter(listedStash => listedStash.id !== stash.id);
+	this.stashes = this.stashes.filter((listedStash) => listedStash.id !== stash.id);
 }
 
 export default {
@@ -273,6 +274,7 @@ export default {
 		Entity,
 		Search,
 	},
+	emits: ['close'],
 	data() {
 		return {
 			actors: [],
@@ -284,7 +286,6 @@ export default {
 			availableStashes: this.$store.state.auth.user.stashes,
 		};
 	},
-	emits: ['close'],
 	methods: {
 		addActor,
 		addAlert,

assets/components/alerts/search.vue

@@ -43,11 +43,12 @@
 <script>
 async function search() {
 	if (this.content === 'actors') {
-		this.results = await this.$store.dispatch('searchActors', {
+		const { actors } = await this.$store.dispatch('fetchActors', {
 			query: this.query,
-			minLength: 1,
 			limit: 10,
 		});
+
+		this.results = actors;
 	}
 
 	if (this.content === 'entities') {

assets/components/auth/login.vue

@@ -35,11 +35,11 @@
 				class="button button-primary"
 			>Log in</button>
 
-			<router-link
+			<RouterLink
 				v-if="$store.state.auth.signup"
 				:to="{ name: 'signup', query: { ref: $route.query.ref } }"
 				class="link link-external signup"
-			>Sign up</router-link>
+			>Sign up</RouterLink>
 		</template>
 	</form>
 </template>

assets/components/auth/signup.vue

@@ -43,11 +43,11 @@
 				class="button button-primary"
 			>Sign up</button>
 
-			<router-link
+			<RouterLink
 				v-if="$store.state.auth.login"
 				:to="{ name: 'login', query: { ref: $route.query.ref } }"
 				class="link link-external login"
-			>Log in</router-link>
+			>Log in</RouterLink>
 		</template>
 	</form>
 </template>

assets/components/campaigns/campaign.vue

@@ -1,13 +1,13 @@
 <template>
 	<a
 		v-if="campaign"
-		:href="campaign.url"
+		:href="campaign.url || campaign.affiliate?.url"
 		target="_blank"
 		class="campaign"
 	>
 		<img
-			v-if="campaign.banner.entity.type === 'network'"
-			:src="`/img/banners/${campaign.banner.entity.slug}/${campaign.banner.id}.jpg`"
+			v-if="campaign.banner.entity.type === 'network' || !campaign.banner.entity.parent"
+			:src="`/img/banners/${campaign.banner.entity.slug}/${campaign.banner.id}.${campaign.banner.type || 'jpg'}`"
 			:width="campaign.banner.width"
 			:height="campaign.banner.height"
 			class="campaign-banner"
@@ -15,7 +15,7 @@
 
 		<img
 			v-if="campaign.banner.entity.type === 'channel' && campaign.banner.entity.parent?.type === 'network'"
-			:src="`/img/banners/${campaign.banner.entity.parent.slug}/${campaign.banner.entity.slug}/${campaign.banner.id}.jpg`"
+			:src="`/img/banners/${campaign.banner.entity.parent.slug}/${campaign.banner.entity.slug}/${campaign.banner.id}.${campaign.banner.type || 'jpg'}`"
 			:width="campaign.banner.width"
 			:height="campaign.banner.height"
 			class="campaign-banner"
@@ -106,6 +106,14 @@ export default {
 			type: Object,
 			default: null,
 		},
+		minHeight: {
+			type: Number,
+			default: null,
+		},
+		maxHeight: {
+			type: Number,
+			default: null,
+		},
 		minRatio: {
 			type: Number,
 			default: null,

assets/components/container/container.vue

@@ -8,35 +8,40 @@
 		/>
 
 		<transition name="slide">
-			<Sidebar
-				v-if="showSidebar"
-				@toggle-sidebar="(state) => toggleSidebar(state)"
-				@show-filters="(state) => toggleFilters(state)"
-			/>
+			<Sidebar v-if="showSidebar" />
 		</transition>
 
-		<Header
-			@toggle-sidebar="(state) => toggleSidebar(state)"
-			@show-filters="(state) => toggleFilters(state)"
-		/>
+		<Header />
 
 		<p
 			v-if="config.showDisclaimer"
 			class="disclaimer"
-		>{{ config.disclaimer }}</p>
+			v-html="config.disclaimer"
+		/>
+
+		<p
+			v-if="config.showAnnouncement"
+			class="announcement"
+			v-html="config.announcement"
+		/>
 
 		<div
 			ref="content"
 			class="content"
 			@scroll="scroll"
 		>
-			<router-view @scroll="scrollToTop" />
+			<RouterView @scroll="scrollToTop" />
 		</div>
 
 		<Filters
 			v-if="showFilters"
 			@close="toggleFilters(false)"
 		/>
+
+		<Settings
+			v-if="showSettings"
+			@close="toggleSettings(false)"
+		/>
 	</div>
 </template>
 
@@ -45,6 +50,7 @@ import Warning from './warning.vue';
 import Header from '../header/header.vue';
 import Sidebar from '../sidebar/sidebar.vue';
 import Filters from '../filters/filters.vue';
+import Settings from '../settings/settings.vue';
 
 function toggleSidebar(state) {
 	this.showSidebar = typeof state === 'boolean' ? state : !this.showSidebar;
@@ -55,6 +61,11 @@ function toggleFilters(state) {
 	this.showSidebar = false;
 }
 
+function toggleSettings(state) {
+	this.showSettings = state;
+	this.showSidebar = false;
+}
+
 async function setConsent(consent, includeQueer) {
 	if (consent) {
 		this.showWarning = false;
@@ -62,7 +73,7 @@ async function setConsent(consent, includeQueer) {
 	}
 
 	if (includeQueer) {
-		this.$store.dispatch('setTagFilter', this.$store.state.ui.tagFilter.filter(tag => !['gay', 'bisexual', 'transsexual'].includes(tag)));
+		this.$store.dispatch('setTagFilter', this.$store.state.ui.tagFilter.filter((tag) => !['gay', 'bisexual', 'transsexual'].includes(tag)));
 		return;
 	}
 
@@ -88,6 +99,9 @@ function scrollToTop() {
 function mounted() {
 	document.addEventListener('click', this.blur);
 	window.addEventListener('resize', this.resize);
+
+	this.events.on('toggleSettings', this.toggleSettings);
+	this.events.on('toggleSidebar', this.toggleSidebar);
 }
 
 function beforeUnmount() {
@@ -101,12 +115,15 @@ export default {
 		Sidebar,
 		Warning,
 		Filters,
+		Settings,
 	},
 	data() {
 		return {
 			showSidebar: false,
 			showWarning: localStorage.getItem('consent') !== window.env.sessionId,
 			showFilters: false,
+			showSettings: false,
+			selected: null,
 		};
 	},
 	mounted,
@@ -114,6 +131,7 @@ export default {
 	methods: {
 		toggleSidebar,
 		toggleFilters,
+		toggleSettings,
 		setConsent,
 		blur,
 		resize,
@@ -183,13 +201,21 @@ export default {
 </style>
 
 <style lang="scss" scoped>
-.disclaimer {
+.disclaimer,
+.announcement {
 	padding: .5rem 1rem;
 	margin: 0;
 	color: var(--text-light);
-	background: var(--warn);
 	font-weight: bold;
 	box-shadow: inset 0 0 3px var(--darken-weak);
 	text-align: center;
 }
+
+.disclaimer {
+	background: var(--warn);
+}
+
+.announcement {
+	background: var(--notice);
+}
 </style>

assets/components/dialog/dialog.vue

@@ -116,6 +116,7 @@ export default {
 ::v-deep(.dialog-body) {
 	padding: 1rem;
 	flex-grow: 1;
+	overflow-y: auto;
 }
 
 ::v-deep(.dialog-section:not(:last-child)) {

assets/components/entities/entity.vue

@@ -51,7 +51,7 @@
 				>{{ tag.name }}</li>
 			</ul>
 
-			<router-link
+			<RouterLink
 				v-if="entity.parent"
 				:to="`/${entity.parent.type}/${entity.parent.slug}`"
 				class="link link-parent"
@@ -74,7 +74,7 @@
 				>{{ entity.parent.name }}</h3>
 
 				<Icon icon="device_hub" />
-			</router-link>
+			</RouterLink>
 		</div>
 
 		<div
@@ -111,7 +111,10 @@
 			/>
 
 			<div class="releases">
-				<Releases :releases="entity.releases" />
+				<Releases
+					:releases="entity.releases"
+					:done="done"
+				/>
 
 				<Pagination
 					:items-total="totalCount"
@@ -134,6 +137,7 @@ import Scroll from '../scroll/scroll.vue';
 import Campaign from '../campaigns/campaign.vue';
 
 async function fetchEntity(scroll = true) {
+	this.done = false;
 	this.entityUrl = null;
 
 	const { entity, totalCount } = await this.$store.dispatch('fetchEntityBySlugAndType', {
@@ -148,7 +152,17 @@ async function fetchEntity(scroll = true) {
 	this.totalCount = totalCount;
 
 	this.pageTitle = entity.name;
-	this.entityUrl = entity.campaigns.find(campaign => !campaign.banner)?.url || entity.url;
+
+	const campaign = entity.campaigns.find((campaignX) => !campaignX.banner)
+		|| entity.parent?.campaigns.find((campaignX) => !campaignX.banner);
+
+	const affiliateParams = new URLSearchParams({
+		...(entity.url && Object.fromEntries(new URL(entity.url).searchParams)), // preserve any query in entity URL, e.g. ?siteId=5
+		...(campaign?.affiliate?.parameters && Object.fromEntries(new URLSearchParams(campaign.affiliate.parameters))), // append affiliate parameters
+	}).toString();
+
+	this.entityUrl = campaign?.url || campaign?.affiliate?.url || `${entity.url}${campaign?.affiliate?.parameters ? `?${affiliateParams}` : ''}`;
+	this.done = true;
 
 	if (scroll && this.$refs.filter?.$el) {
 		this.$refs.filter.$el.scrollIntoView();
@@ -180,6 +194,7 @@ export default {
 			entity: null,
 			pageTitle: null,
 			totalCount: null,
+			done: false,
 			limit: Number(this.$route.query.limit) || 20,
 			expanded: false,
 			entityUrl: null,

assets/components/entities/tile.vue

@@ -4,39 +4,49 @@
 		:title="entity.name"
 		class="tile"
 	>
-		<template v-if="entity.hasLogo">
-			<img
-				v-if="entity.type === 'network' || entity.independent"
-				:src="`/img/logos/${entity.slug}/thumbs/network.png`"
-				:alt="entity.name"
-				loading="lazy"
-				class="logo"
-				@load="$emit('load', $event)"
-			>
+		<div class="tile-logo">
+			<template v-if="entity.hasLogo">
+				<img
+					v-if="entity.type === 'network' || entity.independent"
+					:src="`/img/logos/${entity.slug}/thumbs/network.png`"
+					:alt="entity.name"
+					loading="lazy"
+					class="logo"
+					@load="$emit('load', $event)"
+				>
 
-			<img
-				v-else-if="entity.parent"
-				:src="`/img/logos/${entity.parent.slug}/thumbs/${entity.slug}.png`"
-				:alt="entity.name"
-				loading="lazy"
-				class="logo"
-				@load="$emit('load', $event)"
-			>
+				<img
+					v-else-if="entity.parent"
+					:src="`/img/logos/${entity.parent.slug}/thumbs/${entity.slug}.png`"
+					:alt="entity.name"
+					loading="lazy"
+					class="logo"
+					@load="$emit('load', $event)"
+				>
 
-			<img
+				<img
+					v-else
+					:src="`/img/logos/${entity.slug}/thumbs/${entity.slug}.png`"
+					:alt="entity.name"
+					loading="lazy"
+					class="logo"
+					@load="$emit('load', $event)"
+				>
+			</template>
+
+			<span
 				v-else
-				:src="`/img/logos/${entity.slug}/thumbs/${entity.slug}.png`"
-				:alt="entity.name"
-				loading="lazy"
-				class="logo"
-				@load="$emit('load', $event)"
-			>
-		</template>
+				class="name"
+			>{{ entity.name }}</span>
+		</div>
 
 		<span
-			v-else
-			class="name"
-		>{{ entity.name }}</span>
+			v-if="entity.childrenTotal > 0 || typeof entity.sceneTotal !== 'undefined'"
+			class="count"
+		>
+			<span v-if="typeof entity.sceneTotal !== 'undefined'">{{ entity.sceneTotal }} scenes</span>
+			<span v-if="entity.type === 'network'">{{ entity.childrenTotal }} channels</span>
+		</span>
 	</router-link>
 </template>
 
@@ -59,15 +69,28 @@ export default {
     height: 100%;
     background: var(--tile);
     display: flex;
+	flex-direction: column;
     flex-shrink: 0;
 	justify-content: center;
     align-items: center;
     box-sizing: border-box;
-    padding: .5rem 1rem;
     border-radius: .25rem;
+	position: relative;
     box-shadow: 0 0 3px rgba(0, 0, 0, .25);
     text-align: center;
     text-decoration: none;
+	overflow: hidden;
+
+	&:hover .count {
+		bottom: 0;
+	}
+}
+
+.tile-logo {
+	display: flex;
+	flex-grow: 1;
+    padding: .5rem 1rem;
+	overflow: hidden;
 }
 
 .logo {
@@ -75,6 +98,7 @@ export default {
 	max-height: 100%;
     display: flex;
     align-items: center;
+	align-self: center;
 }
 
 .name {
@@ -82,4 +106,20 @@ export default {
     font-size: 1.25rem;
     font-weight: bold;
 }
+
+.count {
+	display: flex;
+	justify-content: space-between;
+	width: 100%;
+	position: absolute;
+	bottom: -1.75rem;
+	box-sizing: border-box;
+	padding: .25rem .5rem;
+	background: var(--darken-strong);
+	box-shadow: 0 0 3px var(--darken);
+	color: var(--text-light);
+	text-align: center;
+	text-shadow: 1px 1px var(--darken);
+	transition: bottom .1s ease;
+}
 </style>

assets/components/filters/filter-bar.vue

@@ -1,41 +1,33 @@
 <template>
 	<div class="filter-bar noselect">
 		<div class="sort">
-			<router-link
-				:to="{ params: { range: 'latest', pageNumber: 1 }, query: $route.query }"
-				:class="{ active: $route.name === 'latest' || range === 'latest' }"
+			<RouterLink
+				v-for="section in ranges"
+				:key="section"
+				:to="{ params: { range: section, pageNumber: 1 }, query: $route.query }"
+				:class="{ active: $route.name === section || range === section }"
 				class="range range-button"
-			>Latest</router-link>
-
-			<router-link
-				:to="{ params: { range: 'upcoming', pageNumber: 1 }, query: $route.query }"
-				:class="{ active: $route.name === 'upcoming' || range === 'upcoming' }"
-				class="range-button"
-			>Upcoming</router-link>
-
-			<router-link
-				:to="{ params: { range: 'new', pageNumber: 1 }, query: $route.query }"
-				:class="{ active: $route.name === 'new' || range === 'new' }"
-				class="range-button"
-			>New</router-link>
+			>{{ section }}</RouterLink>
 		</div>
 
+		<span
+			v-if="itemsTotal && showTotal"
+			class="total"
+		>{{ itemsTotal }} <template v-if="itemsTotal === 1">scene</template><template v-else>scenes</template></span>
+
 		<div class="filters">
 			<ActorFilter
 				class="filters-filter"
-				:filter="filter"
 				:available-actors="availableActors"
 			/>
 
 			<ChannelFilter
 				class="filters-filter"
-				:filter="filter"
 				:available-channels="availableChannels"
 			/>
 
 			<TagFilter
 				class="filters-filter"
-				:filter="filter"
 				:available-tags="availableTags"
 			/>
 		</div>
@@ -49,10 +41,6 @@ import ActorFilter from './actor-filter.vue';
 import ChannelFilter from './channel-filter.vue';
 import TagFilter from './tag-filter.vue';
 
-function filter(state) {
-	return state.ui.filter;
-}
-
 function range() {
 	return this.$route.params.range;
 }
@@ -88,6 +76,10 @@ export default {
 			type: Boolean,
 			default: false,
 		},
+		showTotal: {
+			type: Boolean,
+			default: true,
+		},
 		itemsTotal: {
 			type: Number,
 			default: 0,
@@ -96,6 +88,10 @@ export default {
 			type: Number,
 			default: 10,
 		},
+		ranges: {
+			type: Array,
+			default: () => ['latest', 'upcoming', 'new'],
+		},
 		availableTags: {
 			type: Array,
 			default: () => [],
@@ -111,7 +107,6 @@ export default {
 	},
 	computed: {
 		...mapState({
-			filter,
 			range,
 			batch,
 		}),
@@ -126,6 +121,43 @@ export default {
 <style lang="scss">
 @import 'breakpoints';
 
+.filter {
+	color: var(--shadow);
+	display: inline-flex;
+	align-items: center;
+
+	.filter-applied {
+		flex-grow: 1;
+		padding: .75rem .5rem;
+		font-size: 1rem;
+		white-space: nowrap;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		text-align: right;
+
+		&.empty {
+			color: var(--shadow);
+		}
+	}
+
+	.icon {
+		fill: var(--shadow);
+		margin: -.1rem 0 0 0;
+	}
+
+	&:hover {
+		cursor: pointer;
+
+		.applied {
+			color: var(--shadow-strong);
+		}
+
+		.icon {
+			fill: var(--shadow-strong);
+		}
+	}
+}
+
 .filter-mode {
 	width: 100%;
 	color: var(--shadow);
@@ -246,6 +278,10 @@ export default {
 	.filters-filter:last-child .filter {
 		padding: .5rem 0 .5rem .5rem;
 	}
+
+	.total {
+		display: none;
+	}
 }
 </style>
 
@@ -267,43 +303,6 @@ export default {
     }
 }
 
-::v-deep(.filter) {
-	color: var(--shadow);
-	display: inline-flex;
-	align-items: center;
-
-	.filter-applied {
-		flex-grow: 1;
-		padding: .75rem .5rem;
-		font-size: 1rem;
-		white-space: nowrap;
-		overflow: hidden;
-		text-overflow: ellipsis;
-		text-align: right;
-
-		&.empty {
-			color: var(--shadow);
-		}
-	}
-
-	.icon {
-		fill: var(--shadow);
-		margin: -.1rem 0 0 0;
-	}
-
-	&:hover {
-		cursor: pointer;
-
-		.applied {
-			color: var(--shadow-strong);
-		}
-
-		.icon {
-			fill: var(--shadow-strong);
-		}
-	}
-}
-
 .filters {
 	flex-shrink: 0;
 }
@@ -324,6 +323,7 @@ export default {
     text-decoration: none;
 	border: solid 1px transparent;
 	border-bottom: none;
+	text-transform: capitalize;
 
     &:hover:not(.active) {
         color: var(--shadow-strong);
@@ -356,4 +356,11 @@ export default {
 		margin: 0 1rem 0 0;
 	}
 }
+
+.total {
+	flex-shrink: 0;
+	padding: 0 1rem;
+	color: var(--shadow);
+	font-size: .8rem;
+}
 </style>

assets/components/filters/tag-filter.vue

@@ -14,7 +14,7 @@
 			>Tags</div>
 		</div>
 
-		<template v-slot:tooltip>
+		<template #tooltip>
 			<div
 				class="filter-options"
 				@click.stop
@@ -70,7 +70,7 @@
 <script>
 function getNewRange(tag) {
 	if (this.selectedTags.includes(tag)) {
-		return { tags: this.selectedTags.filter(selectedTag => selectedTag !== tag).join(',') || undefined };
+		return { tags: this.selectedTags.filter((selectedTag) => selectedTag !== tag).join(',') || undefined };
 	}
 
 	return { tags: this.selectedTags.concat(tag).join(',') };
@@ -82,10 +82,6 @@ function selectedTags() {
 
 export default {
 	props: {
-		filter: {
-			type: Array,
-			default: () => [],
-		},
 		compact: {
 			type: Boolean,
 			default: false,

assets/components/header/header.vue

@@ -16,7 +16,7 @@
 					<li class="nav-item">
 						<router-link
 							v-slot="{ href, isActive, navigate }"
-							to="/actors"
+							:to="{ name: 'actors', params: { pageNumber: 1 } }"
 							custom
 						>
 							<a
@@ -31,7 +31,7 @@
 					<li class="nav-item">
 						<router-link
 							v-slot="{ href, isActive, navigate }"
-							to="/channels"
+							:to="{ name: 'channels' }"
 							custom
 						>
 							<a
@@ -46,7 +46,7 @@
 					<li class="nav-item">
 						<router-link
 							v-slot="{ href, isActive, navigate }"
-							to="/tags"
+							:to="{ name: 'tags' }"
 							custom
 						>
 							<a
@@ -61,7 +61,7 @@
 					<li class="nav-item">
 						<router-link
 							v-slot="{ href, isActive, navigate }"
-							to="/movies"
+							:to="{ name: 'movies', params: { range: 'latest', pageNumber: 1 } }"
 							custom
 						>
 							<a

assets/components/header/menu.vue

@@ -1,28 +1,26 @@
 <template>
 	<div class="menu">
 		<ul class="menu-items noselect">
-			<router-link
+			<RouterLink
 				v-if="login && me"
 				:to="{ name: 'user', params: { username: me.username } }"
 				class="menu-username"
-			>{{ me.username }}</router-link>
+			>{{ me.username }}</RouterLink>
 
-			<router-link
+			<RouterLink
+				v-if="me && favorites"
+				:to="{ name: 'stash', params: { stashId: favorites.id, range: 'scenes', pageNumber: 1 } }"
+				class="menu-item"
+			><Icon icon="heart7" />Favorites</RouterLink>
+
+			<RouterLink
 				v-else-if="login"
 				:to="{ name: 'login', query: { ref: $route.path } }"
 				class="menu-item"
 				@click.stop
 			>
 				<Icon icon="enter2" />Log in
-			</router-link>
-
-			<li
-				v-if="login && me"
-				class="menu-item"
-				@click.stop="$store.dispatch('logout')"
-			>
-				<Icon icon="exit2" />Log out
-			</li>
+			</RouterLink>
 
 			<li
 				v-show="!sfw"
@@ -74,6 +72,14 @@
 			>
 				<Icon icon="filter" />Filters
 			</li>
+
+			<li
+				v-if="login && me"
+				class="menu-item"
+				@click.stop="$store.dispatch('logout')"
+			>
+				<Icon icon="exit2" />Log out
+			</li>
 		</ul>
 	</div>
 </template>
@@ -97,6 +103,10 @@ function signup(state) {
 	return state.auth.signup;
 }
 
+function favorites() {
+	return this.me?.stashes.find(stash => stash.primary);
+}
+
 function me(state) {
 	return state.auth.user;
 }
@@ -118,6 +128,7 @@ export default {
 			theme,
 			me,
 		}),
+		favorites,
 	},
 	emits: ['showFilters'],
 	methods: {

assets/components/home/home.vue

@@ -8,9 +8,13 @@
 				:items-total="totalCount"
 				:items-per-page="limit"
 				:content="$refs.content"
+				:show-total="false"
 			/>
 
-			<Releases :releases="releases" />
+			<Releases
+				:releases="releases"
+				:done="done"
+			/>
 
 			<Pagination
 				v-if="totalCount > 0"
@@ -30,6 +34,8 @@ import Releases from '../releases/releases.vue';
 import Pagination from '../pagination/pagination.vue';
 
 async function fetchReleases(scroll = true) {
+	this.done = false;
+
 	const { releases, totalCount } = await this.$store.dispatch('fetchReleases', {
 		limit: this.limit,
 		range: this.$route.params.range,
@@ -38,6 +44,7 @@ async function fetchReleases(scroll = true) {
 
 	this.totalCount = totalCount;
 	this.releases = releases;
+	this.done = true;
 
 	if (scroll) {
 		this.$refs.filter?.$el.scrollIntoView();
@@ -64,6 +71,7 @@ export default {
 			limit: 30,
 			totalCount: 0,
 			from: null,
+			done: false,
 		};
 	},
 	watch: {

assets/components/loading/ellipsis.vue

@@ -0,0 +1,90 @@
+<template>
+	<div class="load-container">
+		<div class="load-ellipsis">
+			<div />
+			<div />
+			<div />
+			<div />
+		</div>
+	</div>
+</template>
+
+<style lang="scss" scoped>
+.load-container {
+	display: inline-flex;
+	position: relative;
+	padding: 1rem;
+}
+
+.load-ellipsis {
+    display: inline-block;
+    position: relative;
+    width: 5rem;
+    height: .75rem;
+}
+
+.load-ellipsis div {
+    position: absolute;
+    top: 0;
+    width: .75rem;
+    height: .75rem;
+    border-radius: 50%;
+    background: var(--primary);
+}
+
+.load-ellipsis div:nth-child(1) {
+    left: .5rem;
+    animation: load-ellipsis1 0.5s infinite linear;
+}
+
+.load-ellipsis div:nth-child(2) {
+    left: .5rem;
+    animation: load-ellipsis2 0.5s infinite linear;
+}
+
+.load-ellipsis div:nth-child(3) {
+    left: 2rem;
+    animation: load-ellipsis3 0.5s infinite linear;
+}
+
+.load-ellipsis div:nth-child(4) {
+    left: 3.5rem;
+    animation: load-ellipsis4 0.5s infinite linear;
+}
+
+@keyframes load-ellipsis1 {
+	0% {
+		transform: scale(0);
+	}
+	100% {
+		transform: scale(0.5);
+	}
+}
+
+@keyframes load-ellipsis2 {
+	0% {
+		transform: translate(0, 0) scale(0.5);
+	}
+	100% {
+		transform: translate(1.5rem, 0) scale(1);
+	}
+}
+
+@keyframes load-ellipsis3 {
+	0% {
+		transform: translate(0, 0) scale(1);
+	}
+	100% {
+		transform: translate(1.5rem, 0) scale(0.5);
+	}
+}
+
+@keyframes load-ellipsis4 {
+    0% {
+		transform: scale(0.5);
+    }
+    100% {
+		transform: scale(0);
+    }
+}
+</style>

assets/components/networks/networks.vue

@@ -1,44 +1,26 @@
 <template>
 	<div class="networks">
-		<form
-			class="search"
-			@submit.prevent="searchEntities"
-		>
-			<input
-				v-model="query"
-				:placeholder="`Find ${channelCount} channels in ${entities.length} networks`"
-				class="query"
-				@input="searchEntities"
+		<div class="content-inner">
+			<SearchBar
+				:placeholder="`Search ${channelCount} channels in ${entities.length} networks`"
+				:eager="true"
+			/>
+
+			<span
+				v-if="done && entities.length === 0"
+				class="empty"
+			>No results for "{{ $route.query.query }}"</span>
+
+			<div
+				v-else
+				class="entity-tiles"
 			>
-
-			<button
-				type="submit"
-				class="search-button"
-			><Icon icon="search" /></button>
-		</form>
-
-		<div
-			v-if="query.length > 0"
-			class="entity-tiles"
-		>
-			<Entity
-				v-for="entity in searchResults"
-				:key="`${entity.type}-tile-${entity.slug}`"
-				:entity="entity"
-			/>
-
-			<span v-if="searchResults.length === 0">No results for "{{ query }}"</span>
-		</div>
-
-		<div
-			v-else
-			class="entity-tiles"
-		>
-			<Entity
-				v-for="entity in entities"
-				:key="`entity-tile-${entity.slug}`"
-				:entity="entity"
-			/>
+				<Entity
+					v-for="entity in entities"
+					:key="entity.parent ? `entity-tile-${entity.parent.slug}-${entity.slug}` : `entity-tile-${entity.slug}`"
+					:entity="entity"
+				/>
+			</div>
 		</div>
 
 		<Footer />
@@ -47,21 +29,39 @@
 
 <script>
 import Entity from '../entities/tile.vue';
+import SearchBar from '../search/bar.vue';
 
-async function searchEntities() {
-	this.searchResults = await this.$store.dispatch('searchEntities', {
-		query: this.query,
-		limit: 50,
-	});
-}
+async function fetchEntities() {
+	if (this.$route.query.query) {
+		await this.searchEntities();
+		return;
+	}
+
+	this.done = false;
 
-async function mounted() {
 	this.entities = await this.$store.dispatch('fetchEntities', {
 		type: 'network',
 		entitySlugs: [],
 	});
 
-	this.pageTitle = 'Networks';
+	this.done = true;
+}
+
+async function searchEntities() {
+	this.done = false;
+
+	this.entities = await this.$store.dispatch('searchEntities', {
+		query: this.$route.query.query,
+		limit: 20,
+	});
+
+	this.done = true;
+}
+
+async function mounted() {
+	this.pageTitle = 'Channels';
+
+	await this.fetchEntities();
 }
 
 function channelCount() {
@@ -71,20 +71,24 @@ function channelCount() {
 export default {
 	components: {
 		Entity,
+		SearchBar,
 	},
 	data() {
 		return {
-			query: '',
+			done: false,
 			pageTitle: null,
 			entities: [],
-			searchResults: [],
 		};
 	},
 	computed: {
 		channelCount,
 	},
+	watch: {
+		$route: fetchEntities,
+	},
 	mounted,
 	methods: {
+		fetchEntities,
 		searchEntities,
 	},
 };
@@ -94,49 +98,17 @@ export default {
 @import 'theme';
 
 .networks {
-    padding: 0 1rem;
+	display: flex;
+	flex-direction: column;
+	flex-grow: 1;
+}
+
+.content-inner {
+	padding: 0 1rem;
 }
 
 .search {
-    display: flex;
-    width: 100%;
-    max-width: 40rem;
-}
-
-.query {
-    color: var(--text);
-    background: var(--background);
-    flex-grow: 1;
-    box-sizing: border-box;
-    padding: 1rem;
-    border: none;
-    box-sizing: border-box;
-    box-shadow: 0 0 3px var(--darken-weak);
-    margin: 1rem 0;
-    font-size: 1rem;
-    outline: none;
-
-    &:focus {
-        box-shadow: 0 0 3px var(--primary);
-    }
-}
-
-.search-button {
-    padding: 1rem;
-    background: none;
-    border: none;
-
-    .icon {
-        fill: var(--shadow);
-    }
-
-    &:hover {
-        cursor: pointer;
-
-        .icon {
-            fill: var(--primary);
-        }
-    }
+	margin: 1rem 0 0 0;
 }
 
 .entity-tiles {
@@ -150,6 +122,14 @@ export default {
 	}
 }
 
+.empty {
+	display: block;
+	margin: 1rem 0;
+	color: var(--shadow);
+	font-size: 1.25rem;
+	font-weight: bold;
+}
+
 @media(max-width: $breakpoint2) {
     .entity-tiles {
         grid-gap: .5rem;

assets/components/releases/banner.vue

@@ -2,7 +2,7 @@
 	<div class="media-container">
 		<div
 			class="media"
-			:class="{ center: release.photos.length < 2 }"
+			:class="{ center: release.photos.length < 2, preview: !me }"
 		>
 			<div
 				v-if="release.trailer || release.teaser"
@@ -38,15 +38,30 @@
 					class="item trailer"
 				>
 
-				<a
-					v-if="release.poster"
-					v-tooltip="'View poster'"
-					:href="getPath(release.poster)"
-					:class="{ playing }"
-					target="_blank"
-					rel="noopener noreferrer"
-					class="poster-link"
-				><Icon icon="image" /></a>
+				<span
+					v-if="release.poster || release.teaser"
+					class="poster-links"
+				>
+					<a
+						v-if="release.teaser"
+						v-tooltip="'View teaser'"
+						:href="getPath(release.teaser)"
+						:class="{ playing }"
+						target="_blank"
+						rel="noopener noreferrer"
+						class="poster-link"
+					><Icon icon="film4" /></a>
+
+					<a
+						v-if="release.poster"
+						v-tooltip="'View poster'"
+						:href="getPath(release.poster)"
+						:class="{ playing }"
+						target="_blank"
+						rel="noopener noreferrer"
+						class="poster-link"
+					><Icon icon="image" /></a>
+				</span>
 
 				<span
 					v-if="sfw && !playing"
@@ -217,11 +232,16 @@ export default {
 	margin: 0 auto;
 }
 
-.poster-link {
+.poster-links {
+	display: flex;
     position: absolute;
-    top: .5rem;
-    right: .5rem;
+	top: 0;
+	right: 0;
+}
+
+.poster-link {
     transition: opacity .1s ease;
+	padding: .5rem;
 
     .icon {
         width: 1.5rem;
@@ -234,6 +254,14 @@ export default {
         opacity: 0;
     }
 
+	&:first-child {
+		padding-left: .75rem;
+	}
+
+	&:last-child {
+		padding-right: .75rem;
+	}
+
     &:hover {
         cursor: pointer;
         opacity: 1;
@@ -337,7 +365,7 @@ export default {
 }
 
 @media(max-width: $breakpoint-micro) {
-	.media.center {
+	.media.center.preview {
 		flex-direction: column;
 	}
 

assets/components/releases/movie-tile.vue

@@ -3,7 +3,7 @@
 		<Details :release="movie" />
 
 		<div class="movie">
-			<router-link
+			<RouterLink
 				:to="{ name: 'movie', params: { releaseId: movie.id, releaseSlug: movie.slug } }"
 				class="cover"
 			>
@@ -13,15 +13,42 @@
 					:style="{ 'background-image': getBgPath(movie.covers[0], 'lazy') }"
 					loading="lazy"
 				>
-			</router-link>
+
+				<div
+					v-else
+					:title="movie.title"
+					class="unavailable"
+				><Icon icon="blocked" /></div>
+
+				<Icon
+					v-show="(!stash || stash.primary) && favorited"
+					icon="heart7"
+					class="stash stashed"
+					@click.prevent.native="unstashMovie"
+				/>
+
+				<Icon
+					v-show="(!stash || stash.primary) && favorited === false"
+					icon="heart8"
+					class="stash unstashed"
+					@click.prevent.native="stashMovie"
+				/>
+
+				<Icon
+					v-show="stash && !stash.primary"
+					icon="cross2"
+					class="stash unstash"
+					@click.prevent.native="unstashMovie"
+				/>
+			</RouterLink>
 
 			<div class="info">
-				<router-link
+				<RouterLink
 					:to="{ name: 'movie', params: { releaseId: movie.id, releaseSlug: movie.slug } }"
 					class="title-link"
 				>
 					<h3 class="title">{{ movie.title }}</h3>
-				</router-link>
+				</RouterLink>
 
 				<ul
 					class="actors nolist"
@@ -31,10 +58,10 @@
 						v-for="actor in movie.actors"
 						:key="`tag-${movie.id}-${actor.id}`"
 						class="actor"
-					><router-link
+					><RouterLink
 						:to="`/actor/${actor.id}/${actor.slug}`"
 						class="actor-link"
-					>{{ actor.name }}</router-link></li>
+					>{{ actor.name }}</RouterLink></li>
 				</ul>
 
 				<ul
@@ -45,10 +72,10 @@
 						v-for="tag in movie.tags"
 						:key="`tag-${movie.id}-${tag.id}`"
 						class="tag"
-					><router-link
+					><RouterLink
 						:to="`/tag/${tag.slug}`"
 						class="tag-link"
-					>{{ tag.name }}</router-link></li>
+					>{{ tag.name }}</RouterLink></li>
 				</ul>
 			</div>
 		</div>
@@ -58,6 +85,38 @@
 <script>
 import Details from './tile-details.vue';
 
+async function stashMovie() {
+	this.favorited = true;
+
+	try {
+		await this.$store.dispatch('stashMovie', {
+			movieId: this.movie.id,
+			stashId: this.$store.getters.favorites.id,
+		});
+
+		this.$emit('stash', true);
+	} catch (error) {
+		this.favorited = false;
+	}
+}
+
+async function unstashMovie() {
+	if (!this.stash || this.stash.primary) {
+		this.favorited = false;
+	}
+
+	try {
+		await this.$store.dispatch('unstashMovie', {
+			movieId: this.movie.id,
+			stashId: this.stash?.id || this.$store.getters.favorites.id,
+		});
+
+		this.$emit('stash', false);
+	} catch (error) {
+		this.favorited = true;
+	}
+}
+
 function sfw() {
 	return this.$store.state.ui.sfw;
 }
@@ -71,10 +130,23 @@ export default {
 			type: Object,
 			default: null,
 		},
+		stash: {
+			type: Object,
+			default: null,
+		},
+	},
+	data() {
+		return {
+			favorited: this.movie.isFavorited,
+		};
 	},
 	computed: {
 		sfw,
 	},
+	methods: {
+		stashMovie,
+		unstashMovie,
+	},
 };
 </script>
 
@@ -87,10 +159,14 @@ export default {
 	background: var(--background);
 	box-shadow: 0 0 3px var(--darken-weak);
 	font-size: 0;
+
+	&:hover .unstashed,
+	&:hover .unstash {
+		fill: var(--lighten);
+	}
 }
 
 .movie {
-	height: 16rem;
 	display: flex;
 }
 
@@ -100,17 +176,30 @@ export default {
 }
 
 .cover {
-	height: 100%;
+	height: 16rem;
+	width: 11.25rem;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	flex-shrink: 0;
+	position: relative;
 	box-shadow: 0 0 3px var(--darken-weak);
+    background-color: var(--shadow-hint);
 
 	img {
 		height: 100%;
-		max-width: 12rem;
+		width: 100%;
 		background-position: center;
 		background-size: cover;
 		object-fit: cover;
 		object-position: center;
 	}
+
+	.unavailable .icon {
+		width: 2rem;
+		height: 2rem;
+		fill: var(--shadow-hint);
+	}
 }
 
 .info {
@@ -179,9 +268,31 @@ export default {
 	}
 }
 
-@media(max-width: $breakpoint) {
-	.movie {
+.stash {
+	width: 1.5rem;
+	height: 1.5rem;
+	padding: .25rem .5rem .5rem .5rem;
+	position: absolute;
+	top: 0;
+	left: 0;
+	fill: var(--lighten-weak);
+	filter: drop-shadow(0 0 2px var(--darken));
+
+	&:hover.unstashed,
+	&.stashed {
+		fill: var(--primary);
+	}
+
+	&:hover.unstash {
+		fill: var(--text-light);
+		filter: drop-shadow(0 0 2px var(--darken-weak));
+	}
+}
+
+@media(max-width: $breakpoint-kilo) {
+	.cover {
 		height: 12rem;
+		width: 8.25rem;
 	}
 
 	/* ensure no half actor names show */

assets/components/releases/movies.vue

@@ -1,13 +1,31 @@
 <template>
 	<div class="movies">
 		<div class="content-inner">
-			<div class="tiles">
+			<SearchBar :placeholder="`Search ${totalCount} movies`" />
+
+			<TagFilter
+				class="filters-filter"
+				:filter="filter"
+				:available-tags="availableTags"
+			/>
+
+			<div
+				ref="tiles"
+				class="tiles"
+			>
 				<MovieTile
 					v-for="movie in movies"
 					:key="`movie-${movie.id}`"
 					:movie="movie"
 				/>
 			</div>
+
+			<Pagination
+				v-if="totalCount > 0"
+				:items-total="totalCount"
+				:items-per-page="limit"
+				class="pagination-bottom"
+			/>
 		</div>
 
 		<Footer />
@@ -16,27 +34,69 @@
 
 <script>
 import MovieTile from './movie-tile.vue';
+import SearchBar from '../search/bar.vue';
+import Pagination from '../pagination/pagination.vue';
+import TagFilter from '../filters/tag-filter.vue';
+
+async function fetchMovies() {
+	if (this.$route.query.query) {
+		await this.searchMovies();
+		return;
+	}
 
-async function mounted() {
 	const { movies, totalCount } = await this.$store.dispatch('fetchMovies', {
-		limit: 30,
+		limit: this.limit,
+		range: this.$route.params.range,
+		pageNumber: this.$route.params.pageNumber,
 	});
 
 	this.movies = movies;
 	this.totalCount = totalCount;
+
+	this.$refs.tiles.scrollIntoView();
+}
+
+async function searchMovies() {
+	const { movies, totalCount } = await this.$store.dispatch('searchMovies', {
+		query: this.$route.query.query,
+		limit: this.limit,
+		pageNumber: this.$route.params.pageNumber,
+	});
+
+	this.movies = movies;
+	this.totalCount = totalCount;
+
+	this.$refs.tiles.scrollIntoView();
+}
+
+async function mounted() {
+	this.pageTitle = 'Movies';
+
+	await this.fetchMovies();
 }
 
 export default {
 	components: {
 		MovieTile,
+		SearchBar,
+		Pagination,
+		TagFilter,
 	},
 	data() {
 		return {
 			movies: [],
 			totalCount: 0,
+			limit: 20,
 		};
 	},
+	watch: {
+		$route: fetchMovies,
+	},
 	mounted,
+	methods: {
+		fetchMovies,
+		searchMovies,
+	},
 };
 </script>
 
@@ -49,14 +109,22 @@ export default {
 	flex-grow: 1;
 }
 
+.content-inner {
+	padding: 0 1rem;
+}
+
+.search {
+	margin: 1rem 0 0 0;
+}
+
 .tiles {
 	display: grid;
 	grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr));
 	grid-gap: 1rem;
-	padding: 1rem;
+	padding: 1rem 0;
 }
 
-@media(max-width: $breakpoint) {
+@media(max-width: $breakpoint-kilo) {
 	.tiles {
 		grid-template-columns: repeat(auto-fill, minmax(20rem, 1fr));
 	}

assets/components/releases/release.vue

@@ -39,7 +39,10 @@
 				<h2
 					v-if="release.title"
 					class="title"
-				>{{ release.title }}</h2>
+				>
+					{{ release.title }}
+					<template v-if="release.movies?.[0]?.title && /^scene \d+$/i.test(release.title)"><span class="title-composed">&nbsp;from&nbsp;</span>{{ release.movies[0].title }}</template>
+				</h2>
 
 				<h2
 					v-else-if="release.actors.length > 0"
@@ -275,7 +278,7 @@ function bannerBackground() {
 function pageTitle() {
 	return this.release
 		&& (this.release.title
-		|| (this.release.actors.length > 0 ? `${this.release.actors.map(actor => actor.name).join(', ')} for ${this.release.entity.name}` : null));
+		|| (this.release.actors.length > 0 ? `${this.release.actors.map((actor) => actor.name).join(', ')} for ${this.release.entity.name}` : null));
 }
 
 function showAlbum() {

assets/components/releases/releases.vue

@@ -5,8 +5,10 @@
 			class="heading"
 		><span class="range">{{ range }}</span> releases for '{{ context }}'</h3>
 
+		<Ellipsis v-if="!done" />
+
 		<ul
-			v-if="releases.length > 0"
+			v-else-if="releases.length > 0"
 			:key="sfw"
 			class="nolist tiles"
 		>
@@ -18,13 +20,14 @@
 					:release="release"
 					:referer="referer"
 					:index="index"
+					:stash="stash"
 					@stash="isStashed => $emit('stash', isStashed)"
 				/>
 			</li>
 		</ul>
 
 		<span
-			v-if="releases.length === 0 && range !== 'all'"
+			v-else-if="releases.length === 0 && range !== 'all'"
 			class="empty"
 		>No {{ range }} releases</span>
 
@@ -36,6 +39,7 @@
 </template>
 
 <script>
+import Ellipsis from '../loading/ellipsis.vue';
 import SceneTile from './scene-tile.vue';
 
 function range() {
@@ -48,6 +52,7 @@ function sfw() {
 
 export default {
 	components: {
+		Ellipsis,
 		SceneTile,
 	},
 	props: {
@@ -59,10 +64,18 @@ export default {
 			type: String,
 			default: null,
 		},
+		done: {
+			type: Boolean,
+			default: true,
+		},
 		referer: {
 			type: String,
 			default: null,
 		},
+		stash: {
+			type: Object,
+			default: null,
+		},
 	},
 	emits: ['stash'],
 	computed: {
@@ -113,10 +126,29 @@ export default {
     font-weight: bold;
 }
 
+@media(max-width: $breakpoint-mega) {
+    .tiles {
+		grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
+    }
+}
+
 @media(max-width: $breakpoint-kilo) {
     .tiles {
+		grid-template-columns: repeat(auto-fill, minmax(18.5rem, 1fr));
 		grid-gap: .5rem;
 		padding: .5rem;
     }
 }
+
+@media(max-width: $breakpoint) {
+    .tiles {
+		grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
+    }
+}
+
+@media(max-width: $breakpoint-micro) {
+    .tiles {
+		grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
+    }
+}
 </style>

assets/components/releases/scene-tile.vue

@@ -46,18 +46,25 @@
 					><Icon icon="blocked" />No thumbnail available</div>
 
 					<Icon
-						v-show="favorited"
+						v-show="(!stash || stash.primary) && favorited"
 						icon="heart7"
 						class="stash stashed"
 						@click.prevent.native="unstashScene"
 					/>
 
 					<Icon
-						v-show="favorited === false"
+						v-show="(!stash || stash.primary) && favorited === false"
 						icon="heart8"
 						class="stash unstashed"
 						@click.prevent.native="stashScene"
 					/>
+
+					<Icon
+						v-show="stash && !stash.primary"
+						icon="cross2"
+						class="stash unstash"
+						@click.prevent.native="unstashScene"
+					/>
 				</a>
 			</span>
 
@@ -78,7 +85,9 @@
 						v-tooltip.bottom="release.title"
 						:title="release.title"
 						class="title"
-					>{{ release.title }}</h3>
+					>
+						{{ release.title }}<template v-if="release.movies?.[0]?.title && /^scene \d+$/i.test(release.title)"><span class="title-composed">&nbsp;from&nbsp;</span>{{ release.movies[0].title }}</template>
+					</h3>
 
 					<h3
 						v-else-if="release.actors.length > 0"
@@ -104,21 +113,22 @@
 							:key="actor.id"
 							class="actor"
 						>
-							<router-link
+							<RouterLink
 								:to="{ name: 'actor', params: { actorId: actor.id, actorSlug: actor.slug } }"
+								:class="{ [actor.gender]: !!actor.gender }"
 								class="actor-link"
-							>{{ actor.name }}</router-link>
+							>{{ actor.name }}</RouterLink>
 						</li>
 					</ul>
 				</span>
 
 				<div class="labels">
-					<router-link
+					<RouterLink
 						v-if="release.shootId && release.studio"
-						:to="{ name: 'studio', params: { entitySlug: release.studio.slug } }"
+						:to="`/studio/${release.studio.slug}`"
 						:title="release.studio && release.studio.name"
 						class="shoot nolink"
-					>{{ release.shootId }}</router-link>
+					>{{ release.shootId }}</RouterLink>
 
 					<span
 						v-else-if="release.shootId"
@@ -136,10 +146,10 @@
 							:key="`tag-${tag.slug}`"
 							class="tag"
 						>
-							<router-link
+							<RouterLink
 								:to="`/tag/${tag.slug}`"
 								class="tag-link"
-							>{{ tag.name }}</router-link>
+							>{{ tag.name }}</RouterLink>
 						</li>
 					</ul>
 				</div>
@@ -167,12 +177,14 @@ async function stashScene() {
 }
 
 async function unstashScene() {
-	this.favorited = false;
+	if (!this.stash || this.stash.primary) {
+		this.favorited = false;
+	}
 
 	try {
 		await this.$store.dispatch('unstashScene', {
 			sceneId: this.release.id,
-			stashId: this.$store.getters.favorites.id,
+			stashId: this.stash?.id || this.$store.getters.favorites.id,
 		});
 
 		this.$emit('stash', false);
@@ -190,6 +202,10 @@ export default {
 			type: Object,
 			default: null,
 		},
+		stash: {
+			type: Object,
+			default: null,
+		},
 	},
 	emits: ['stash'],
 	data() {
@@ -218,23 +234,27 @@ export default {
     box-shadow: 0 0 3px var(--darken-weak);
 
 	&.new .poster::after {
-		content: '★';
+		content: 'new';
 		position: absolute;
-		top: 0;
-		left: 0;
-		width: 1rem;
-		height: 1rem;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		bottom: 0;
+		right: .5rem;
+		width: 2rem;
 		box-sizing: border-box;
-		margin: .25rem;
-		border-radius: 0 0 .5rem 0;
-		color: var(--primary);
-		font-size: 1rem;
+		padding: .1rem 0 .05rem 0;
+		border-radius: .25rem .25rem 0 0;
+		background: var(--info);
+		color: var(--text-light);
+		font-size: .7rem;
 		font-weight: bold;
 		line-height: 1;
-		text-shadow: 0 0 2px var(--darken-weak);
+		box-shadow: 0 0 3px var(--shadow);
 	}
 
-	&:hover .unstashed {
+	&:hover .unstashed,
+	&:hover .unstash {
 		fill: var(--lighten);
 	}
 }
@@ -279,8 +299,8 @@ export default {
 }
 
 .stash {
-	width: 1.25rem;
-	height: 1.25rem;
+	width: 1.5rem;
+	height: 1.5rem;
 	position: absolute;
 	top: 0;
 	right: 0;
@@ -293,20 +313,26 @@ export default {
 		fill: var(--primary);
 		filter: drop-shadow(0 0 2px var(--darken-weak));
 	}
+
+	&:hover.unstash {
+		fill: var(--text-light);
+		filter: drop-shadow(0 0 2px var(--darken-weak));
+	}
 }
 
 .row {
+	max-width: 100%;
     display: flex;
     justify-content: space-between;
     align-items: center;
     box-sizing: border-box;
     padding: 0 .5rem;
-    margin: 0 0 .1rem 0;
 }
 
 .info {
     display: flex;
     flex-direction: column;
+	align-items: flex-start;
     flex-grow: 1;
 	overflow: hidden;
 }
@@ -318,7 +344,7 @@ export default {
 .title {
     margin: 0;
     color: var(--text);
-    font-size: 1rem;
+    font-size: .9rem;
     line-height: 1.5;
 	white-space: nowrap;
     text-overflow: ellipsis;
@@ -344,8 +370,9 @@ export default {
 }
 
 .actor-link {
-    color: var(--link);
+    color: var(--text);
     text-decoration: none;
+	font-size: .9rem;
 
     &:hover {
         color: var(--primary);
@@ -353,7 +380,7 @@ export default {
 }
 
 .labels {
-    padding: 0 .5rem 1.5rem .5rem;
+    padding: 0 .5rem 1.25rem .5rem;
     max-height: .5rem;
     overflow-y: hidden;
 	font-size: 0;
@@ -384,11 +411,11 @@ export default {
 }
 
 .tag-link {
-	background: var(--background);
+	background: var(--shadow-touch);
     color: var(--shadow);
     display: inline-block;
     padding: .25rem .5rem;
-	border: solid 1px var(--shadow-hint);
+	margin: 0 1px 0 0;
     font-size: .75rem;
     font-weight: bold;
     text-decoration: none;
@@ -400,14 +427,20 @@ export default {
 }
 
 .details-wide {
-	margin: 0 0 .5rem 0;
+	margin: 0 0 .4rem 0;
 }
 
 .details-compact {
 	display: none;
 }
 
-@media(max-width: $breakpoint-kilo) {
+@media(max-width: $breakpoint) {
+	.thumbnail {
+		height: 11rem;
+	}
+}
+
+@media(max-width: $breakpoint-micro) {
 	.tile-body {
 		flex-direction: row;
 	}
@@ -453,14 +486,15 @@ export default {
 	}
 
 	.tile.new .poster::after {
-		bottom: 0;
-		top: auto;
-		margin: .1rem .25rem;
+		top: 0;
+		right: .25rem;
+		bottom: auto;
+		border-radius: 0 0 .25rem .25rem;
+		padding: .05rem 0 .1rem 0;
 	}
 
 	.stash {
 		left: 0;
-		right: auto;
 		padding: .25rem .5rem .5rem .25rem;
 	}
 }

assets/components/releases/tile-details.vue

@@ -57,10 +57,7 @@
 			target="_blank"
 			rel="noopener noreferrer"
 			class="date"
-		><Icon
-			v-if="release.url"
-			icon="share2"
-		/>{{ formatDate(release.date, 'MMMM D, YYYY', release.datePrecision) }}</a>
+		>{{ formatDate(release.date, 'MMMM D, YYYY', release.datePrecision) }}</a>
 
 		<a
 			v-else
@@ -91,27 +88,17 @@ export default {
     width: 100%;
     display: flex;
     justify-content: space-between;
+	z-index: 1;
 	white-space: nowrap;
-    background: var(--profile);
+    background: var(--info);
     font-size: 0;
 	font-weight: bold;
 
     .favicon {
 		width: 2rem;
 		box-sizing: border-box;
-		padding: .5rem;
+		padding: .4rem .5rem;
     }
-
-	/*
-	&.new .date::before {
-		content: '';
-		width: .5rem;
-		height: .5rem;
-		border-radius: 50%;
-		margin: 0 .25rem 0 0;
-		background: var(--primary);
-	}
-	*/
 }
 
 .site,
@@ -120,7 +107,7 @@ export default {
     align-items: center;
     position: relative;
     font-size: .8rem;
-    padding: .5rem;
+    padding: .4rem .5rem;
     color: var(--text-light);
     text-decoration: none;
 

assets/components/search/bar.vue

@@ -0,0 +1,101 @@
+<template>
+	<form
+		class="search"
+		@submit.prevent="() => search()"
+	>
+		<input
+			v-model="query"
+			:placeholder="placeholder || 'Search'"
+			class="query"
+			@input="() => search(true)"
+		>
+
+		<button
+			type="submit"
+			class="search-button"
+		><Icon icon="search" /></button>
+	</form>
+</template>
+
+<script>
+function search(typing) {
+	if (!typing || this.eager) {
+		this.$router.replace({
+			query: { query: this.query || undefined },
+			params: { ...this.$route.params, pageNumber: 1 },
+		});
+	}
+}
+
+function resetQuery() {
+	this.query = this.$route.query.query || null;
+}
+
+export default {
+	props: {
+		placeholder: {
+			type: String,
+			default: null,
+		},
+		eager: {
+			type: Boolean,
+			default: false,
+		},
+	},
+	data() {
+		return {
+			query: this.$route.query.query || null,
+		};
+	},
+	watch: {
+		$route: resetQuery,
+	},
+	methods: {
+		search,
+	},
+};
+</script>
+
+<style lang="scss" scoped>
+.search {
+    display: flex;
+    width: 100%;
+}
+
+.query {
+    max-width: 40rem;
+	min-width: 10rem;
+    color: var(--text);
+    background: var(--background);
+    flex-grow: 1;
+    box-sizing: border-box;
+    padding: 1rem;
+    border: none;
+    box-sizing: border-box;
+    box-shadow: 0 0 3px var(--darken-weak);
+    font-size: 1rem;
+    outline: none;
+
+    &:focus {
+        box-shadow: 0 0 3px var(--primary);
+    }
+}
+
+.search-button {
+    padding: 1rem;
+    background: none;
+    border: none;
+
+    .icon {
+        fill: var(--shadow);
+    }
+
+    &:hover {
+        cursor: pointer;
+
+        .icon {
+            fill: var(--primary);
+        }
+    }
+}
+</style>

assets/components/stashes/stash.vue

@@ -10,11 +10,11 @@
 			>{{ stash.name }}</h2>
 
 			<span class="header-section">
-				<router-link
+				<RouterLink
 					v-if="stash.user"
 					:to="{ name: 'user', params: { username: stash.user.username } }"
 					class="header-item stash-username nolink"
-				><Icon icon="user3" /><span class="username-name">{{ stash.user.username }}</span></router-link>
+				><Icon icon="user3" /><span class="username-name">{{ stash.user.username }}</span></RouterLink>
 
 				<label
 					v-if="isMine"
@@ -55,22 +55,50 @@
 		</div>
 
 		<div class="content-inner">
+			<FilterBar :ranges="['scenes', 'actors', 'movies']" />
+
 			<Releases
-				v-if="stash.scenes?.length > 0"
+				v-if="$route.params.range === 'scenes' && stash.scenes?.length > 0"
 				:releases="stash.scenes.map(item => item.scene)"
+				:stash="stash"
 				class="stash-section stash-scenes"
 				@stash="fetchStash"
 			/>
 
 			<ul
-				v-if="stash.actors?.length > 0"
+				v-if="$route.params.range === 'actors'"
 				class="stash-section stash-actors nolist"
 			>
 				<li
 					v-for="item in stash.actors"
 					:key="item.id"
-				><Actor :actor="item.actor" /></li>
+				><Actor
+					:actor="item.actor"
+					:stash="stash"
+					@stash="fetchStash"
+				/></li>
 			</ul>
+
+			<div
+				v-if="$route.params.range === 'movies'"
+				class="stash-movies"
+			>
+				<Movie
+					v-for="item in stash.movies"
+					:key="`movie-${item.id}`"
+					:movie="item.movie"
+					:stash="stash"
+					@stash="fetchStash"
+				/>
+			</div>
+
+			<Pagination
+				:items-total="totalCount"
+				:items-per-page="limit"
+				class="pagination-bottom"
+			/>
+
+			<Footer />
 		</div>
 	</div>
 </template>
@@ -78,12 +106,35 @@
 <script>
 import Actor from '../actors/tile.vue';
 import Releases from '../releases/releases.vue';
+import Movie from '../releases/movie-tile.vue';
 import RemoveStash from './remove.vue';
 import Toggle from '../form/toggle.vue';
+import FilterBar from '../filters/filter-bar.vue';
+import Pagination from '../pagination/pagination.vue';
 
 async function fetchStash() {
-	this.stash = await this.$store.dispatch('fetchStash', this.$route.params.stashId);
+	this.stash = await this.$store.dispatch('fetchStash', {
+		stashId: this.$route.params.stashId,
+		section: this.$route.params.range,
+		pageNumber: this.$route.params.pageNumber || 1,
+		limit: this.limit,
+	});
+
 	this.isMine = this.stash.user?.id === this.$store.state.auth.user?.id;
+
+	if (this.$route.params.range === 'scenes') {
+		this.totalCount = this.stash.sceneTotal;
+	}
+
+	if (this.$route.params.range === 'actors') {
+		this.totalCount = this.stash.actorTotal;
+	}
+
+	if (this.$route.params.range === 'movies') {
+		this.totalCount = this.stash.movieTotal;
+	}
+
+	this.pageTitle = this.stash.name;
 }
 
 async function publishStash(isPublic) {
@@ -109,23 +160,32 @@ async function removeStash(removed) {
 }
 
 async function mounted() {
-	this.fetchStash();
+	await this.fetchStash();
 }
 
 export default {
 	components: {
 		Actor,
+		Movie,
 		Releases,
 		RemoveStash,
+		Pagination,
+		FilterBar,
 		Toggle,
 	},
 	data() {
 		return {
 			stash: null,
+			limit: Number(this.$route.query.limit) || 20,
+			pageTitle: null,
 			showRemoveStash: false,
 			isMine: false,
+			totalCount: 0,
 		};
 	},
+	watch: {
+		$route: fetchStash,
+	},
 	mounted,
 	methods: {
 		fetchStash,
@@ -199,24 +259,29 @@ export default {
 	}
 }
 
-.stash-section:not(:last-child) {
-	border-bottom: solid 1px var(--shadow-hint);
-}
-
 .stash-actors {
     display: grid;
     grid-gap: .5rem;
     grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
+	grid-template-rows: min-content;
 	flex-grow: 1;
 	padding: 1rem;
+	border-top: solid 1px var(--shadow-hint);
 }
 
-.stash-scenes {
-	flex-grow: 0;
+.stash-movies {
+	display: grid;
+	flex-grow: 1;
+	grid-template-columns: repeat(auto-fill, minmax(25rem, 1fr));
+	grid-template-rows: min-content;
+	grid-gap: 1rem;
+	padding: 1rem;
+	border-top: solid 1px var(--shadow-hint);
+}
 
-	.tiles {
-		grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
-	}
+.stash-scenes .tiles {
+	grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr));
+	grid-template-rows: min-content;
 }
 
 @media(max-width: $breakpoint-small) {

assets/components/tags/tag.vue

@@ -64,7 +64,10 @@
 				:fetch-releases="fetchReleases"
 			/>
 
-			<Releases :releases="releases" />
+			<Releases
+				:releases="releases"
+				:done="done"
+			/>
 
 			<Pagination
 				:items-total="totalCount"
@@ -93,6 +96,8 @@ import Campaign from '../campaigns/campaign.vue';
 const converter = new Converter();
 
 async function fetchReleases(scroll = true) {
+	this.done = false;
+
 	const { tag, releases, totalCount } = await this.$store.dispatch('fetchTagBySlug', {
 		tagSlug: this.$route.params.tagSlug,
 		pageNumber: Number(this.$route.params.pageNumber),
@@ -107,6 +112,8 @@ async function fetchReleases(scroll = true) {
 	this.hasMedia = this.tag.poster || this.tag.photos.length > 0;
 	this.description = this.tag.description && converter.makeHtml(escapeHtml(this.tag.description));
 
+	this.done = true;
+
 	if (this.hasMedia) {
 		this.showBannerCampaign = true;
 	}
@@ -146,6 +153,7 @@ export default {
 			tag: null,
 			description: null,
 			releases: null,
+			done: false,
 			totalCount: 0,
 			limit: 20,
 			pageTitle: null,

assets/components/tags/tags.vue

@@ -1,22 +1,29 @@
 <template>
 	<div class="tags">
-		<div
-			v-for="(tags, category) in categories"
-			:key="category"
-			class="category"
-		>
-			<h3 class="heading">{{ category }}</h3>
+		<div class="content-inner">
+			<SearchBar
+				:placeholder="'Search tags'"
+				class="search"
+			/>
 
 			<div
-				:key="sfw"
-				class="tiles"
+				v-for="(tags, category) in categories"
+				:key="category"
+				class="category"
 			>
-				<Tag
-					v-for="tag in tags"
-					:key="`tag-${tag.id}`"
-					:tag="tag"
-					:lazy="true"
-				/>
+				<h3 class="heading">{{ category }}</h3>
+
+				<div
+					:key="sfw"
+					class="tiles"
+				>
+					<Tag
+						v-for="tag in tags"
+						:key="`tag-${tag.id}`"
+						:tag="tag"
+						:lazy="true"
+					/>
+				</div>
 			</div>
 		</div>
 
@@ -26,121 +33,135 @@
 
 <script>
 import Tag from './tile.vue';
+import SearchBar from '../search/bar.vue';
+
+const tagSlugsByCategory = {
+	popular: [
+		'anal',
+		'lesbian',
+		'interracial',
+		'mff',
+		'mfm',
+		'teen',
+		'milf',
+		'blowjob',
+		'gay',
+		'transsexual',
+		'dp',
+		'gangbang',
+		'facial',
+		'creampie',
+		'squirting',
+	],
+	appearance: [
+		'asian',
+		'black',
+		'latina',
+		'white',
+		'natural-boobs',
+		'enhanced-boobs',
+		'blonde',
+		'brunette',
+		'redhead',
+		'tattoos',
+		'piercings',
+	],
+	sexuality: [
+		'gay',
+		'bisexual',
+		'transsexual',
+	],
+	oral: [
+		'blowjob',
+		'pussy-eating',
+		'ass-eating',
+		'deepthroat',
+		'facefucking',
+		'69',
+		'atm',
+	],
+	manual: [
+		'handjob',
+		'fingering',
+		'anal-fingering',
+		'titty-fucking',
+		'fisting',
+		'anal-fisting',
+		'fisting-dp',
+	],
+	group: [
+		'mfm',
+		'mff',
+		'orgy',
+		'gangbang',
+		'blowbang',
+	],
+	cumshot: [
+		'facial',
+		'creampie',
+		'cum-in-mouth',
+		'cum-on-boobs',
+		'cum-on-butt',
+		'cum-on-pussy',
+		'anal-creampie',
+		'oral-creampie',
+		'bukkake',
+		'fake-cum',
+	],
+	toys: [
+		'toys',
+		'toy-anal',
+		'toy-dp',
+		'double-dildo',
+		'double-dildo-blowjob',
+		'double-dildo-kiss',
+		'double-dildo-anal',
+		'double-dildo-dp',
+	],
+	roleplay: [
+		'family',
+		'parody',
+		'schoolgirl',
+		'nurse',
+		'maid',
+		'nun',
+	],
+	fetish: [
+		'bdsm',
+		'femdom',
+		'bondage',
+		'free-use',
+		'latex',
+		'blindfold',
+	],
+	extreme: [
+		'dp',
+		'airtight',
+		'dap',
+		'dvp',
+		'da-tp',
+		'dv-tp',
+		'tap',
+		'tvp',
+	],
+	misc: [
+		'gaping',
+		'squirting',
+		'oil',
+		'vr',
+		'bts',
+	],
+};
 
 function sfw() {
 	return this.$store.state.ui.sfw;
 }
 
-async function mounted() {
-	const tagSlugsByCategory = {
-		popular: [
-			'anal',
-			'lesbian',
-			'interracial',
-			'mff',
-			'mfm',
-			'teen',
-			'milf',
-			'blowjob',
-			'dp',
-			'gangbang',
-			'facial',
-			'creampie',
-			'squirting',
-		],
-		appearance: [
-			'asian',
-			'black',
-			'latina',
-			'white',
-			'natural-boobs',
-			'enhanced-boobs',
-			'blonde',
-			'brunette',
-			'redhead',
-			'tattoos',
-			'piercings',
-		],
-		oral: [
-			'blowjob',
-			'pussy-eating',
-			'ass-eating',
-			'69',
-			'double-blowjob',
-			'deepthroat',
-			'facefucking',
-			'atm',
-		],
-		manual: [
-			'handjob',
-			'fingering',
-			'anal-fingering',
-			'titty-fucking',
-			'fisting',
-			'anal-fisting',
-			'fisting-dp',
-		],
-		group: [
-			'mfm',
-			'mff',
-			'orgy',
-			'gangbang',
-			'blowbang',
-		],
-		cumshot: [
-			'facial',
-			'creampie',
-			'cum-in-mouth',
-			'cum-on-boobs',
-			'cum-on-butt',
-			'cum-on-pussy',
-			'anal-creampie',
-			'oral-creampie',
-			'bukkake',
-			'fake-cum',
-		],
-		toys: [
-			'toys',
-			'toy-anal',
-			'toy-dp',
-			'double-dildo',
-			'double-dildo-blowjob',
-			'double-dildo-kiss',
-			'double-dildo-anal',
-			'double-dildo-dp',
-		],
-		roleplay: [
-			'family',
-			'parody',
-			'schoolgirl',
-			'nurse',
-			'maid',
-			'nun',
-		],
-		fetish: [
-			'bdsm',
-			'femdom',
-			'bondage',
-			'latex',
-			'blindfold',
-		],
-		extreme: [
-			'dp',
-			'airtight',
-			'dap',
-			'dvp',
-			'da-tp',
-			'dv-tp',
-			'tap',
-		],
-		misc: [
-			'gaping',
-			'squirting',
-			'oil',
-			'vr',
-			'bts',
-		],
-	};
+async function fetchTags() {
+	if (this.$route.query.query) {
+		await this.searchTags();
+		return;
+	}
 
 	const tags = await this.$store.dispatch('fetchTags', {
 		slugs: Object.values(tagSlugsByCategory).flat(),
@@ -148,17 +169,42 @@ async function mounted() {
 
 	const tagsBySlug = tags.reduce((acc, tag) => ({ ...acc, [tag.slug]: tag }), {});
 
-	this.categories = Object.entries(tagSlugsByCategory).reduce((acc, [category, tagSlugs]) => ({
-		...acc,
-		[category]: tagSlugs.map(tagSlug => tagsBySlug[tagSlug]),
-	}), {});
+	this.categories = Object.entries(tagSlugsByCategory).reduce((acc, [category, tagSlugs]) => {
+		const categoryTags = tagSlugs.map((tagSlug) => tagsBySlug[tagSlug]).filter(Boolean);
 
+		if (categoryTags.length === 0) {
+			return acc;
+		}
+
+		return {
+			...acc,
+			[category]: categoryTags,
+		};
+	}, {});
+}
+
+async function searchTags() {
+	const tags = await this.$store.dispatch('searchTags', {
+		minLength: 1,
+		query: this.$route.query.query,
+		limit: 20,
+	});
+
+	this.categories = {
+		results: tags,
+	};
+}
+
+async function mounted() {
 	this.pageTitle = 'Tags';
+
+	await this.fetchTags();
 }
 
 export default {
 	components: {
 		Tag,
+		SearchBar,
 	},
 	data() {
 		return {
@@ -169,14 +215,28 @@ export default {
 	computed: {
 		sfw,
 	},
+	watch: {
+		$route: fetchTags,
+		'$store.state.ui.tagFilter': fetchTags,
+	},
 	mounted,
+	methods: {
+		fetchTags,
+		searchTags,
+	},
 };
 </script>
 
 <style lang="scss" scoped>
-@import 'theme';
+@import 'breakpoints';
 
 .tags {
+	display: flex;
+	flex-direction: column;
+	flex-grow: 1;
+}
+
+.content-inner {
     padding: 1rem 1rem 0 1rem;
 }
 
@@ -184,35 +244,97 @@ export default {
     display: grid;
     grid-template-columns: repeat(auto-fill, minmax(20rem, .33fr));
     grid-gap: 1rem;
-    margin: 0 0 1.5rem 0;
 }
 
 .heading {
     text-transform: capitalize;
 	padding: 0 0 0 .5rem;
-	margin: 2rem 0 1rem 0;
+	margin: 1.25rem 0 1rem 0;
 }
 
 .category:first-child .heading {
 	margin: .5rem 0 1rem 0;
 }
 
-@media(max-width: $breakpoint3) {
+.search {
+	margin: 0 0 .25rem 0;
+}
+
+@media(max-width: $breakpoint-mega) {
     .tiles {
-        grid-template-columns: repeat(auto-fill, minmax(18rem, .5fr));
+        grid-template-columns: repeat(auto-fill, minmax(17.75rem, .5fr));
     }
+
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 12rem;
+	}
+}
+
+@media(max-width: $breakpoint-kilo) {
+    .tiles {
+        grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr));
+		grid-gap: .5rem;
+    }
+
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 14rem;
+	}
 }
 
 @media(max-width: $breakpoint) {
     .tiles {
-        grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
+        grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr));
 		grid-gap: .5rem;
     }
+
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 11rem;
+	}
 }
 
-@media(max-width: $breakpoint0) {
+@media(max-width: $breakpoint-small) {
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 10rem;
+	}
+}
+
+@media(max-width: $breakpoint-micro) {
     .tiles {
-        grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
+        grid-template-columns: repeat(auto-fill, minmax(11rem, 1fr));
     }
+
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 7.5rem;
+	}
+}
+
+@media(max-width: $breakpoint-mini) {
+    .tiles {
+        grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
+    }
+
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 12rem;
+	}
+}
+
+@media(max-width: $breakpoint-nano) {
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 10rem;
+	}
+}
+
+@media(max-width: $breakpoint-pico) {
+	::v-deep(.poster),
+	::v-deep(.blank) {
+		height: 8rem;
+	}
 }
 </style>

assets/components/tags/tile.vue

@@ -1,55 +1,62 @@
 <template>
 	<div
-		v-if="tag.poster"
 		class="tile"
 	>
 		<router-link
 			:to="`/tag/${tag.slug}`"
 			:title="tag.name"
+			:class="{ blank: !tag.poster }"
 			class="poster-link"
 		>
-			<img
-				v-if="!lazy && !sfw"
-				:src="`/img/${tag.poster.thumbnail}`"
-				:style="{ 'background-image': `url(/img/${tag.poster.lazy})` }"
-				:title="comment"
-				:alt="tag.name"
-				class="poster"
-			>
+			<template v-if="tag.poster">
+				<img
+					v-if="!lazy && !sfw"
+					:src="`/img/${tag.poster.thumbnail}`"
+					:style="{ 'background-image': `url(/img/${tag.poster.lazy})` }"
+					:title="comment"
+					:alt="tag.name"
+					class="poster"
+				>
 
-			<img
-				v-if="!lazy && sfw"
-				:src="`/img/${tag.poster.sfw.thumbnail}`"
-				:style="{ 'background-image': `url(/img/${tag.poster.sfw.lazy})` }"
-				:title="tag.poster.sfw.comment"
-				:alt="tag.name"
-				class="poster"
-			>
+				<img
+					v-if="!lazy && sfw"
+					:src="`/img/${tag.poster.sfw.thumbnail}`"
+					:style="{ 'background-image': `url(/img/${tag.poster.sfw.lazy})` }"
+					:title="tag.poster.sfw.comment"
+					:alt="tag.name"
+					class="poster"
+				>
 
-			<img
-				v-if="lazy && !sfw"
-				:src="`/img/${tag.poster.thumbnail}`"
-				:style="{ 'background-image': `url(/img/${tag.poster.lazy})` }"
-				:title="comment"
-				:alt="tag.name"
-				loading="lazy"
-				class="poster"
-			>
+				<img
+					v-if="lazy && !sfw"
+					:src="`/img/${tag.poster.thumbnail}`"
+					:style="{ 'background-image': `url(/img/${tag.poster.lazy})` }"
+					:title="comment"
+					:alt="tag.name"
+					loading="lazy"
+					class="poster"
+				>
 
-			<img
-				v-if="lazy && sfw"
-				:src="`/img/${tag.poster.sfw.thumbnail}`"
-				:style="{ 'background-image': `url(/img/${tag.poster.sfw.lazy})` }"
-				:title="tag.poster.sfw.comment"
-				:alt="tag.name"
-				loading="lazy"
-				class="poster"
-			>
+				<img
+					v-if="lazy && sfw"
+					:src="`/img/${tag.poster.sfw.thumbnail}`"
+					:style="{ 'background-image': `url(/img/${tag.poster.sfw.lazy})` }"
+					:title="tag.poster.sfw.comment"
+					:alt="tag.name"
+					loading="lazy"
+					class="poster"
+				>
 
-			<Logo
-				v-if="!sfw"
-				:photo="tag.poster"
-				favicon
+				<Logo
+					v-if="!sfw"
+					:photo="tag.poster"
+					favicon
+				/>
+			</template>
+
+			<Icon
+				v-else
+				icon="price-tag2"
 			/>
 		</router-link>
 
@@ -59,11 +66,6 @@
 			:title="tag.name"
 		>{{ tag.name }}</router-link>
 	</div>
-
-	<span
-		v-else
-		class="title"
-	>{{ tag.name }}</span>
 </template>
 
 <script>
@@ -100,13 +102,16 @@ export default {
 
 <style lang="scss" scoped>
 .tile {
+	display: flex;
+	flex-direction: column;
     box-sizing: border-box;
     position: relative;
 	text-decoration: none;
 	font-size: 0;
 
 	&:hover {
-		.poster {
+		.poster,
+		.blank {
 			box-shadow: 0 0 2px var(--darken);
 		}
 
@@ -119,15 +124,30 @@ export default {
 .poster {
 	display: inline-block;
     width: 100%;
-	height: 13.5rem;
 	object-fit: cover;
 	background-size: cover;
 	background-position: center;
     box-shadow: 0 0 3px var(--darken-weak);
 }
 
+.poster,
+.blank {
+	height: 13.5rem;
+}
+
 .poster-link {
+	display: flex;
+	align-items: center;
+	justify-content: center;
 	position: relative;
+	flex-grow: 1;
+	background: var(--shadow-hint);
+
+	.icon {
+		width: 2rem;
+		height: 2rem;
+		fill: var(--shadow-weak);
+	}
 }
 
 .title {

assets/components/tooltip/tooltip.vue

@@ -16,16 +16,19 @@
 				:style="{ transform: `translate3d(${tooltipX}px, ${tooltipY}px, 0)` }"
 				@click.stop
 			>
-				<div class="tooltip-inner">
+				<div
+					class="tooltip-inner"
+					:style="{ 'max-height': `calc(100vh - ${tooltipY}px - 1rem)` }"
+				>
 					<div class="tooltip">
 						<slot name="tooltip" />
 					</div>
-
-					<div
-						class="tooltip-arrow"
-						:style="{ transform: `translate3d(${arrowOffset}px, 0, 0)` }"
-					/>
 				</div>
+
+				<div
+					class="tooltip-arrow"
+					:style="{ transform: `translate3d(${arrowOffset}px, 0, 0)` }"
+				/>
 			</div>
 		</teleport>
 	</div>
@@ -155,6 +158,8 @@ export default {
 
 .tooltip-inner {
 	position: relative;
+	overflow-y: auto;
+	background: var(--background);
 	box-shadow: 0 0 .5rem var(--darken);
 }
 

assets/components/users/stash.vue

@@ -2,7 +2,7 @@
 	<div class="stash">
 		<div class="stash-section stash-header">
 			<router-link
-				:to="{ name: 'stash', params: { stashId: stash.id, stashSlug: stash.slug } }"
+				:to="{ name: 'stash', params: { stashId: stash.id, stashSlug: stash.slug, range: 'scenes', pageNumber: 1 } }"
 				class="stash-link nolink"
 			>
 				<h4 class="stash-name">{{ stash.name }}</h4>

assets/css/_breakpoints.scss

@@ -1,5 +1,6 @@
 $breakpoint-pico: 270px;
 $breakpoint-nano: 320px;
+$breakpoint-mini: 400px;
 $breakpoint-micro: 540px;
 $breakpoint-small: 620px;
 $breakpoint: 720px;

assets/css/_inputs.scss

@@ -44,6 +44,11 @@
 	&:hover {
 		background: var(--primary-strong);
 	}
+
+	&:disabled {
+		background: var(--shadow-weak);
+		cursor: default;
+	}
 }
 
 .button-secondary {

assets/css/_theme.scss

@@ -5,14 +5,21 @@ $breakpoint3: 1200px;
 $breakpoint4: 1500px;
 
 :root {
+    --primary: #f65596;
+    --primary-strong: #f90071;
+    --primary-faded: #ffcce4;
+
 	/*
+    --primary: #f04288;
+
     --primary: #ff6c88;
     --primary-strong: #ff4166;
     --primary-faded: #ffdfee;
-	*/
+
     --primary: #f28;
     --primary-strong: #f90071;
     --primary-faded: #ffcce4;
+	*/
 
     --text-dark: #222;
     --text-light: #fff;
@@ -39,6 +46,8 @@ $breakpoint4: 1500px;
     --logo-shadow: drop-shadow(1px 0 0 $shadow-weak) drop-shadow(-1px 0 0 $shadow-weak) drop-shadow(0 1px 0 $shadow-weak) drop-shadow(0 -1px 0 $shadow-weak);
     --logo-highlight: drop-shadow(0 0 1px $highlight);
 
+    --info: #321b24;
+
     --male: #0af;
     --female: #f0a;
 

assets/img/icons/film4.svg

@@ -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>film4</title>
+<path d="M0 2v12h16v-12h-16zM3 13h-2v-2h2v2zM3 9h-2v-2h2v2zM3 5h-2v-2h2v2zM12 13h-8v-10h8v10zM15 13h-2v-2h2v2zM15 9h-2v-2h2v2zM15 5h-2v-2h2v2zM6 5v6l4-3z"></path>
+</svg>

assets/img/icons/presentation.svg

@@ -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>presentation</title>
+<path d="M14.25 0h-13.5c-0.412 0-0.75 0.338-0.75 0.75v11.5c0 0.412 0.338 0.75 0.75 0.75h4.455l-2.040 2.040c-0.22 0.22-0.22 0.576 0 0.795 0.11 0.11 0.254 0.165 0.398 0.165s0.288-0.055 0.398-0.165l2.835-2.835h0.205v2.5c0 0.276 0.224 0.5 0.5 0.5s0.5-0.224 0.5-0.5v-2.5h0.205l2.835 2.835c0.11 0.11 0.254 0.165 0.398 0.165s0.288-0.055 0.398-0.165c0.22-0.22 0.22-0.576 0-0.795l-2.040-2.040h4.455c0.412 0 0.75-0.338 0.75-0.75v-11.5c0-0.412-0.338-0.75-0.75-0.75zM6 3l4 2.5-4 2.5v-5zM12.5 11h-10c-0.276 0-0.5-0.224-0.5-0.5s0.224-0.5 0.5-0.5h10c0.276 0 0.5 0.224 0.5 0.5s-0.224 0.5-0.5 0.5z"></path>
+</svg>

assets/js/actors/actions.js

@@ -281,7 +281,7 @@ function initActorActions(store, router) {
 
 		return {
 			actor: curateActor(actor, null, curateRelease),
-			releases: actor.scenesConnection.releases.map(release => curateRelease(release)),
+			releases: actor.scenesConnection.releases.map((release) => curateRelease(release)),
 			totalCount: actor.scenesConnection.totalCount,
 		};
 	}
@@ -289,9 +289,10 @@ function initActorActions(store, router) {
 	async function fetchActors({ _commit }, {
 		limit = 10,
 		pageNumber = 1,
-		letter,
+		query,
 		gender,
 		age,
+		country,
 		dob,
 		naturalBoobs,
 		boobSize,
@@ -302,7 +303,8 @@ function initActorActions(store, router) {
 
 		const genderFilter = (gender === null && 'gender: { isNull: true }')
 			|| (gender === 'all' && ' ')
-			|| `gender: { equalTo: "${gender}" }`;
+			|| (gender && `gender: { equalTo: "${gender}" }`)
+			|| '';
 
 		const ageFilter = age ? `
 			or: [
@@ -325,37 +327,38 @@ function initActorActions(store, router) {
 		` : '';
 
 		const dobFilter = dob ? `dateOfBirth: { equalTo: "${dob}" }` : '';
+		const countryFilter = country ? `countryByBirthCountryAlpha2: { alpha2: { equalTo: "${country}" } }` : '';
 
 		const heightFilter = height ? `height: { greaterThanOrEqualTo: ${height[0]}, lessThanOrEqualTo: ${height[1]} }` : '';
 		const weightFilter = weight ? `weight: { greaterThanOrEqualTo: ${weight[0]}, lessThanOrEqualTo: ${weight[1]} }` : '';
 		const cupFilter = boobSize ? `cup: { greaterThanOrEqualTo: "${boobSize[0]}", lessThanOrEqualTo: "${boobSize[1]}" }` : '';
 
-		const { connection: { actors, totalCount } } = await graphql(`
+		const { connection: { actors, totalCount }, countries } = await graphql(`
             query Actors(
+                $query: String
                 $limit: Int,
                 $offset: Int = 0,
-                $letter: String! = "",
 				$naturalBoobs: Boolean,
 				$userId: Int,
 				$hasAuth: Boolean!,
             ) {
-				connection: actorsConnection(
+				connection: searchActorsConnection(
+					query: $query
                     first: $limit,
 					offset: $offset
                     orderBy: NAME_ASC
+					minLength: 0
                     filter: {
 						aliasFor: {
 							isNull: true
 						}
-                        name: {
-                            startsWith: $letter
-                        }
 						${genderFilter}
 						${ageFilter}
 						${dobFilter}
 						${heightFilter}
 						${weightFilter}
 						${cupFilter}
+						${countryFilter}
 						naturalBoobs: {
 							equalTo: $naturalBoobs
 						}
@@ -408,110 +411,30 @@ function initActorActions(store, router) {
 						${actorStashesFields}
 					}
                 }
+				countries(
+					orderBy: NAME_ASC,
+				) {
+					alpha2
+					name
+					alias
+				}
             }
         `, {
+			query,
 			offset: Math.max(0, (pageNumber - 1)) * limit,
 			limit,
-			letter,
-			naturalBoobs,
+			naturalBoobs: naturalBoobs || null,
 			hasAuth: !!store.state.auth.user,
 			userId: store.state.auth.user?.id,
 		});
 
 		return {
-			actors: actors.map(actor => curateActor(actor)),
+			actors: actors.map((actor) => curateActor(actor)),
 			totalCount,
+			countries,
 		};
 	}
 
-	async function searchActors({ _commit }, { query, limit = 20, minLength = 2 }) {
-		const { actors } = await graphql(`
-            query SearchActors(
-                $query: String!
-                $limit: Int = 20
-                $minLength: Int = 2
-				$hasAuth: Boolean!
-				$userId: Int
-            ) {
-                actors: searchActors(
-                    search: $query,
-					minLength: $minLength
-                    first: $limit
-                ) {
-                    id
-                    name
-                    slug
-                    age
-					ageAtDeath
-                    dateOfBirth
-                    dateOfDeath
-                    gender
-					aliasFor: actorByAliasFor {
-						id
-						name
-						slug
-						age
-						ageAtDeath
-						dateOfBirth
-						dateOfDeath
-						gender
-						entity {
-							id
-							name
-							slug
-						}
-						avatar: avatarMedia {
-							id
-							path
-							thumbnail
-							lazy
-							isS3
-							width
-							height
-							comment
-							credit
-						}
-						birthCountry: countryByBirthCountryAlpha2 {
-						  alpha2
-						  name
-						  alias
-						}
-					}
-                    entity {
-                        id
-                        name
-                        slug
-                    }
-					avatar: avatarMedia {
-						id
-						path
-						thumbnail
-						lazy
-						isS3
-						width
-						height
-						comment
-						credit
-					}
-                    birthCountry: countryByBirthCountryAlpha2 {
-                      alpha2
-                      name
-                      alias
-                    }
-					${actorStashesFields}
-                }
-            }
-        `, {
-			query,
-			limit,
-			minLength,
-			hasAuth: !!store.state.auth.user,
-			userId: store.state.auth.user?.id,
-		});
-
-		return actors.map(actor => curateActor(actor));
-	}
-
 	async function fetchActorReleases({ _commit }, actorId) {
 		const releases = await get(`/actors/${actorId}/releases`, {
 			filter: store.state.ui.filter,
@@ -526,7 +449,6 @@ function initActorActions(store, router) {
 		fetchActorById,
 		fetchActors,
 		fetchActorReleases,
-		searchActors,
 	};
 }
 

assets/js/auth/getters.js

@@ -1,5 +1,5 @@
 function favoritesStash(state) {
-	return state.user.stashes.find(stash => stash.slug === 'favorites');
+	return state.user.stashes.find((stash) => stash.slug === 'favorites');
 }
 
 module.exports = {

assets/js/curate.js

@@ -31,8 +31,8 @@ function curateActor(actor, release) {
 
 	if (actor.profiles) {
 		const photos = actor.profiles
-			.map(profile => ({ entity: profile.entity, ...profile.avatar }))
-			.filter(avatar => avatar.id && (!curatedActor.avatar || avatar.hash !== curatedActor.avatar.hash));
+			.map((profile) => ({ entity: profile.entity, ...profile.avatar }))
+			.filter((avatar) => avatar.id && (!curatedActor.avatar || avatar.hash !== curatedActor.avatar.hash));
 
 		const descriptions = actor.profiles.reduce((acc, profile) => ({
 			...acc,
@@ -57,10 +57,10 @@ function curateActor(actor, release) {
 	}
 
 	if (actor.stashes) {
-		curatedActor.stashes = actor.stashes.filter(Boolean).map(stash => curateStash(stash.stash || stash)); // eslint-disable-line no-use-before-define
+		curatedActor.stashes = actor.stashes.filter(Boolean).map((stash) => curateStash(stash.stash || stash)); // eslint-disable-line no-use-before-define
 	}
 
-	curatedActor.stashes = actor.stashes?.map(stash => stash.stash || stash) || [];
+	curatedActor.stashes = actor.stashes?.map((stash) => stash.stash || stash) || [];
 
 	return curatedActor;
 }
@@ -70,21 +70,21 @@ function curateRelease(release) {
 		...release,
 		actors: [],
 		poster: release.poster && release.poster.media,
-		tags: release.tags ? release.tags.map(tag => tag.tag || tag) : [],
+		tags: release.tags ? release.tags.map((tag) => tag.tag || tag) : [],
 	};
 
 	if (release.scenes) curatedRelease.scenes = release.scenes.filter(Boolean).map(({ scene }) => curateRelease(scene));
 	if (release.movies) curatedRelease.movies = release.movies.filter(Boolean).map(({ movie }) => curateRelease(movie));
-	if (release.chapters) curatedRelease.chapters = release.chapters.filter(Boolean).map(chapter => curateRelease(chapter));
-	if (release.photos) curatedRelease.photos = release.photos.filter(Boolean).map(photo => photo.media || photo);
+	if (release.chapters) curatedRelease.chapters = release.chapters.filter(Boolean).map((chapter) => curateRelease(chapter));
+	if (release.photos) curatedRelease.photos = release.photos.filter(Boolean).map((photo) => photo.media || photo);
 	if (release.covers) curatedRelease.covers = release.covers.filter(Boolean).map(({ media }) => media);
 	if (release.trailer) curatedRelease.trailer = release.trailer.media;
 	if (release.teaser) curatedRelease.teaser = release.teaser.media;
-	if (release.actors) curatedRelease.actors = release.actors.filter(Boolean).map(actor => curateActor(actor.actor || actor, curatedRelease));
-	if (release.directors) curatedRelease.directors = release.directors.filter(Boolean).map(director => curateActor(director.director || director, curatedRelease));
+	if (release.actors) curatedRelease.actors = release.actors.filter(Boolean).map((actor) => curateActor(actor.actor || actor, curatedRelease));
+	if (release.directors) curatedRelease.directors = release.directors.filter(Boolean).map((director) => curateActor(director.director || director, curatedRelease));
 	if (release.movieTags && release.movieTags.length > 0) curatedRelease.tags = release.movieTags.filter(Boolean).map(({ tag }) => tag);
 	if (release.movieActors && release.movieActors.length > 0) curatedRelease.actors = release.movieActors.filter(Boolean).map(({ actor }) => curateActor(actor, curatedRelease));
-	if (release.stashes) curatedRelease.stashes = release.stashes.filter(Boolean).map(stash => curateStash(stash.stash || stash)); // eslint-disable-line no-use-before-define
+	if (release.stashes) curatedRelease.stashes = release.stashes.filter(Boolean).map((stash) => curateStash(stash.stash || stash)); // eslint-disable-line no-use-before-define
 
 	if (release.productionLocation) {
 		curatedRelease.productionLocation = {
@@ -108,14 +108,16 @@ function curateEntity(entity, parent, releases) {
 
 	if (entity.children) {
 		if (entity.children.nodes) {
-			curatedEntity.children = entity.children.nodes.map(childEntity => curateEntity(childEntity, curatedEntity));
+			curatedEntity.children = entity.children.nodes.map((childEntity) => curateEntity(childEntity, curatedEntity));
 		}
 
 		curatedEntity.childrenTotal = entity.children.totalCount;
 	}
 
 	if (entity.parent || parent) curatedEntity.parent = curateEntity(entity.parent || parent);
-	if (releases) curatedEntity.releases = releases.map(release => curateRelease(release));
+	if (releases) curatedEntity.releases = releases.map((release) => curateRelease(release));
+
+	curatedEntity.sceneTotal = entity.sceneTotal;
 
 	return curatedEntity;
 }
@@ -136,20 +138,30 @@ function curateTag(tag) {
 function curateStash(stash) {
 	const curatedStash = stash;
 
-	if (stash.scenes) {
-		curatedStash.scenes = stash.scenes.map(item => ({
+	if (stash.scenes || stash.scenesConnection?.scenes) {
+		curatedStash.sceneTotal = stash.scenesConnection?.totalCount || null;
+		curatedStash.scenes = (stash.scenesConnection?.scenes || stash.scenes).map((item) => ({
 			...item,
 			scene: curateRelease(item.scene),
 		}));
 	}
 
-	if (stash.actors) {
-		curatedStash.actors = stash.actors.map(item => ({
+	if (stash.actors || stash.actorsConnection?.actors) {
+		curatedStash.actorTotal = stash.actorsConnection?.totalCount || null;
+		curatedStash.actors = (stash.actorsConnection?.actors || stash.actors).map((item) => ({
 			...item,
 			actor: curateActor(item.actor),
 		}));
 	}
 
+	if (stash.movies || stash.moviesConnection?.movies) {
+		curatedStash.movieTotal = stash.moviesConnection?.totalCount || null;
+		curatedStash.movies = (stash.moviesConnection?.movies || stash.movies).map((item) => ({
+			...item,
+			movie: curateRelease(item.movie),
+		}));
+	}
+
 	return curatedStash;
 }
 
@@ -161,11 +173,11 @@ function curateAlert(alert) {
 	const curatedAlert = alert;
 
 	if (alert.actors) {
-		curatedAlert.actors = alert.actors.map(actor => curateActor(actor.actor || actor));
+		curatedAlert.actors = alert.actors.map((actor) => curateActor(actor.actor || actor));
 	}
 
 	if (alert.tags) {
-		curatedAlert.tags = alert.tags.map(tag => curateTag(tag.tag || tag));
+		curatedAlert.tags = alert.tags.map((tag) => curateTag(tag.tag || tag));
 	}
 
 	if (alert.entity) {
@@ -173,7 +185,7 @@ function curateAlert(alert) {
 	}
 
 	if (alert.stashes) {
-		curatedAlert.stashes = alert.stashes.map(stash => curateStash(stash.stash || stash));
+		curatedAlert.stashes = alert.stashes.map((stash) => curateStash(stash.stash || stash));
 	}
 
 	return curatedAlert;
@@ -187,11 +199,11 @@ function curateUser(user) {
 	const curatedUser = user;
 
 	if (user.stashes) {
-		curatedUser.stashes = user.stashes.map(stash => curateStash(stash.stash || stash));
+		curatedUser.stashes = user.stashes.map((stash) => curateStash(stash.stash || stash));
 	}
 
 	if (user.alerts) {
-		curatedUser.alerts = user.alerts.map(alert => curateAlert(alert.alert || alert));
+		curatedUser.alerts = user.alerts.map((alert) => curateAlert(alert.alert || alert));
 	}
 
 	return curatedUser;

assets/js/entities/actions.js

@@ -14,7 +14,7 @@ function initEntitiesActions(store, router) {
 	}) {
 		const { before, after, orderBy } = getDateRange(range);
 
-		const { entity, connection: { releases, totalCount } } = await graphql(`
+		const { entity } = await graphql(`
             query Entity(
                 $entitySlug: String!
                 $entityType: String! = "channel"
@@ -22,8 +22,6 @@ function initEntitiesActions(store, router) {
                 $offset: Int = 0,
                 $after: Datetime = "1900-01-01",
                 $before: Datetime = "2100-01-01",
-                $afterTime: Datetime = "1900-01-01",
-                $beforeTime: Datetime = "2100-01-01",
                 $orderBy: [ReleasesOrderBy!]
                 $exclude: [String!]
 				$hasAuth: Boolean!
@@ -64,6 +62,10 @@ function initEntitiesActions(store, router) {
 							independent
 							hasLogo
 							${campaignsFragment}
+							sceneTotal
+							children: childEntitiesConnection {
+								totalCount
+							}
 						}
                     }
 					${campaignsFragment}
@@ -77,82 +79,44 @@ function initEntitiesActions(store, router) {
 						hasLogo
 						${campaignsFragment}
                     }
-                }
-				connection: releasesConnection(
-					first: $limit
-					offset: $offset
-					orderBy: $orderBy
-					filter: {
-						and: [
-							{
-								entity: {
-									or: [
-										{
-											slug: { equalTo: $entitySlug }
-										},
-										{
-											parent: {
-												slug: { equalTo: $entitySlug }
-												type: { equalTo: $entityType }
-											}
-										},
-										{
-											parent: {
-												parent: {
-													slug: { equalTo: $entitySlug }
-													type: { equalTo: $entityType }
-												}
-											}
-										}
-										{
-											parent: {
-												parent: {
-													parent: {
-														slug: { equalTo: $entitySlug }
-														type: { equalTo: $entityType }
-													}
-												},
-											},
-										},
-									]
-								}
-							}
-							{
-								or: [
-									{
-										date: {
-											lessThan: $before,
-											greaterThan: $after
-										}
-									},
-									{
-										date: {
-											isNull: true
-										},
-										createdAt: {
-											lessThan: $beforeTime,
-											greaterThan: $afterTime,
-										}
+					connection: scenesConnection(
+						first: $limit
+						offset: $offset
+						orderBy: $orderBy
+						filter: {
+							or: [
+								{
+									date: {
+										isNull: ${entityType !== 'network'}
 									}
-								]
+								}
+								{
+									date: {
+										isNull: false
+									}
+								}
+							]
+							date: {
+								lessThan: $before,
+								greaterThan: $after
 							}
-						]
-						releasesTagsConnection: {
-							none: {
-								tag: {
-									slug: {
-										in: $exclude
+							releasesTagsConnection: {
+								none: {
+									tag: {
+										slug: {
+											in: $exclude
+										}
 									}
 								}
 							}
 						}
+					) {
+						releases: nodes {
+							${releaseFields}
+						}
+						totalCount
 					}
-				) {
-					releases: nodes {
-						${releaseFields}
-					}
-					totalCount
-				}
+                }
             }
         `, {
 			entitySlug,
@@ -162,8 +126,6 @@ function initEntitiesActions(store, router) {
 			after,
 			before,
 			orderBy,
-			afterTime: store.getters.after,
-			beforeTime: store.getters.before,
 			exclude: store.state.ui.tagFilter,
 			hasAuth: !!store.state.auth.user,
 			userId: store.state.auth.user?.id,
@@ -175,8 +137,8 @@ function initEntitiesActions(store, router) {
 		}
 
 		return {
-			entity: curateEntity(entity, null, releases),
-			totalCount,
+			entity: curateEntity(entity, null, entity.connection.releases),
+			totalCount: entity.connection.totalCount,
 		};
 	}
 
@@ -240,17 +202,17 @@ function initEntitiesActions(store, router) {
 			entitySlugs,
 		});
 
-		return entities.map(entity => curateEntity(entity));
+		return entities.map((entity) => curateEntity(entity));
 	}
 
 	async function searchEntities({ _commit }, { query, limit = 20 }) {
 		const { entities } = await graphql(`
             query SearchEntities(
                 $query: String!
-                $limit:Int = 20,
+                $limit: Int = 20,
             ) {
                 entities: searchEntities(
-                    search: $query,
+                    search: $query
                     first: $limit
                 ) {
 					id
@@ -274,7 +236,7 @@ function initEntitiesActions(store, router) {
 			limit,
 		});
 
-		return entities.map(entity => curateEntity(entity));
+		return entities.map((entity) => curateEntity(entity));
 	}
 
 	return {

assets/js/format.js

@@ -5,7 +5,7 @@ export function formatDuration(duration, forceHours) {
 	const minutes = Math.floor((duration % 3600) / 60);
 	const seconds = Math.floor(duration % 60);
 
-	const [formattedHours, formattedMinutes, formattedSeconds] = [hours, minutes, seconds].map(segment => segment.toString().padStart(2, '0'));
+	const [formattedHours, formattedMinutes, formattedSeconds] = [hours, minutes, seconds].map((segment) => segment.toString().padStart(2, '0'));
 
 	if (duration >= 3600 || forceHours) {
 		return `${formattedHours}:${formattedMinutes}:${formattedSeconds}`;

assets/js/fragments.js

@@ -96,6 +96,75 @@ const actorFields = `
 		${actorStashesFields}
 `;
 
+const movieFields = `
+	id
+	title
+	url
+	slug
+	date
+	datePrecision
+	actors {
+		id
+		name
+		slug
+	}
+	tags {
+		id
+		name
+		slug
+	}
+	entity {
+		id
+		name
+		slug
+		type
+		parent {
+			id
+			name
+			slug
+			type
+		}
+	}
+	covers: moviesCovers(orderBy: MEDIA_BY_MEDIA_ID__INDEX_ASC) {
+		media {
+			id
+			path
+			thumbnail
+			lazy
+			width
+			height
+			thumbnailWidth
+			thumbnailHeight
+			isS3
+			sfw: sfwMedia {
+				id
+				path
+				thumbnail
+				lazy
+				comment
+			}
+		}
+	}
+	isFavorited
+	isStashed(includeFavorites: false)
+	stashes: stashesMovies(
+		filter: {
+			stash: {
+				userId: {
+					equalTo: $userId
+				}
+			}
+		}
+	) @include(if: $hasAuth) {
+		stash {
+			id
+			name
+			slug
+			primary
+		}
+	}
+`;
+
 const campaignsFragment = `
 	campaigns(filter: {
 		or: [
@@ -119,8 +188,14 @@ const campaignsFragment = `
 	}) {
 		id
 		url
+		affiliate {
+			id
+			url
+			parameters
+		}
 		banner {
 			id
+			type
 			width
 			height
 			ratio
@@ -169,7 +244,12 @@ const releaseDirectorFragment = `
 `;
 
 const releaseTagsFragment = `
-    tags: releasesTags(orderBy: TAG_BY_TAG_ID__PRIORITY_DESC) {
+    tags: releasesTags(
+		orderBy: TAG_BY_TAG_ID__PRIORITY_DESC
+		filter: {
+			tagId: { isNull: false }
+		}
+	) {
       tag {
         name
         priority
@@ -180,7 +260,7 @@ const releaseTagsFragment = `
 `;
 
 const releasePosterFragment = `
-    poster: releasesPosterByReleaseId {
+    poster: releasesPoster {
         media {
 			id
             index
@@ -255,7 +335,7 @@ const releasePhotosFragment = `
 `;
 
 const releaseTrailerFragment = `
-    trailer: releasesTrailerByReleaseId {
+    trailer: releasesTrailer {
         media {
 			id
             index
@@ -269,7 +349,7 @@ const releaseTrailerFragment = `
 `;
 
 const releaseTeaserFragment = `
-    teaser: releasesTeaserByReleaseId {
+    teaser: releasesTeaser {
         media {
 			id
             index
@@ -305,6 +385,13 @@ const releaseFields = `
         slug
         url
     }
+	movies: moviesScenesBySceneId {
+	    movie {
+			id
+			title
+			slug
+		}
+	}
     isNew
 	isFavorited
 	isStashed(includeFavorites: false)
@@ -400,7 +487,7 @@ const releaseFragment = `
 				slug
 			}
 		}
-		poster: chaptersPosterByChapterId {
+		poster: chaptersPoster {
 			media {
 				id
 				index
@@ -429,7 +516,7 @@ const releaseFragment = `
 			id
 			title
 			slug
-			covers: moviesCovers {
+			covers: moviesCovers(orderBy: MEDIA_BY_MEDIA_ID__INDEX_ASC) {
 				media {
 					id
 					index
@@ -537,6 +624,7 @@ export {
 	actorFields,
 	actorStashesFields,
 	campaignsFragment,
+	movieFields,
 	releaseActorsFragment,
 	releaseFields,
 	releaseTagsFragment,

assets/js/get-date-range.js

@@ -7,12 +7,12 @@ const dateRanges = {
 	latest: () => ({
 		after: '1900-01-01',
 		before: dayjs.utc().toDate(),
-		orderBy: ['DATE_DESC', 'CREATED_AT_DESC'],
+		orderBy: ['DATE_DESC'],
 	}),
 	upcoming: () => ({
 		after: dayjs.utc().toDate(),
 		before: '2100-01-01',
-		orderBy: ['DATE_ASC', 'CREATED_AT_ASC'],
+		orderBy: ['DATE_DESC'],
 	}),
 	new: () => ({
 		after: '1900-01-01 00:00:00',
@@ -22,35 +22,10 @@ const dateRanges = {
 	all: () => ({
 		after: '1900-01-01',
 		before: '2100-01-01',
-		orderBy: ['DATE_DESC', 'CREATED_AT_DESC'],
+		orderBy: ['DATE_DESC'],
 	}),
 };
 
-/* requires PostgreSQL 12.x> not available in production yet
-const dateRanges = {
-	latest: () => ({
-		after: '1900-01-01',
-		before: dayjs.utc().toDate(),
-		orderBy: ['EFFECTIVE_DATE_DESC'],
-	}),
-	upcoming: () => ({
-		after: dayjs.utc().toDate(),
-		before: '2100-01-01',
-		orderBy: ['EFFECTIVE_DATE_DESC'],
-	}),
-	new: () => ({
-		after: '1900-01-01 00:00:00',
-		before: '2100-01-01',
-		orderBy: ['CREATED_AT_DESC', 'EFFECTIVE_DATE_ASC'],
-	}),
-	all: () => ({
-		after: '1900-01-01',
-		before: '2100-01-01',
-		orderBy: ['EFFECTIVE_DATE_DESC'],
-	}),
-};
-*/
-
 function getDateRange(range) {
 	return (dateRanges[range] || dateRanges.all)();
 }

assets/js/main.js

@@ -109,6 +109,10 @@ async function init() {
 				document.title = 'traxxx';
 			},
 		},
+		beforeCreate() {
+			this.uid = uid;
+			uid += 1;
+		},
 		methods: {
 			formatDate,
 			formatDuration,
@@ -117,10 +121,6 @@ async function init() {
 			getPath,
 			getBgPath: (media, type) => `url(${getPath(media, type)})`,
 		},
-		beforeCreate() {
-			this.uid = uid;
-			uid += 1;
-		},
 	});
 
 	app.directive('tooltip', {

assets/js/releases/actions.js

@@ -1,5 +1,10 @@
 import { graphql } from '../api';
-import { releasesFragment, releaseFragment, releaseFields } from '../fragments';
+import {
+	releasesFragment,
+	releaseFragment,
+	releaseFields,
+	movieFields,
+} from '../fragments';
 import { curateRelease } from '../curate';
 import getDateRange from '../get-date-range';
 
@@ -32,7 +37,7 @@ function initReleasesActions(store, router) {
 		});
 
 		return {
-			releases: releases.map(release => curateRelease(release)),
+			releases: releases.map((release) => curateRelease(release)),
 			totalCount,
 		};
 	}
@@ -67,6 +72,8 @@ function initReleasesActions(store, router) {
             query Movies(
                 $limit:Int = 1000,
                 $offset:Int = 0,
+				$hasAuth: Boolean!
+				$userId: Int
             ) {
 				connection: moviesConnection(
 					first: $limit
@@ -79,65 +86,57 @@ function initReleasesActions(store, router) {
 					}
 				) {
 					movies: nodes {
-						id
-						title
-						url
-						slug
-						date
-						datePrecision
-						actors {
-							id
-							name
-							slug
-						}
-						tags {
-							id
-							name
-							slug
-						}
-						entity {
-							id
-							name
-							slug
-							type
-							parent {
-								id
-								name
-								slug
-								type
-							}
-						}
-						covers: moviesCovers {
-							media {
-								id
-								path
-								thumbnail
-								lazy
-								width
-								height
-								thumbnailWidth
-								thumbnailHeight
-								isS3
-								sfw: sfwMedia {
-									id
-									path
-									thumbnail
-									lazy
-									comment
-								}
-							}
-						}
+						${movieFields}
 					}
 					totalCount
 				}
 			}
         `, {
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
 			limit,
 			offset: Math.max(0, (pageNumber - 1)) * limit,
 		});
 
 		return {
-			movies: movies.map(release => curateRelease(release)),
+			movies: movies.map((release) => curateRelease(release)),
+			totalCount,
+		};
+	}
+
+	async function searchMovies({ _commit }, { query, limit = 20, pageNumber = 1 }) {
+		const { connection: { movies, totalCount } } = await graphql(`
+            query SearchMovies(
+                $query: String!
+                $limit:Int = 20
+                $offset:Int = 0
+				$hasAuth: Boolean!
+				$userId: Int
+            ) {
+				connection: searchMoviesConnection(
+                    query: $query
+                    first: $limit
+					offset: $offset
+					orderBy: RANK_DESC
+                ) {
+					movies: nodes {
+						movie {
+							${movieFields}
+						}
+					}
+					totalCount
+                }
+            }
+        `, {
+			hasAuth: !!store.state.auth.user,
+			userId: store.state.auth.user?.id,
+			query,
+			limit,
+			offset: Math.max(0, (pageNumber - 1)) * limit,
+		});
+
+		return {
+			movies: movies.map(({ movie }) => curateRelease(movie)),
 			totalCount,
 		};
 	}
@@ -183,7 +182,7 @@ function initReleasesActions(store, router) {
 							isS3
 						}
 					}
-					poster: moviesPosterByMovieId {
+					poster: moviesPoster {
 						media {
 							id
 							path
@@ -196,7 +195,7 @@ function initReleasesActions(store, router) {
 							isS3
 						}
 					}
-					covers: moviesCovers {
+					covers: moviesCovers(orderBy: MEDIA_BY_MEDIA_ID__INDEX_ASC) {
 						media {
 							id
 							path
@@ -209,7 +208,7 @@ function initReleasesActions(store, router) {
 							isS3
 						}
 					}
-					trailer: moviesTrailerByMovieId {
+					trailer: moviesTrailer {
 						media {
 							id
 							path
@@ -297,6 +296,7 @@ function initReleasesActions(store, router) {
 		fetchReleaseById,
 		fetchMovies,
 		fetchMovieById,
+		searchMovies,
 	};
 }
 

assets/js/router.js

@@ -74,7 +74,7 @@ const routes = [
 	{
 		path: '/actor/:actorId/:actorSlug',
 		name: 'actor',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'actorRange',
 			params: {
 				...from.params,
@@ -91,7 +91,7 @@ const routes = [
 	{
 		path: '/director/:actorId/:actorSlug',
 		name: 'director',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'directorRange',
 			params: {
 				...from.params,
@@ -107,7 +107,7 @@ const routes = [
 	},
 	{
 		path: '/channel/:entitySlug',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'channel',
 			params: {
 				...from.params,
@@ -123,7 +123,7 @@ const routes = [
 	},
 	{
 		path: '/network/:entitySlug',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'network',
 			params: {
 				...from.params,
@@ -139,7 +139,7 @@ const routes = [
 	},
 	{
 		path: '/studio/:entitySlug',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'studio',
 			params: {
 				...from.params,
@@ -155,7 +155,7 @@ const routes = [
 	},
 	{
 		path: '/tag/:tagSlug',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'tag',
 			params: {
 				...from.params,
@@ -171,12 +171,11 @@ const routes = [
 	},
 	{
 		path: '/actors',
-		redirect: from => ({
+		redirect: (from) => ({
 			name: 'actors',
 			params: {
 				...from.params,
 				gender: 'all',
-				letter: 'all',
 				tags: 'all',
 				range: 'latest',
 				pageNumber: 1,
@@ -184,7 +183,7 @@ const routes = [
 		}),
 	},
 	{
-		path: '/actors/:gender?/:letter?/:pageNumber',
+		path: '/actors/:gender?/:pageNumber',
 		component: Actors,
 		name: 'actors',
 	},
@@ -196,6 +195,17 @@ const routes = [
 	{
 		path: '/movies',
 		component: Movies,
+		redirect: {
+			name: 'movies',
+			params: {
+				range: 'latest',
+				pageNumber: 1,
+			},
+		},
+	},
+	{
+		path: '/movies/:range/:pageNumber',
+		component: Movies,
 		name: 'movies',
 	},
 	{
@@ -218,7 +228,18 @@ const routes = [
 		name: 'notifications',
 	},
 	{
-		path: '/stash/:stashId/:stashSlug?',
+		path: '/stash/:stashId/:stashSlug',
+		redirect: (from) => ({
+			name: 'stash',
+			params: {
+				...from.params,
+				range: 'scenes',
+				pageNumber: 1,
+			},
+		}),
+	},
+	{
+		path: '/stash/:stashId/:stashSlug?/:range/:pageNumber',
 		component: Stash,
 		name: 'stash',
 	},

assets/js/stashes/actions.js

@@ -5,14 +5,24 @@ import {
 	patch,
 } from '../api';
 
-import { releaseFields, actorStashesFields } from '../fragments';
+import { releaseFields, actorStashesFields, movieFields } from '../fragments';
 import { curateStash } from '../curate';
 
 function initStashesActions(store, _router) {
-	async function fetchStash(context, stashId) {
+	async function fetchStash(context, {
+		stashId,
+		section = 'scenes',
+		pageNumber = 1,
+		limit = 20,
+	}) {
 		const { stash } = await graphql(`
 			query Stash(
 				$stashId: Int!
+				$includeScenes: Boolean!
+				$includeActors: Boolean!
+				$includeMovies: Boolean!
+                $limit:Int = 10,
+				$offset:Int = 0,
 				$hasAuth: Boolean!
 				$userId: Int
 			) {
@@ -26,45 +36,77 @@ function initStashesActions(store, _router) {
 						id
 						username
 					}
-					actors: stashesActors {
-						comment
-						actor {
-							id
-							name
-							slug
-							gender
-							age
-							ageFromBirth
-							dateOfBirth
-							birthCity
-							birthState
-							birthCountry: countryByBirthCountryAlpha2 {
-							  alpha2
-							  name
-							  alias
-							}
-							avatar: avatarMedia {
+					actorsConnection: stashesActorsConnection(
+						orderBy: CREATED_AT_DESC
+						first: $limit
+						offset: $offset
+					) @include(if: $includeActors) {
+						totalCount
+						actors: nodes {
+							comment
+							actor {
 								id
-								path
-								thumbnail
-								lazy
-								isS3
-								width
-								height
+								name
+								slug
+								gender
+								age
+								ageFromBirth
+								dateOfBirth
+								birthCity
+								birthState
+								birthCountry: countryByBirthCountryAlpha2 {
+								  alpha2
+								  name
+								  alias
+								}
+								avatar: avatarMedia {
+									id
+									path
+									thumbnail
+									lazy
+									isS3
+									width
+									height
+								}
+								${actorStashesFields}
 							}
-							${actorStashesFields}
 						}
 					}
-					scenes: stashesScenes {
-						comment
-						scene {
-							${releaseFields}
+					scenesConnection: stashesScenesConnection(
+						orderBy: [CREATED_AT_DESC, RELEASE_BY_SCENE_ID__DATE_DESC]
+						first: $limit
+						offset: $offset
+					) @include(if: $includeScenes) {
+						totalCount
+						scenes: nodes {
+							comment
+							scene {
+								${releaseFields}
+							}
+						}
+					}
+					moviesConnection: stashesMoviesConnection(
+						orderBy: [CREATED_AT_DESC, MOVIE_BY_MOVIE_ID__DATE_DESC]
+						first: $limit
+						offset: $offset
+					) @include(if: $includeMovies) {
+						totalCount
+						movies: nodes {
+							comment
+							movie {
+								${movieFields}
+							}
 						}
 					}
 				}
 			}
 		`, {
 			stashId: Number(stashId),
+			includeScenes: section === 'scenes',
+			includeActors: section === 'actors',
+			includeMovies: section === 'movies',
+			offset: Math.max(0, (pageNumber - 1)) * limit,
+			limit: Number(limit),
 			hasAuth: !!store.state.auth.user,
 			userId: store.state.auth.user?.id,
 		});

assets/js/tags/actions.js

@@ -35,7 +35,7 @@ function initTagsActions(store, _router) {
                         name
                         slug
                     }
-                    poster: tagsPosterByTagId {
+                    poster: tagsPoster {
                         media {
                             id
                             thumbnail
@@ -120,6 +120,7 @@ function initTagsActions(store, _router) {
 							id
 							width
 							height
+							type
 							ratio
 							entity {
 								id
@@ -187,14 +188,14 @@ function initTagsActions(store, _router) {
 			before,
 			orderBy,
 			offset: Math.max(0, (pageNumber - 1)) * limit,
-			exclude: store.state.ui.tagFilter.filter(tagFilter => tagFilter !== tagSlug),
+			exclude: store.state.ui.tagFilter.filter((tagFilter) => tagFilter !== tagSlug),
 			hasAuth: !!store.state.auth.user,
 			userId: store.state.auth.user?.id,
 		});
 
 		return {
 			tag: curateTag(tagBySlug, null, curateRelease),
-			releases: tagBySlug.scenesConnection.releases.map(release => curateRelease(release)),
+			releases: tagBySlug.scenesConnection.releases.map((release) => curateRelease(release)),
 			totalCount: tagBySlug.scenesConnection.totalCount,
 		};
 	}
@@ -209,15 +210,21 @@ function initTagsActions(store, _router) {
             query Tags(
                 $slugs: [String!] = [],
                 $limit: Int = 100
+                $exclude: [String!]
             ) {
                 tags(
-                    filter: { slug: { in: $slugs } },
+                    filter: {
+						slug: {
+							in: $slugs
+							notIn: $exclude
+						}
+					},
                     first: $limit
                 ) {
                     id
                     name
                     slug
-                    poster: tagsPosterByTagId {
+                    poster: tagsPoster {
                         media {
                             thumbnail
                             comment
@@ -256,9 +263,10 @@ function initTagsActions(store, _router) {
         `, {
 			slugs,
 			limit,
+			exclude: store.state.ui.tagFilter,
 		});
 
-		return tags.map(tag => curateTag(tag, store.state.ui.sfw));
+		return tags.map((tag) => curateTag(tag, store.state.ui.sfw));
 	}
 
 	async function searchTags({ _commit }, {
@@ -275,14 +283,14 @@ function initTagsActions(store, _router) {
                 $minLength: Int = 2
             ) {
 				tags: searchTags(
-                    search: $query,
+                    query: $query,
                     first: $limit
 					minLength: $minLength
                 ) {
                     id
                     name
                     slug
-                    poster: tagsPosterByTagId {
+                    poster: tagsPoster {
                         media {
                             thumbnail
                             comment
@@ -324,7 +332,7 @@ function initTagsActions(store, _router) {
 			minLength,
 		});
 
-		return tags.map(tag => curateTag(tag, store.state.ui.sfw));
+		return tags.map((tag) => curateTag(tag, store.state.ui.sfw));
 	}
 
 	async function fetchTagReleases({ _commit }, tagId) {

assets/js/ui/actions.js

@@ -70,7 +70,7 @@ function initUiActions(store, _router) {
 									slug
 								}
 							}
-							entity: alertsEntityByAlertId {
+							entity: alertsEntity {
 								entity {
 									id
 									name
@@ -103,7 +103,7 @@ function initUiActions(store, _router) {
 			};
 		}
 
-		const curatedNotifications = notifications.nodes.map(notification => curateNotification(notification));
+		const curatedNotifications = notifications.nodes.map((notification) => curateNotification(notification));
 
 		return {
 			notifications: curatedNotifications,
@@ -148,7 +148,7 @@ function initUiActions(store, _router) {
 					rank
                 }
                 actors: searchActors(
-                    search: $query,
+                    query: $query,
                     first: $limit
                 ) {
                     id
@@ -221,11 +221,9 @@ function initUiActions(store, _router) {
 			userId: store.state.auth.user?.id,
 		});
 
-		console.log(res.results);
-
 		return {
-			releases: res?.results.map(result => curateRelease(result.release)) || [],
-			actors: res?.actors.map(actor => curateActor(actor)) || [],
+			releases: res?.results.map((result) => curateRelease(result.release)) || [],
+			actors: res?.actors.map((actor) => curateActor(actor)) || [],
 		};
 	}
 

assets/js/ui/observers.js

@@ -3,7 +3,7 @@ async function initUiObservers(store, _router) {
 
 	body.classList.add(store.state.ui.theme);
 
-	store.watch(state => state.ui.theme, (newTheme, oldTheme) => {
+	store.watch((state) => state.ui.theme, (newTheme, oldTheme) => {
 		body.classList.add(newTheme);
 		body.classList.remove(oldTheme);
 	});

assets/js/users/actions.js

@@ -57,7 +57,10 @@ function initUsersActions(store, _router) {
 								}
 							}
 						}
-						scenes: stashesScenes(first: 20) {
+						scenes: stashesScenes(
+							first: 20
+							orderBy: CREATED_AT_DESC
+						) {
 							comment
 							scene {
 								${releaseFields}
@@ -87,7 +90,7 @@ function initUsersActions(store, _router) {
 								${actorFields}
 							}
 						}
-						entity: alertsEntityByAlertId {
+						entity: alertsEntity {
 							entity {
 								id
 								name

config/default.js

@@ -66,10 +66,7 @@ module.exports = {
 			// pornpros
 			'milfhumiliation',
 			'humiliated',
-			'flexiblepositions',
-			'publicviolations',
 			'amateurviolations',
-			'squirtdisgrace',
 			'cumdisgrace',
 			'webcamhackers',
 			'collegeteens',
@@ -79,6 +76,11 @@ module.exports = {
 			'pornmegaload',
 			'scorelandtv',
 			'scoretv',
+			// spizoo
+			'intimatelesbians',
+			'porngoespro',
+			'pornstartease',
+			'thestripperexperience',
 			// teenscoreclub
 			'maiko',
 			'ncuksinners',
@@ -91,6 +93,9 @@ module.exports = {
 		networks: [
 			// dummy network for testing
 			'traxxx',
+			// porn doe
+			'forbondage',
+			'score',
 		],
 	},
 	profiles: [
@@ -142,6 +147,11 @@ module.exports = {
 			'hotcrazymess',
 			'thatsitcomshow',
 		],
+		[
+			// Adult DVD Empire
+			'elegantangel',
+			'westcoastproductions',
+		],
 		'21sextury',
 		'julesjordan',
 		'dorcelclub',
@@ -239,6 +249,7 @@ module.exports = {
 			'www.tushy.com',
 			'www.tushyraw.com',
 			'www.deeper.com',
+			'www.slayed.com',
 			'sthw-trailer-vixen.ssl-cdn.com',
 			'sthw-trailer-tushy.ssl-cdn.com',
 			'sthw-trailer-tushyraw.ssl-cdn.com',
@@ -251,6 +262,30 @@ module.exports = {
 			'streamhw-trailer-blacked.ssl-cdn.com',
 			'streamhw-trailer-blackedraw.ssl-cdn.com',
 			'streamhw-trailer-deeper.ssl-cdn.com',
+			'cdn.vixen.com',
+			'cdn.tushy.com',
+			'cdn.blacked.com',
+			'cdn.deeper.com',
+			'cdn.blackedraw.com',
+			'cdn.tushyraw.com',
+			'cdn.slayed.com',
+			'www.vogov.com',
+			'www.vogov.com',
+			'www.nubiles.net',
+			'www.brattysis.com',
+			'www.deeplush.com',
+			'www.detentiongirls.com',
+			'www.daddyslilangel.com',
+			'www.myfamilypies.com',
+			'www.bountyhunterporn.com',
+			'www.anilos.com',
+			'www.thatsitcomshow.com',
+			'www.nubileset.com',
+			'www.nubilesunscripted.com',
+			'www.nubilefilms.com',
+			'www.badteenspunished.com',
+			'www.cumlouder.com',
+			'im0.imgcm.com',
 		],
 	},
 	limits: {
@@ -263,15 +298,26 @@ module.exports = {
 			interval: 1000,
 			concurrency: 1,
 		},
-		'www.realitykings.com': {
-			interval: 1000,
+		'westcoastproductions.com': {
+			interval: 100,
+			concurrency: 1,
+		},
+		'images.mylfcdn.net': {
+			interval: 50,
 			concurrency: 1,
 		},
 	},
 	fetchAfter: [1, 'week'],
 	missingDateLimit: 3,
+	memorySampling: {
+		enabled: false,
+		sampleDuration: 300000, // 5 minutes
+		snapshotIntervals: [],
+	},
 	media: {
 		path: './media',
+		maxSize: 1000,
+		quality: 80,
 		thumbnailSize: 320, // width for 16:9 will be exactly 576px
 		thumbnailQuality: 100,
 		lazySize: 90,

migrations/20190325001339_releases.js

@@ -1,6 +1,6 @@
 const config = require('config');
 
-exports.up = knex => Promise.resolve()
+exports.up = (knex) => Promise.resolve()
 	.then(() => knex.schema.createTable('countries', (table) => {
 		table.text('alpha2', 2)
 			.unique()
@@ -108,7 +108,7 @@ exports.up = knex => Promise.resolve()
 			.onDelete('cascade');
 
 		table.date('date');
-		table.enum('date_precision', ['year', 'month', 'day', 'hour', 'minute', 'second'])
+		table.enum('date_precision', ['year', 'month', 'week', 'day', 'hour', 'minute', 'second'])
 			.defaultTo('year');
 
 		table.text('comment');
@@ -643,7 +643,7 @@ exports.up = knex => Promise.resolve()
 			.references('alpha2')
 			.inTable('countries');
 
-		table.enum('date_precision', ['year', 'month', 'day', 'hour', 'minute', 'second'])
+		table.enum('date_precision', ['year', 'month', 'week', 'day', 'hour', 'minute', 'second'])
 			.defaultTo('day');
 
 		table.text('description');
@@ -792,7 +792,6 @@ exports.up = knex => Promise.resolve()
 	}))
 	.then(() => knex.schema.createTable('releases_tags', (table) => {
 		table.integer('tag_id', 12)
-			.notNullable()
 			.references('id')
 			.inTable('tags');
 
@@ -802,6 +801,8 @@ exports.up = knex => Promise.resolve()
 			.inTable('releases')
 			.onDelete('cascade');
 
+		table.text('original_tag');
+
 		table.unique(['tag_id', 'release_id']);
 	}))
 	.then(() => knex.schema.createTable('releases_search', (table) => {
@@ -832,7 +833,7 @@ exports.up = knex => Promise.resolve()
 		table.timestamp('date');
 		table.index('date');
 
-		table.enum('date_precision', ['year', 'month', 'day', 'hour', 'minute', 'second'])
+		table.enum('date_precision', ['year', 'month', 'week', 'day', 'hour', 'minute', 'second'])
 			.defaultTo('day');
 
 		table.text('description');
@@ -915,6 +916,12 @@ exports.up = knex => Promise.resolve()
 
 		table.unique('movie_id');
 	}))
+	.then(() => knex.schema.createTable('movies_search', (table) => {
+		table.integer('movie_id', 16)
+			.references('id')
+			.inTable('movies')
+			.onDelete('cascade');
+	}))
 	.then(() => knex.schema.createTable('chapters', (table) => {
 		table.increments('id', 16);
 
@@ -979,7 +986,6 @@ exports.up = knex => Promise.resolve()
 	}))
 	.then(() => knex.schema.createTable('chapters_tags', (table) => {
 		table.integer('tag_id', 12)
-			.notNullable()
 			.references('id')
 			.inTable('tags')
 			.onDelete('cascade');
@@ -990,6 +996,8 @@ exports.up = knex => Promise.resolve()
 			.inTable('chapters')
 			.onDelete('cascade');
 
+		table.text('original_tag');
+
 		table.unique(['tag_id', 'chapter_id']);
 	}))
 	.then(() => knex.schema.createTable('users_roles', (table) => {
@@ -1274,12 +1282,37 @@ exports.up = knex => Promise.resolve()
 			.notNullable()
 			.defaultTo(knex.fn.now());
 	}))
+	.then(() => knex.schema.createTable('affiliates', (table) => {
+		table.string('id')
+			.primary()
+			.unique()
+			.notNullable();
+
+		table.integer('entity_id', 12)
+			.references('id')
+			.inTable('entities');
+
+		table.text('url');
+		table.text('parameters');
+
+		table.unique(['entity_id', 'url']);
+		table.unique(['entity_id', 'parameters']);
+
+		table.text('comment');
+
+		table.datetime('created_at')
+			.notNullable()
+			.defaultTo(knex.fn.now());
+	}))
 	.then(() => knex.schema.createTable('banners', (table) => {
 		table.string('id')
 			.primary()
 			.unique()
 			.notNullable();
 
+		table.string('type')
+			.defaultTo('jpg');
+
 		table.integer('width')
 			.notNullable();
 
@@ -1323,13 +1356,16 @@ exports.up = knex => Promise.resolve()
 			.references('id')
 			.inTable('entities');
 
+		table.text('affiliate_id')
+			.references('id')
+			.inTable('affiliates');
+
+		table.text('url');
+
 		table.string('banner_id')
 			.references('id')
 			.inTable('banners');
 
-		table.text('url')
-			.notNullable();
-
 		table.text('comment');
 
 		table.datetime('created_at')
@@ -1341,6 +1377,7 @@ exports.up = knex => Promise.resolve()
 		// allow vim fold
 		return knex.raw(`
 			ALTER TABLE releases_search ADD COLUMN document tsvector;
+			ALTER TABLE movies_search ADD COLUMN document tsvector;
 
 			/* allow scenes without dates to be mixed inbetween scenes with dates */
 			ALTER TABLE releases
@@ -1355,17 +1392,23 @@ exports.up = knex => Promise.resolve()
 			CREATE UNIQUE INDEX unique_actor_slugs_network ON actors (slug, entity_id, entry_id);
 			CREATE UNIQUE INDEX unique_actor_slugs ON actors (slug) WHERE entity_id IS NULL;
 
-			CREATE UNIQUE INDEX unique_entity_campaigns_banner ON campaigns (entity_id, url, banner_id);
-			CREATE UNIQUE INDEX unique_entity_campaigns ON campaigns (entity_id, url) WHERE banner_id IS NULL;
+			CREATE UNIQUE INDEX unique_entity_campaigns_banner_url ON campaigns (entity_id, url, banner_id) WHERE affiliate_id IS NULL;
+			CREATE UNIQUE INDEX unique_entity_campaigns_url ON campaigns (entity_id, url) WHERE banner_id IS NULL AND affiliate_id IS NULL;
+			CREATE UNIQUE INDEX unique_entity_campaigns_banner_affiliate ON campaigns (entity_id, affiliate_id, banner_id) WHERE url IS NULL;
+			CREATE UNIQUE INDEX unique_entity_campaigns_affiliate ON campaigns (entity_id, affiliate_id) WHERE banner_id IS NULL AND url IS NULL;
 
 			CREATE UNIQUE INDEX releases_search_unique ON releases_search (release_id);
+			CREATE UNIQUE INDEX movies_search_unique ON movies_search (movie_id);
 			CREATE INDEX releases_search_index ON releases_search USING GIN (document);
+			CREATE INDEX movies_search_index ON movies_search USING GIN (document);
 		`);
 	})
 	// FUNCTIONS
 	.then(() => { // eslint-disable-line arrow-body-style
 		// allow vim fold
 		return knex.raw(`
+			CREATE EXTENSION IF NOT EXISTS pg_trgm;
+
 			CREATE FUNCTION current_user_id() RETURNS INTEGER AS $$
 				/* if the user ID is undefined, the adapter will pass it as a string, which cannot be cast as NULL by ::integer */
 				SELECT NULLIF(current_setting('user.id', true), '')::integer;
@@ -1375,6 +1418,7 @@ exports.up = knex => Promise.resolve()
 			 * Using a table as a proxy for the search results allows us to get both a reference to the releases table, and the ranking.
 			 * A composite type does not seem to be compatible with PostGraphile's @sortable, and a view does not allow for many native constraints */
 			CREATE TABLE releases_search_results (release_id integer, rank real, FOREIGN KEY (release_id) REFERENCES releases (id));
+			CREATE TABLE movies_search_results (movie_id integer, rank real, FOREIGN KEY (movie_id) REFERENCES movies (id));
 
 			CREATE FUNCTION search_releases(query text) RETURNS SETOF releases_search_results AS $$
 				SELECT releases.id, ranks.rank FROM (
@@ -1388,6 +1432,18 @@ exports.up = knex => Promise.resolve()
 				ORDER BY ranks.rank DESC;
 			$$ LANGUAGE SQL STABLE;
 
+			CREATE FUNCTION search_movies(query text) RETURNS SETOF movies_search_results AS $$
+				SELECT movies.id, ranks.rank FROM (
+					SELECT
+						movies_search.movie_id,
+						ts_rank(movies_search.document, to_tsquery('english', array_to_string(array(SELECT * FROM regexp_matches(query, '[A-Za-zÀ-ÖØ-öø-ÿ0-9]+', 'g')), '|'))) AS rank
+					FROM movies_search
+					) ranks
+				LEFT JOIN movies ON movies.id = ranks.movie_id
+				WHERE ranks.rank > 0
+				ORDER BY ranks.rank DESC;
+			$$ LANGUAGE SQL STABLE;
+
 			CREATE FUNCTION search_entities(search text) RETURNS SETOF entities AS $$
 				SELECT * FROM entities
 				WHERE
@@ -1396,25 +1452,29 @@ exports.up = knex => Promise.resolve()
 				array_to_string(alias, '') ILIKE ('%' || TRIM(search) || '%') OR
 				replace(array_to_string(alias, ''), ' ', '') ILIKE ('%' || TRIM(search) || '%') OR
 				url ILIKE ('%' || search || '%')
+				ORDER BY similarity(entities.name, search) DESC, name ASC
 			$$ LANGUAGE SQL STABLE;
 
-			CREATE FUNCTION search_actors(search text, min_length smallint DEFAULT 2) RETURNS SETOF actors AS $$
+			CREATE FUNCTION search_actors(query text, min_length smallint DEFAULT 2) RETURNS SETOF actors AS $$
 				SELECT * FROM actors
-				WHERE length(search) >= min_length
-				AND name ILIKE ('%' || TRIM(search) || '%')
-			$$ LANGUAGE SQL STABLE;
-
-			CREATE FUNCTION search_tags(search text, min_length smallint DEFAULT 2, is_primary boolean DEFAULT true) RETURNS SETOF tags AS $$
-				SELECT * FROM tags
-				WHERE length(search) >= min_length
-				AND name ILIKE ('%' || TRIM(search) || '%')
+				WHERE query IS NULL
+				OR length(query) >= min_length
 				AND CASE
-					WHEN is_primary
-					THEN tags.alias_for IS NULL
+					WHEN length(query) > 1 THEN name ILIKE ('%' || TRIM(query) || '%')
+					WHEN length(query) = 1 THEN name ILIKE (TRIM(query) || '%')
 					ELSE true
 				END
 			$$ LANGUAGE SQL STABLE;
 
+			CREATE FUNCTION search_tags(query text, min_length smallint DEFAULT 2) RETURNS SETOF tags AS $$
+				SELECT aliases.* FROM tags
+				LEFT JOIN tags AS aliases ON aliases.id = tags.alias_for OR (tags.alias_for IS NULL AND aliases.id = tags.id)
+				WHERE length(query) >= min_length
+				AND tags.name ILIKE ('%' || TRIM(query) || '%')
+				GROUP BY aliases.id
+				ORDER BY similarity(aliases.slug, query) DESC, slug ASC
+			$$ LANGUAGE SQL STABLE;
+
 			CREATE FUNCTION actors_tags(actor actors, selectable_tags text[]) RETURNS SETOF tags AS $$
 				SELECT tags.*
 				FROM releases_actors
@@ -1550,6 +1610,12 @@ exports.up = knex => Promise.resolve()
 			CREATE FUNCTION banners_ratio(banner banners) RETURNS numeric AS $$
 				SELECT ROUND(banner.width::decimal / banner.height::decimal, 2);
 			$$ LANGUAGE SQL STABLE;
+
+			CREATE FUNCTION get_random_campaign() RETURNS SETOF campaigns AS $$
+				SELECT * FROM campaigns
+				ORDER BY random()
+				LIMIT 1;
+			$$ LANGUAGE sql STABLE;
 		`);
 	})
 	// POLICIES
@@ -1683,8 +1749,11 @@ exports.up = knex => Promise.resolve()
 			COMMENT ON FUNCTION actors_actors IS E'@sortable';
 			COMMENT ON FUNCTION actors_scenes IS E'@sortable';
 			COMMENT ON FUNCTION tags_scenes IS E'@sortable';
+
 			COMMENT ON FUNCTION search_releases IS E'@sortable';
+			COMMENT ON FUNCTION search_entities IS E'@sortable';
 			COMMENT ON FUNCTION search_actors IS E'@sortable';
+			COMMENT ON FUNCTION search_movies IS E'@sortable';
 			COMMENT ON FUNCTION search_tags IS E'@sortable';
 		`);
 	});
@@ -1702,6 +1771,7 @@ exports.down = (knex) => { // eslint-disable-line arrow-body-style
 		DROP TABLE IF EXISTS releases_teasers CASCADE;
 		DROP TABLE IF EXISTS releases_tags CASCADE;
 		DROP TABLE IF EXISTS releases_search CASCADE;
+		DROP TABLE IF EXISTS movies_search CASCADE;
 
 		DROP TABLE IF EXISTS movies_scenes CASCADE;
 		DROP TABLE IF EXISTS movies_covers CASCADE;
@@ -1719,6 +1789,8 @@ exports.down = (knex) => { // eslint-disable-line arrow-body-style
 		DROP TABLE IF EXISTS banners_tags CASCADE;
 		DROP TABLE IF EXISTS banners CASCADE;
 		DROP TABLE IF EXISTS campaigns CASCADE;
+		DROP TABLE IF EXISTS affiliates CASCADE;
+
 		DROP TABLE IF EXISTS batches CASCADE;
 
 		DROP TABLE IF EXISTS actors_avatars CASCADE;
@@ -1776,6 +1848,7 @@ exports.down = (knex) => { // eslint-disable-line arrow-body-style
 		DROP FUNCTION IF EXISTS search_sites;
 		DROP FUNCTION IF EXISTS search_entities;
 		DROP FUNCTION IF EXISTS search_actors;
+		DROP FUNCTION IF EXISTS search_movies;
 		DROP FUNCTION IF EXISTS search_tags;
 		DROP FUNCTION IF EXISTS get_random_sfw_media_id;
 
@@ -1794,7 +1867,9 @@ exports.down = (knex) => { // eslint-disable-line arrow-body-style
 		DROP POLICY IF EXISTS stashes_policy ON stashes_actors;
 
 		DROP FUNCTION IF EXISTS current_user_id;
+		DROP FUNCTION IF EXISTS get_random_campaign;
 
 		DROP TABLE IF EXISTS releases_search_results;
+		DROP TABLE IF EXISTS movies_search_results;
 	`);
 };

migrations/20211030162955_entity_scenes.js

@@ -0,0 +1,29 @@
+exports.up = async (knex) => knex.raw(`
+	CREATE FUNCTION entities_scenes(entity entities) RETURNS SETOF releases AS $$
+		WITH RECURSIVE children AS (
+			SELECT entities.id
+				FROM entities
+				WHERE entities.id = entity.id
+
+				UNION ALL
+
+				SELECT entities.id
+				FROM entities
+				INNER JOIN children ON children.id = entities.parent_id
+		)
+
+		SELECT releases FROM releases
+		INNER JOIN children ON children.id = releases.entity_id
+
+		UNION
+
+		SELECT releases FROM releases
+		INNER JOIN children ON children.id = releases.studio_id;
+	$$ LANGUAGE SQL STABLE;
+
+	COMMENT ON FUNCTION entities_scenes IS E'@sortable';
+`);
+
+exports.down = async (knex) => knex.raw(`
+	DROP FUNCTION IF EXISTS entities_scenes;
+`);

migrations/20220123234131_scene_indexes.js

@@ -0,0 +1,15 @@
+exports.up = async (knex) => Promise.resolve()
+	.then(() => knex.schema.alterTable('releases_tags', (table) => {
+		table.index('release_id');
+	}))
+	.then(() => knex.schema.alterTable('movies_scenes', (table) => {
+		table.index('scene_id');
+	}));
+
+exports.down = async (knex) => Promise.resolve()
+	.then(() => knex.schema.alterTable('releases_tags', (table) => {
+		table.dropIndex('release_id');
+	}))
+	.then(() => knex.schema.alterTable('movies_scenes', (table) => {
+		table.dropIndex('scene_id');
+	}));

migrations/20220126132955_scene_counts.js

@@ -0,0 +1,11 @@
+exports.up = async (knex) => knex.raw(`
+	CREATE OR REPLACE FUNCTION entities_scene_total(entity entities) RETURNS integer AS $$
+		SELECT COUNT(id)
+		FROM releases
+		WHERE releases.entity_id = entity.id;
+	$$ LANGUAGE SQL STABLE;
+`);
+
+exports.down = async (knex) => knex.raw(`
+	DROP FUNCTION IF EXISTS entities_scene_total;
+`);

migrations/20220209010315_movies_tags.js

@@ -0,0 +1,8 @@
+exports.up = async (knex) => knex.raw(`
+	CREATE VIEW movies_tagged AS
+		SELECT * FROM movies;
+`);
+
+exports.down = async (knex) => knex.raw(`
+	DROP VIEW IF EXISTS movies_tagged;
+`);

package.json

@@ -1,13 +1,13 @@
 {
     "name": "traxxx",
-    "version": "1.196.3",
+    "version": "1.209.4",
     "description": "All the latest porn releases in one place",
     "main": "src/app.js",
     "scripts": {
         "start": "node -r source-map-support/register src/init.js",
         "webpack": "webpack --env=production --mode=production",
         "webpack-dev": "webpack --env=development --mode=development",
-        "webpack-watch": "webpack --progress --colors --watch --env=development --mode=development",
+        "webpack-watch": "webpack --progress --color --watch --env=development --mode=development",
         "babel": "babel src --source-maps -d dist",
         "babel-watch": "babel src -w --source-maps -d dist",
         "build": "babel src --source-maps -d dist && webpack --env=production --mode=production",
@@ -40,38 +40,37 @@
     "devDependencies": {
         "@babel/cli": "^7.12.10",
         "@babel/core": "^7.8.4",
+        "@babel/eslint-parser": "^7.16.0",
         "@babel/plugin-proposal-optional-chaining": "^7.8.3",
         "@babel/preset-env": "^7.8.4",
         "@babel/register": "^7.8.3",
-        "@vue/compiler-sfc": "^3.0.4",
-        "autoprefixer": "^9.7.4",
-        "babel-eslint": "^10.1.0",
+        "autoprefixer": "^10.4.0",
         "babel-loader": "^8.0.6",
-        "babel-preset-airbnb": "^3.3.2",
-        "css-loader": "^5.0.1",
-        "eslint": "^7.20.0",
-        "eslint-config-airbnb": "^17.1.1",
-        "eslint-config-airbnb-base": "^13.2.0",
+        "babel-preset-airbnb": "^5.0.0",
+        "css-loader": "^6.5.0",
+        "eslint": "^8.1.0",
+        "eslint-config-airbnb": "^18.2.1",
+        "eslint-config-airbnb-base": "^14.2.1",
         "eslint-plugin-import": "^2.20.1",
         "eslint-plugin-jsx-a11y": "^6.2.3",
         "eslint-plugin-react": "^7.18.3",
-        "eslint-plugin-vue": "^6.2.1",
-        "eslint-watch": "^4.0.2",
-        "eslint-webpack-plugin": "^2.5.2",
-        "mini-css-extract-plugin": "^1.3.3",
-        "node-sass": "^5.0.0",
-        "postcss-loader": "^3.0.0",
+        "eslint-plugin-vue": "^8.0.3",
+        "eslint-watch": "^7.0.0",
+        "eslint-webpack-plugin": "^3.1.0",
+        "mini-css-extract-plugin": "^2.4.3",
+        "node-sass": "^6.0.1",
+        "postcss-loader": "^6.2.0",
         "raw-loader": "^4.0.2",
-        "sass-loader": "^11.0.1",
-        "style-loader": "^0.23.1",
-        "vue-loader": "^16.1.2",
+        "sass-loader": "^12.3.0",
+        "style-loader": "^3.3.1",
+        "vue-loader": "^16.8.2",
         "webpack": "^5.11.0",
-        "webpack-cli": "^3.3.11"
+        "webpack-cli": "^4.9.1"
     },
     "dependencies": {
         "@casl/ability": "^5.2.2",
         "@graphile-contrib/pg-order-by-related": "^1.0.0-beta.6",
-        "@graphile-contrib/pg-simplify-inflector": "^5.0.0-beta.1",
+        "@graphile-contrib/pg-simplify-inflector": "^6.1.0",
         "acorn": "^8.0.4",
         "array-equal": "^1.0.0",
         "aws-sdk": "^2.847.0",
@@ -88,61 +87,62 @@
         "cloudscraper": "^4.6.0",
         "config": "^3.2.5",
         "connect-session-knex": "^2.0.0",
-        "convert": "^1.6.2",
+        "convert": "^4.2.4",
         "cookie": "^0.4.0",
         "csv-stringify": "^5.3.6",
         "dayjs": "^1.8.21",
         "dompurify": "^2.0.11",
         "ejs": "^3.0.1",
         "express": "^4.17.1",
-        "express-promise-router": "^3.0.3",
+        "express-promise-router": "^4.1.0",
         "express-react-views": "^0.11.0",
         "express-session": "^1.17.1",
         "face-api.js": "^0.22.2",
         "faker": "^5.1.0",
-        "file-type": "^14.1.4",
+        "file-type": "^16.5.3",
         "fluent-ffmpeg": "^2.1.2",
-        "fs-extra": "^7.0.1",
-        "graphile-utils": "^4.5.6",
-        "graphql": "^14.6.0",
-        "iconv-lite": "^0.5.1",
-        "inquirer": "^7.3.3",
-        "jsdom": "^16.3.0",
-        "knex": "^0.21.13",
+        "fs-extra": "^10.0.0",
+        "graphile-utils": "^4.12.2",
+        "graphql": "^15.4.0",
+        "html-entities": "^2.3.2",
+        "iconv-lite": "^0.6.3",
+        "inquirer": "^8.2.0",
+        "inspector-api": "^1.4.2",
+        "jsdom": "^18.0.0",
+        "knex": "^0.95.12",
         "knex-migrate": "^1.7.4",
         "longjohn": "^0.2.12",
         "mime": "^2.4.4",
-        "mitt": "^2.1.0",
+        "mitt": "^3.0.0",
         "moment": "^2.24.0",
-        "nanoid": "^2.1.11",
-        "object-merge-advanced": "^10.12.1",
+        "nanoid": "^3.1.30",
+        "node-fetch": "^2.6.7",
+        "object-merge-advanced": "^12.1.0",
         "object.omit": "^3.0.0",
-        "opn": "^5.5.0",
+        "opn": "^6.0.0",
         "pg": "^8.5.1",
         "postgraphile": "^4.10.0",
-        "postgraphile-plugin-connection-filter": "^1.1.3",
+        "postgraphile-plugin-connection-filter": "^2.2.2",
         "promise-task-queue": "^1.2.0",
         "prop-types": "^15.7.2",
-        "react": "^16.13.0",
-        "react-dom": "^16.13.0",
-        "sharp": "^0.27.2",
+        "sharp": "^0.29.2",
         "showdown": "^1.9.1",
         "source-map-support": "^0.5.16",
         "template-format": "^1.2.5",
         "tippy.js": "^6.3.1",
-        "tough-cookie": "^3.0.1",
-        "tty-table": "^2.8.12",
+        "tough-cookie": "^4.0.0",
         "tunnel": "0.0.6",
+        "undici": "^4.13.0",
         "url-pattern": "^1.0.3",
         "v-tooltip": "^2.0.3",
         "video.js": "^7.11.4",
         "videojs-vr": "^1.7.1",
-        "vue": "^3.0.4",
-        "vue-router": "^4.0.1",
-        "vuex": "^4.0.0-rc.2",
+        "vue": "^3.2.20",
+        "vue-router": "^4.0.12",
+        "vuex": "^4.0.2",
         "why-is-node-running": "^2.2.0",
         "winston": "^3.2.1",
         "winston-daily-rotate-file": "^4.4.2",
-        "yargs": "^13.3.0"
+        "yargs": "^17.2.1"
     }
 }

public/img/flags/aq.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-aq" viewBox="0 0 640 480">
+  <path fill="#3a7dce" fill-rule="evenodd" d="M0 0h640v480H0z"/>
+  <path fill="#fff" d="M184.8 225.3c-2.9-5.9-2.9-5.9-2.9-11.8-1.4 0-1.7.3-2.5 0-.8-.2-1.2 5.5-3.9 4.4-.4-.6 2-4.7-.6-6.4-.8-.5.2-3.9-.2-5.4 0 0-3.3 1.8-5.7-4.4-1.3-1.6-3 1.5-3 1.5s.8 1.9-.5 2.3c-1.9-1.4-3.2-.6-5.6-2.5-2.3-2 .5-4.1-4-5.7 3-7.4 3-6 10.2-8.9-4.4-3-4.4-3-7.3-7.4-4.3-1.4-5.7-3-10-5.9-5.8-7.3-8.7-22.1-8.7-32.4 3.6-3.5 8.6 11.8 15.9 16.2l10 4.4c5.8 3 7.3 6 11.6 8.9l13 4.4c5.8 4.4 8.7 10.3 13 11.8 4.7 0 5.6-2.7 7.1-3 8.5-.4 12.8-1.5 14.5-4 1.7-2.2 5.8 1.1 17.4-3.3l-1.5-6s3.1-2.5 7.3-1.4c-.2-2.7-.4-9.9 3.7-13.1-2.5-2.7-.9-4.6-.9-4.6s2.3-2.3 2.6-3.5c-1.2-6.5 1-6.6 1.6-8.5s-2-1.2-1.3-3.9c.7-2.6 4.9-3.2 5.5-5.4.5-2.2-1.2-3.3-1.1-3.8.9-2 .1-7 0-8.9 7.7-2 10.3-8.5 13-5.9 1.4-8.8 2.8-11.8 11.5-11.8 1.2-2.7-3.1-5-1.4-5.9 2.9-.3 5-.2 8.5 4.3 1 1.4 1.2-2 2.3-2.4 1-.4 3.7-.4 4-2.2.5-1.8 1-4.1 2.5-7 1.2-2.5 2.2.9 3.2 5.6a157 157 0 0 1 25.7 3.2c4.3 1.1 7.2-1.2 11.3-1.6 3.1 3.1 6 .8 7.6 7.5 2.3 3.6 6 .3 6.9 1.3 4.8 13.6 21.4 4.5 22.7 4.7 2 0 4.7 6 6.3 6 2.8-.5 2-2.4 4.4-1.7-.7 5.2 4.6 11 4.6 14.9 0 0 1.3.6 2.5-.5s2.3-4 3.3-4l6.5 1.2c7.8 2.8 11.8 3.4 14.8 4.8 1.5 2.6 2.8 4 5.7 3.5 2.4 1.6.6 3.8 2 3.9 3-1.5 3.9-3.1 6.8-1.6a17.6 17.6 0 0 1 7.2 7.4c0 1.4-1.5 7.3 0 16.2.7 3 1 5.3 4.1 10.3-.8 5.3 4 14 4 16.2 0 3-2.4 4.5-3.8 7.5 5.8 4.4 0 11.8-2.9 16.2 21.7 4.4 11.6 13.3 28.9 8.8-4.3 10.4-2.8 9.5 1.5 19.9-8.6 5.9-.2 7.7-6 15-.3.5 3.5 6.5 8.8 6.5-1.4 11.8-5.8 7.4-4.3 25-11.4-.2-6.8 13.3-14.4 11.9.4 8.4 4.3 9.2 2.8 17.7-5.7 1.5-5.7 1.5-8.6 5.9l-4.4-1.5c-1.4 7.4-4.3 8.9 0 16.3H439c-.1 2.5 2.5 3.2 3 5.9-.3 1-8.3 5.7-14.5 5.9-1.6 3.6 4.3 7.5 4 9.3-6.8 1.4-9.8 9.9-9.8 9.9s3.5 1.4 2.9 3c-1.9-1.5-2.9-1.6-5.8-1.6-1.4.4-5 0-8.3 5.8-3.7 1.2-5.5.8-8.3 4.6-1.2-3.7-3 0-5.2 1.4s-5.1 4.9-5.5 4.7c0-1 1.3-4.7 1.3-4.7l-7.2 1.5-.9.1c-.5 0-.4-4.3-1.8-4.1-1.3.1-5.2 5.5-6.6 5.6-1.3.2-1.7-1.7-2.9-1.5-1.1.2-3.4 5.6-4.2 5.8-.8.1-4-3.4-6.8-2.9-14.2 5.1-16.4-10-18.7-1.5-3-1.6-2.4-.7-5.4.1-2 .5-2.1-2.6-3.9-2.5-3.4 0-3.2 3.4-5.1 2.4-1.5-7-10.8-5.7-11.7-8.6-.7-3.1 4-3 5.6-5.2 1.1-3-1.3-4.1 3.5-7 6.2-4.3 2.6-6 3.7-9.2 2-4.6 2-5.8.4-9.9 0 0-4.9-13.2-5.8-13.2-3-.9-3 4.9-7.2 6.4-8.6 3-24-7.5-26.6-7.5-2.4 0-13.7 2.8-13.3-3-1.6 5.6-7.8 1.3-8.2 1.3-5.8 0-3.6 4.6-7.5 4.4-1.7-.6-19.5-1.6-19.5-1.6v3l-11.6-6-10-3c-8.7-2.9-4.4-10.3-18.8-5.8v-9H195c3-17.6 0-8.8-1.4-25l-5.8 1.5c-5.7-8 8-6.5-4.3-11.8 0 0 .2-8.8-2.9-6-.6.4 1.5 4.5 1.5 4.5-11.6-1.5-14.5-4.4-14.5-16.2 0 0 9.5 1.3 8.7 0a73 73 0 0 1-2.8-17.6c-.2-2 8.8-6.8 7-11.5 1.2-.4 4.4-.5 4.4-.5"/>
+  <path fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="2.1" d="M574.6 284.3a3 3 0 0 0 0 2.8c1-1.3.2-1.9 0-2.8z"/>
+  <path fill="none" stroke="#fff" stroke-linejoin="round" stroke-width="2" d="M203.3 167.8s-2.4-.3-1.9 1.8c.8-1.7 1.8-1.7 1.9-1.8zm.5-5c-1.3 0-3-.2-2.4 2 .8-1.7 2.4-1.9 2.4-2zm9.1 28.3s2.1-.1 1.6 2c-.8-1.6-1.5-1.9-1.6-2z"/>
+</svg>

public/img/flags/bv.svg

@@ -0,0 +1,13 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-bv" viewBox="0 0 640 480">
+  <defs>
+    <clipPath id="a">
+      <path fill-opacity=".7" d="M0 0h640v480H0z"/>
+    </clipPath>
+  </defs>
+  <g fill-rule="evenodd" stroke-width="1pt" clip-path="url(#a)">
+    <path fill="#fff" d="M-28 0h699.7v512H-28z"/>
+    <path fill="#d72828" d="M-53-77.8h218.7v276.2H-53zM289.4-.6h381v199h-381zM-27.6 320h190.4v190.3H-27.6zm319.6 2.1h378.3v188.2H292z"/>
+    <path fill="#003897" d="M196.7-25.4H261v535.7h-64.5z"/>
+    <path fill="#003897" d="M-27.6 224.8h698v63.5h-698z"/>
+  </g>
+</svg>

public/img/flags/gf.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-gf" viewBox="0 0 640 480">
+  <path fill="#078930" d="M0 0h640v480z"/>
+  <path fill="#fcdd09" d="M0 0l640 480H0z"/>
+  <path fill="#da121a" d="M252.4 218h135.2l-109.4 79.5L320 169l41.8 128.6z"/>
+</svg>

public/img/flags/gp.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-gp" viewBox="0 0 640 480">
+  <g fill-rule="evenodd" stroke-width="1pt">
+    <path fill="#fff" d="M0 0h640v480H0z"/>
+    <path fill="#00267f" d="M0 0h213.3v480H0z"/>
+    <path fill="#f31830" d="M426.7 0H640v480H426.7z"/>
+  </g>
+</svg>

public/img/flags/gs.svg

@@ -0,0 +1,201 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" id="flag-icon-css-gs" viewBox="0 0 640 480">
+  <defs>
+    <linearGradient id="b">
+      <stop offset="0" stop-color="#d5dfff"/>
+      <stop offset="1" stop-color="#fff"/>
+    </linearGradient>
+    <linearGradient id="a">
+      <stop offset="0" stop-color="#474747"/>
+      <stop offset="1" stop-color="#f50"/>
+    </linearGradient>
+    <linearGradient id="c" x1="109.3" x2="110.9" y1="218.5" y2="173.4" gradientTransform="matrix(1.5 0 0 .65 40.5 0)" gradientUnits="userSpaceOnUse" xlink:href="#a"/>
+    <linearGradient id="d" x1="125.9" x2="126" y1="316.4" y2="337.2" gradientTransform="matrix(1.23 0 0 .8 40.5 0)" gradientUnits="userSpaceOnUse">
+      <stop offset="0" stop-color="#b50000"/>
+      <stop offset="1" stop-color="#ffc500"/>
+    </linearGradient>
+    <linearGradient id="e" x1="407.9" x2="456.4" y1="149.4" y2="147.3" gradientTransform="matrix(.56 0 0 1.76 40.5 0)" gradientUnits="userSpaceOnUse" xlink:href="#b"/>
+    <linearGradient id="f" x1="215.8" x2="229" y1="103" y2="103" gradientTransform="matrix(.74 0 0 1.33 40.5 0)" gradientUnits="userSpaceOnUse" xlink:href="#a"/>
+    <linearGradient id="g" x1="117.6" x2="78.2" y1="1040.4" y2="1003.7" gradientTransform="matrix(2.56 0 0 .38 40.5 0)" gradientUnits="userSpaceOnUse" xlink:href="#b"/>
+    <linearGradient id="h" x1="264.7" x2="255" y1="246" y2="226.4" gradientTransform="matrix(.9 0 0 1.1 40.5 0)" gradientUnits="userSpaceOnUse" xlink:href="#b"/>
+  </defs>
+  <path fill="#006" d="M0 0h640v480H0z"/>
+  <g stroke-width="1pt">
+    <path fill="#fff" d="M0 0v33l403.2 261.7H454v-33L50.7 0H0zm454 0v33L50.7 294.6H0v-33L403.2 0H454z"/>
+    <path fill="#fff" d="M189.2 0v294.7h75.6V0h-75.6zM0 98.2v98.3h454V98.1H0z"/>
+    <path fill="#c00" d="M0 117.9v59h454v-59H0zM204.3 0v294.7h45.4V0h-45.4zM0 294.7l151.3-98.2h33.9L33.8 294.6H0zM0 0l151.3 98.2h-33.8L0 22V0zm268.8 98.2L420.1 0H454L302.6 98.2h-33.8zM454 294.7l-151.3-98.2h33.8L454 272.6v22z"/>
+  </g>
+  <path fill="#6a4c2d" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M463.8 350s-3 7.5-4.6 7.5c-1.6 0-7.6-3.2-7.6-3.2s-4.3 7-6.6 7.4c-2.2.4-8.2-1-8.2-1s-5.8 0-6-.9c-.2-.8.3-2.4.3-2.4s-8.3 6.5-10.1 6.1c-1.9-.4-8-8.2-8-8.2l-1 4.1-11.8-.4-10.3-6.6s-5.7 9.5-6 9.3c-.1-.2-10 2.2-10 2.2l-.6-1.8-6.6-4s5.1-7.1 5.1-7.3c0-.2-2.4-1-2.4-1l-3.7 3-7.6 5-7.7-3.5 3.3-6.2.4-4.5 6-9 73-71 36 66.4-5.3 20z"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M515.6 354.3l19-.7-8-4 72.3-2.8-10.2-3.9-9-12.2-37.6-2.9s-2.8-2.1-7.4-1c-.2-3-3.7-6.8-3.7-6.8l-23-1.7-14.5 9.8 9.7 25 12.4 1.1z"/>
+  <path fill="url(#c)" fill-rule="evenodd" stroke="#000" stroke-width="1pt" d="M121.3 150.8l2.2-7.6s4-6.6 4-9.4c0-3 2.8-6.4 2.8-6.4s9-2.6 10.8 2.9c9.6-14.5 20.8-.7 20.8-.7l3.1-3.6 6.4-7.8s9 8.4 9 9.9 1.6.4 1.6.4l9.8-.8s4.7 3.7 3.7 10.6c3.4 2 6.6 14 6.6 14l-80.8-1.5z" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="#656263" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M515.5 218.7c1.4-.9 6-2.3 5.5-9-.6-6.7-6.4-7.5-9.6-7.3-3.3.3-6.2 3-6.2 3l-10.7-6.8s5.4-33.8 11-35.9c5.5-3.9 6.4-5.5 6.4-6.4s-2-3.2-2-3.2L475 149l-33 3.9s-2.6 3.9-2.2 5.5.4 3.2 6.3 7.8c6.6 5 11 33.9 11 33.9s-9.2 4.6-9.8 4c-.5-.6-3.3-1.1-4.7-.9-1.5.2-6.3 2.7-6.3 9 0 6.4 4.8 10 4.8 10s31.6-3.6 36.3 5.1c4.5-10.5 34.5-6.8 38.1-8.6z"/>
+  <path fill-rule="evenodd" stroke="#000" stroke-linejoin="round" stroke-width="1.1" d="M549.5 183.6s.4-3.7 3-5.4c2.6-1.8 20-2.6 24.3 0s5.7 15.5 5.7 15.5 2.6 4.6 2.8 7.9l.5 5.6s14 18.1 14.2 34.6c1.6 11.1 1.2 41-3.2 52.4-.1 14.1-6 23.4-6 23.4s1.3 2.4 1.2 5c-.2 2.7-1.6 5.1-1.6 5.1l20.4 10.1-7.5-2.8 7.5 6.3-8.5-4 5 5-12.4-5.5s5.8 5.4 5.4 5.2l-9.2-4.3 5.4 5.6c-.2-.3-8-3.5-8-3.5l.3 3s-6.3-.4-6.3-5.1a23 23 0 0 1-5.2-4.2l-14.5-2.5-16.4-49 3.8-83 1-4.2-1.7-11.2z"/>
+  <path fill="#fb0" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M538.5 448.8s-8.4-17.8-12.6-18c-3.8-7.2 13.2-66.2 46-69.5 18 1.4 1.4 20.7-10.4 14.8 1.5 5.2 7.4 12.6 7.4 12.6s-23.5 10.1-30.4 60zm-112.7 2.5s7-20.1 11.2-20.4c4.2-.2-11.2-67-44.8-67.6-18.1 1.5-1.5 21 10.4 15-1.4 5.2-7.4 12.6-7.4 12.6s23.6 10.2 30.6 60.4z"/>
+  <path fill="#00713d" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M456.6 325.5c-.1-.1-8.4 2.6-3 11.6.4-3.5 4-5.6 4-5.6s-5.6 6.7.4 12.4c.7-5.3 4.1-7 4.1-7s-4.2 12.3.1 14.8c.5-4.9 3.7-7 3.7-7s-3.8 11-.4 13.5c.4-4.2 3.2-6 3.2-6s-1.7 11.4 2.7 12.2c.1-4 3.4-8 3.4-8s-1.5 9.4 5.5 9.8c0-3.5 1.3-7.6 1.3-7.6s3.2 10 7.8 8.3v-8.4s2.9 9.5 8.4 7.7c-.8-2.7.3-5.8.3-5.8s3 5.9 8.2 4c.9-1.8-.2-5.3-.2-5.3s7.6 8 10 3.2c2.3-4.8-6.2-6.4-6.2-6.4h5.8s-1.9-4.9-9.6-6c2.6-1.1 5.4-.3 5.4-.3s-1.6-6-9.6-6.7c3.1-1 6.5-.3 6.5-.3s-1-5.7-9.8-7.4c1.4-1.5 5.1-1 5.1-1s-3.5-5.4-7.4-5.1-39.8-3.6-39.7-3.6z"/>
+  <path fill="none" stroke="#3ec26d" stroke-linecap="round" stroke-width="1.1" d="M491.9 354.7s3.1 1.6 3 3m-1.1-5.5s4 2.9 4 5m-.5-6.4s3.2 2 3.4 5.2m2-4s1.6 3.6 1 4.2m2.3-2.3c.2 2.8-.3 3-.3 3m-39.6-20.4s3.8 2.5 3.5 5.9m-3.7-3s1.7 1.8 1.3 2.9m3.3-5.7s2.6 3.5 1.7 6m2.6-3.7s1.2 2.2.1 3.4m2-2.4s1.3 2.2.1 3m-1.7 4.2s3.6.8 4 3.5m-1.9-5.9s3.7.3 4.1 4.2m.9-5.6s2.5 4.3 2 5.7m2.7-5.3s1 4.2.3 5.5m2.8-3.8v4.7m-4.7-11.2s2.4.9 2.2 3.1m0-5.2s3 1.7 2.7 5m.8-6.4s2.6 3 1.6 6.5m2.9-5.8s-1 3.8-.6 5.4m3.3-2.8s-1.6 1.3-.7 3m-14 11.8s.6 3 0 3.4m-3.7-5s1.9 3.2 1.2 4.8m-5.2-5s2.1 2.4 2 4.3m-5.2-3.8s2 1.8 1.8 2.9m-3.5-.1s1.9 2 1.8 2.3"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M430.9 222.2l26.7-.5s17.7 0 19.6 5.8c3.4-7.7 18.6-7.2 18.6-7.2l27.7-1 .5 67a71.5 71.5 0 0 1-44.9 52 68.6 68.6 0 0 1-45.3-52.6l-3-63.5z"/>
+  <path fill="#006b00" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M440.4 222l39 103.8 35.2-106.1c-11 .7-34.4-1.7-37.3 8.3-4.5-9-29.1-5.4-36.9-6z"/>
+  <path fill="#ffc900" fill-rule="evenodd" stroke="#006b00" stroke-linecap="round" stroke-width=".6" d="M467 278.2c1.4.8 1.4-28.2 3.4-29.1l1.5-6c-1.7-3-9.3-2.8-12-.3a74.5 74.5 0 0 0 1.8 5.4c3.8 6.2 3 30.6 5.2 30z"/>
+  <path fill="#cdad56" fill-rule="evenodd" stroke="#000" stroke-linejoin="round" stroke-width="1.1" d="M456.5 54.3s2.8-3.1 2.9-3.9c.1-.7 12.5-1.2 19.9-15 4.1-7.2 0-3 0-3L479 29s5.1-4.9 3.3-7.5c-1.9-2.6-1.3 3.4-4.3 3.3-3-.2-1.4-6.5-1.4-6.5s-.2-.8-1-1.2c-1.3.2-1 2.4-2 2.7-1.2.2-2.2-5.3-2.2-5.3s-1.9-2.5-3.5 5.4c.9 8.4 6.2 6.7 6.2 12.2 0 5.5-4.7 9.8-6 10-1.5 0-1-4.7-1-4.7s-.7-2.3-1.2-2.3 2.7-.5 2.2-6.7c-1-7.5-2 1.7-4 1.4s-.5-7 .3-7.7-.9-3.8-5.3 4.2c-.4 3.8-.9-1-1.7-.8-1.5 3.1-1.3 5.4.9 8.3 3 2.8 5 5.7 5 7.2-.2 1.5-1.8 4.9-4 4.9s0-4.1 0-5.5c-.2-1.4-4-6.4-4-6.4s-2.6-4.2-2.3-4.4c.3 0-.3-.7-1.5 3.7s-2.8-3-2.8-3-1.7 5.5 2 8.7c-2.8-.4-3 .8-3 .8 0 1.5 3.8 2.1 4.3 4.7s-4 4.2-4 4.2 1.9 2.6 7.1-2.5c.1 3.2-2 5.5-2 5.5 1.8.8 3.1.7 3.4 2.7z"/>
+  <path fill="#cdad56" fill-rule="evenodd" stroke="#000" stroke-linejoin="round" stroke-width=".9" d="M439.3 54.3s-2.3-3.5-2.4-4.1c-.1-.7-11.5.8-17-13-3.4-6.7 0-2.8 0-2.8l.3-3.2s-3.7-4.6-2.1-7c1.6-2.3 1 3.1 3 3.1 2.5 0 1.1-5.9 1.1-5.9s.2-.7 1-1c1 .1 1.5 3.5 2.4 3.8 1 .2 3-4 3.6-5 .9 0 .8-3.5 2.2 3.7-.7 7.6-7 6.1-7 11.2 0 5 4 8.8 5.2 9 1.1 0 .7-4.3.7-4.3s.6-2 1-2c.5 0-3.6.8-3.2-5 1-5.2 3 .4 4.8 0 1.7-.3-.2-5.5.3-6.4 0-.8 2.6-4.2 3.5 3.4.4 3.6 2.3-3 3-2.8 1.3 2.9-.5 6.7-2.3 9.3-2.7 2.6-4 5.5-3.8 6.8.1 1.4.7 3 2.6 3 2 0 .7-2.3.8-3.5.1-1.3 3.3-5.3 3.3-5.3.6-1 .1-3 .8-3.8 1 0 1.4-1.4 2.5 2.6 1 4 2.3-2.6 2.3-2.6s1.5 4.9-1.7 7.8c2.5-.3 2.7.7 2.7.7 0 1.4-1.2 2-1.6 4.3a4 4 0 0 0 1.3 3.8s-1.6 2.4-6.1-2.3a7.8 7.8 0 0 0 1.7 5c-1.5.7-2.7.7-2.9 2.5z"/>
+  <path fill="#ffc900" fill-rule="evenodd" d="M508 237.4c-2.3-2-2.5-.2-3.7-.7-.5-.2-1-.8-1.5-1.2-.4-.5-.9-.7-1.5-.9l-.6 1.9c-.2.6.6 1.7.6 2.6-.2 1.4-.8 2.5-2.5 3 .5-1 .8-1 .6-2.2 0-.6-1.7-1.7-1.5-2.3.3-.9.8-2 .4-2.9-.7.5-1.6.3-2.4.6-.6.2-.6 1.4-1.4 1.8-1 .4-2.8.2-4.4-.7 1-.7 1.8-.2 2.7-1 .5-.3.5-1.9 1-2.3s1.6-.7 2.1-1c-.4-.6-.4-1.4-.8-1.9s-2.4-.4-2.8-.9c-.9-1-.7-2.3-1.6-3.3 2.2.9 2 2 2.5 1.9a4 4 0 0 1 2.7-.4c.5.2 1.6 1.6 2.2 1.9l.7-2c.2-.7-1-1.8-.7-2.4.4-1.3 1.4-2.4 1.9-3.6l.5 3.4c0 .6 1.2 1 1.3 1.5 0 .6-.6 2-.5 2.6l2.2-.1c.7-.2 1-1.7 1.7-1.8a8.4 8.4 0 0 1 3.6 0c-1 1-1.7 1-2.3 1.7-.5.4.1 1.6-1.3 2.5-.5.3-1.9 0-2.4.3l1.3 1.5s2.4.7 2.9 1.2c.9 1 1.3 2.2 1 3.3zm-59.8 1c2.3-2 2.6-.2 3.7-.7.6-.2 1-.7 1.5-1.2.4-.4 1-.6 1.5-.9l.6 2s-.6 1.6-.5 2.5c.1 1.4.7 2.6 2.4 3-.4-1-.7-1-.6-2.2 0-.6 1.8-1.7 1.6-2.2-.3-1-.9-2-.5-3 .8.6 1.7.3 2.4.6.6.3.6 1.4 1.5 1.8.9.4 2.8.2 4.3-.7-1-.7-1.7-.2-2.7-1-.5-.3-.5-1.9-1-2.2-.4-.4-1.6-.8-2-1.2.4-.5.3-1.2.8-1.7s2.3-.4 2.8-1c.9-1 .7-2.2 1.6-3.2-2.3.8-2 1.9-2.5 1.8-1.1-.5-2.2-.6-2.7-.4-.6.3-1.7 1.7-2.2 1.9l-.8-2c-.2-.7 1-1.8.8-2.4-.4-1.2-1.5-2.4-2-3.6 0 1.2-.3 2.2-.4 3.4-.1.6-1.3 1-1.4 1.5 0 .6.7 2 .6 2.7-.7-.2-1.6 0-2.3-.2-.6-.1-1-1.6-1.7-1.8a8.3 8.3 0 0 0-3.5.1c1 .9 1.7.8 2.3 1.7.5.3-.2 1.5 1.2 2.4.5.3 2 0 2.4.3l-1.3 1.5c-.4.5-2.4.7-2.8 1.2-1 1-1.4 2.2-1.1 3.3z"/>
+  <path fill="#ffc900" fill-rule="evenodd" stroke="#006b00" stroke-linecap="round" stroke-linejoin="round" stroke-width=".6" d="M506 244.1c-2.1 1.7-15.8 5.1-15.9 17-.1 11.8 2.4 14.5-.1 14.8-5 0-5.7-13.2-5.5-19 .1-5.9.3-5 .3-5s3.3 1 3 3.8c-.2 2.8 3.4-7 2.2-9.8 2.2 2.3 5.2 1.4 5.2 1.2 0-.1-1.7-2-2.4-3.3-.7-1.3 2.5.8 2.5.8s.1-2.3-2.7-2.1c-3.6 0 .6-1.2.6-1.2s2.1 2 3.5-.2a12 12 0 0 0-3.8-2.5s-2-3.8-4.6-4.5c-3.1-.8-2.7 1.3-6.2 1-.7 1.4-.7 1.5.7 2-2.4 1.6-1.1 5-1.1 5s3.8-1.7 3.6 1c-.1 2.7-2.2 2.2-3.6.6-1.3-.8-1.7.7-1.7.7l2 2.1s-3.9-.1-4.8 2.4c2-.1 3.2.5 3.2.5s-4.3 2-4.8 3c-.4 1-.5-1.2-.7-1.2l-4.2-1.5-1.4 6.5s2.8 2.8 4.4 1.9c1.5-1 4.3-3.6 6-2.9-5 3.8-9.8 9.2-12.5 10-.7-.7-3.1-3-4-1.9-1 1.2-.4 2.7.9 2.6 1.3-.2-4 1.2-3 3.4 1.2 2.3 1 2.1 2 1.5 1-.6-.8-.7 2.8-1.8 3.7-1 3.5-2 3.5-2s-.7 1.6-2.6 2c-2 .5-3.5.5-3.1 1 .4.7 1.2 1.7 1 2.3-.3.6 4-3.1 5.2-.1 3-.2 4.9-3.8 3.5-5.9.1 2.3 1.5 3 .7 4s6.6-3.4 3-6c1 2.2 1 4 1 4s1.8-.2 2.2-.8c.4-.6-.9 1.7-.3 2.1.6.5 3.2 3 2 4.8-.6-1-.7-2.7-1.6-2.5-.8.1-4.3 2.7-6.5 2.8s2.6 7.8 2.6 7.8-3.3-.4-3.7-.1c-.4.3-2.5-2.7-3-1-.6 2.3.8 1.4.8 1.4s-1.9-.9-2.8.2c-1 1-2 2-1.3 2.5s3.8.5 4.2.3-3.5.3-3.8.8c-.3.4-.8 2 0 2.7s3-.3 3.1-.8c.2-.4.3 1.7.3 1.7s3.6.3 3.6-3.5.3 2.7.3 2.7 3.7.6 3.8-3.1.4 2.5.4 2.5 2.4-.7 2.4-1.3c0-.6-.1 7.5-1.8 9.7-2.7-1.8-4.4 1.2-4.4 1.2s.2 4.3-.1 5.4c-.3 1 1.8-.6 2-1 .1-.5 2.6-1.7 2.8-2l.8-1.8s-.5 2.1-1.5 2.4-2 1.3-1.6 2.2c.5 1 2 1.5 2.6 2.4.5 1 2.5-5.2 2.5-5.2l.1 1.3s2.6-.6 2.9-1.8c.2-1.2-2.7-2.2-.3-4.2 2.4-1.9 0 1.8 0 1.8s.8 2.9 1.4 2.9 2-5.4.5-6.7c-1.4-1.4 2.1 1.6 2.1 1.6s2-5.5-.1-6.3l-3.1-1s1.1-1.5.6-1.7 3 3.3 3.5 2.4 1.4-3.6-2.7-5c-4-1.6-.1-5.8-.1-5.8s2.5 3 4.3 1.4c1.9-1.7-.1-1.7-.1-1.7s5.2-3.3 5.3-5l-2.6.2s3-2 2.2-5a3.5 3.5 0 0 1-2.7 1.6s2.6-2.6 2.1-5c-1.5 1.2-1.4 2.1-2.3 1.8s-2.7-9.7 1.2-10.3c4-.6 1.8 4.6 2 4.6.1 0 5.9-2.4 0-6.3 1.4-.4 4.4 2.3 4.4 2.3s-1.3-6.6-7.6-2.6c1.5-1.6 2.5-2.7 3.7-2.4 1.3.3 5.8-.1 5.8-1.5-1.1-.9-3.5.5-4.8 0-1.2-.4 9-1.2 8.2-6.3z"/>
+  <path fill="none" stroke="#006b00" stroke-linecap="round" stroke-width="1.3" d="M481.3 118.5s12.3-6.4 18.4 1.6m4.9 12.2c-.3 0-4.3 4-5.2 4m13.4 8.9s11.4.9 18.7-10.4" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="none" stroke="#006b00" stroke-linecap="round" stroke-width="1.3" d="M525 141.8s1 6.1 2.8 6.1-3 1.6-4.9.3c2.2 2.8 3.4 7.7 0 9.5" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#e80000" fill-rule="evenodd" stroke="#006b00" stroke-linecap="round" stroke-width="1.3" d="M519.3 219s-4 4.3-9 4.6" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="none" stroke="#006b00" stroke-linecap="round" stroke-width="1.3" d="M523.9 199.4s-2.5-12.3-1-15.3c1-4 5-5.5 8-10.7m-8.3 17s-3 7.4-16.5 5m20.2-23.3s1 9.8-11.3 6.1m-3.7-50.2s-4.9 4.3-3 10.1" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#006b00" fill-rule="evenodd" d="M483.7 247.6s3-1.2 3.6-1.8a9 9 0 0 0 1.8-2.7c.3-.9-2-2.3-.9-4.2.7-.9 1.7-1 3.4 0s-1.5-3.3-3.2-3.5-2.8 1.3-3.3 1c-.4-.3.2 1.2-.5 1.2s1.4 1.2 1.2 1.9c-.1.8 2.3 3.3 2.1 3.9 0 .6-3.5 4-4.2 4.2z"/>
+  <path fill="#ffc900" fill-rule="evenodd" stroke="#ffc900" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.3" d="M534.3 97.1c2.8-.6 3.2 0 2.7 2.5a7 7 0 0 1-2.7-2.5z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#e80000" fill-rule="evenodd" stroke="#006b00" stroke-linejoin="round" stroke-width="1.3" d="M514.7 233.5s-1 6.4 1.5 7c-.1-2.5.5-4.2 1.2-4.9-.6-.2-2.6-2-2.7-2zm-5.7-7.9c-2.3-.3-6.2 1.6-5 4 1.8-1.7 3.6 0 4.9-1.6.4-.4.3-1.8.1-2.4zm0-4.5s-3.6-.6-4.1 1.9c2.5-.3 3.2-.6 4 0 .3-.6 0-1.8.1-2z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#e80000" fill-rule="evenodd" stroke="#006b00" stroke-linejoin="round" stroke-width="1pt" d="M493.5 185s2.2.8 2.9 3c1.7-1 2.5-5.8-2.9-3zm-5.4 5.4c.1 0 4.6-2.8 5-.2-.9 1-1.3 1.6-2 1.8-.6 0-1.8-1.8-3-1.6zm-.4 8.8s2.9-2.5 4-.8c1 1.6-1 1.5-1 1.5s-1-.4-3-.7zm-4-49.2s-3.6-1.4-5 1c2.3.4 3.1 1.2 4.2 2-.3-1-.8-2.6.8-3zm-6.9 18.5s.2-4.2 2.1-5.9c1.2.7 1.5 1.7 2.2 2.9-1.5.3-3.4.4-4.3 3zm9.5-3s-4 1.9-2.6 3.8c1.2-1.3 2.7-1 2.7-1l-.1-2.8z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#ffc900" fill-rule="evenodd" stroke="#006b00" stroke-linejoin="round" stroke-width="1pt" d="M480.6 125.6c-1.4 1.6 1.8 5 5 4.5 1-3.7-4.1-5.7-5-4.5z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="none" d="M461.2 248.1c-.3.9 1 2 1.7 1.8.3-1-1.4-2.5-1.7-1.8z"/>
+  <path fill="#e80000" fill-rule="evenodd" stroke="#006b00" stroke-linejoin="round" stroke-width="1pt" d="M484.3 122.8s.6 2.9 3.4 2.1c-.4-2.3-2.4-4-2.4-4-.1.7.4 1.7-1 1.9zm1.9 8.5s1.5 1.7 4.6-1.8c-1.4.4-3.8-.8-3.8-.8s0 2.4-.8 2.6z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="#ffc900" fill-rule="evenodd" stroke="#006b00" stroke-linejoin="round" stroke-width="1pt" d="M480.5 118.9c-1.4 1.5.5 3.7 3.8 3.2.9-3.7-3-4.4-3.8-3.2z" transform="matrix(.46 0 0 .5 240.3 190.1)"/>
+  <path fill="url(#d)" fill-rule="evenodd" d="M144.6 266.6s7-2 10.8 1 3.7.3 3.7.3 5.5 2 7 1.6-1 .1 1-1.2c2.2-1.2-4.2.3-4.8-2.4-1-1.7.1-3.9-2.2-3.2-1.5-2 1-3.4.5-5.6-1.6 1.2-2.5-.4-3.8 2.5-3-.6-.4-4.8-3.7-5.2 0 3-2.4 3.2-2.6 4.9-1.4 1-7.7 4.7-5.9 7.3z" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="#c01500" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M392 437.9c4-1 25.2 4.7 33.4 13.5-1.7-15.7-6-27.7-6-27.7s-12.8-3.6-14.5-1.9a96.3 96.3 0 0 0-13 16.1zm-6.5-72.3c-1.5.2-3 1.2-4.5 3.7-1.7 4.2-3 14.9-5.4 17.4-2.5 2.5-4.8 2.7-4.8 5 0 2.2.3 7.4 7 9.4 6.7.3 17.4-10.7 17.4-10.7s5.5-6 7.7-12.4c-13 4.5-22.1-7.5-17.4-12.4zm187 69.8c-4-1-25.4 4.7-33.6 13.4a133 133 0 0 1 6-27.5c1.6-.4 12.5-3.6 14.2-1.9 2.5 2.7 10.7 10.7 13.4 16zm6-72c1.5.3 2 2.3 3.2 4.7 1.7 4.2 3.5 10.4 6 12.8 2.5 2.5 4.7 6.2 4.7 8.4s-.5 5.2-7.2 7.2c-6.7.3-16.3-8.3-16.3-8.3s-5.4-6-7.7-12.4c12.9 4.5 21.2-7 17.3-12.3z"/>
+  <path fill="#fb0" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M378 424.2s13.5 9.2 13.7 13.5c36-53.5 128-70.1 180.5-3.8 7-9.2 14.2-12.1 14.2-12.1-55.2-72.2-165.1-63.2-208.4 2.4z"/>
+  <g fill="#1e5aa6" fill-rule="evenodd" stroke="#000" stroke-width="1.1">
+    <path d="M515 219.9l5.2-.2-9.4 12 11.3 13-22.2 28 21 25.2a70 70 0 0 1-8.6 15.4l-12-13.3 21.8-27.2-18-20.3L515 220zm-75.2 2.3l-5.6.2 10.5 11.4-11.2 13.9 23.2 25.1-19.2 25.7a75.8 75.8 0 0 0 9.2 16.5l11.4-14.4-23.4-26 17.1-21.8-12-30.6z"/>
+    <path d="M465.9 289.8l-8.3 11L487 335a74 74 0 0 0 13.8-9.2L485.5 308l6.3-18.4 9 10.4-28.2 36a62 62 0 0 1-14.7-9.1l15-18.9-7-18.2zm-9.2-17.1l5.4 6.8-3.5-9.2-1.9 2.4zm38.6 6l4.3-5.8-1.6-2.2-2.7 8z"/>
+  </g>
+  <text x="-328.3" y="362.4" font-family="Timmons" font-size="14" font-weight="bold" transform="rotate(-49.4 182.5 -362) scale(.86)">
+    <tspan x="-328.3" y="362.4">L</tspan>
+  </text>
+  <text x="-292.3" y="384.3" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.6 -.6 .6 .6 337.3 11.7)">
+    <tspan x="-292.3" y="384.3">E</tspan>
+  </text>
+  <text x="-239.8" y="451.7" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.66 -.47 .5 .65 337.3 11.7)">
+    <tspan x="-239.8" y="451.7">O</tspan>
+  </text>
+  <text x="-188.5" y="430" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.7 -.48 .48 .7 337.3 11.7)">
+    <tspan x="-188.5" y="430">T</tspan>
+  </text>
+  <text x="-115.4" y="451.5" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.78 -.37 .37 .78 337.3 11.7)">
+    <tspan x="-115.4" y="451.5">E</tspan>
+  </text>
+  <text x="-94.1" y="453.1" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.8 -.35 .35 .8 337.3 11.7)">
+    <tspan x="-94.1" y="453.1">R</tspan>
+  </text>
+  <text x="-68.4" y="455" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.8 -.32 .32 .8 337.3 11.7)">
+    <tspan x="-68.4" y="455">R</tspan>
+  </text>
+  <text x="112" y="445.7" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.86 -.07 .07 .86 337.3 11.7)">
+    <tspan x="112" y="445.7">R</tspan>
+  </text>
+  <text x="180.2" y="430.8" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.86 0 0 .86 337.3 11.7)">
+    <tspan x="180.2" y="430.8">R</tspan>
+  </text>
+  <text x="414.8" y="275.2" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.75 .43 -.43 .75 337.3 11.7)">
+    <tspan x="414.8" y="275.2">R</tspan>
+  </text>
+  <text x="483.9" y="193.1" font-family="Timmons" font-size="14" font-weight="bold" transform="rotate(39.9 153.2 471.7) scale(.86)">
+    <tspan x="483.9" y="193.1">E</tspan>
+  </text>
+  <text x="309.1" y="414" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.83 .16 -.13 .82 337.3 11.7)">
+    <tspan x="309.1" y="414">O</tspan>
+  </text>
+  <text x="105.1" y="459.3" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.78 -.1 .12 .84 337.3 11.7)">
+    <tspan x="105.1" y="459.3">O</tspan>
+  </text>
+  <text x="-45.7" y="455.8" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.8 -.3 .3 .8 337.3 11.7)">
+    <tspan x="-45.7" y="455.8">A</tspan>
+  </text>
+  <text x="518.4" y="144.7" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.6 .6 -.6 .6 337.3 11.7)">
+    <tspan x="518.4" y="144.7">A</tspan>
+  </text>
+  <text x="271.2" y="388.3" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.84 .17 -.17 .84 337.3 11.7)">
+    <tspan x="271.2" y="388.3">A</tspan>
+  </text>
+  <text x="40.3" y="455.2" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.85 -.16 .16 .85 337.3 11.7)">
+    <tspan x="40.3" y="455.2">M</tspan>
+  </text>
+  <text x="94.4" y="448.1" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.86 -.1 .1 .86 337.3 11.7)">
+    <tspan x="94.4" y="448.1">P</tspan>
+  </text>
+  <text x="155.1" y="437.6" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.86 0 0 .86 337.3 11.7)">
+    <tspan x="155.1" y="437.6">P</tspan>
+  </text>
+  <text x="405.1" y="276.7" font-family="Timmons" font-size="14" font-weight="bold" transform="rotate(29.3 146.8 652.1) scale(.86)">
+    <tspan x="405.1" y="276.7">P</tspan>
+  </text>
+  <text x="232.1" y="409.8" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.85 .1 -.1 .85 337.3 11.7)">
+    <tspan x="232.1" y="409.8">I</tspan>
+  </text>
+  <text x="530.4" y="132.1" font-family="Timmons" font-size="14" font-weight="bold" transform="rotate(46.4 155 399.3) scale(.87)">
+    <tspan x="530.4" y="132.1">T</tspan>
+  </text>
+  <text x="464.2" y="218.5" font-family="Timmons" font-size="14" font-weight="bold" transform="rotate(36.4 149 515.6) scale(.87)">
+    <tspan x="464.2" y="218.5">T</tspan>
+  </text>
+  <text x="313.7" y="362" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.83 .24 -.24 .83 337.3 11.7)">
+    <tspan x="313.7" y="362">M</tspan>
+  </text>
+  <text x="513.7" y="123.3" font-family="Timmons" font-size="14" font-weight="bold" transform="matrix(.58 .64 -.64 .58 337.3 11.7)">
+    <tspan x="513.7" y="123.3">G</tspan>
+  </text>
+  <path fill="none" stroke="#fff700" stroke-linecap="round" stroke-width="1.1" d="M557.4 184.5s5.2-4.4 8.9-4.6m-8.2 4c.1-.1 31-4.5 32-5.4m-31.9 5.6l34.6-3m-34.7 3.2s36.7-1.8 39 0m-39.1-.2s36 .3 36.6 1.1m-36.5-1l34.6 2.8m-35-2.6c.2 0 35.3 3 38.7 7.5m1.9 6.3c-.2-.1-12-14.2-40.7-14m.2.3s19.8 1.4 26.1 8.3m-25.8-8.5s12.9-2.5 26.3 13.7"/>
+  <path fill="url(#e)" fill-rule="evenodd" stroke="#000" stroke-width="1pt" d="M247.4 217.7s20.7.9 20.7 2.9-15.4 5.9-15.6 14.4c-.2 8.5 11.8 9.2 12.6 20 .8 10.7-9.4 12.3-11.4 15.2-2 1.4-6.9 16.6-6.3 25.5.6 9 3.3 39.2 8 45.3 3.6 2.9 9 12 15 9.2 5.9-2.9 1.8-13.2 1.2-16s2.4-7.6 2.4-11.8c0-4.3-2.2-7.8-2-8.8.2-1 16.4 3.9 15.4 20-1 16-7.5 11-7.5 11s2 19.8-3 22.4c-9.2 5-15.9-1-15.9-1l.9 4-7-3.6s-9-12.8-11-18.5-4.4-31-3.6-36.5c.8-5.5 1.4-37.6 1-39.2s-2-28.5-1-32.5 7.3-22 7.1-22z" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="#ff7000" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M530.8 194.4s12.4-12 19.6-10.6c3.7 0 .2 2.6.2 2.6s6.3.5 7.1 3.3c.2 1.2-3 1.6-3 1.6s2.7.5 2.8 2.8-26.5.5-26.7.3z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M531.5 193.9s13.3-1.8 18.9-7.4m-5.4 3.7s9.8-.3 9.8 1"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-linejoin="round" stroke-width="1.1" d="M579.7 333.1s8.4-1.9 10.7-4.9c1.4-1 8.7 11-10.7 5z"/>
+  <path fill="none" stroke="#fff" stroke-linecap="round" stroke-width="1.1" d="M577.5 263.8s1 6.4-2 10.8c-1.5 1.7-6.3 4.7-6.3 6.8 0 2.1 1.8 4.9 1.4 7.3s-3 5-2.7 7c0 2.1 3 13.3 2.6 13.5m-8.4-66.4s-6.6 2.3-8 9"/>
+  <path fill="#c75b00" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M559.3 190.2s2.3 6.3 9.6.4c-4.7-6.5-9.6-.2-9.6-.4z"/>
+  <path fill-rule="evenodd" d="M564.9 190c0 .4-.4.7-.8.7s-.8-.3-.8-.6.3-.6.8-.6.8.2.8.6z"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M499.3 175.6s14 15 23 15c1.6 4.4-4.2 8.5-6.5 10.4-4.5-1.4-8.7.3-19.3-12.8.6-8.3 3-12.2 2.8-12.6zm18.8-35c1.8-5.6 5.4-10 8.5-10.5-.8-4.2 6.6-23 28-30.3 1.3 9.7-9.1 19.2-9.1 19.2s31.6-5.4 38-13.4c-.7 3.6-7.1 26-40.8 25.8 12.8 12.1-4.1 21.8-11.3 18.9 13.2-10.2-3.8-16.2-13.3-9.7z"/>
+  <path fill="#cccccd" fill-rule="evenodd" stroke="#ccc" stroke-width="1.1" d="M529 132.8c6.3-4.1 8.6-4.1 13.8-3.3l-3.7.6s-.4.5 2 2.7c-2.7-.7-5-2.2-12.2 0z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M526.5 130.1s12.6-6.7 19.6-11.3"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M515.7 201s17.3 4.8 19.3-20.1c-3.8-10.8-9-34-1-40.8-7.4-5-15.4.2-15.4.2-.5 1.1-7 10.5 1.8 26.8-21-5.5-12.4 14.3-12.4 14.3.8-3.1 12-6 14.7 9.8 1.1 4-7.5 10-7 9.8z"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M535.1 181s18.4-9.8 17.9-32.9c-15.6.4-21.1 20.5-21.1 20.5l3.3 12.4z"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M453 179.9s-13.6 11.8-21.3 8c-5.7 3.4-12.4-2.6-12.4-2.6s7.8 29 36 8c-.5-6.4-2-13-2.3-13.4z"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M431.5 187.4c1.2-6 6-9 9.7-3.3 5 1 10.2-19.8-7.9-16.3 5.1-27.2-10.1-37.3-10.1-37.3s-5.4 30-3 35.6c2.5 5.6-3.5-10.3-23-14.7-.3 22.8 21.7 33.4 21.7 33.4s6.3 5.7 12.6 2.6z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M433.3 167.6s-8.5 7.2-6.5 17m-6.4-18s-2 7 2.3 17m-3.6 2.4s4-6.4 12.4 1.8"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M420.7 141.8c0-.2-12.9 0-5.2 13-5.7 1.8-18.5-6.5-9.7-17.6-29-.7-40.7-14.6-40.7-27.4 8.5 8.9 28.8 5.3 36 10.7-8.8-8.2-7-19.5-7-19.5s24.7 7.4 29.1 29.3c-1.5 4.2-2.1 11.8-2.5 11.4z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M400.9 119.9c4.7 4.9 17 6.3 23.2 11.7"/>
+  <path fill="#cccccd" fill-rule="evenodd" stroke="#ccc" stroke-width=".8" d="M406.5 134.2s10.2-1.3 13 2.3c-3.9 0-5.2-1-11 1.2 1.7-.9 1.2-2.3 2.1-2.3s-3.7-1.2-4.1-1.2z"/>
+  <path fill="#923f00" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M457 54.8s5.6-4.9 11.7-.4c-2.7 8.1-12.6 5-12.6 5s.3 4.1-.7 6c2 1.6 3.6 6.5 3.6 6.5s10.2-2.5 12.3 2c3.9-.6 6.7 0 6.7 0s7.9-2 10.7-2c2.7 0 11.6 2.3 12.4 3.9.8 1.6 3.8 12.6 5.7 12.4 2-.1-4.7 2.7-6.5-.1-1.8-2.8-1.3 3.6-1.3 3.6s5.5 5.9 6.2 7.2c.6 1.3-3.4 12-.3 19.3-2.8.2-3 3-3 3-.1 3.3-4.2 4.2-4.2 4.2l-1-4.4-2.8 1.6 1.1-3.4s3.8-9.2 4.1-12.1c.4-3-3.4-8.2-6.3-8.2s-5.1 9.3-5.1 9.3-1.5 7-1 7.7l-2-2.3s-1.3 4.3-2.3 5.6c-1 1.3-3 1.8-3 1.8s-1.5-4.3-1-6c.4-1.6 8-8 7.3-12.5-.6-4.6 0-3.5-.2-3.6-.1-.2-3.9-3.5-4-5.3-.2-1.8-5 2.3-11.2 1-1.9 3.3-2 11.6-2 11.6s-.8 10 .6 11.2c1.3 1.1-3.3 3.6-3.3 3.6l-3.3 4.4-1.1-2.6-2.3 1.6 1.3-3.3c0-2.4 3.2-9.2 3.2-15s.4-11.8.4-11.8-6-.3-6 5.9c.3 6.2-1.4 6.5-1 8.3.3 1.8 2 6.9 1.4 8.4-.5 1.4-2.4 2-2.4 2l-.5.8s-6 2.7-6 3.9c.2 1.1 0-3.3 0-3.3l-.4-4.7s3.6-2.3 3.6-8c0-5.8-.8-6.6-.7-8 .2-1.2 1-6 .9-6.5-.2-.4-3.5 1.4-4.5 1.4s1.8-3.5 2.2-6c.3-2.4-3.3 2.4-6.3-.4 1.4-3 3.5-4 3.8-6.2s-2.3 2-4.6.3c.2-2.2 2.5-4.1 2.5-4.1s-1.9-.2-2.6 0c-1.5-.5 1.6-2.8 1.8-6 .1-3.3-1.8-4.6-1.8-4.8 0-.2-3.3-3-3.8-4.1-.5-1.1-.5-2.5-.5-2.5s-5.4 4-11.8-4.4c5.9-5 12.1-1.3 12.1-1.3s1.7-4.6 9.2-4.2c7.5.3 9 4.5 8.7 4z"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M498.3 139.5s13.8.4 14 7.8c.1 7.3-4.2 5.4-4.4 5.4l-10-1.2.3-12z"/>
+  <path fill="#fffeff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M484.9 137.5s17.2-.2 16.2 7.3-5.3 6-5.3 6l-8.3-.7-2.6-12.6z"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M475.2 136.6l10 .9s6 .8 5.7 6.5c-.3 5.7-6.1 5.9-6.1 5.9l-9.7-.6.1-12.7z"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M451.9 139.5c-.1 0-13.9.4-14 7.8-.2 7.3 4.2 5.4 4.3 5.4l10.1-1.2-.4-12z"/>
+  <path fill="#00f" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M465.3 137.5s-17.2-.2-16.3 7.3c1 7.5 5.4 6 5.4 6l8.3-.7 2.6-12.6z"/>
+  <path fill="#fff" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M475 136.6l-10 .9s-6 .8-5.7 6.5c.2 5.7 6.1 5.9 6.1 5.9l9.7-.6-.2-12.7z"/>
+  <path fill="#5e0043" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M501.6 219.4s7.1-10.6 10.2-9.4c2.6.9.6 9-.7 9.8l-9.5-.4zm-49 1.9c-2.3-3.2-5.6-11.8-8.6-9.4-2.6.8-.6 9 .6 9.8l8-.4z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M457.3 200.4s14 8.6 18.5 8.8c4.6.3 19-11.1 19-11.1"/>
+  <path fill="#5e0043" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M458.6 166.8l2.7-3.4 13.4 6.8 13.6-6 2.7 2.8-15.2 10.7-17.2-11z"/>
+  <path fill="#474747" fill-rule="evenodd" stroke="#474747" stroke-linejoin="round" stroke-width="1.1" d="M448 166.6c1 1.3 9.7 11.9 11.3 20.6 1.6 8.7-.9-12-.9-12s10.7 5.3 11 8.6c.4 3.4 5.2-.2 5.4-.8l-31-20.1 4.2 3.7zm52.9-.6s-11.3 14.8-10 31c-2.3-7.8-.4-20.6-.4-20.6l-2.4 1.6s-2.6 11-5.8 12.6c-.6-1.3-.5-1.8-.5-1.8s-3.4 4.5-4.1 5c-.7.4.2 15 .2 15s1.2 10.6 2.5 10.5a45 45 0 0 0-3.4 1.9l-1.4-28.3 3.2-3.2s4.3-5.1 4.6-10.1c-1.9 1.5-4 2-4 2s-.5 7.1-2.1 8.1c-1.7 1-1.8 2.9-1.8 2.9l-.4-9.3L501 166z"/>
+  <path fill="none" stroke="#000" stroke-linecap="round" stroke-width="1.1" d="M475.1 183.1l2.2 44.6"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M447.7 204.4s5.1 3 7 12.2c16.7-1.2 22 4.7 22 4.7s13.7-6.6 20-5.4c2.3-4.7 8.7-10.7 8.7-10.7"/>
+  <path fill="#b4b6b9" fill-rule="evenodd" stroke="#000" stroke-width="1.1" d="M440.7 160.7l34.4 22.6 31-21s6.5-3.5 6-6-2.8-1.6-4-1.2c-1 .5-32.4 22.7-32.4 22.7l-33.4-21s-2.4-.9-2.9.7 1 2.4 1.3 3.2z"/>
+  <path fill="#474747" fill-rule="evenodd" stroke="#474747" stroke-linejoin="round" stroke-width="1.1" d="M502.3 154.9s-8.8-3.8-8.8-.5c0 3.2.2 3.5 1.6 5.6 1.4 2.1-1 3.4-1 3.4l-.9-2.3c-.5-1.4-5.2-2.4-5.6-4-.4-1.7 1-4.4-1.9-4.7a5.2 5.2 0 0 0-6.1 4.4 67.5 67.5 0 0 1-4.2 10.8l.5-17.2c6.2.4 17.7 1.8 26.6 2.8-2.7-.4 1 .2.9 1-.3.8-1.2 1-1.1.7zm-31.2-4.4c-1.6 0-9.5 1-11.5 2.1-2 1.2 3.3 3 2.6 4.6-.7 1.6-.7 4.7-3.2 4-2.5-.6-11-4.7-11.2-6.2-.2-1.4-2-1.5-2-1.5s24.1-3.2 25.3-3z"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M474.9 148.6v21.1m-16.3-46l-9.8 16.1"/>
+  <path fill="url(#f)" fill-rule="evenodd" stroke="#000" stroke-width="1pt" d="M161.8 129.7s4.9 6.7 4.3 8.6a25 25 0 0 1 4.3 7.8" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M492.7 122.3s-9.1 12.8-8.8 13.8"/>
+  <path fill-rule="evenodd" d="M446.2 61.4c-.2.7-1.4 1-2.6.7s-2-1.3-1.8-2c.2-.8 1.3-1 2.6-.7s2 1.3 1.8 2zm3.7-.2c.2.7 1.4 1 2.6.6s2-1.3 1.8-2c-.2-.7-1.4-1-2.6-.6s-2 1.3-1.8 2z"/>
+  <path fill="#ff7000" fill-rule="evenodd" stroke="#000" stroke-linejoin="round" stroke-width="1.1" d="M556.1 326.6s-3.3.6-3.2 1-9.8.5-10 .2c-.2-.3-1.5 1.7-1.5 1.7l1.6-1s2.4 2.6 3.1 2.4c.8-.2-.3 1 0 1.1.1.2.9-.4.9-.4l16.3-.3-7.2-4.7zm6.1 5.1l-13.3.4s-3.4 3-3.6 3.7 2.2 1 2.2 1l.7 2.5 1.7-.6s11.4 1.7 21.8-.6c5.3-1.9 6.2-4.1 2.5-5.5-3.7-1.3-11.9-.9-12-1z"/>
+  <path fill="url(#g)" fill-rule="evenodd" stroke="#000" stroke-width="1pt" d="M208.4 404l28-1.3-5.3-4.4 75.7-3-2.6-6-84.7 3.3 10.2 4.8-23 .6.8 2.4-6-.2s6.6 2.6 6.9 3.7z" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="url(#h)" fill-rule="evenodd" stroke="#000" stroke-width="1pt" d="M239.7 249.4c-2.2-1-12-2.4-22.8 4.7l.4 25s16-8.6 23.8-6.6c-.5-7.8-.5-17.8-1.4-23z" transform="matrix(.86 0 0 .86 337.3 11.7)"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M410.4 291.8L353.7 348m82-56l-46 60.7m44-76.5l-61.5 74.5m-1.8-1l6-7m69-29l-23.9 32.8m-1 4.3l.6 12.6m35.2-38.2L431 356.9m20.7-2.5l10.3-16.8m-6.3-3.3l-12.4 14M452 321l-8.5 10.3m-2.4-25.3s-25.7 37.6-25.3 40.7m22.6-45.6c-.6.4-22.2 29-22.2 29m-1.2 9l-4 4.8m-4.9 7.2l-6 7.8"/>
+  <path fill="#8a9396" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M407.6 205.2s-1.7 5.5 0 8.2 12.7 24.9 12.7 24.9 7.5-9.2 10.2-9.5c2.7-.2 1.5 23.9 1.5 23.9s-4.5 4.2-7.2 4c-2.7-.3 6.7 9.4 6.5 17.6s-12.5 49-17 49.7c-4.4.8 2-7.4 1.8-9.7-.3-2.2-1.5-.7-2.5-3.2s1.5-6.2 1-8.7-2.8-2-3-3.7 1.5-2.3 1.2-4.2c-.2-2-3-1.5-2.7-3.3s.5-1 .3-4.2c-.3-3.2-.8 2.2-3.5 2.5-2.8.2-5 6.4-5 6.4s-5.5 7.7-11 4.3c3.3 7 .8 10-.4 10.2s1 5.4-2 5.7 2.2 11.7-1.3 12.7c3.8 1.7.8 4 .8 4s-8.6.7-6.7 11.9c-25.4-9-37.8-24.4-37.6-40 .3-15.7 5.3-29.9 17.4-35 3.5-13 9.5-27 9.5-27s-1-5.7-.3-9.4c.8-3.7 4.3-7.4 4.3-7.4s-.5-9-.3-13.5c.3-4.4 2-6.4 2.2-9 .3-2.4-.7-15 1.8-17.3 2.5-2.3 7.2-2 9.7-3.5 2.5-1.5 5.7-4.2 9-4s6 2.5 6 2.5 12 0 12.8 4.7c.8 4.8-2.5 6.5-2.5 6.5s1.8 6.7-5.7 13z"/>
+  <path fill="#cecfcf" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M396.9 188.1c.4.7-.5 2-2 2.8s-3 .8-3.4.1c-.4-.7.5-2 2-2.8s3-.8 3.4-.1z"/>
+  <path fill-rule="evenodd" d="M394.8 189.3c0 .5-.4.9-1 .9-.4 0-.9-.4-.9-.8 0-.5.5-.9 1-.9s.9.4.9.9z"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width=".5" d="M413 197.5s3 13.4-.7 22.8m1.5-28.7s6 7.8 5.2 17.4m-4.6-19.1c.2 0 5 4.1 4.8 7m-3.6-8.8s3.2 2.3 4 4.6"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M414 186.8s-11.5 18.8-10 30.6"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width=".5" d="M414.8 186.2s-15.4 9.2-18.2 39"/>
+  <path fill="none" stroke="#000" stroke-width="1.1" d="M413.1 191.8l-6 4.5"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width=".5" d="M390.9 226.9s8.5-35.5 23.7-40.7"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M420.5 238.9s8.2-10.3 10-9.9c2 .4 1.4 23.8 1.4 23.8s-6 4.5-7.4 4.3c-1.3-.2 6.8 11 6.6 15.2l-.3 4.2s0-2.5-2-6.5c-1.8-4-.7-8.5-13-18.6-3-6.2 6 3.8 8 2.3 1.8-1.5-3.5-14.6-3.3-14.8z"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width="1.1" d="M406 181s-3.5 1-4 2.4c-.4 1.4-2.4 2.8-3.5 2.4a18.9 18.9 0 0 1-3.1-2.2"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-linejoin="round" stroke-width="1.1" d="M386.5 193.1s-5.2 5.2-2.7 5.8c2.5.6 5.2-4 5.2-4s0 7.9 2.1 6.6l8.6-5.7s2.2-.2 2.7 0c.5.1 6 4.8 9.5 3-2 5.4-4.4 6-4.4 6s-3.7 4.9-8.6 3.8c-4.8-1.1-6-3.2-6-3.2s-4.1.3-5.3-1.5c-1.3-1.9-1.8-3-1.8-3s-2.3 2.4-3 1.3c-.6-1.1 0-7.5 3.7-9z"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width="1.1" d="M415.7 186s-9.6-2.9-12.8 1.8c-3.3 4.7-2.5 7.3-.8 7.8"/>
+  <path fill-rule="evenodd" d="M417.1 185.7c0 1-.8 2-1.8 2s-1.8-1-1.8-2 .8-2 1.8-2 1.8.8 1.8 2z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M389.4 210s3.9 6 8.5 7.6-3.2 3-7.8 0c-3.4-4.6-2.5-8-2.5-8s1-.8 1.8.4zm33.3 35.2s-11-15.1-14.1-16c-3.1-.8 2.4-1.5 5.7 1.8 3.4 3.2-.9-5.3-.9-5.3l9.3 19.5z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-linejoin="round" stroke-width="1.1" d="M388.4 332.8c4.2-1 22.4 10.5 26.5 13.4 4 3 12.7 1 12.7 1s-4 2.5-6.5 3 7.4.7 7.4.7-23.3 6.4-47-6.1c-2.2-9.7 5-11.9 6.9-12z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M415 249s-3-.6-4.6-2.4c-1.6-1.8-3.8-6.2-6.1-8.1s-14-8.2-18.1-7.8c-4.2.5-5.5-.4-6-1-.5-.5-2.2.3-2 2.5.4 2.1-3.1 6.9-1.9 9.1a63.5 63.5 0 0 0 8.5 11.7c1.2.3.4 5.3.4 5.3s5.3 5.4 6.7 5.7c1.3.3 2.7 1.2 2.5 2.5-.1 1.3-5.8 8.2-5.8 8.2s-6.1 3.2-6.2 5c0 1.8 1.5 5.6 6.3 6.8a45 45 0 0 0 18.6-1c.7-1 1.8-7.8 1.3-8.4-.4-.7-3.7-2.7-5.3-2.4-1.6.3-3.1 1.6-3 1.9.2.3-2.3 1.6-2.3.4s4.8-6.6 5.3-6.2c.5.5 7.3 1.2 8.6 4.6s1.3 5.9 4.9 5.5c3.5-.3 8.5-3.6 9-10.5.4-6.9-4-11.5-5.2-12.2-1-.6-4.8-2.9-5.1-4-.3-1-1-4.4-.5-5.2z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M350.4 279.3s11.6-3 14.6-3c3 .1 14.3 5.4 17.5 8.6 3.3 3.2 10 10.8 14.5 10.2 4.4-.7 5.6-1.6 5.6-1.6l-1.7 3.3s-3.6 1-5.4.5a19 19 0 0 1-8.8-5c-3.5-3.4-14.3-12.7-23.5-12-9.2.6-14.5 9.7-14.5 9.7s0-4.4.5-5.4c.3-1-2 2-2 2l3.2-7.3z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-width="1.1" d="M393 288.3c.1 0 3 .8 7.8.8s7.3-2.1 7.3-2.1l-.3-1.9.7-2.6s3.7 3.7 3.6 4.5c0 .7-1.5 1-1.5 1l-.5-1.8-1.3 1.6s-7 5.5-10.7 4.7c-3.8-.8-7.4-3.3-6.4-3.9s1.5-.4 1.4-.4zm-16.8 9.7s-4.2 0-6 .9c-2 .9-2.6 2-3.9 1.8-1.2-.1-2.2-1.8-1.8-2.4.5-1 3-2.4 7.7-2s4 1.7 4 1.7zm14.6 11.4c0-.2-.3-6.1-2.6-8.5a7 7 0 0 0-6.4-2.1c-1.3.3 4.7 2.9 5.3 4.6.6 1.7 2.5 6.5 2 7.7-.5 1.2-1.5-3.3-5.2-4.6s-8.7-.6-7.6 1 5.1.2 7.2 3.7 3.7 7.2 3.7 7.2l.6-2.5 2-.5.1-4.9 1-1.1z"/>
+  <path fill="#2b2b2b" fill-rule="evenodd" stroke="#2b2b2b" stroke-linejoin="round" stroke-width="1.1" d="M387.8 328.5l-3.8-7.6s-1.2-4.9-4.4-6.2c-3.2-1.4-7.5-1.1-7.5.5-.1 1.7 6.8 3.7 7.3 4.6.5 1 .2 2.4-.4 2.5-.6 0-3.6-1.1-5.2-.7-1.6.3-2.5 2.4-4.8 1.8-2.3-.6-4.2-8-3.4-8.8 1-.7-1.7 1.4-2.2-.6-.5-2 .8-8-.1-8.7s-5.3-3.4-5.3-4c-.1-.4.2-29.6 24.6-5.4-10.5-12.4-14.6-11-16.5-11.2-1.4 0-10.9.9-13.3 13-2.4 12-5.2 4.5-5.2 4.5s-.5 5.2 2 6.7-1.2 5.9-1.2 5.9-4.6-11.2-3.9-16c-.9 3.9-.8 13.5 5 24a78 78 0 0 0 29.9 21.1c8.9-13.6 8.4-15.2 8.4-15.4z"/>
+  <path fill="#8a9396" fill-rule="evenodd" stroke="#2b2b2b" stroke-linejoin="round" stroke-width="1.1" d="M371.9 328.6s4.9.6 6.2 3.1a24 24 0 0 1 2 6.4c.8-1.6 1.2-3 2.8-4.2s2.8-1.4 2.8-2.2c-.1-1-5.3-6.4-7.9-6.7-2.6-.3-7.1 2.8-7.1 2.8s-.9 1.2 1.2.8z"/>
+  <path fill="none" stroke="#8a9396" stroke-linecap="round" stroke-width="1.1" d="M383.1 341.4s12.8 5.9 33.8 6.2"/>
+  <path fill="none" stroke="#2b2b2b" stroke-linecap="round" stroke-width="1.1" d="M425.8 282.1s-1.1 10.7-9.4 32"/>
+  <path fill="none" stroke="#2b2b2b" stroke-width="1.1" d="M424.1 288.7s-2.5 7.7-9.3 13.5"/>
+</svg>

public/img/flags/gy.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-gy" viewBox="0 0 640 480">
+  <g fill-rule="evenodd">
+    <path fill="#399408" d="M2.4 0H640v480H2.4z"/>
+    <path fill="#fff" d="M.2 0c-.9 0 619.6 241.5 619.6 241.5L0 479.8.2 0z"/>
+    <path fill="#ffde08" d="M.3 20.2c3.4 0 559 217.9 555.9 220L1.9 463.2.3 20.3z"/>
+    <path d="M1.9.8c1.8 0 290.9 240.9 290.9 240.9L1.8 477V.8z"/>
+    <path fill="#de2110" d="M.3 33.9c1.6-15 260.9 208.4 260.9 208.4L.2 451.7V33.9z"/>
+  </g>
+</svg>

public/img/flags/hm.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-hm" viewBox="0 0 640 480">
+  <g stroke-width="1pt">
+    <path fill="#006" d="M0 0h640v480H0z"/>
+    <path fill="#fff" d="M0 0v30.6l372.6 243h46.9V243L46.9 0H0zm419.5 0v30.6l-372.6 243H0V243L372.6 0h46.9z"/>
+    <path fill="#fff" d="M174.8 0v273.6h69.9V0h-70zM0 91.2v91.2h419.5V91.2H0z"/>
+    <path fill="#c00" d="M0 109.4v54.8h419.5v-54.8H0zM188.8 0v273.6h42V0h-42zM0 273.6l139.8-91.2h31.3L31.3 273.6H0zM0 0l139.8 91.2h-31.2L0 20.4V0zm248.4 91.2L388.2 0h31.3L279.6 91.2h-31.2zm171 182.4l-139.7-91.2h31.2l108.6 70.8v20.4z"/>
+    <path fill="#fff" fill-rule="evenodd" d="M125.5 416.5L98 414l23.8-14-15.3-23 25.8 9.7 8.4-26.3 8.5 26.3L175 377l-15.3 23 23.7 14-27.5 2.5 3.8 27.3-19-20-19 20m370.5 1.9l-19.4-1.7 16.7-10-10.7-16 18.1 6.8 6-18.5 6 18.5 18-6.9-10.7 16.2L533 444l-19.3 1.7 2.7 19.2-13.4-14-13.4 14m2.7-307l-19.4-1.7 16.7-9.9-10.7-16.2 18.1 7 6-18.6 6 18.5 18-6.9-10.7 16.2 16.7 10-19.3 1.6 2.7 19.2-13.4-14-13.4 14m-105.2 97.7l-19.4-1.7 16.7-9.9-10.8-16.1 18.2 6.8 6-18.5 5.9 18.5 18.2-6.8-10.8 16.1 16.7 10-19.3 1.6 2.6 19.3L395 280l-13.4 14M588 246l-19.4-1.6 16.8-10-10.8-16.1 18.2 6.9 5.9-18.5 6 18.5 18-7-10.6 16.2 16.7 10-19.4 1.6 2.7 19.3-13.4-14.1-13.4 14M563 305.7l-9.5 8 3 12-10.6-6.5-10.5 6.6 3-12-9.6-8.1 12.4-1 4.7-11.4 4.7 11.5"/>
+  </g>
+</svg>

public/img/flags/ki.svg

@@ -0,0 +1,36 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-ki" viewBox="0 0 640 480">
+  <defs>
+    <clipPath id="a">
+      <path fill-opacity=".7" d="M-86.3 0h682.6v512H-86.3z"/>
+    </clipPath>
+  </defs>
+  <g clip-path="url(#a)" transform="translate(81) scale(.9375)">
+    <path fill="#e73e2d" fill-rule="evenodd" d="M-164.3 0h835.8v306.5h-835.8z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M204.3 282.1c-19.4-15.2-55.6-10-61.6-51.3 27.7 21.5 22.7-1.2 64 19.3l-2.4 32z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M209.5 263.4c-13.9-20.4-50-26.6-43-67.7 19.9 28.9 22 5.7 55.2 37.9l-12.2 29.8z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M215.8 250c-5-24.1-36-43.6-13.8-79 7.2 34.4 18 13.8 36.4 56.2L215.8 250z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M230.3 237.6c2.7-24.5-20.8-52.6 11.1-79.4-3.6 34.9 13 18.7 17.5 64.6l-28.6 14.8z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M243.3 227.7c12.4-21.3 2.5-56.5 42.6-67.9-17.6 30.3 4.2 22.3-10.5 66l-32.1 1.9z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M262 230.3c18.6-16.2 20.4-52.8 62-50.9-26.3 23.2-3 22.5-31 59.4l-31-8.5z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M278.6 239.9c22.5-10.1 34.9-44.5 74.1-30.5-32 14.5-9.5 20.7-47 47.7l-27.1-17.2z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M292.5 255c24.4-3.4 46-33 79.7-8.4-34.7 4.9-15 17.1-58.5 32.5l-21.2-24.2z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M379.5 259.6l-112.1 2.5 4.7 30.2 107.4-32.7z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M363 218.4l-103.8 39.9 17.3 33.3 86.5-73.2z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M280.6 280.7l53.7-97.6-82.4 76.7 28.7 20.9z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M279.5 272.6l17.2-109.4-53.8 97.2 36.6 12.2z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M273 263.7l-18-110.2-20 110.7 38-.5z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M263.7 254.3l-52.3-92 20 111.8 32.3-19.8z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M255.6 253.6l-81.1-68.5 57.6 98 23.5-29.5z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M146 218.9l87 71.9 13.4-37.6L146 218.9z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M232.1 260.9l-102.3-1.5 101.9 34 .4-32.5z"/>
+    <path fill="#fec74a" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M315.1 279.2a61.4 61.4 0 1 1-122.7 0 61.4 61.4 0 0 1 122.7 0z"/>
+    <path fill="#005989" fill-rule="evenodd" d="M-165.1 303.4h839.9V512h-840z"/>
+    <path fill="#fff" fill-rule="evenodd" d="M-165.6 454c15.6 7.2 38 25.3 62 25.3 40-.3 41-27.4 81.6-26.1 40.7 1 33.3 29.6 88.2 29.5 45.4-.2 60-34.7 99.2-30.6 29-1.5 40.8 32.7 85.3 33.2 46.2 1 63.1-37.3 92-34.1 31 0 41 30.8 84.3 31 55.2.3 64.9-32 99.3-30 24.6-.5 44 23.7 80 24.3 28.6.5 52.7-21.2 69-29l.7-36.8c-17 6.3-42.4 27.1-67.7 27.3-36.6 1.4-59.1-24-84.5-23.7-30.4.3-42.5 31.3-94 31.3-47.2 0-58-31.3-88.4-31.3-29.7.2-38.8 34-90.3 33.4-42-.5-58.3-32.3-88-32-31.5 0-64 30.9-99 29.4-48-2-58.5-29.4-90-29.4-23.5 0-49 25.6-77.3 26-28.2.5-59.9-25.5-62.8-26l.4 38.3zm0-73c15.6 7.3 38 25.4 62 25.4 40-.3 41-27.4 81.6-26.2 40.7 1 33.3 29.7 88.2 29.5 45.4 0 60-34.6 99.2-30.5 29-1.5 40.8 32.7 85.3 33.1 46.2 1 63.1-37.2 92-34 31 0 41 30.8 84.3 31 55.2.3 64.9-32 99.3-30 24.6-.5 44 23.7 80 24.3 28.6.5 52.7-21.2 69-29l.7-36.8c-17 6.3-42.4 27-67.7 27.3-36.6 1.3-59.1-24-84.5-23.7-30.4.3-42.5 31.3-94 31.3-47.2 0-58-31.3-88.4-31.3-29.7.2-38.8 34-90.3 33.4-42-.5-58.3-32.3-88-32-31.5 0-64 30.8-99 29.3-48-2-58.5-29.4-90-29.4-23.5 0-49 25.7-77.3 26.1-28.2.4-59.9-25.5-62.8-26l.4 38.3z"/>
+    <path fill="#fff" fill-rule="evenodd" d="M-165.6 309c15.6 7.2 38 25.2 61.9 25.2 40-.2 41-27.4 81.6-26.1 40.6 1 33.2 29.6 88.1 29.5 45.3-.1 60-34.7 99-30.5 29-1.5 40.8 32.7 85.3 33.1 46.1 1 63-37.3 92-34.1 30.8 0 41 30.8 84.2 31 55 .3 64.7-32 99.2-30 24.5-.5 43.9 23.7 79.8 24.3 28.7.5 52.7-21.2 69-29l.7-36.8c-17 6.4-42.3 27.1-67.7 27.3-36.4 1.4-59-23.9-84.4-23.7-30.3.3-42.4 31.3-94 31.3-47 0-57.8-31.3-88.2-31.3-29.7.3-38.8 34-90.1 33.4-42-.5-58.3-32.2-88-32-31.5 0-64 30.9-98.8 29.4-48.1-2-58.5-29.4-90-29.4-23.5 0-48.9 25.6-77.2 26-28.2.5-59.8-25.4-62.8-26l.4 38.3z"/>
+    <path fill="#ffc84b" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.8" d="M136.8 76c61-4.2 50-9.4 74.5-13.4 31 4.3 34.5 23 51.8 34.5 0 0-6.5 22-27.7 18.9-2.9-8.8 10.2-11.6-27.5-34.6-22-1.3-61.3 3.9-71-5.4zm189.3 33.9l-44 1.8v10.9c29.7 1 35-3 44-12.7z"/>
+    <path fill="#ffc84b" fill-rule="evenodd" stroke="#d8aa3f" stroke-linejoin="round" stroke-width="1.7" d="M174.8 108c7.7-3.9 11.5-2.3 18.2-2.5 4.5 8.3 8.8 9 18.8 10a49.5 49.5 0 0 0 39.9 21.8c29.9-.8 39.4-21.7 59.5-24h21.2c-3.5-6-6.3-9.5-14-9.9-15.8-.8-36.2-.4-54 3.6l-25.1 6.3c-7.4-3.6-25.3-22.4-36.8-22-6.7 1.8-6.7 4.1-10 6.7-6.5 2.8-13 1.4-17.7 10z"/>
+    <path fill="#ffc84b" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.7" d="M205.1 99a3.2 3.2 0 1 1-6.3 0 3.2 3.2 0 0 1 6.3 0z"/>
+    <path fill="#ffc84b" fill-rule="evenodd" stroke="#d8aa3f" stroke-width="1.8" d="M225.6 107.8c44.9-54.1 84.1-47.5 135.3-51.2 1.7 6.3 1 15.7-23.3 24-33.4 5-93.1 40.2-93.4 40.2-11.1-.6-18.9-12.2-18.6-13z"/>
+    <path fill="none" stroke="#d9a43e" stroke-linecap="round" stroke-width="1.8" d="M317.9 72.5L351 74m-36.7 4l24.1 2"/>
+  </g>
+</svg>

public/img/flags/mf.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-mf" viewBox="0 0 640 480">
+  <g fill-rule="evenodd" stroke-width="1pt">
+    <path fill="#fff" d="M0 0h640v480H0z"/>
+    <path fill="#00267f" d="M0 0h213.3v480H0z"/>
+    <path fill="#f31830" d="M426.7 0H640v480H426.7z"/>
+  </g>
+</svg>

public/img/flags/nc.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-nc" viewBox="0 0 640 480">
+  <g fill-rule="evenodd" stroke-width="1pt">
+    <path fill="#fff" d="M0 0h640v480H0z"/>
+    <path fill="#00267f" d="M0 0h213.3v480H0z"/>
+    <path fill="#f31830" d="M426.7 0H640v480H426.7z"/>
+  </g>
+</svg>

public/img/flags/pm.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" id="flag-icon-css-pm" viewBox="0 0 640 480">
+  <g fill-rule="evenodd" stroke-width="1pt">
+    <path fill="#fff" d="M0 0h640v480H0z"/>
+    <path fill="#00267f" d="M0 0h213.3v480H0z"/>
+    <path fill="#f31830" d="M426.7 0H640v480H426.7z"/>
+  </g>
+</svg>