Added 'independent' property for network-like channels. Changed release tile design. Adding Brazzers timeline events as tags. Added Property Sex to MindGeek. Changed DP, DAP and DVP tag slugs. Changed Porn Pros logo. Added better BAM Visions and Mug Fucked logos.

assets/components/entities/children.vue

@@ -31,6 +31,7 @@ export default {
 	display: flex;
 	box-sizing: border-box;
 	padding: 1rem;
+	margin: 0 1rem 0 0;
 	border-bottom: solid 1px var(--darken-hint);
 	overflow-x: auto;
 	scroll-behavior: smooth;
@@ -45,6 +46,7 @@ export default {
 		display: grid;
 		grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
 		grid-gap: 1rem;
+		margin: 0;
 
 		.tile {
 			width: 100%;

assets/components/entities/entity.vue

@@ -18,7 +18,7 @@
 					>
 
 					<img
-						v-else-if="entity.parent"
+						v-else-if="entity.parent && !entity.independent"
 						class="logo logo-child"
 						:src="`/img/logos/${entity.parent.slug}/thumbs/${entity.slug}.png`"
 					>
@@ -60,16 +60,14 @@
 		>
 			<Scroll
 				v-if="entity.children.length > 0"
+				:expanded="expanded"
 				class="scroll-dark"
+				@expand="(state) => expanded = state"
 			>
-				<Children :entity="entity" />
+				<Children
-
+					:entity="entity"
-				<template v-slot:expanded>
+					:class="{ expanded }"
-					<Children
+				/>
-						class="expanded"
-						:entity="entity"
-					/>
-				</template>
 			</Scroll>
 
 			<FilterBar
@@ -140,6 +138,7 @@ export default {
 			entity: null,
 			totalCount: null,
 			limit: 20,
+			expanded: false,
 		};
 	},
 	watch: {

assets/components/header/filter-bar.vue

@@ -157,7 +157,7 @@ export default {
 			background: var(--background-soft);
 			position: absolute;
 			left: 0;
-			bottom: -1px;
+			bottom: -2px;
 		}
     }
 }

assets/components/networks/networks.vue

@@ -56,11 +56,7 @@ async function searchEntities() {
 async function mounted() {
 	this.entities = await this.$store.dispatch('fetchEntities', {
 		type: 'network',
-		entitySlugs: [
+		entitySlugs: [],
-			'bamvisions',
-			'evilangel',
-			'legalporno',
-		],
 	});
 
 	this.pageTitle = 'Networks';
@@ -143,7 +139,7 @@ export default {
 
 .entity-tiles {
     display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
     grid-gap: 1rem;
     padding: 1rem 0;
 }

assets/components/pagination/pagination.vue

@@ -103,15 +103,17 @@ export default {
 
 .pagination-button {
 	width: 2.5rem;
-	height: 2rem;
+	height: 2.5rem;
 	display: inline-flex;
 	flex-shrink: 0;
 	align-items: center;
 	justify-content: center;
+	background: var(--background);
 	color: var(--shadow);
 	font-size: 1rem;
 	font-weight: bold;
 	text-decoration: none;
+	box-shadow: 0 0 3px var(--shadow-hint);
 
 	.icon {
 		width: .8rem;
@@ -121,10 +123,10 @@ export default {
 	}
 
 	&:hover:not(.active):not(.disabled) {
-		color: var(--text);
+		color: var(--shadow-strong);
 
 		.icon {
-			fill: var(--text);
+			fill: var(--shadow-strong);
 		}
 	}
 
@@ -147,7 +149,7 @@ export default {
 }
 
 .cursors {
-	margin: 0 .5rem;
+	margin: 0 .75rem;
 	font-size: 0;
 }
 </style>

assets/components/releases/media.vue

@@ -119,6 +119,10 @@ export default {
 			type: Object,
 			default: null,
 		},
+		expanded: {
+			type: Boolean,
+			default: false,
+		},
 	},
 	data() {
 		return {
@@ -147,12 +151,12 @@ export default {
 
 	&.expanded {
 		display: flex;
+		justify-content: center;
 		flex-wrap: wrap;
 
 		.item-link,
 		.trailer {
-			margin: 0 .5rem .5rem 0;
+			margin: 0 0 .5rem 0;
-			max-width: 100%;
 			height: 18rem;
 			flex: 1;
 		}
@@ -200,7 +204,6 @@ export default {
     display: inline-flex;
     align-items: center;
     justify-content: center;
-	box-shadow: 0 0 3px var(--shadow-weak);
 
     .warning {
         display: none;
@@ -238,6 +241,7 @@ export default {
     height: 18rem;
     vertical-align: middle;
 	object-fit: cover;
+	box-shadow: 0 0 3px var(--shadow);
 }
 
 .trailer-container {
@@ -247,7 +251,7 @@ export default {
 }
 
 .trailer {
-	max-width: 100%;
+	width: 100%;
 	max-height: 100%;
 	object-fit: cover;
 

assets/components/releases/release.vue

@@ -86,7 +86,7 @@
 		</div>
 
 		<Expand
-			v-if="release.photos.length > 0 || release.trailer || release.teaser"
+			v-if="release.photos.length > 0"
 			class="expand-bottom"
 			:expanded="expanded"
 			@expand="(state) => expanded = state"
@@ -97,13 +97,6 @@
 				<h2 class="title">{{ release.title }}</h2>
 			</div>
 
-			<div
-				v-if="release.description"
-				class="row"
-			>
-				<p class="description">{{ release.description }}</p>
-			</div>
-
 			<div
 				v-if="release.tags.length > 0"
 				class="row"
@@ -155,42 +148,52 @@
 			</div>
 
 			<div
-				v-if="release.duration"
+				v-if="release.description"
 				class="row"
 			>
-				<span class="row-label">Duration</span>
+				<span class="row-label">Description</span>
+				<p class="description">{{ release.description }}</p>
+			</div>
 
-				<div class="duration">
+			<div class="row row-tidbits">
-					<span
+				<div
-						v-if="release.duration >= 3600"
+					v-if="release.duration"
-						class="duration-segment"
+					class="row-tidbit"
-					>{{ Math.floor(release.duration / 3600).toString().padStart(2, '0') }}:</span>
+				>
-					<span class="duration-segment">{{ Math.floor((release.duration % 3600) / 60).toString().padStart(2, '0') }}:</span>
+					<span class="row-label">Duration</span>
-					<span class="duration-segment">{{ (release.duration % 60).toString().padStart(2, '0') }}</span>
+
+					<div class="duration">
+						<span
+							v-if="release.duration >= 3600"
+							class="duration-segment"
+						>{{ Math.floor(release.duration / 3600).toString().padStart(2, '0') }}:</span>
+						<span class="duration-segment">{{ Math.floor((release.duration % 3600) / 60).toString().padStart(2, '0') }}:</span>
+						<span class="duration-segment">{{ (release.duration % 60).toString().padStart(2, '0') }}</span>
+					</div>
+				</div>
+
+				<div
+					v-if="release.shootId"
+					class="row-tidbit"
+				>
+					<span class="row-label">Shoot #</span>
+					{{ release.shootId }}
+				</div>
+
+				<div
+					v-if="release.studio"
+					class="row-tidbit"
+				>
+					<span class="row-label">Studio</span>
+
+					<router-link
+						:to="`/studio/${release.studio.slug}`"
+						class="link studio"
+					>{{ release.studio.name }}</router-link>
 				</div>
 			</div>
 
-			<div
+			<div class="row">
-				v-if="release.studio"
-				class="row"
-			>
-				<span class="row-label">Studio</span>
-
-				<router-link
-					:to="`/studio/${release.studio.slug}`"
-					class="link studio"
-				>{{ release.studio.name }}</router-link>
-			</div>
-
-			<div
-				v-if="release.shootId"
-				class="row"
-			>
-				<span class="row-label">Shoot #</span>
-				{{ release.shootId }}
-			</div>
-
-			<span class="row">
 				<span class="row-label">Added</span>
 
 				<router-link
@@ -198,7 +201,7 @@
 					:title="`Added on ${formatDate(release.dateAdded, 'MMMM D, YYYY')}`"
 					class="link added"
 				>{{ formatDate(release.createdAt, 'MMMM D, YYYY HH:mm') }}</router-link>
-			</span>
+			</div>
 		</div>
 	</div>
 </template>
@@ -345,13 +348,6 @@ export default {
     &.associations {
         align-items: start;
     }
-
-    .icon {
-        display: inline-block;
-        width: 1rem;
-        fill: var(--shadow-strong);
-        margin: 0 1rem 0 0;
-    }
 }
 
 .row-label {
@@ -366,6 +362,11 @@ export default {
 	}
 }
 
+.row-tidbit {
+	display: inline-block;
+	margin: 0 1rem 0 0;
+}
+
 .title {
 	margin: 0;
 }

assets/components/releases/tile-details.vue

@@ -0,0 +1,122 @@
+<template>
+	<span
+		class="details"
+		:class="{ new: release.isNew }"
+	>
+		<span
+			v-if="release.entity.type !== 'network' && !release.entity.independent && release.entity.parent"
+			class="site"
+		>
+			<router-link
+				v-tooltip.bottom="`Part of ${release.entity.parent.name}`"
+				:title="`Part of ${release.entity.parent.name}`"
+				:to="`/${release.entity.parent.type}/${release.entity.parent.slug}`"
+				class="site-link"
+			><img
+				:src="`/img/logos/${release.entity.parent.slug}/favicon.png`"
+				class="favicon"
+			></router-link>
+
+			<router-link
+				v-tooltip.bottom="`More from ${release.entity.name}`"
+				:title="`More from ${release.entity.name}`"
+				:to="`/${release.entity.type}/${release.entity.slug}`"
+				class="site-link"
+			>{{ release.entity.name }}</router-link>
+		</span>
+
+		<router-link
+			v-else
+			:to="`/${release.entity.type}/${release.entity.slug}`"
+			class="site site-link"
+		><img
+			:src="`/img/logos/${release.entity.slug}/favicon.png`"
+			class="favicon"
+		>{{ release.entity.name }}</router-link>
+
+		<a
+			v-if="release.date"
+			v-tooltip.bottom="release.url && `View scene on ${release.entity.name}`"
+			:title="release.url && `View scene on ${release.entity.name}`"
+			:href="release.url"
+			:class="{ upcoming: isAfter(release.date, new Date()) }"
+			target="_blank"
+			rel="noopener noreferrer"
+			class="date"
+		>{{ formatDate(release.date, 'MMM D, YYYY') }}</a>
+
+		<a
+			v-else
+			:href="release.url"
+			:class="{ upcoming: isAfter(release.date, new Date()), new: release.isNew }"
+			title="Scene date N/A, showing date added"
+			target="_blank"
+			rel="noopener noreferrer"
+			class="date"
+		>{{ `(${formatDate(release.dateAdded, 'MMM D, YYYY')})` }}</a>
+	</span>
+</template>
+
+<script>
+export default {
+	props: {
+		release: {
+			type: Object,
+			default: null,
+		},
+	},
+};
+</script>
+
+<style lang="scss" scoped>
+.details {
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+    background: var(--profile);
+    font-size: 0;
+	font-weight: bold;
+	box-shadow: 0 0 3px var(--darken);
+
+    .favicon {
+        height: 1rem;
+        margin: 0 .25rem 0 0;
+    }
+
+	&.new {
+		border-right: solid 5px var(--primary);
+	}
+}
+
+.site,
+.date {
+    display: flex;
+    align-items: center;
+    position: relative;
+    font-size: .8rem;
+    padding: .5rem;
+    color: var(--text-light);
+    text-decoration: none;
+}
+
+/*
+.date {
+    &.new:before {
+        content: '';
+        background: var(--primary);
+        width: .5rem;
+        display: inline-block;
+        position: absolute;
+        top: 0;
+        bottom: 0;
+        left: -.5rem;
+    }
+}
+*/
+
+.site-link {
+    display: flex;
+    color: var(--text-light);
+    text-decoration: none;
+}
+</style>

assets/components/releases/tile.vue

@@ -5,60 +5,6 @@
 		class="tile"
 	>
 		<span class="poster">
-			<span class="details">
-				<span
-					v-if="release.entity.type !== 'network' && release.entity.parent"
-					class="site"
-				>
-					<router-link
-						v-tooltip.bottom="`Part of ${release.entity.parent.name}`"
-						:title="`Part of ${release.entity.parent.name}`"
-						:to="`/${release.entity.parent.type}/${release.entity.parent.slug}`"
-						class="site-link"
-					><img
-						:src="`/img/logos/${release.entity.parent.slug}/favicon.png`"
-						class="favicon"
-					></router-link>
-
-					<router-link
-						v-tooltip.bottom="`More from ${release.entity.name}`"
-						:title="`More from ${release.entity.name}`"
-						:to="`/${release.entity.type}/${release.entity.slug}`"
-						class="site-link"
-					>{{ release.entity.name }}</router-link>
-				</span>
-
-				<router-link
-					v-else
-					:to="`/${release.entity.type}/${release.entity.slug}`"
-					class="site site-link"
-				><img
-					:src="`/img/logos/${release.entity.slug}/favicon.png`"
-					class="favicon"
-				>{{ release.entity.name }}</router-link>
-
-				<a
-					v-if="release.date"
-					v-tooltip.bottom="release.url && `View scene on ${release.entity.name}`"
-					:title="release.url && `View scene on ${release.entity.name}`"
-					:href="release.url"
-					:class="{ upcoming: isAfter(release.date, new Date()), new: release.isNew }"
-					target="_blank"
-					rel="noopener noreferrer"
-					class="date"
-				>{{ formatDate(release.date, 'MMM D, YYYY') }}</a>
-
-				<a
-					v-else
-					:href="release.url"
-					:class="{ upcoming: isAfter(release.date, new Date()), new: release.isNew }"
-					title="Scene date N/A, showing date added"
-					target="_blank"
-					rel="noopener noreferrer"
-					class="date"
-				>{{ `(${formatDate(release.dateAdded, 'MMM D, YYYY')})` }}</a>
-			</span>
-
 			<a
 				:href="`/${release.type || 'scene'}/${release.id}/${release.slug}`"
 				target="_blank"
@@ -95,6 +41,8 @@
 			</a>
 		</span>
 
+		<Details :release="release" />
+
 		<div class="info">
 			<a
 				:href="`/${release.type || 'scene'}/${release.id}/${release.slug}`"
@@ -106,16 +54,14 @@
 					v-tooltip.top="release.title"
 					:title="release.title"
 					class="title"
-				>
+				>{{ release.title }}</h3>
-					<Icon
-						v-if="release.type === 'movie'"
-						icon="film"
-					/>{{ release.title }}
-				</h3>
 			</a>
 
 			<span class="row">
-				<ul class="actors nolist">
+				<ul
+					class="actors nolist"
+					:title="release.actors.map(actor => actor.name).join(', ')"
+				>
 					<li
 						v-for="actor in release.actors"
 						:key="actor.id"
@@ -129,41 +75,50 @@
 				</ul>
 			</span>
 
-			<ul
+			<div class="labels">
-				v-if="release.tags.length > 0"
+				<span
-				:title="release.tags.map(tag => tag.name).join(', ')"
+					v-if="release.shootId"
-				class="tags nolist"
+					:title="release.studio && release.studio.name"
-			>
+					class="shoot"
-				<li
+				>{{ release.shootId }}</span>
-					v-for="tag in release.tags"
+
-					:key="`tag-${tag.slug}`"
+				<ul
-					class="tag"
+					v-if="release.tags.length > 0"
+					:title="release.tags.map(tag => tag.name).join(', ')"
+					class="tags nolist"
 				>
-					<router-link
+					<li
-						:to="`/tag/${tag.slug}`"
+						v-for="tag in release.tags"
-						class="tag-link"
+						:key="`tag-${tag.slug}`"
-					>{{ tag.name }}</router-link>
+						class="tag"
-				</li>
+					>
-			</ul>
+						<router-link
+							:to="`/tag/${tag.slug}`"
+							class="tag-link"
+						>{{ tag.name }}</router-link>
+					</li>
+				</ul>
+			</div>
 		</div>
 	</div>
 </template>
 
 <script>
+import Details from './tile-details.vue';
+
 function sfw() {
 	return this.$store.state.ui.sfw;
 }
 
 export default {
+	components: {
+		Details,
+	},
 	props: {
 		release: {
 			type: Object,
 			default: null,
 		},
-		referer: {
-			type: String,
-			default: null,
-		},
 	},
 	computed: {
 		sfw,
@@ -187,7 +142,6 @@ export default {
 
 .poster {
     position: relative;
-    margin: 0 0 .5rem 0;
 }
 
 .covers {
@@ -213,6 +167,10 @@ export default {
     text-shadow: 1px 1px 0 var(--highlight);
 }
 
+.details {
+    margin: 0 0 .6rem 0;
+}
+
 .row {
     display: flex;
     justify-content: space-between;
@@ -222,54 +180,6 @@ export default {
     margin: 0 0 .25rem 0;
 }
 
-.details {
-    width: 100%;
-    display: flex;
-    justify-content: space-between;
-    position: absolute;
-    font-size: 0;
-
-    .favicon {
-        height: 1rem;
-        margin: 0 .25rem 0 0;
-    }
-}
-
-.site,
-.date {
-    color: var(--text-light);
-    display: flex;
-    align-items: center;
-    background: var(--darken);
-    position: relative;
-    font-size: .8rem;
-    padding: .25rem;
-    text-decoration: none;
-}
-
-.date {
-    &.new:before {
-        content: '';
-        background: var(--primary);
-        width: .5rem;
-        display: inline-block;
-        position: absolute;
-        top: 0;
-        bottom: 0;
-        left: -.5rem;
-    }
-}
-
-.site {
-    font-weight: bold;
-}
-
-.site-link {
-    display: flex;
-    color: var(--text-light);
-    text-decoration: none;
-}
-
 .info {
     display: flex;
     flex-direction: column;
@@ -288,10 +198,6 @@ export default {
     line-height: 1.5;
     text-overflow: ellipsis;
     overflow: hidden;
-
-    .icon {
-        margin: 0 .25rem 0 0;
-    }
 }
 
 .network {
@@ -303,30 +209,18 @@ export default {
 .actors {
     word-wrap: break-word;
     overflow: hidden;
-    max-height: 2.75rem;
+    max-height: 1.5rem;
     line-height: 1.5rem;
-}
+	margin: 0 0 .25rem 0;
-
-.tags {
-    max-height: .5rem;
-    padding: .25rem .5rem 1rem .5rem;
-    word-wrap: break-word;
-    overflow-y: hidden;
-}
-
-.actor {
-    margin: 0 .25rem 0 0;
-}
-
-.tag {
-    margin: 0 .25rem .25rem 0;
 }
 
 .actor:not(:last-of-type)::after {
     content: ",";
+	margin: 0 .25rem 0 0;
 }
 
 .actor-link {
+    color: var(--link);
     text-decoration: none;
 
     &:hover {
@@ -334,8 +228,28 @@ export default {
     }
 }
 
-.actor-link {
+.labels {
-    color: var(--link);
+    padding: .25rem .5rem 1rem .5rem;
+    max-height: .5rem;
+    overflow-y: hidden;
+}
+
+.shoot {
+	display: inline;
+	padding: .25rem;
+	background: var(--shadow-hint);
+	color: var(--shadow);
+	font-size: 0.8rem;
+	font-weight: bold;
+}
+
+.tags {
+	display: inline;
+    word-wrap: break-word;
+}
+
+.tag {
+    margin: 0 .25rem .25rem 0;
 }
 
 .tag-link {

assets/components/scroll/scroll.vue

@@ -242,12 +242,12 @@ export default {
 
 .scroll-left {
 	left: 0;
-	padding: 1rem 2rem 1rem 1rem;
+	padding: 1rem 2rem 1rem .5rem;
 }
 
 .scroll-right {
 	right: 0;
-	padding: 1rem 1rem 1rem 2rem;
+	padding: 1rem .5rem 1rem 2rem;
 }
 
 @media(max-width: $breakpoint) {

assets/components/tags/tags.vue

@@ -42,7 +42,7 @@ async function mounted() {
 			'blowjob',
 			'orgy',
 			'gangbang',
-			'double-penetration',
+			'dp',
 			'facial',
 			'creampie',
 			'squirting',
@@ -72,11 +72,11 @@ async function mounted() {
 		],
 		extreme: [
 			'airtight',
-			'double-anal',
+			'dap',
-			'double-vaginal',
+			'dvp',
 			'da-tp',
 			'dv-tp',
-			'triple-anal',
+			'tap',
 		],
 		cumshot: [
 			'facial',

assets/js/entities/actions.js

@@ -32,6 +32,7 @@ function initEntitiesActions(store, _router) {
                     name
                     slug
                     url
+					independent
 					hasLogo
 					children: childEntitiesConnection(
                         orderBy: [PRIORITY_DESC, NAME_ASC],
@@ -52,6 +53,7 @@ function initEntitiesActions(store, _router) {
                         slug
 						type
                         url
+						independent
 						hasLogo
                     }
                 }
@@ -138,7 +140,6 @@ function initEntitiesActions(store, _router) {
 	async function fetchEntities({ _commit }, { type, entitySlugs }) {
 		const { entities } = await graphql(`
             query Entities(
-				$type: String! = "network"
 				$entitySlugs: [String!] = []
 			) {
 				entities(
@@ -147,9 +148,20 @@ function initEntitiesActions(store, _router) {
 						or: [
 							{
 								type: {
-									equalTo: $type
+									equalTo: "network"
 								}
 							}
+							{
+								independent: {
+									equalTo: true
+								}
+							}
+							{
+								type: {
+									equalTo: "channel"
+								}
+								parentExists: false
+							}
 							{
 								slug: {
 									in: $entitySlugs

assets/js/fragments.js

@@ -5,12 +5,14 @@ const siteFragment = `
       slug
       url
 	  type
+	  independent
       parent {
         id
         name
         slug
         url
 		type
+	    independent
       }
     }
 `;
@@ -22,12 +24,14 @@ const sitesFragment = `
       slug
       url
 	  type
+	  independent
       parent {
         id
         name
         slug
         url
 		type
+		independent
       }
     }
 `;
@@ -167,6 +171,7 @@ const releaseFields = `
     date
     slug
     type
+	shootId
     createdAt
     url
     ${releaseActorsFragment}

migrations/20190325001339_releases.js

@@ -183,6 +183,9 @@ exports.up = knex => Promise.resolve()
 		table.integer('priority', 3)
 			.defaultTo(0);
 
+		table.boolean('independent')
+			.defaultTo(false);
+
 		table.boolean('has_logo')
 			.defaultTo(true);