diff --git a/admin/lib/schema.js b/admin/lib/schema.js index e86119c..1e68672 100644 --- a/admin/lib/schema.js +++ b/admin/lib/schema.js @@ -173,8 +173,8 @@ module.exports = [ { key: 'image', label: 'Bildschirmfoto', type: 'image' }, { key: 'mobileImage', label: 'Handy-Ansicht (Hochformat, leer = kein Handy)', type: 'image' }, { key: 'video', label: 'Video im Laptop (Pfad zu einer .mp4, leer = Standbild)', type: 'text' }, - { key: 'fullImage', label: 'Ganze Seite, Computer (Pfad, öffnet sich beim Anklicken; leer = nicht vergrößerbar)', type: 'text' }, - { key: 'fullMobileImage', label: 'Ganze Seite, Handy (Pfad, öffnet sich beim Anklicken)', type: 'text' }, + { key: 'fullImage', label: 'Ganze Seite, Computer (Ordner mit Streifen, z. B. /mappe/ganz/name/; leer = nicht vergrößerbar)', type: 'text' }, + { key: 'fullMobileImage', label: 'Ganze Seite, Handy (Ordner mit Streifen, z. B. /mappe/ganz/name-mobil/)', type: 'text' }, { key: 'kategorie', label: 'Kategorie', type: 'text' }, { key: 'titel', label: 'Titel / Name', type: 'text' }, { key: 'aufgabe', label: 'Die Aufgabe (leer = nur Text zeigen)', type: 'textarea' }, diff --git a/content/site.json b/content/site.json index 537a02e..9a424c9 100644 --- a/content/site.json +++ b/content/site.json @@ -187,8 +187,8 @@ "image": "/mappe/elektro-rabe.webp", "mobileImage": "/mappe/elektro-rabe-mobil.webp", "video": "/mappe/elektro-rabe.mp4", - "fullImage": "/mappe/elektro-rabe-ganz.webp", - "fullMobileImage": "/mappe/elektro-rabe-mobil-ganz.webp" + "fullImage": "/mappe/ganz/elektro-rabe/", + "fullMobileImage": "/mappe/ganz/elektro-rabe-mobil/" }, { "kategorie": "Konzeptarbeit · Tanzstudio", @@ -199,8 +199,8 @@ "image": "/mappe/maison-verte.webp", "mobileImage": "/mappe/maison-verte-mobil.webp", "video": "/mappe/maison-verte.mp4", - "fullImage": "/mappe/maison-verte-ganz.webp", - "fullMobileImage": "/mappe/maison-verte-mobil-ganz.jpg" + "fullImage": "/mappe/ganz/maison-verte/", + "fullMobileImage": "/mappe/ganz/maison-verte-mobil/" }, { "kategorie": "Konzeptarbeit · Kosmetikstudio", @@ -211,8 +211,8 @@ "image": "/mappe/atelier-rosenhain.webp", "mobileImage": "/mappe/atelier-rosenhain-mobil.webp", "video": "", - "fullImage": "/mappe/atelier-rosenhain-ganz.webp", - "fullMobileImage": "/mappe/atelier-rosenhain-mobil-ganz.webp" + "fullImage": "/mappe/ganz/atelier-rosenhain/", + "fullMobileImage": "/mappe/ganz/atelier-rosenhain-mobil/" } ] }, diff --git a/public/mappe/atelier-rosenhain-ganz.webp b/public/mappe/atelier-rosenhain-ganz.webp deleted file mode 100644 index 74c6cb4..0000000 Binary files a/public/mappe/atelier-rosenhain-ganz.webp and /dev/null differ diff --git a/public/mappe/atelier-rosenhain-mobil-ganz.webp b/public/mappe/atelier-rosenhain-mobil-ganz.webp deleted file mode 100644 index 45fa622..0000000 Binary files a/public/mappe/atelier-rosenhain-mobil-ganz.webp and /dev/null differ diff --git a/public/mappe/elektro-rabe-ganz.webp b/public/mappe/elektro-rabe-ganz.webp deleted file mode 100644 index 881a3f0..0000000 Binary files a/public/mappe/elektro-rabe-ganz.webp and /dev/null differ diff --git a/public/mappe/elektro-rabe-mobil-ganz.webp b/public/mappe/elektro-rabe-mobil-ganz.webp deleted file mode 100644 index 7020cdf..0000000 Binary files a/public/mappe/elektro-rabe-mobil-ganz.webp and /dev/null differ diff --git a/public/mappe/ganz/atelier-rosenhain-mobil/000-780x1700.webp b/public/mappe/ganz/atelier-rosenhain-mobil/000-780x1700.webp new file mode 100644 index 0000000..52db114 Binary files /dev/null and b/public/mappe/ganz/atelier-rosenhain-mobil/000-780x1700.webp differ diff --git a/public/mappe/ganz/atelier-rosenhain-mobil/001-780x2496.webp b/public/mappe/ganz/atelier-rosenhain-mobil/001-780x2496.webp new file mode 100644 index 0000000..cd3fc6e Binary files /dev/null and b/public/mappe/ganz/atelier-rosenhain-mobil/001-780x2496.webp differ diff --git a/public/mappe/ganz/atelier-rosenhain/000-1440x900.webp b/public/mappe/ganz/atelier-rosenhain/000-1440x900.webp new file mode 100644 index 0000000..a96e098 Binary files /dev/null and b/public/mappe/ganz/atelier-rosenhain/000-1440x900.webp differ diff --git a/public/mappe/ganz/atelier-rosenhain/001-1440x263.webp b/public/mappe/ganz/atelier-rosenhain/001-1440x263.webp new file mode 100644 index 0000000..c9b685f Binary files /dev/null and b/public/mappe/ganz/atelier-rosenhain/001-1440x263.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/000-780x1700.webp b/public/mappe/ganz/elektro-rabe-mobil/000-780x1700.webp new file mode 100644 index 0000000..79e0e0b Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/000-780x1700.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/001-780x3200.webp b/public/mappe/ganz/elektro-rabe-mobil/001-780x3200.webp new file mode 100644 index 0000000..56325d1 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/001-780x3200.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/002-780x3200.webp b/public/mappe/ganz/elektro-rabe-mobil/002-780x3200.webp new file mode 100644 index 0000000..ef33741 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/002-780x3200.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/003-780x3200.webp b/public/mappe/ganz/elektro-rabe-mobil/003-780x3200.webp new file mode 100644 index 0000000..1259d49 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/003-780x3200.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/004-780x3200.webp b/public/mappe/ganz/elektro-rabe-mobil/004-780x3200.webp new file mode 100644 index 0000000..87e4668 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/004-780x3200.webp differ diff --git a/public/mappe/ganz/elektro-rabe-mobil/005-780x1318.webp b/public/mappe/ganz/elektro-rabe-mobil/005-780x1318.webp new file mode 100644 index 0000000..55d309f Binary files /dev/null and b/public/mappe/ganz/elektro-rabe-mobil/005-780x1318.webp differ diff --git a/public/mappe/ganz/elektro-rabe/000-1440x900.webp b/public/mappe/ganz/elektro-rabe/000-1440x900.webp new file mode 100644 index 0000000..75cea1a Binary files /dev/null and b/public/mappe/ganz/elektro-rabe/000-1440x900.webp differ diff --git a/public/mappe/ganz/elektro-rabe/001-1440x1800.webp b/public/mappe/ganz/elektro-rabe/001-1440x1800.webp new file mode 100644 index 0000000..3ca9f9b Binary files /dev/null and b/public/mappe/ganz/elektro-rabe/001-1440x1800.webp differ diff --git a/public/mappe/ganz/elektro-rabe/002-1440x1800.webp b/public/mappe/ganz/elektro-rabe/002-1440x1800.webp new file mode 100644 index 0000000..76e49f3 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe/002-1440x1800.webp differ diff --git a/public/mappe/ganz/elektro-rabe/003-1440x65.webp b/public/mappe/ganz/elektro-rabe/003-1440x65.webp new file mode 100644 index 0000000..5a8a390 Binary files /dev/null and b/public/mappe/ganz/elektro-rabe/003-1440x65.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/000-780x1700.webp b/public/mappe/ganz/maison-verte-mobil/000-780x1700.webp new file mode 100644 index 0000000..4be91fe Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/000-780x1700.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/001-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/001-780x3200.webp new file mode 100644 index 0000000..abb2b2f Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/001-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/002-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/002-780x3200.webp new file mode 100644 index 0000000..cf42c93 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/002-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/003-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/003-780x3200.webp new file mode 100644 index 0000000..0e0d4e1 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/003-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/004-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/004-780x3200.webp new file mode 100644 index 0000000..8f40020 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/004-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/005-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/005-780x3200.webp new file mode 100644 index 0000000..556f1b0 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/005-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/006-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/006-780x3200.webp new file mode 100644 index 0000000..c2be437 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/006-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/007-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/007-780x3200.webp new file mode 100644 index 0000000..8639a91 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/007-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/008-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/008-780x3200.webp new file mode 100644 index 0000000..936fdb3 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/008-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/009-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/009-780x3200.webp new file mode 100644 index 0000000..b13bb28 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/009-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/010-780x3200.webp b/public/mappe/ganz/maison-verte-mobil/010-780x3200.webp new file mode 100644 index 0000000..dcdf890 Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/010-780x3200.webp differ diff --git a/public/mappe/ganz/maison-verte-mobil/011-780x344.webp b/public/mappe/ganz/maison-verte-mobil/011-780x344.webp new file mode 100644 index 0000000..ae8416b Binary files /dev/null and b/public/mappe/ganz/maison-verte-mobil/011-780x344.webp differ diff --git a/public/mappe/ganz/maison-verte/000-1440x900.webp b/public/mappe/ganz/maison-verte/000-1440x900.webp new file mode 100644 index 0000000..a0a2abd Binary files /dev/null and b/public/mappe/ganz/maison-verte/000-1440x900.webp differ diff --git a/public/mappe/ganz/maison-verte/001-1440x1800.webp b/public/mappe/ganz/maison-verte/001-1440x1800.webp new file mode 100644 index 0000000..f0b72d8 Binary files /dev/null and b/public/mappe/ganz/maison-verte/001-1440x1800.webp differ diff --git a/public/mappe/ganz/maison-verte/002-1440x1800.webp b/public/mappe/ganz/maison-verte/002-1440x1800.webp new file mode 100644 index 0000000..3e8adb3 Binary files /dev/null and b/public/mappe/ganz/maison-verte/002-1440x1800.webp differ diff --git a/public/mappe/ganz/maison-verte/003-1440x1800.webp b/public/mappe/ganz/maison-verte/003-1440x1800.webp new file mode 100644 index 0000000..a88881a Binary files /dev/null and b/public/mappe/ganz/maison-verte/003-1440x1800.webp differ diff --git a/public/mappe/ganz/maison-verte/004-1440x1800.webp b/public/mappe/ganz/maison-verte/004-1440x1800.webp new file mode 100644 index 0000000..0513767 Binary files /dev/null and b/public/mappe/ganz/maison-verte/004-1440x1800.webp differ diff --git a/public/mappe/ganz/maison-verte/005-1440x1800.webp b/public/mappe/ganz/maison-verte/005-1440x1800.webp new file mode 100644 index 0000000..fb979af Binary files /dev/null and b/public/mappe/ganz/maison-verte/005-1440x1800.webp differ diff --git a/public/mappe/ganz/maison-verte/006-1440x791.webp b/public/mappe/ganz/maison-verte/006-1440x791.webp new file mode 100644 index 0000000..2103188 Binary files /dev/null and b/public/mappe/ganz/maison-verte/006-1440x791.webp differ diff --git a/public/mappe/maison-verte-ganz.webp b/public/mappe/maison-verte-ganz.webp deleted file mode 100644 index 33b3a34..0000000 Binary files a/public/mappe/maison-verte-ganz.webp and /dev/null differ diff --git a/public/mappe/maison-verte-mobil-ganz.jpg b/public/mappe/maison-verte-mobil-ganz.jpg deleted file mode 100644 index 97938db..0000000 Binary files a/public/mappe/maison-verte-mobil-ganz.jpg and /dev/null differ diff --git a/scripts/ganzseiten-kacheln.mjs b/scripts/ganzseiten-kacheln.mjs new file mode 100644 index 0000000..13770e0 --- /dev/null +++ b/scripts/ganzseiten-kacheln.mjs @@ -0,0 +1,43 @@ +// Schneidet die Ganzseitenaufnahmen der Mappe in Streifen, damit die +// Großansicht sofort etwas zeigt und der Rest beim Scrollen nachlädt. +// Aufruf: node scripts/ganzseiten-kacheln.mjs +// Erwartet .png (Computer, 1440 px breit) und -mobil.png (Handy, 780 px). +// Ergebnis: public/mappe/ganz/[-mobil]/NNN-BREITExHOEHE.webp +// Die Maße stehen im Dateinamen, so braucht der Build kein Bildwerkzeug. +import sharp from 'sharp'; +import { mkdirSync, readdirSync, rmSync } from 'node:fs'; +import { join } from 'node:path'; +import { fileURLToPath } from 'node:url'; + +const quelle = process.argv[2]; +if (!quelle) throw new Error('Ordner mit den PNGs angeben'); +const ziel = new URL('../public/mappe/ganz/', import.meta.url); + +// Erster Streifen klein (schnell sichtbar), danach größere +const STREIFEN = { desktop: [900, 1800], mobil: [1700, 3200] }; + +for (const datei of readdirSync(quelle).filter((f) => f.endsWith('.png') && !f.startsWith('v-'))) { + const name = datei.replace(/\.png$/, ''); + const art = name.endsWith('-mobil') ? 'mobil' : 'desktop'; + const pfad = join(quelle, datei); + const { width, height } = await sharp(pfad, { limitInputPixels: false }).metadata(); + const ordner = new URL(`${name}/`, ziel); + rmSync(ordner, { recursive: true, force: true }); + mkdirSync(ordner, { recursive: true }); + + let top = 0; + let i = 0; + let summe = 0; + while (top < height) { + const h = Math.min(i === 0 ? STREIFEN[art][0] : STREIFEN[art][1], height - top); + const out = new URL(`${String(i).padStart(3, '0')}-${width}x${h}.webp`, ordner); + const info = await sharp(pfad, { limitInputPixels: false }) + .extract({ left: 0, top, width, height: h }) + .webp({ quality: 80 }) + .toFile(fileURLToPath(out)); + summe += info.size; + top += h; + i++; + } + console.log(`${name}: ${i} Streifen, ${Math.round(summe / 1024)} KB`); +} diff --git a/src/components/Devices.astro b/src/components/Devices.astro index 7fd0c65..bd278e6 100644 --- a/src/components/Devices.astro +++ b/src/components/Devices.astro @@ -6,10 +6,12 @@ * Mit `screenZoom`/`phoneZoom` wird das Gerät anklickbar und öffnet die ganze * Seite in der Großansicht (, einmal pro Seite eingebunden). */ +import type { Streifen } from '../lib/ganzseiten'; + export interface ZoomSource { title: string; - desktop?: string; - mobile?: string; + desktop?: Streifen[]; + mobile?: Streifen[]; } interface Props { @@ -27,8 +29,8 @@ const loading = eager ? 'eager' : 'lazy'; const zoomAttrs = (z: ZoomSource, mode: 'desktop' | 'mobile') => ({ 'data-zoom': mode, 'data-zoom-title': z.title, - 'data-zoom-desktop': z.desktop || undefined, - 'data-zoom-mobile': z.mobile || undefined, + 'data-zoom-desktop': z.desktop ? JSON.stringify(z.desktop) : undefined, + 'data-zoom-mobile': z.mobile ? JSON.stringify(z.mobile) : undefined, 'aria-label': `${z.title} ${mode === 'desktop' ? 'am Computer' : 'auf dem Handy'} vergrößert ansehen`, }); const laptopZoom = screenZoom && (screenZoom.desktop || screenZoom.mobile) ? screenZoom : undefined; diff --git a/src/components/Zoom.astro b/src/components/Zoom.astro index 634415f..5b3e598 100644 --- a/src/components/Zoom.astro +++ b/src/components/Zoom.astro @@ -25,12 +25,12 @@
- +
- +
@@ -39,48 +39,145 @@