itube-specs 0.0.981 → 0.0.983

package/components/card/model-mini.vue

@@ -3,7 +3,6 @@
   <div class="card-model-mini">
     <UiImg
       :src="currentImage"
-      :image-urls="currentImageUrls"
       :avif-src="currentAvifSrc"
       :alt="card.title"
       class="card-model-mini__img"
@@ -56,17 +55,13 @@ const props = defineProps<{
 const fallbackImage = '/img/model-placeholder.webp';
 const imageError = ref(false);
 
-/** Аватар 48px, крупнее мелкой ступени сюда не надо: при DPR3 нужно всего 144. */
+/** Аватар 48px круглый — нужен квадратный кроп, вертикальный портрет сюда не годится. */
 const currentImage = computed(() => {
   if (imageError.value) return fallbackImage;
-  return props.card.primaryImageSmallUrl || props.card.primaryImageUrl || props.card.thumbUrl || fallbackImage;
+  return props.card.primaryImageSmallUrl || fallbackImage;
 });
 
-const currentImageUrls = computed(() => (imageError.value ? undefined : props.card.primaryImageUrls));
-const currentAvifSrc = computed(() => {
-  if (imageError.value) return undefined;
-  return props.card.primaryImageSmallAvifUrl || props.card.primaryImageAvifUrl;
-});
+const currentAvifSrc = computed(() => (imageError.value ? undefined : props.card.primaryImageSmallAvifUrl));
 </script>
 
 <style lang="scss">

package/components/card/model.vue

@@ -8,7 +8,6 @@
     <div class="card-model__thumb">
       <UiImg
         :src="currentImage"
-        :image-urls="currentImageUrls"
         :avif-src="currentAvifSrc"
         :loading="loading"
         :alt="card.title"
@@ -104,11 +103,10 @@ const imageError = ref(false);
 
 const currentImage = computed(() => {
   if (imageError.value) return fallbackImage;
-  return props.card.primaryImageUrl || props.card.thumbUrl || fallbackImage;
+  return props.card.primaryImageUrl || fallbackImage;
 });
 
 /** На заглушке ладдер сбрасываем — иначе браузер продолжит тянуть битые кандидаты. */
-const currentImageUrls = computed(() => (imageError.value ? undefined : props.card.primaryImageUrls));
 const currentAvifSrc = computed(() => (imageError.value ? undefined : props.card.primaryImageAvifUrl));
 
 function onImageError() {

package/components/card/round.vue

@@ -6,7 +6,6 @@
   >
     <UiImg
       :src="currentImage"
-      :image-urls="currentImageUrls"
       :avif-src="currentAvifSrc"
       :loading="loading"
       :alt="card.title"
@@ -70,7 +69,6 @@ const currentImage = computed(() => {
   return props.card.primaryImageUrl || fallbackImage || '';
 });
 
-const currentImageUrls = computed(() => (imageError.value ? undefined : props.card.primaryImageUrls));
 const currentAvifSrc = computed(() => (imageError.value ? undefined : props.card.primaryImageAvifUrl));
 
 function onImageError() {

package/components/info/main.vue

@@ -16,7 +16,6 @@
         v-if="card.img"
         :src="currentImage"
         :avif-src="currentAvifSrc"
-        :image-urls="currentImageUrls"
         :alt="title"
         :sizes="IMG_SIZES"
         class="info-main__img"
@@ -216,8 +215,6 @@ const currentImage = computed(() => {
 /** `.info-main__img` — 80px до sm, 96px дальше. `auto` впереди — см. `UiImg`. */
 const IMG_SIZES = `auto, (max-width: ${CSS_BREAKPOINTS.sm - 1}px) 80px, 96px`;
 
-const currentImageUrls = computed(() => (imageError.value ? undefined : props.card.imgUrls));
-
 const currentAvifSrc = computed(() => (imageError.value ? undefined : props.card.imgAvifUrl));
 
 function getParameter(name: string) {
@@ -241,7 +238,6 @@ const shareModelCard = computed<IModelCard>(() => ({
   title: props.card.title,
   videosCount: props.card.videosCount,
   thumbUrl: props.card.img || '',
-  primaryImageUrls: props.card.imgUrls,
   guid: props.card.guid || '',
   parameters: [],
   country: shareCountry.value,
@@ -392,6 +388,7 @@ const socialItems = computed<ILinkItem[]>(() => {
   margin-top: 12px;
   line-height: 1.625;
   color: $info-description;
+  grid-column: 2;
 
   @include to-br(sm) {
     grid-column: 1/-1;

package/components/search/item.vue

@@ -10,9 +10,8 @@
   >
     <UiImg
       v-if="isModel"
-      :src="item?.primaryImageUrl || `/img/model-placeholder.webp`"
-      :avif-src="item?.primaryImageAvifUrl"
-      :image-urls="item?.primaryImageUrls"
+      :src="icon.webp"
+      :avif-src="icon.avif"
       :alt="title"
       class="search-item__icon"
       sizes="auto, 32px"
@@ -32,7 +31,7 @@
 
 <script setup lang="ts">
 import type { ISearchTopModelsType } from '../../types';
-import { convertString } from '../../runtime';
+import { convertString, pickPortraitVariant } from '../../runtime';
 import DOMPurify from 'dompurify';
 
 const props = defineProps<{
@@ -42,6 +41,16 @@ const props = defineProps<{
   isDefault?: boolean
 }>();
 
+/** Иконка 32px — квадратный кроп по лицу, если он есть в ответе. */
+const icon = computed(() => {
+  const square = pickPortraitVariant(props.item?.portraits)?.square;
+
+  return {
+    webp: square?.webp || '/img/model-placeholder.webp',
+    avif: square?.avif,
+  };
+});
+
 const title = computed(() => props.item?.title?.replace(/<[^>]*>/g, ''));
 const { generateLink } = useGenerateLink();
 

package/components/ui/img.vue

@@ -24,7 +24,7 @@
 </template>
 
 <script setup lang="ts">
-import type { IThumbUrls, IModelImageUrls } from '../../types';
+import type { IThumbUrls } from '../../types';
 import { ThumbSize, buildSrcset } from '../../runtime';
 
 defineOptions({ inheritAttrs: false });
@@ -37,8 +37,6 @@ const props = withDefaults(defineProps<{
   height: string | number,
   sizes?: string,
   urls?: IThumbUrls,
-  /** Ладдер по ширине (портреты моделей). Старше `urls`. */
-  imageUrls?: IModelImageUrls,
   alt?: string,
   loading?: 'lazy' | 'eager',
   fit?: 'cover' | 'contain' | 'fill' | 'inside' | 'outside',
@@ -72,10 +70,10 @@ const imgSrc = computed(() => {
   return undefined;
 });
 
-const computedSrcset = computed(() => buildSrcset(props.imageUrls?.webp) || buildSrcset(props.urls?.webp));
+const computedSrcset = computed(() => buildSrcset(props.urls?.webp));
 
 /** Ладдер старше одиночного `avifSrc`: нужен, когда ступени есть и в avif-ветке. */
-const avifSrcset = computed(() => buildSrcset(props.imageUrls?.avif) || props.avifSrc);
+const avifSrcset = computed(() => props.avifSrc);
 
 const imgAttrs = computed(() => ({
   ...attrs,

package/components/view/video.vue

@@ -22,7 +22,7 @@
               <UiChips
                 v-for="(model, index) in data.models"
                 :key="index"
-                :item="getModelChips(model, index)"
+                :item="getModelChips(model)"
                 is-link
               />
             </template>
@@ -203,14 +203,11 @@ const topChips = computed(() => {
 
 const topChipsStrings = computed(() => topChips.value?.map(item => item.value));
 
-const { portraitAt } = useTestModelImages();
-
-function getModelChips(model: IVideoData['models'][number], index: number): IChipsItem {
+function getModelChips(model: IVideoData['models'][number]): IChipsItem {
   return {
     prefix: '/models',
     value: model.title,
     title: model.title,
-    image: portraitAt(index).thumbUrl,
   };
 }
 </script>

package/nuxt.config.ts

@@ -64,6 +64,9 @@ export default defineNuxtConfig({
     public: {
       featureFlags: {},
       adsConfig: {},
+      // Тема сайта. Дублирует `appConfig.theme`, потому что серверные хендлеры читают только
+      // runtimeConfig: по ней выбирается вариант портрета из `portraits`.
+      theme: '',
       webcamsConfig: {},
       locales: {
         codes: [],

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "itube-specs",
   "type": "module",
-  "version": "0.0.981",
+  "version": "0.0.983",
   "main": "./nuxt.config.ts",
   "types": "./types/index.d.ts",
   "scripts": {

package/pages/models/[slug]/index.vue

@@ -47,14 +47,6 @@ const [
   useRouteQueryCategories(),
 ]);
 
-const { portraits, portraitAt } = useTestModelImages();
-
-if (cardInfo.value) {
-  const portrait = portraitAt(Math.floor(Math.random() * portraits.length));
-  cardInfo.value.img = portrait.primaryImageUrl;
-  cardInfo.value.imgUrls = portrait.primaryImageUrls;
-}
-
 const { t } = useI18n();
 
 const title = convertString().fromSlug(String(route.params[ 'slug' ]));

package/pages/models/index.vue

@@ -25,7 +25,7 @@
 </template>
 
 <script setup lang="ts">
-import type { IBreadcrumbItem, IModelImageUrls } from '../../types';
+import type { IBreadcrumbItem } from '../../types';
 import { ModelsApiService } from '../../services/api/models.service';
 import { AsyncData } from '../../runtime';
 import { sortModels } from '../../lib';
@@ -34,12 +34,6 @@ const { t } = useI18n();
 const pageName = useRoute().name;
 const pagePureName = useGetPureRouteName();
 
-const { portraitAt } = useTestModelImages();
-
-function applyTestImages<T extends { primaryImageUrl?: string; thumbUrl?: string; primaryImageUrls?: IModelImageUrls }>(items: T[] | undefined): T[] | undefined {
-  return items?.map((item, i) => ({ ...item, ...portraitAt(i) }));
-}
-
 const [
   { data: topModels },
   { data: models, status },
@@ -48,13 +42,6 @@ const [
   useFetchModels(ModelsApiService.getListByNiche),
 ]);
 
-if (topModels.value?.items) {
-  topModels.value.items = applyTestImages(topModels.value.items)!;
-}
-if (models.value?.items) {
-  models.value.items = applyTestImages(models.value.items)!;
-}
-
 const { meta, h1 } = useMeta({
   t,
   pageKey: pagePureName,

package/runtime/index.ts

@@ -10,6 +10,7 @@ export * from './constants/playlist-step';
 export * from './constants/thumb-size';
 export * from './constants/webcams';
 export * from './utils/build-srcset';
+export * from './utils/pick-portrait-variant';
 export * from './utils/format-date';
 export * from './utils/format-time';
 export * from './utils/get-multiple-query';

package/runtime/utils/__tests__/pick-portrait-variant.test.ts

@@ -0,0 +1,25 @@
+import { describe, it, expect } from 'vitest';
+import { pickPortraitVariant } from '../pick-portrait-variant';
+
+const tall = { width: 640, height: 960, webp: 'w', avif: 'a' };
+
+describe('pickPortraitVariant', () => {
+  it('берёт запрошенный вариант', () => {
+    const portraits = { dark: { tall }, light: { tall: { ...tall, webp: 'light' } } };
+    expect(pickPortraitVariant(portraits, 'light')?.tall?.webp).toBe('light');
+  });
+
+  it('запрошенного нет → dark', () => {
+    const portraits = { dark: { tall }, light: { tall: { ...tall, webp: 'light' } } };
+    expect(pickPortraitVariant(portraits, 'sepia')?.tall?.webp).toBe('w');
+  });
+
+  it('dark нет → первый попавшийся', () => {
+    expect(pickPortraitVariant({ light: { tall: { ...tall, webp: 'light' } } })?.tall?.webp).toBe('light');
+  });
+
+  it('пусто → undefined', () => {
+    expect(pickPortraitVariant()).toBeUndefined();
+    expect(pickPortraitVariant({})).toBeUndefined();
+  });
+});

package/runtime/utils/cleaners/__tests__/clean-model-card.test.ts

@@ -26,17 +26,35 @@ describe('cleanModelCard', () => {
     expect(result.country).toEqual({ title: 'United States of America', name: 'us' });
   });
 
-  it('primary_image_urls → ладдер портрета как есть, ступени произвольные', () => {
+  it('portraits → tall в карточку, square в аватары', () => {
     const raw = makeRaw({
-      primary_image_urls: { webp: { 300: 'https://img.com/p-300.webp', 640: 'https://img.com/p-640.webp' } },
-    });
-    expect(cleanModelCard(raw as any).primaryImageUrls).toEqual({
-      webp: { 300: 'https://img.com/p-300.webp', 640: 'https://img.com/p-640.webp' },
+      portraits: {
+        dark: {
+          tall: { width: 640, height: 960, webp: 'https://cdn/t.webp', avif: 'https://cdn/t.avif' },
+          square: { width: 256, height: 256, webp: 'https://cdn/s.webp', avif: 'https://cdn/s.avif' },
+        },
+      },
     });
+    const result = cleanModelCard(raw as any);
+    expect(result.primaryImageUrl).toBe('https://cdn/t.webp');
+    expect(result.primaryImageAvifUrl).toBe('https://cdn/t.avif');
+    expect(result.primaryImageSmallUrl).toBe('https://cdn/s.webp');
+    expect(result.primaryImageSmallAvifUrl).toBe('https://cdn/s.avif');
   });
 
-  it('без primary_image_urls → ладдера нет', () => {
-    expect(cleanModelCard(makeRaw() as any).primaryImageUrls).toBeUndefined();
+  it('без portraits → картинок нет, старые поля не подставляются', () => {
+    const result = cleanModelCard(makeRaw() as any);
+    expect(result.primaryImageUrl).toBe('');
+    expect(result.primaryImageSmallUrl).toBeUndefined();
+  });
+
+  it('вариант выбирается по теме', () => {
+    const file = (webp: string) => ({ width: 1, height: 1, webp, avif: `${webp}.avif` });
+    const raw = makeRaw({
+      portraits: { dark: { tall: file('dark') }, light: { tall: file('light') } },
+    });
+    expect(cleanModelCard(raw as any, 'light').primaryImageUrl).toBe('light');
+    expect(cleanModelCard(raw as any, 'dark').primaryImageUrl).toBe('dark');
   });
 
   it('параметры: guy_type, ethnicity, age', () => {

package/runtime/utils/cleaners/__tests__/clean-model-info.test.ts

@@ -9,6 +9,7 @@ describe('cleanModelInfo', () => {
       social: '@model',
       videos_count: 50,
       video_thumb_urls: { webp: { '320x180': 'https://img.com/s.webp' } },
+      portraits: { dark: { square: { width: 256, height: 256, webp: 'https://cdn/sq.webp', avif: 'https://cdn/sq.avif' } } },
       parameters: 'height: 170',
       long_description: 'long desc',
       bio: 'bio text',
@@ -28,7 +29,8 @@ describe('cleanModelInfo', () => {
     expect(result.description).toBe('desc');
     expect(result.social).toBe('@model');
     expect(result.videosCount).toBe(50);
-    expect(result.img).toBe('https://img.com/s.webp');
+    expect(result.img).toBe('https://cdn/sq.webp');
+    expect(result.imgAvifUrl).toBe('https://cdn/sq.avif');
     expect(result.parameters).toBe('height: 170');
     expect(result.fullDescription).toBe('long desc');
     expect(result.relatedNames).toEqual(['Model B']);

package/runtime/utils/cleaners/clean-model-card.ts

@@ -1,34 +1,42 @@
 import type { IRawModelCard, IModelCard, IModelParameter } from '../../../types';
 import { ThumbSize } from '../../constants/thumb-size';
+import { pickPortraitVariant } from '../pick-portrait-variant';
 
 const parameterNames = ['guy_type', 'ethnicity'];
 const firstValue = (card: IRawModelCard, name: string) => card.parameters?.find(item => item.name === name)?.values?.[0];
 const age = (card: IRawModelCard) => firstValue(card, 'age')?.title;
 
 /** Нормализует сырую карточку модели к типу IModelCard, включая параметры (возраст, рост, вес) и страну. */
-export const cleanModelCard = (card: IRawModelCard): IModelCard => ({
-  title: card.title || '',
-  videosCount: card.videos_count || 0,
-  thumbUrl: card.video_thumb_urls?.webp?.[ThumbSize.Small] || '',
-  primaryImageUrl: card.primary_image_url || '',
-  primaryImageUrls: card.primary_image_urls?.webp ? { webp: card.primary_image_urls.webp } : undefined,
-  guid: card.guid || '',
-  // Страна лежит в parameters под именем nationality_iso_codes: `name` — код ISO-2 (`us`),
-  // он же имя файла флага, `title` — читаемое название. Одноимённое поле верхнего уровня
-  // в ответе списка всегда null, параметра `birthplace_country` там нет вовсе.
-  country: {
-    title: firstValue(card, 'nationality_iso_codes')?.title || '',
-    name: firstValue(card, 'nationality_iso_codes')?.name?.toLowerCase() || '',
-  },
-  parameters: [
-    ...(card.parameters?.filter(item => parameterNames.includes(item.name) && item.values?.length).map((item: IModelParameter) => ({
-      title: item.name,
-      value: item.values?.[0]?.title,
-    })) ?? []),
-    ...(age(card) ? [{
-      title: 'age',
-      value: age(card),
-    }] : []),
-  ],
-  lastVideoAddedAt: card.last_video_added_at,
-});
+export const cleanModelCard = (card: IRawModelCard, theme?: string): IModelCard => {
+  // `tall` идёт в карточку каталога, `square` — в круглые аватары, мини-карточки и поиск.
+  const portrait = pickPortraitVariant(card.portraits, theme);
+
+  return {
+    title: card.title || '',
+    videosCount: card.videos_count || 0,
+    thumbUrl: card.video_thumb_urls?.webp?.[ThumbSize.Small] || '',
+    primaryImageUrl: portrait?.tall?.webp || '',
+    primaryImageAvifUrl: portrait?.tall?.avif,
+    primaryImageSmallUrl: portrait?.square?.webp,
+    primaryImageSmallAvifUrl: portrait?.square?.avif,
+    guid: card.guid || '',
+    // Страна лежит в parameters под именем nationality_iso_codes: `name` — код ISO-2 (`us`),
+    // он же имя файла флага, `title` — читаемое название. Одноимённое поле верхнего уровня
+    // в ответе списка всегда null, параметра `birthplace_country` там нет вовсе.
+    country: {
+      title: firstValue(card, 'nationality_iso_codes')?.title || '',
+      name: firstValue(card, 'nationality_iso_codes')?.name?.toLowerCase() || '',
+    },
+    parameters: [
+      ...(card.parameters?.filter(item => parameterNames.includes(item.name) && item.values?.length).map((item: IModelParameter) => ({
+        title: item.name,
+        value: item.values?.[0]?.title,
+      })) ?? []),
+      ...(age(card) ? [{
+        title: 'age',
+        value: age(card),
+      }] : []),
+    ],
+    lastVideoAddedAt: card.last_video_added_at,
+  };
+};

package/runtime/utils/cleaners/clean-model-info.ts

@@ -1,18 +1,24 @@
 import type { IRawModelInfo, ICardInfo } from '../../../types';
-import { ThumbSize } from '../../constants/thumb-size';
+import { pickPortraitVariant } from '../pick-portrait-variant';
 
 /** Нормализует сырые данные страницы модели к типу ICardInfo. */
-export const cleanModelInfo = (card: IRawModelInfo): ICardInfo => ({
-  title: card.title || '',
-  description: card.description || '',
-  social: card.social || undefined,
-  videosCount: card.videos_count || 0,
-  img: card.video_thumb_urls?.webp?.[ThumbSize.Small] || '',
-  parameters: card.parameters || [],
-  fullDescription: card.long_description || '',
-  relatedNames: card.relatedNames || [],
-  akaNames: card.aka_names?.join(', ') || '',
-  birthSummary: card.birth_summary || '',
-  nationalityIsoCodes: card.nationality_iso_codes || [],
-  seo: card.seo || null,
-});
+export const cleanModelInfo = (card: IRawModelInfo, theme?: string): ICardInfo => {
+  // В шапке страницы аватар круглый, поэтому берём квадратный кроп.
+  const portrait = pickPortraitVariant(card.portraits, theme);
+
+  return {
+    title: card.title || '',
+    description: card.description || '',
+    social: card.social || undefined,
+    videosCount: card.videos_count || 0,
+    img: portrait?.square?.webp || '',
+    imgAvifUrl: portrait?.square?.avif,
+    parameters: card.parameters || [],
+    fullDescription: card.long_description || '',
+    relatedNames: card.relatedNames || [],
+    akaNames: card.aka_names?.join(', ') || '',
+    birthSummary: card.birth_summary || '',
+    nationalityIsoCodes: card.nationality_iso_codes || [],
+    seo: card.seo || null,
+  };
+};

package/runtime/utils/converters/__tests__/convert-model-to-round-card.test.ts

@@ -5,6 +5,7 @@ describe('convertModelToRoundCard', () => {
   it('конвертирует модель в round card', () => {
     const model = {
       title: 'Model Name',
+      primaryImageSmallUrl: 'https://img.com/square.webp',
       primaryImageUrl: 'https://img.com/primary.jpg',
       thumbUrl: 'https://img.com/thumb.jpg',
       videosCount: 10,
@@ -13,25 +14,24 @@ describe('convertModelToRoundCard', () => {
     };
     const result = convertModelToRoundCard(model);
     expect(result.title).toBe('Model Name');
-    expect(result.primaryImageUrl).toBe('https://img.com/primary.jpg');
+    expect(result.primaryImageUrl).toBe('https://img.com/square.webp');
     expect(result.videosCount).toBe(10);
     expect(result.link).toBe('/models/model-name');
   });
 
-  it('без primaryImageUrl → использует thumbUrl', () => {
+  it('вертикальный портрет в круглую карточку НЕ подставляется', () => {
     const model = {
       title: 'Test',
-      primaryImageUrl: '',
+      primaryImageUrl: 'https://img.com/tall.webp',
       thumbUrl: 'https://img.com/thumb.jpg',
       videosCount: 5,
       guid: 'm-2',
       parameters: [],
     };
-    const result = convertModelToRoundCard(model);
-    expect(result.primaryImageUrl).toBe('https://img.com/thumb.jpg');
+    expect(convertModelToRoundCard(model).primaryImageUrl).toBe('');
   });
 
-  it('без обоих url → пустая строка', () => {
+  it('без картинок → пустая строка', () => {
     const model = {
       title: 'Test',
       primaryImageUrl: '',
@@ -44,21 +44,7 @@ describe('convertModelToRoundCard', () => {
     expect(result.primaryImageUrl).toBe('');
   });
 
-  it('пробрасывает ладдер портрета', () => {
-    const model = {
-      title: 'Test',
-      primaryImageUrl: 'https://img.com/primary.jpg',
-      primaryImageUrls: { webp: { '300x400': 'https://img.com/a-300.webp' } },
-      thumbUrl: '',
-      videosCount: 0,
-      guid: 'm-5',
-      parameters: [],
-    };
-    const result = convertModelToRoundCard(model);
-    expect(result.primaryImageUrls).toEqual({ webp: { '300x400': 'https://img.com/a-300.webp' } });
-  });
-
-  it('без ладдера → undefined', () => {
+  it('без мелкой ступени → undefined', () => {
     const model = {
       title: 'Test',
       primaryImageUrl: 'url',
@@ -67,7 +53,7 @@ describe('convertModelToRoundCard', () => {
       guid: 'm-6',
       parameters: [],
     };
-    expect(convertModelToRoundCard(model).primaryImageUrls).toBeUndefined();
+    expect(convertModelToRoundCard(model).primaryImageAvifUrl).toBeUndefined();
   });
 
   it('slug с пробелами и заглавными', () => {

package/runtime/utils/converters/convert-model-to-round-card.ts

@@ -5,10 +5,9 @@ import { convertString } from './convert-string';
 export function convertModelToRoundCard(model: IModelCard): IRoundCard {
   return {
     title: model.title,
-    // Круглому аватару крупнее мелкой ступени не нужно: 96px при DPR3 просит 288.
-    primaryImageUrl: model.primaryImageSmallUrl || model.primaryImageUrl || model.thumbUrl || '',
-    primaryImageUrls: model.primaryImageUrls,
-    primaryImageAvifUrl: model.primaryImageSmallAvifUrl || model.primaryImageAvifUrl,
+    // Круглому аватару нужен квадратный кроп, вертикальный портрет туда не годится.
+    primaryImageUrl: model.primaryImageSmallUrl || '',
+    primaryImageAvifUrl: model.primaryImageSmallAvifUrl,
     videosCount: model.videosCount,
     link: `/models/${convertString().toSlug(model.title)}`,
   };

package/runtime/utils/pick-portrait-variant.ts

@@ -0,0 +1,18 @@
+import type { IRawPortraits, IRawPortraitVariant } from '../../types';
+
+/**
+ * Выбирает вариант портрета из карты, которую отдаёт API. Ключ — фон съёмки.
+ *
+ * Клинеры работают в BFF на сервере, где темы сайта нет под рукой, поэтому порядок такой:
+ * запрошенный вариант, затем `dark`, затем первый попавшийся. Пока API отдаёт один вариант,
+ * этого достаточно; если начнёт отдавать несколько и светлой сборке понадобится свой —
+ * тему придётся прокинуть в хендлеры через `runtimeConfig.public`, как сделано с локалями.
+ */
+export const pickPortraitVariant = (portraits?: IRawPortraits, preferred?: string): IRawPortraitVariant | undefined => {
+  if (!portraits) return undefined;
+
+  if (preferred && portraits[preferred]) return portraits[preferred];
+  if (portraits['dark']) return portraits['dark'];
+
+  return Object.values(portraits)[0];
+};

package/server/api/models/get-info-by-name.get.ts

@@ -6,5 +6,5 @@ export default defineEventHandler(async (event) => {
 
   const data = await cachedApiFetch(url, event, 300);
 
-  return cleanModelInfo(data);
+  return cleanModelInfo(data, useRuntimeConfig(event).public.theme);
 });

package/server/api/models/get-models-by-phrase.get.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../runtime';
 import type { IRawModelCard, IModelCard } from '../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/search`, event);
 
@@ -14,7 +15,7 @@ export default defineEventHandler(async (event) => {
 
   const items: IRawModelCard[] = rawData.data?.items || [];
 
-  const cleanedItems: IModelCard[] = items.map(cleanModelCard);
+  const cleanedItems: IModelCard[] = items.map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: rawData.data?.current_page,

package/server/api/models/list-by-category/[category].get.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../../runtime';
 import type { IRawModelCard, IModelCard } from '../../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const category = getRouterParam(event, 'category');
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/list-by-category/${category}`, event);
@@ -15,7 +16,7 @@ export default defineEventHandler(async (event) => {
 
   const items: IRawModelCard[] = rawData.data?.items || [];
 
-  const cleanedItems: IModelCard[] = items.map(cleanModelCard);
+  const cleanedItems: IModelCard[] = items.map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: rawData.data?.current_page,

package/server/api/models/list-by-channel/[channel].get.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../../runtime';
 import type { IRawModelCard, IModelCard } from '../../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const channel = getRouterParam(event, 'channel');
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/list-by-channel/${channel}`, event);
@@ -15,7 +16,7 @@ export default defineEventHandler(async (event) => {
 
   const items: IRawModelCard[] = rawData.data?.items || [];
 
-  const cleanedItems: IModelCard[] = items.map(cleanModelCard);
+  const cleanedItems: IModelCard[] = items.map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: rawData.data?.current_page,

package/server/api/models/list-by-first-letter.get.ts

@@ -2,12 +2,13 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../runtime';
 import type { IRawModelCard, IModelCard, PaginatedResponse } from '../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/list-by-first-letter`, event);
 
   const data = await cachedApiFetch<PaginatedResponse<IRawModelCard>>(url, event);
 
-  const cleanedItems: IModelCard[] = (data.items || []).map(cleanModelCard);
+  const cleanedItems: IModelCard[] = (data.items || []).map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: data.current_page,

package/server/api/models/list-by-niche.post.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../runtime';
 import type { IModelFilter, IRawModelCard, IModelCard, IPageSeo } from '../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/filter`, event);
 
@@ -19,7 +20,7 @@ export default defineEventHandler(async (event) => {
   const filters: IModelFilter[] = rawData?.data?.filters || [];
   const seo: IPageSeo | null = rawData?.data?.seo || null;
 
-  const cleanedItems: IModelCard[] = items && items.length > 0 ? items.map(cleanModelCard) : [];
+  const cleanedItems: IModelCard[] = items && items.length > 0 ? items.map(card => cleanModelCard(card, theme)) : [];
 
   return {
     currentPage: rawData?.data?.current_page,

package/server/api/models/list-by-tag/[tag].get.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../../runtime';
 import type { IRawModelCard, IModelCard } from '../../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const tag = getRouterParam(event, 'tag');
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/list-by-tag/${tag}`, event);
@@ -15,7 +16,7 @@ export default defineEventHandler(async (event) => {
 
   const items: IRawModelCard[] = rawData.data?.items || [];
 
-  const cleanedItems: IModelCard[] = items.map(cleanModelCard);
+  const cleanedItems: IModelCard[] = items.map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: rawData.data?.current_page,

package/server/api/models/related.get.ts

@@ -2,6 +2,7 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../runtime';
 import type { IRawModelCard, IModelCard } from '../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/related`, event);
 
@@ -14,7 +15,7 @@ export default defineEventHandler(async (event) => {
 
   const items: IRawModelCard[] = rawData.data?.items || [];
 
-  const cleanedItems: IModelCard[] = items.map(cleanModelCard);
+  const cleanedItems: IModelCard[] = items.map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: rawData.data?.current_page,

package/server/api/models/top.get.ts

@@ -2,12 +2,13 @@ import { cleanModelCard, getUrlWithProxiedParams } from '../../../runtime';
 import type { IRawModelCard, IModelCard, PaginatedResponse } from '../../../types';
 
 export default defineEventHandler(async (event) => {
+  const theme = useRuntimeConfig(event).public.theme;
   const apiUrl = process.env.NUXT_PUBLIC_API_DOMAIN;
   const url = getUrlWithProxiedParams(`${apiUrl}/v2/models/top`, event);
 
   const data = await cachedApiFetch<PaginatedResponse<IRawModelCard>>(url, event);
 
-  const cleanedItems: IModelCard[] = (data?.items || []).map(cleanModelCard);
+  const cleanedItems: IModelCard[] = (data?.items || []).map(card => cleanModelCard(card, theme));
 
   return {
     currentPage: data?.current_page,

package/stubs/library-follows.ts

@@ -68,21 +68,21 @@ function buildVideos(slug: string, offset: number, newCount: number): LibraryFol
 
 /** Порядок по числу новинок намеренно не совпадает с алфавитным — иначе обе сортировки дают одно и то же. */
 const MODELS = [
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Jax Thirio', image: 'portrait-2-300.webp', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
-  { title: 'Austin Young', image: 'portrait-3-300.webp', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
-  { title: 'Devin Franco', image: 'portrait-4-300.webp', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Jax Thirio', image: 'portrait-2-300.webp', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
-  { title: 'Austin Young', image: 'portrait-3-300.webp', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
-  { title: 'Devin Franco', image: 'portrait-4-300.webp', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Dakota Lovell', image: 'portrait-1-300.webp', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
-  { title: 'Jax Thirio', image: 'portrait-2-300.webp', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
-  { title: 'Austin Young', image: 'portrait-3-300.webp', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
-  { title: 'Devin Franco', image: 'portrait-4-300.webp', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Jax Thirio', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
+  { title: 'Austin Young', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
+  { title: 'Devin Franco', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Jax Thirio', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
+  { title: 'Austin Young', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
+  { title: 'Devin Franco', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Dakota Lovell', country: { name: 'us', title: 'USA' }, age: 22, videosCount: 41, newCount: 3, guyType: 'Twink', bodyBuild: 'Slim', ethnicity: 'Caucasian', updatedAgo: 6 * HOUR, videoOffset: 3 },
+  { title: 'Jax Thirio', country: { name: 'ca', title: 'Canada' }, age: 38, videosCount: 17, newCount: 2, guyType: 'Daddy', bodyBuild: 'Muscular', ethnicity: 'Latino', updatedAgo: 2 * DAY, videoOffset: 9 },
+  { title: 'Austin Young', country: { name: 'us', title: 'USA' }, age: 24, videosCount: 75, newCount: 1, guyType: 'Twink', bodyBuild: 'Athletic', ethnicity: 'Caucasian', updatedAgo: 9 * DAY, videoOffset: 0 },
+  { title: 'Devin Franco', country: { name: 'us', title: 'USA' }, age: 33, videosCount: 24, newCount: 0, guyType: 'Jock', bodyBuild: 'Muscular', ethnicity: 'Black', updatedAgo: 21 * DAY, videoOffset: 6 },
 ];
 
 const CHANNELS = [
@@ -136,13 +136,13 @@ const PLAYLISTS = [
 export function getLibraryModelsStub(): LibraryModelStub[] {
   const stamp = now();
 
-  return MODELS.map(({ image, updatedAgo, videoOffset, ...model }) => {
+  return MODELS.map(({ updatedAgo, videoOffset, ...model }) => {
     const guid = toSlug(model.title);
 
     return {
       ...model,
       guid,
-      avatarUrl: `/img/models/${image}`,
+      avatarUrl: '',
       lastVideoAddedAt: stamp - updatedAgo,
       videos: buildVideos(guid, videoOffset, model.newCount),
     };

package/types/card-info.d.ts

@@ -1,6 +1,5 @@
 import type { IParameterModel } from './parameter-model';
 import type { IChipsItem } from './chips-item';
-import type { IModelImageUrls } from './model-image-urls';
 import type { IPageSeo } from './page-seo';
 
 export interface ICardInfo {
@@ -10,8 +9,6 @@ export interface ICardInfo {
   img?: string;
   /** Тот же кадр в avif. Есть — рендерится через `<picture>`, `img` фолбэком. */
   imgAvifUrl?: string;
-  /** Ладдер портрета под srcset. Нет — рендерится один `img`. */
-  imgUrls?: IModelImageUrls;
   guid?: string;
   fullDescription?: string
   miniCardTitle?: string

package/types/index.d.ts

@@ -2,9 +2,8 @@ export * from './site.d.ts';
 export * from './video-data.d.ts';
 export * from './video-card.d.ts';
 export * from './thumbs-urls.d.ts';
-export * from './model-image-urls.d.ts';
 export * from './raw/raw-thumbs-urls.d.ts';
-export * from './raw/raw-model-image-urls.d.ts';
+export * from './raw/raw-portraits.d.ts';
 export * from './raw/raw-category-info.d.ts';
 export * from './raw/raw-category-card.d.ts';
 export * from './raw/raw-channel-card.d.ts';

package/types/model-card.d.ts

@@ -1,5 +1,3 @@
-import type { IModelImageUrls } from './model-image-urls';
-
 export interface IModelCard {
   title: string;
   videosCount: number;
@@ -10,8 +8,6 @@ export interface IModelCard {
   /** Мелкая ступень 300w: круглые аватары, мини-карточки, подсказки поиска. */
   primaryImageSmallUrl?: string;
   primaryImageSmallAvifUrl?: string;
-  /** Ладдер портрета под srcset. Нет — карточка рендерит один `primaryImageUrl`. */
-  primaryImageUrls?: IModelImageUrls;
   guid: string;
   age?: string;
   country?: {

package/types/raw/raw-model-card.d.ts

@@ -1,5 +1,5 @@
 import type { IRawThumbUrls } from './raw-thumbs-urls';
-import type { IRawModelImageUrls } from './raw-model-image-urls';
+import type { IRawPortraits } from './raw-portraits';
 import type { IModelParameter } from '~/types';
 
 export interface IRawModelCard {
@@ -9,7 +9,7 @@ export interface IRawModelCard {
   guid: string;
   likes: number;
   primary_image_url: string;
-  primary_image_urls?: IRawModelImageUrls;
+  portraits?: IRawPortraits;
   number_of_videos_in_recent_days: number;
   orientation: string;
 

package/types/raw/raw-model-info.d.ts

@@ -1,4 +1,5 @@
 import type { IRawThumbUrls } from './raw-thumbs-urls';
+import type { IRawPortraits } from './raw-portraits';
 import type { IParameterModel, IPageSeo } from '~/types';
 
 export interface IRawModelInfo {
@@ -29,6 +30,7 @@ export interface IRawModelInfo {
   thumb_number: number;
   views: number;
   primary_image_md5: string;
+  portraits?: IRawPortraits;
   rank: number;
   number_of_videos_in_recent_days: number;
   video_thumb_urls: IRawThumbUrls;

package/types/raw/raw-portraits.d.ts

@@ -0,0 +1,22 @@
+/** Один файл портрета: пара форматов и габариты. */
+export interface IRawPortraitFile {
+  width: number;
+  height: number;
+  webp: string;
+  avif: string;
+}
+
+/**
+ * Набор портретов одного варианта: вертикальный под карточку каталога и квадратный кроп по
+ * лицу под круглые аватары, мини-карточки и подсказки поиска.
+ */
+export interface IRawPortraitVariant {
+  tall?: IRawPortraitFile;
+  square?: IRawPortraitFile;
+}
+
+/**
+ * Варианты портретов, ключ — фон съёмки (`dark` и т.п.). API может вернуть несколько; какой
+ * из них наш, решает `pickPortraitVariant`.
+ */
+export type IRawPortraits = Record<string, IRawPortraitVariant>;

package/types/round-card.d.ts

@@ -1,12 +1,8 @@
-import type { IModelImageUrls } from './model-image-urls';
-
 export interface IRoundCard {
   title: string
   primaryImageUrl: string
   /** Тот же портрет в avif. Есть — карточка отдаёт его через `<picture>`, webp фолбэком. */
   primaryImageAvifUrl?: string
-  /** Ладдер портрета под srcset. Нет — карточка рендерит один `primaryImageUrl`. */
-  primaryImageUrls?: IModelImageUrls
   videosCount: number
   link: string
   /** Новинки с прошлого захода — бейдж на аватаре (страница подписок) */

package/types/search-top-models.d.ts

@@ -1,4 +1,4 @@
-import type { IModelImageUrls } from './model-image-urls';
+import type { IRawPortraits } from './raw/raw-portraits';
 
 export interface ISearchTopModelsType {
   videosCount?: number
@@ -6,6 +6,6 @@ export interface ISearchTopModelsType {
   title: string
   primaryImageUrl?: string
   primaryImageAvifUrl?: string
-  /** Ладдер портрета под srcset. Нет — рендерится один `primaryImageUrl`. */
-  primaryImageUrls?: IModelImageUrls
+  /** Приходит из multi-suggest как есть: там общий snake→camel, отдельного клинера нет. */
+  portraits?: IRawPortraits
 }

package/composables/use-test-model-images.ts

@@ -1,69 +0,0 @@
-export interface ITestModelPortrait {
-  primaryImageUrl: string;
-  thumbUrl: string;
-  primaryImageAvifUrl?: string;
-  primaryImageSmallUrl?: string;
-  primaryImageSmallAvifUrl?: string;
-}
-
-/** Модели из тестовой поставки нарезчика: `public/img/models/<guid>{,-640,-256}.{png,webp,avif}`. */
-const PORTRAIT_GUIDS = [
-  '00003fff-0aa5-4e65-9356-7e01358408fe',
-  '0000cca2-8ec5-4c12-950f-4460920805b9',
-  '0002b6da-f82d-484a-aa0b-9a7f9ecb11da',
-  '00038fca-1453-40d8-8ace-66ea034c804e',
-  '0004202c-10a1-461b-9f80-e3c0fafdff04',
-  '0004c061-1393-42d0-8582-29952591129f',
-  '0006f78f-e668-4c35-9370-a936565780a4',
-  '0006fe81-996a-4ab3-b5b9-27285dd1c2cd',
-  '00072f5d-6068-4fa0-a22f-16b07d6f4e6b',
-  '000785cd-9500-4915-a7f4-836dda420f34',
-];
-
-/**
- * Тестовые портреты моделей:
- *
- * - `?img=png` — исходники 1024×1536;
- * - `?img=444` — наш avif в полной цветности 4:4:4 при том же качестве яркости, что у поставки
- *   нарезчика (она в 4:2:0). Сравнение стоит вести по цвету: губы, румянец, переходы кожи;
- * - без параметра — нарезка по `DOCS/MODEL-IMAGES.md`: один 640w, avif через `<picture>`.
- *
- * Две ширины, выбирает их КОМПОНЕНТ, а не браузер: srcset мы не ставим. 640w — портрет в
- * карточку сетки, 256w — квадратный кроп по лицу в круглые аватары, мини-карточки и подсказки
- * поиска.
- *
- * Ступеней через srcset НЕ делаем. Ступень мельче слота заведомо хуже полного файла: её портит
- * двойной пересчёт (ресайз нарезчика плюс браузерный), а её артефакты показываются почти 1:1,
- * тогда как 640w в слоте карточки ужимается в 2.5 раза и они размазываются. Проверено на
- * DPR1-мониторе: ладдер мылит, один файл нет.
- *
- * Пробовали поднять ширину до 800 и 1024 при том же весе: на DPR1-мониторе рядом с исходником
- * они чуть чище. Но без эталона под рукой разницу не поймать, а у пользователя эталона нет —
- * остались на 640.
- *
- * Читается один раз на монтировании, поэтому переключение — перезагрузкой, а не навигацией
- * по query. Для замера сети это и нужно: он честен только с чистого захода.
- */
-export function useTestModelImages() {
-  const format = String(useRoute().query['img'] || '');
-
-  const portraits: ITestModelPortrait[] = PORTRAIT_GUIDS.map((guid) => {
-    const base = `/img/models/${guid}`;
-
-    if (format === 'png') {
-      return { primaryImageUrl: `${base}.png`, thumbUrl: `${base}.png` };
-    }
-
-    return {
-      primaryImageUrl: `${base}-640.webp`,
-      thumbUrl: `${base}-256.webp`,
-      primaryImageSmallUrl: `${base}-256.webp`,
-      primaryImageAvifUrl: format === '444' ? `${base}-640-444.avif` : `${base}-640.avif`,
-      primaryImageSmallAvifUrl: format === '444' ? `${base}-256-444.avif` : `${base}-256.avif`,
-    };
-  });
-
-  const portraitAt = (index: number) => portraits[index % portraits.length]!;
-
-  return { portraits, portraitAt };
-}

package/types/model-image-urls.d.ts

@@ -1,14 +0,0 @@
-/**
- * Ладдер портрета модели. Ключ — ширина в пикселях, высота не фиксирована.
- *
- * Портреты НЕ приводятся к 3:4 нарезкой — обрезает `object-fit` в карточке. Предварительный
- * кроп менял габариты файла, а вместе с ними и цепочку уменьшения в браузере, и картинка
- * заметно мылила при тех же самых пикселях. Проверено на живой вёрстке.
- *
- * Только webp: avif на портретах проигрывал по точности и почти не выигрывал по весу, а
- * держать ради него `<picture>` в `UiImg` не окупалось.
- */
-export interface IModelImageUrls {
-  avif?: Record<string, string>;
-  webp: Record<string, string>;
-}

package/types/raw/raw-model-image-urls.d.ts

@@ -1,5 +0,0 @@
-/** Raw портрет модели из API. Ключ — ширина в пикселях, см. `IModelImageUrls`. */
-export interface IRawModelImageUrls {
-  jpeg?: Record<string, string>;
-  webp?: Record<string, string>;
-}