Upgraded dependencies, bumped to Node 24.
This commit is contained in:
@@ -1,3 +1,28 @@
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
|
||||
import getPath from '#/src/get-path.js';
|
||||
import { formatDate, formatDuration } from '#/utils/format.js';
|
||||
|
||||
const props = defineProps({
|
||||
chapters: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const lastChapter = props.chapters.at(-1);
|
||||
const duration = lastChapter.time + lastChapter.duration;
|
||||
|
||||
const timeline = computed(() => {
|
||||
if (props.chapters.every((chapter) => chapter.time)) {
|
||||
return props.chapters.filter((chapter) => chapter.tags?.length > 0);
|
||||
}
|
||||
|
||||
return null;
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
v-if="timeline"
|
||||
@@ -43,19 +68,19 @@
|
||||
<span class="chapter-details">
|
||||
<span
|
||||
v-if="typeof chapter.time === 'number'"
|
||||
v-tooltip="'Time in video'"
|
||||
v-tooltip="{ content: 'Time in video', ariaId: `chapter-time-${chapter.id}` }"
|
||||
class="chapter-time"
|
||||
><Icon icon="film3" /> {{ formatDuration(chapter.time) }}</span>
|
||||
|
||||
<span
|
||||
v-if="chapter.duration"
|
||||
v-tooltip="'Duration'"
|
||||
v-tooltip="{ content: 'Duration', ariaId: `chapter-duration-${chapter.id}` }"
|
||||
class="chapter-duration"
|
||||
><Icon icon="stopwatch" />{{ formatDuration(chapter.duration) }}</span>
|
||||
|
||||
<time
|
||||
v-if="chapter.date"
|
||||
v-tooltip="formatDate(chapter.date, 'yyyy-MM-dd hh:mm')"
|
||||
v-tooltip="{ content: formatDate(chapter.date, 'yyyy-MM-dd hh:mm'), ariaId: `chapter-date-${chapter.id}` }"
|
||||
:datetime="chapter.date"
|
||||
class="chapter-date"
|
||||
>{{ formatDate(chapter.date, 'MMM d') }}</time>
|
||||
@@ -90,31 +115,6 @@
|
||||
</ul>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed } from 'vue';
|
||||
|
||||
import getPath from '#/src/get-path.js';
|
||||
import { formatDuration, formatDate } from '#/utils/format.js';
|
||||
|
||||
const props = defineProps({
|
||||
chapters: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
},
|
||||
});
|
||||
|
||||
const lastChapter = props.chapters.at(-1);
|
||||
const duration = lastChapter.time + lastChapter.duration;
|
||||
|
||||
const timeline = computed(() => {
|
||||
if (props.chapters.every((chapter) => chapter.time)) {
|
||||
return props.chapters.filter((chapter) => chapter.tags?.length > 0);
|
||||
}
|
||||
|
||||
return null;
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.chapters {
|
||||
display: grid;
|
||||
|
||||
@@ -1,3 +1,18 @@
|
||||
<script setup>
|
||||
import { format } from 'date-fns';
|
||||
|
||||
defineProps({
|
||||
scene: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
user: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="meta">
|
||||
<div class="channel">
|
||||
@@ -44,21 +59,6 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { format } from 'date-fns';
|
||||
|
||||
defineProps({
|
||||
scene: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
user: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.meta {
|
||||
display: flex;
|
||||
|
||||
@@ -1,3 +1,195 @@
|
||||
<script setup>
|
||||
import Cookies from 'js-cookie';
|
||||
|
||||
import { parse } from 'path-to-regexp';
|
||||
import {
|
||||
computed,
|
||||
inject,
|
||||
ref,
|
||||
} from 'vue';
|
||||
|
||||
import Campaign from '#/components/campaigns/campaign.vue';
|
||||
import ActorsFilter from '#/components/filters/actors.vue';
|
||||
import ChannelsFilter from '#/components/filters/channels.vue';
|
||||
import Filters from '#/components/filters/filters.vue';
|
||||
|
||||
import TagsFilter from '#/components/filters/tags.vue';
|
||||
import YearsFilter from '#/components/filters/years.vue';
|
||||
import Ellipsis from '#/components/loading/ellipsis.vue';
|
||||
import Pagination from '#/components/pagination/pagination.vue';
|
||||
import SceneTile from '#/components/scenes/tile.vue';
|
||||
import { get } from '#/src/api.js';
|
||||
// import events from '#/src/events.js';
|
||||
import entityPrefixes from '#/src/entities-prefixes.js';
|
||||
import navigate from '#/src/navigate.js';
|
||||
import { getActorIdentifier, parseActorIdentifier } from '#/src/query.js';
|
||||
|
||||
const props = defineProps({
|
||||
showFilters: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showMeta: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showScopeTabs: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
defaultScope: {
|
||||
type: String,
|
||||
default: 'latest',
|
||||
},
|
||||
});
|
||||
|
||||
const {
|
||||
pageProps,
|
||||
routeParams,
|
||||
urlParsed,
|
||||
campaigns,
|
||||
env,
|
||||
} = inject('pageContext');
|
||||
|
||||
const {
|
||||
actor: pageActor,
|
||||
tag: pageTag,
|
||||
entity: pageEntity,
|
||||
stash: pageStash,
|
||||
} = pageProps;
|
||||
|
||||
const scenes = ref(pageProps.scenes);
|
||||
const aggYears = ref(pageProps.aggYears || []);
|
||||
const aggActors = ref(pageProps.aggActors || []);
|
||||
const aggTags = ref(pageProps.aggTags || []);
|
||||
const aggActorTags = ref(pageProps.aggActorTags || []);
|
||||
const aggChannels = ref(pageProps.aggChannels || []);
|
||||
|
||||
const currentPage = ref(Number(routeParams.page));
|
||||
const scope = ref(routeParams.scope || props.defaultScope);
|
||||
const total = ref(Number(pageProps.sceneTotal || pageProps.total));
|
||||
const loading = ref(false);
|
||||
const scenesContainer = ref(null);
|
||||
|
||||
const view = ref(env.scenesView || 'grid');
|
||||
|
||||
const actorIds = urlParsed.search.actors?.split(',').map((identifier) => parseActorIdentifier(identifier)?.id).filter(Boolean) || [];
|
||||
const queryActors = actorIds.map((urlActorId) => aggActors.value.find((aggActor) => aggActor.id === urlActorId)).filter(Boolean);
|
||||
|
||||
const networks = Object.fromEntries(aggChannels.value.map((channel) => (channel.type === 'network' ? channel : channel.parent)).filter(Boolean).map((parent) => [`_${parent.slug}`, parent]));
|
||||
const channels = Object.fromEntries(aggChannels.value.filter((channel) => channel.type === 'channel').map((channel) => [channel.slug, channel]));
|
||||
|
||||
const queryEntity = networks[urlParsed.search.e] || channels[urlParsed.search.e];
|
||||
|
||||
const filters = ref({
|
||||
search: urlParsed.search.q,
|
||||
years: urlParsed.search.years?.split(',').filter(Boolean).map(Number) || [],
|
||||
tags: urlParsed.search.tags?.split(',').filter(Boolean) || [],
|
||||
onlyActorTags: Object.hasOwn(urlParsed.search, 'at'),
|
||||
entity: queryEntity,
|
||||
actors: queryActors,
|
||||
});
|
||||
|
||||
const sceneCampaign = campaigns?.scenes;
|
||||
const campaignIndex = campaigns?.index;
|
||||
|
||||
const campaignScenes = computed(() => scenes.value.flatMap((scene, index) => (sceneCampaign && index === campaignIndex ? ['campaign', scene] : scene)));
|
||||
|
||||
function getPath(targetScope, preserveQuery) {
|
||||
const path = parse(routeParams.path).map((segment) => {
|
||||
if (segment.name === 'scope') {
|
||||
return `${segment.prefix}${targetScope}`;
|
||||
}
|
||||
|
||||
if (segment.name === 'page') {
|
||||
return `${segment.prefix}${1}`;
|
||||
}
|
||||
|
||||
return `${segment.prefix || ''}${routeParams[segment.name] || segment}`;
|
||||
}).join('');
|
||||
|
||||
if (preserveQuery && urlParsed.searchOriginal) {
|
||||
return `${path}${urlParsed.searchOriginal}`;
|
||||
}
|
||||
|
||||
return path;
|
||||
}
|
||||
|
||||
async function search(options = {}) {
|
||||
if (options.resetPage !== false) {
|
||||
currentPage.value = 1;
|
||||
}
|
||||
|
||||
if (options.autoScope !== false) {
|
||||
if (filters.value.search) {
|
||||
scope.value = 'results';
|
||||
}
|
||||
|
||||
if (!filters.value.search && scope.value === 'results') {
|
||||
scope.value = 'latest';
|
||||
}
|
||||
}
|
||||
|
||||
const query = {
|
||||
q: filters.value.search || undefined,
|
||||
};
|
||||
|
||||
const entity = filters.value.entity || pageEntity;
|
||||
// const entitySlug = entity?.type === 'network' ? `_${entity.slug}` : entity?.slug;
|
||||
const entitySlug = entity && `${entityPrefixes[entity.type]}${entity.slug}`;
|
||||
|
||||
loading.value = true;
|
||||
|
||||
navigate(getPath(scope.value, false), {
|
||||
...query,
|
||||
years: filters.value.years.join(',') || undefined,
|
||||
actors: filters.value.actors.map((filterActor) => getActorIdentifier(filterActor)).join(',') || undefined, // don't include page actor ID in query, already a parameter
|
||||
tags: filters.value.tags.join(',') || undefined,
|
||||
at: (filters.value.tags.length > 0 && filters.value.onlyActorTags) || undefined,
|
||||
// e: filters.value.entity?.type === 'network' ? `_${filters.value.entity.slug}` : (filters.value.entity?.slug || undefined),
|
||||
e: filters.value.entity ? `${entityPrefixes[filters.value.entity.type]}${filters.value.entity.slug}` : undefined,
|
||||
}, { redirect: false });
|
||||
|
||||
const res = await get('/scenes', {
|
||||
...query,
|
||||
years: filters.value.years.filter(Boolean).join(','), // if we're on an actor page, that actor ID needs to be included
|
||||
actors: [pageActor, ...filters.value.actors].filter(Boolean).map((filterActor) => getActorIdentifier(filterActor)).join(','), // if we're on an actor page, that actor ID needs to be included
|
||||
tags: [pageTag?.slug, ...filters.value.tags].filter(Boolean).join(','),
|
||||
at: !!filters.value.onlyActorTags,
|
||||
stashId: pageStash?.id,
|
||||
e: entitySlug,
|
||||
scope: scope.value,
|
||||
page: currentPage.value, // client uses param rather than query pagination
|
||||
});
|
||||
|
||||
scenes.value = res.scenes;
|
||||
aggYears.value = res.aggYears;
|
||||
aggActors.value = res.aggActors;
|
||||
aggTags.value = res.aggTags;
|
||||
aggActorTags.value = res.aggActorTags;
|
||||
aggChannels.value = res.aggChannels;
|
||||
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
|
||||
// events.emit('scrollUp');
|
||||
scenesContainer.value?.scrollIntoView(true);
|
||||
}
|
||||
|
||||
function updateFilter(prop, value, reload = true) {
|
||||
filters.value[prop] = value;
|
||||
|
||||
if (reload) {
|
||||
search();
|
||||
}
|
||||
}
|
||||
|
||||
function setView(newView) {
|
||||
view.value = newView;
|
||||
Cookies.set('scenesView', newView);
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="scenes-page"
|
||||
@@ -207,198 +399,6 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
inject,
|
||||
} from 'vue';
|
||||
|
||||
import Cookies from 'js-cookie';
|
||||
import { parse } from 'path-to-regexp';
|
||||
|
||||
import navigate from '#/src/navigate.js';
|
||||
import { get } from '#/src/api.js';
|
||||
// import events from '#/src/events.js';
|
||||
import entityPrefixes from '#/src/entities-prefixes.js';
|
||||
import { getActorIdentifier, parseActorIdentifier } from '#/src/query.js';
|
||||
|
||||
import Filters from '#/components/filters/filters.vue';
|
||||
import YearsFilter from '#/components/filters/years.vue';
|
||||
import ActorsFilter from '#/components/filters/actors.vue';
|
||||
import TagsFilter from '#/components/filters/tags.vue';
|
||||
import ChannelsFilter from '#/components/filters/channels.vue';
|
||||
import SceneTile from '#/components/scenes/tile.vue';
|
||||
import Campaign from '#/components/campaigns/campaign.vue';
|
||||
import Pagination from '#/components/pagination/pagination.vue';
|
||||
import Ellipsis from '#/components/loading/ellipsis.vue';
|
||||
|
||||
const props = defineProps({
|
||||
showFilters: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showMeta: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
showScopeTabs: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
defaultScope: {
|
||||
type: String,
|
||||
default: 'latest',
|
||||
},
|
||||
});
|
||||
|
||||
const {
|
||||
pageProps,
|
||||
routeParams,
|
||||
urlParsed,
|
||||
campaigns,
|
||||
env,
|
||||
} = inject('pageContext');
|
||||
|
||||
const {
|
||||
actor: pageActor,
|
||||
tag: pageTag,
|
||||
entity: pageEntity,
|
||||
stash: pageStash,
|
||||
} = pageProps;
|
||||
|
||||
const scenes = ref(pageProps.scenes);
|
||||
const aggYears = ref(pageProps.aggYears || []);
|
||||
const aggActors = ref(pageProps.aggActors || []);
|
||||
const aggTags = ref(pageProps.aggTags || []);
|
||||
const aggActorTags = ref(pageProps.aggActorTags || []);
|
||||
const aggChannels = ref(pageProps.aggChannels || []);
|
||||
|
||||
const currentPage = ref(Number(routeParams.page));
|
||||
const scope = ref(routeParams.scope || props.defaultScope);
|
||||
const total = ref(Number(pageProps.sceneTotal || pageProps.total));
|
||||
const loading = ref(false);
|
||||
const scenesContainer = ref(null);
|
||||
|
||||
const view = ref(env.scenesView || 'grid');
|
||||
|
||||
const actorIds = urlParsed.search.actors?.split(',').map((identifier) => parseActorIdentifier(identifier)?.id).filter(Boolean) || [];
|
||||
const queryActors = actorIds.map((urlActorId) => aggActors.value.find((aggActor) => aggActor.id === urlActorId)).filter(Boolean);
|
||||
|
||||
const networks = Object.fromEntries(aggChannels.value.map((channel) => (channel.type === 'network' ? channel : channel.parent)).filter(Boolean).map((parent) => [`_${parent.slug}`, parent]));
|
||||
const channels = Object.fromEntries(aggChannels.value.filter((channel) => channel.type === 'channel').map((channel) => [channel.slug, channel]));
|
||||
|
||||
const queryEntity = networks[urlParsed.search.e] || channels[urlParsed.search.e];
|
||||
|
||||
const filters = ref({
|
||||
search: urlParsed.search.q,
|
||||
years: urlParsed.search.years?.split(',').filter(Boolean).map(Number) || [],
|
||||
tags: urlParsed.search.tags?.split(',').filter(Boolean) || [],
|
||||
onlyActorTags: Object.hasOwn(urlParsed.search, 'at'),
|
||||
entity: queryEntity,
|
||||
actors: queryActors,
|
||||
});
|
||||
|
||||
const sceneCampaign = campaigns?.scenes;
|
||||
const campaignIndex = campaigns?.index;
|
||||
|
||||
const campaignScenes = computed(() => scenes.value.flatMap((scene, index) => (sceneCampaign && index === campaignIndex ? ['campaign', scene] : scene)));
|
||||
|
||||
function getPath(targetScope, preserveQuery) {
|
||||
const path = parse(routeParams.path).map((segment) => {
|
||||
if (segment.name === 'scope') {
|
||||
return `${segment.prefix}${targetScope}`;
|
||||
}
|
||||
|
||||
if (segment.name === 'page') {
|
||||
return `${segment.prefix}${1}`;
|
||||
}
|
||||
|
||||
return `${segment.prefix || ''}${routeParams[segment.name] || segment}`;
|
||||
}).join('');
|
||||
|
||||
if (preserveQuery && urlParsed.searchOriginal) {
|
||||
return `${path}${urlParsed.searchOriginal}`;
|
||||
}
|
||||
|
||||
return path;
|
||||
}
|
||||
|
||||
async function search(options = {}) {
|
||||
if (options.resetPage !== false) {
|
||||
currentPage.value = 1;
|
||||
}
|
||||
|
||||
if (options.autoScope !== false) {
|
||||
if (filters.value.search) {
|
||||
scope.value = 'results';
|
||||
}
|
||||
|
||||
if (!filters.value.search && scope.value === 'results') {
|
||||
scope.value = 'latest';
|
||||
}
|
||||
}
|
||||
|
||||
const query = {
|
||||
q: filters.value.search || undefined,
|
||||
};
|
||||
|
||||
const entity = filters.value.entity || pageEntity;
|
||||
// const entitySlug = entity?.type === 'network' ? `_${entity.slug}` : entity?.slug;
|
||||
const entitySlug = entity && `${entityPrefixes[entity.type]}${entity.slug}`;
|
||||
|
||||
loading.value = true;
|
||||
|
||||
navigate(getPath(scope.value, false), {
|
||||
...query,
|
||||
years: filters.value.years.join(',') || undefined,
|
||||
actors: filters.value.actors.map((filterActor) => getActorIdentifier(filterActor)).join(',') || undefined, // don't include page actor ID in query, already a parameter
|
||||
tags: filters.value.tags.join(',') || undefined,
|
||||
at: (filters.value.tags.length > 0 && filters.value.onlyActorTags) || undefined,
|
||||
// e: filters.value.entity?.type === 'network' ? `_${filters.value.entity.slug}` : (filters.value.entity?.slug || undefined),
|
||||
e: filters.value.entity ? `${entityPrefixes[filters.value.entity.type]}${filters.value.entity.slug}` : undefined,
|
||||
}, { redirect: false });
|
||||
|
||||
const res = await get('/scenes', {
|
||||
...query,
|
||||
years: filters.value.years.filter(Boolean).join(','), // if we're on an actor page, that actor ID needs to be included
|
||||
actors: [pageActor, ...filters.value.actors].filter(Boolean).map((filterActor) => getActorIdentifier(filterActor)).join(','), // if we're on an actor page, that actor ID needs to be included
|
||||
tags: [pageTag?.slug, ...filters.value.tags].filter(Boolean).join(','),
|
||||
at: !!filters.value.onlyActorTags,
|
||||
stashId: pageStash?.id,
|
||||
e: entitySlug,
|
||||
scope: scope.value,
|
||||
page: currentPage.value, // client uses param rather than query pagination
|
||||
});
|
||||
|
||||
scenes.value = res.scenes;
|
||||
aggYears.value = res.aggYears;
|
||||
aggActors.value = res.aggActors;
|
||||
aggTags.value = res.aggTags;
|
||||
aggActorTags.value = res.aggActorTags;
|
||||
aggChannels.value = res.aggChannels;
|
||||
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
|
||||
// events.emit('scrollUp');
|
||||
scenesContainer.value?.scrollIntoView(true);
|
||||
}
|
||||
|
||||
function updateFilter(prop, value, reload = true) {
|
||||
filters.value[prop] = value;
|
||||
|
||||
if (reload) {
|
||||
search();
|
||||
}
|
||||
}
|
||||
|
||||
function setView(newView) {
|
||||
view.value = newView;
|
||||
Cookies.set('scenesView', newView);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.scenes-page {
|
||||
display: flex;
|
||||
|
||||
@@ -1,3 +1,158 @@
|
||||
<script setup>
|
||||
import Cookies from 'js-cookie';
|
||||
import { inject, onMounted, ref } from 'vue';
|
||||
import { parse } from 'yaml';
|
||||
|
||||
import defaultTemplate from '#/assets/summary.yaml?raw';
|
||||
import { del, get, post } from '#/src/api.js';
|
||||
// import slugify from '#/utils/slugify.js';
|
||||
import events from '#/src/events.js';
|
||||
|
||||
import processSummaryTemplate from '#/utils/process-summary-template.js';
|
||||
|
||||
const props = defineProps({
|
||||
release: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const pageContext = inject('pageContext');
|
||||
|
||||
const cookies = Cookies.withConverter({
|
||||
write: (value) => value,
|
||||
});
|
||||
|
||||
const templates = ref(pageContext.assets.templates);
|
||||
const selectedTemplate = ref(Number(pageContext.urlParsed.search.t) || templates.value.at(0)?.id || null);
|
||||
|
||||
const initialTemplate = templates.value.find((storedTemplate) => storedTemplate.id === selectedTemplate.value) || null;
|
||||
|
||||
const template = ref(initialTemplate?.template || defaultTemplate);
|
||||
const hasError = ref(false);
|
||||
const input = ref(null);
|
||||
const changed = ref(false);
|
||||
|
||||
const templateName = ref(initialTemplate?.name || `custom_${Date.now()}`);
|
||||
|
||||
function getSummary() {
|
||||
return processSummaryTemplate(template.value, props.release, pageContext.env);
|
||||
}
|
||||
|
||||
const summary = ref(getSummary());
|
||||
|
||||
function selectTemplate(templateId) {
|
||||
selectedTemplate.value = templateId;
|
||||
|
||||
const nextTemplate = templates.value.find((storedTemplate) => storedTemplate.id === templateId);
|
||||
|
||||
template.value = nextTemplate.template;
|
||||
templateName.value = nextTemplate.name;
|
||||
summary.value = getSummary();
|
||||
|
||||
cookies.set('selectedTemplate', String(templateId));
|
||||
window.location.href = `${window.location.origin}${window.location.pathname}?t=${nextTemplate.id}`;
|
||||
}
|
||||
|
||||
function update() {
|
||||
hasError.value = false;
|
||||
changed.value = true;
|
||||
|
||||
try {
|
||||
summary.value = getSummary();
|
||||
}
|
||||
catch (error) {
|
||||
hasError.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
async function save(explicit) {
|
||||
if (!explicit && !changed.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
parse(template.value);
|
||||
|
||||
const createdTemplate = await post('/templates', {
|
||||
name: templateName.value,
|
||||
template: template.value,
|
||||
}, {
|
||||
successFeedback: `Saved summary template '${templateName.value}'`,
|
||||
errorFeedback: `Failed to save summary template '${templateName.value}'`,
|
||||
});
|
||||
|
||||
changed.value = false;
|
||||
templates.value = await get(`/users/${pageContext.user.id}/templates`);
|
||||
|
||||
selectTemplate(createdTemplate.id);
|
||||
}
|
||||
catch (error) {
|
||||
events.emit('feedback', {
|
||||
type: 'error',
|
||||
message: `Failed to save summary template '${templateName.value}': ${error.message}`,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function add() {
|
||||
selectedTemplate.value = null;
|
||||
template.value = '';
|
||||
templateName.value = `custom_${Date.now()}`;
|
||||
summary.value = '';
|
||||
|
||||
input.value.focus();
|
||||
}
|
||||
|
||||
async function remove() {
|
||||
if (confirm(`Are you sure you want to delete summary template ${templateName.value}?`)) { // eslint-disable-line no-alert
|
||||
await del(`/templates/${selectedTemplate.value}`, {
|
||||
undoFeedback: `Deleted summary template '${templateName.value}'`,
|
||||
errorFeedback: `Failed to remove summary template '${templateName.value}'`,
|
||||
});
|
||||
|
||||
templates.value = await get(`/users/${pageContext.user.id}/templates`);
|
||||
|
||||
selectTemplate(templates.value.at(-1)?.id);
|
||||
}
|
||||
}
|
||||
|
||||
function copy() {
|
||||
navigator.clipboard.writeText(summary.value);
|
||||
|
||||
events.emit('feedback', {
|
||||
type: 'success',
|
||||
message: 'Summary copied to clipboard',
|
||||
});
|
||||
}
|
||||
|
||||
function reset() {
|
||||
if (confirm('Are you sure you want to reset the summary template to the default? Your custom template will be discarded.')) { // eslint-disable-line no-alert
|
||||
template.value = defaultTemplate;
|
||||
|
||||
update();
|
||||
|
||||
events.emit('feedback', {
|
||||
type: 'undo',
|
||||
message: 'Reset summary template',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function indent() {
|
||||
// YAML does not support tabs
|
||||
input.value.setRangeText(' ', input.value.selectionStart, input.value.selectionEnd, 'end');
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
window.addEventListener('beforeunload', (event) => {
|
||||
if (changed.value) {
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="editor">
|
||||
<div class="editor-header">
|
||||
@@ -89,159 +244,6 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, inject, onMounted } from 'vue';
|
||||
import { parse } from 'yaml';
|
||||
import Cookies from 'js-cookie';
|
||||
|
||||
// import slugify from '#/utils/slugify.js';
|
||||
import events from '#/src/events.js';
|
||||
import { get, post, del } from '#/src/api.js';
|
||||
import processSummaryTemplate from '#/utils/process-summary-template.js';
|
||||
|
||||
import defaultTemplate from '#/assets/summary.yaml?raw'; // eslint-disable-line import/no-unresolved
|
||||
|
||||
const pageContext = inject('pageContext');
|
||||
|
||||
const cookies = Cookies.withConverter({
|
||||
write: (value) => value,
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
release: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const templates = ref(pageContext.assets.templates);
|
||||
const selectedTemplate = ref(Number(pageContext.urlParsed.search.t) || templates.value.at(0)?.id || null);
|
||||
|
||||
const initialTemplate = templates.value.find((storedTemplate) => storedTemplate.id === selectedTemplate.value) || null;
|
||||
|
||||
const template = ref(initialTemplate?.template || defaultTemplate);
|
||||
const hasError = ref(false);
|
||||
const input = ref(null);
|
||||
const changed = ref(false);
|
||||
|
||||
const templateName = ref(initialTemplate?.name || `custom_${Date.now()}`);
|
||||
|
||||
function getSummary() {
|
||||
return processSummaryTemplate(template.value, props.release, pageContext.env);
|
||||
}
|
||||
|
||||
const summary = ref(getSummary());
|
||||
|
||||
function selectTemplate(templateId) {
|
||||
selectedTemplate.value = templateId;
|
||||
|
||||
const nextTemplate = templates.value.find((storedTemplate) => storedTemplate.id === templateId);
|
||||
|
||||
template.value = nextTemplate.template;
|
||||
templateName.value = nextTemplate.name;
|
||||
summary.value = getSummary();
|
||||
|
||||
cookies.set('selectedTemplate', String(templateId));
|
||||
window.location.href = `${window.location.origin}${window.location.pathname}?t=${nextTemplate.id}`;
|
||||
}
|
||||
|
||||
function update() {
|
||||
hasError.value = false;
|
||||
changed.value = true;
|
||||
|
||||
try {
|
||||
summary.value = getSummary();
|
||||
} catch (error) {
|
||||
hasError.value = true;
|
||||
}
|
||||
}
|
||||
|
||||
async function save(explicit) {
|
||||
if (!explicit && !changed.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
parse(template.value);
|
||||
|
||||
const createdTemplate = await post('/templates', {
|
||||
name: templateName.value,
|
||||
template: template.value,
|
||||
}, {
|
||||
successFeedback: `Saved summary template '${templateName.value}'`,
|
||||
errorFeedback: `Failed to save summary template '${templateName.value}'`,
|
||||
});
|
||||
|
||||
changed.value = false;
|
||||
templates.value = await get(`/users/${pageContext.user.id}/templates`);
|
||||
|
||||
selectTemplate(createdTemplate.id);
|
||||
} catch (error) {
|
||||
events.emit('feedback', {
|
||||
type: 'error',
|
||||
message: `Failed to save summary template '${templateName.value}': ${error.message}`,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function add() {
|
||||
selectedTemplate.value = null;
|
||||
template.value = '';
|
||||
templateName.value = `custom_${Date.now()}`;
|
||||
summary.value = '';
|
||||
|
||||
input.value.focus();
|
||||
}
|
||||
|
||||
async function remove() {
|
||||
if (confirm(`Are you sure you want to delete summary template ${templateName.value}?`)) { // eslint-disable-line no-restricted-globals, no-alert
|
||||
await del(`/templates/${selectedTemplate.value}`, {
|
||||
undoFeedback: `Deleted summary template '${templateName.value}'`,
|
||||
errorFeedback: `Failed to remove summary template '${templateName.value}'`,
|
||||
});
|
||||
|
||||
templates.value = await get(`/users/${pageContext.user.id}/templates`);
|
||||
|
||||
selectTemplate(templates.value.at(-1)?.id);
|
||||
}
|
||||
}
|
||||
|
||||
function copy() {
|
||||
navigator.clipboard.writeText(summary.value);
|
||||
|
||||
events.emit('feedback', {
|
||||
type: 'success',
|
||||
message: 'Summary copied to clipboard',
|
||||
});
|
||||
}
|
||||
|
||||
function reset() {
|
||||
if (confirm('Are you sure you want to reset the summary template to the default? Your custom template will be discarded.')) { // eslint-disable-line no-restricted-globals, no-alert
|
||||
template.value = defaultTemplate;
|
||||
|
||||
update();
|
||||
|
||||
events.emit('feedback', {
|
||||
type: 'undo',
|
||||
message: 'Reset summary template',
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function indent() {
|
||||
// YAML does not support tabs
|
||||
input.value.setRangeText(' ', input.value.selectionStart, input.value.selectionEnd, 'end');
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
window.addEventListener('beforeunload', (event) => {
|
||||
if (changed.value) {
|
||||
event.preventDefault();
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.editor {
|
||||
display: flex;
|
||||
|
||||
@@ -1,3 +1,30 @@
|
||||
<script setup>
|
||||
import { inject, ref } from 'vue';
|
||||
|
||||
import Meta from '#/components/scenes/meta.vue';
|
||||
|
||||
import Heart from '#/components/stashes/heart.vue';
|
||||
import getPath from '#/src/get-path.js';
|
||||
|
||||
const props = defineProps({
|
||||
scene: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const pageContext = inject('pageContext');
|
||||
const { user } = pageContext;
|
||||
const pageStash = pageContext.pageProps.stash;
|
||||
const currentStash = pageStash || pageContext.assets?.primaryStash;
|
||||
|
||||
const tagsById = Object.fromEntries(props.scene.tags.map((tag) => [tag.id, tag]));
|
||||
const sceneTags = Array.from(new Set(props.scene.tags.map((tag) => tag.id))).map((tagId) => tagsById[tagId]);
|
||||
|
||||
const priorityTags = sceneTags.map((tag) => tag.name).slice(0, 2);
|
||||
const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id === currentStash?.id));
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div
|
||||
class="tile"
|
||||
@@ -115,33 +142,6 @@
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, inject } from 'vue';
|
||||
|
||||
import getPath from '#/src/get-path.js';
|
||||
|
||||
import Meta from '#/components/scenes/meta.vue';
|
||||
import Heart from '#/components/stashes/heart.vue';
|
||||
|
||||
const props = defineProps({
|
||||
scene: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
});
|
||||
|
||||
const pageContext = inject('pageContext');
|
||||
const { user } = pageContext;
|
||||
const pageStash = pageContext.pageProps.stash;
|
||||
const currentStash = pageStash || pageContext.assets?.primaryStash;
|
||||
|
||||
const tagsById = Object.fromEntries(props.scene.tags.map((tag) => [tag.id, tag]));
|
||||
const sceneTags = Array.from(new Set(props.scene.tags.map((tag) => tag.id))).map((tagId) => tagsById[tagId]);
|
||||
|
||||
const priorityTags = sceneTags.map((tag) => tag.name).slice(0, 2);
|
||||
const favorited = ref(props.scene.stashes.some((sceneStash) => sceneStash.id === currentStash?.id));
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.tile {
|
||||
display: flex;
|
||||
|
||||
Reference in New Issue
Block a user