diff --git a/landing/app.js b/landing/app.js index ba8d8c3..d422ed9 100644 --- a/landing/app.js +++ b/landing/app.js @@ -35,15 +35,23 @@ // ---------- Slider de capturas ---------- // Dos diapositivas por idioma: tema claro y oscuro. + function shot(base, cap, theme) { + return { + src: "assets/shots/" + base + "-960.webp", + srcset: "assets/shots/" + base + "-320.webp 320w, " + + "assets/shots/" + base + "-640.webp 640w, " + + "assets/shots/" + base + "-960.webp 960w, " + + "assets/shots/" + base + "-1080.webp 1080w, " + + "assets/shots/" + base + ".webp 1800w", + full: "assets/shots/" + base + ".webp", + thumb: "assets/shots/" + base + "-320.webp", + cap: cap, + theme: theme + }; + } var slides = { - es: [ - { src: "assets/shots/main-es-light.webp", cap: "shots.capLight", theme: "light" }, - { src: "assets/shots/main-es-dark.webp", cap: "shots.capDark", theme: "dark" } - ], - en: [ - { src: "assets/shots/main-en-light.webp", cap: "shots.capLight", theme: "light" }, - { src: "assets/shots/main-en-dark.webp", cap: "shots.capDark", theme: "dark" } - ] + es: [shot("main-es-light", "shots.capLight", "light"), shot("main-es-dark", "shots.capDark", "dark")], + en: [shot("main-en-light", "shots.capLight", "light"), shot("main-en-dark", "shots.capDark", "dark")] }; var slideImg = document.getElementById("slideImg"); var slideCaption = document.getElementById("slideCaption"); @@ -65,7 +73,7 @@ b.setAttribute("aria-label", dict[s.cap] || ""); b.tabIndex = i === slideIndex ? 0 : -1; var img = document.createElement("img"); - img.src = s.src; img.alt = ""; img.loading = "lazy"; img.decoding = "async"; + img.src = s.thumb; img.alt = ""; img.loading = "lazy"; img.decoding = "async"; img.width = 96; img.height = 64; b.appendChild(img); b.addEventListener("click", function () { showSlide(i); }); @@ -83,6 +91,7 @@ slideIndex = mod(i, list.length); var s = list[slideIndex]; slideImg.src = s.src; + slideImg.srcset = s.srcset; slideCaption.textContent = (I18N[lang] || I18N.es)[s.cap] || ""; [...thumbs.children].forEach(function (b, j) { b.setAttribute("aria-selected", j === slideIndex ? "true" : "false"); @@ -214,7 +223,7 @@ // ---------- Lightbox ---------- slideImg.addEventListener("click", function () { if (suppressLightbox) { suppressLightbox = false; return; } - lightboxImg.src = slideImg.src; + lightboxImg.src = activeSlides()[slideIndex].full; lightboxImg.alt = slideImg.alt; lightbox.showModal(); }); diff --git a/landing/assets/shots/main-en-dark-1080.webp b/landing/assets/shots/main-en-dark-1080.webp new file mode 100644 index 0000000..7be02ea Binary files /dev/null and b/landing/assets/shots/main-en-dark-1080.webp differ diff --git a/landing/assets/shots/main-en-dark-320.webp b/landing/assets/shots/main-en-dark-320.webp new file mode 100644 index 0000000..6e686f0 Binary files /dev/null and b/landing/assets/shots/main-en-dark-320.webp differ diff --git a/landing/assets/shots/main-en-dark-640.webp b/landing/assets/shots/main-en-dark-640.webp new file mode 100644 index 0000000..8e6b886 Binary files /dev/null and b/landing/assets/shots/main-en-dark-640.webp differ diff --git a/landing/assets/shots/main-en-dark-960.webp b/landing/assets/shots/main-en-dark-960.webp new file mode 100644 index 0000000..a417d34 Binary files /dev/null and b/landing/assets/shots/main-en-dark-960.webp differ diff --git a/landing/assets/shots/main-en-light-1080.webp b/landing/assets/shots/main-en-light-1080.webp new file mode 100644 index 0000000..82743a4 Binary files /dev/null and b/landing/assets/shots/main-en-light-1080.webp differ diff --git a/landing/assets/shots/main-en-light-320.webp b/landing/assets/shots/main-en-light-320.webp new file mode 100644 index 0000000..001fd27 Binary files /dev/null and b/landing/assets/shots/main-en-light-320.webp differ diff --git a/landing/assets/shots/main-en-light-640.webp b/landing/assets/shots/main-en-light-640.webp new file mode 100644 index 0000000..10c46ca Binary files /dev/null and b/landing/assets/shots/main-en-light-640.webp differ diff --git a/landing/assets/shots/main-en-light-960.webp b/landing/assets/shots/main-en-light-960.webp new file mode 100644 index 0000000..5168df1 Binary files /dev/null and b/landing/assets/shots/main-en-light-960.webp differ diff --git a/landing/assets/shots/main-es-dark-1080.webp b/landing/assets/shots/main-es-dark-1080.webp new file mode 100644 index 0000000..13fe948 Binary files /dev/null and b/landing/assets/shots/main-es-dark-1080.webp differ diff --git a/landing/assets/shots/main-es-dark-320.webp b/landing/assets/shots/main-es-dark-320.webp new file mode 100644 index 0000000..9cf4da5 Binary files /dev/null and b/landing/assets/shots/main-es-dark-320.webp differ diff --git a/landing/assets/shots/main-es-dark-640.webp b/landing/assets/shots/main-es-dark-640.webp new file mode 100644 index 0000000..847a69a Binary files /dev/null and b/landing/assets/shots/main-es-dark-640.webp differ diff --git a/landing/assets/shots/main-es-dark-960.webp b/landing/assets/shots/main-es-dark-960.webp new file mode 100644 index 0000000..a7c50b9 Binary files /dev/null and b/landing/assets/shots/main-es-dark-960.webp differ diff --git a/landing/assets/shots/main-es-light-1080.webp b/landing/assets/shots/main-es-light-1080.webp new file mode 100644 index 0000000..703cb14 Binary files /dev/null and b/landing/assets/shots/main-es-light-1080.webp differ diff --git a/landing/assets/shots/main-es-light-320.webp b/landing/assets/shots/main-es-light-320.webp new file mode 100644 index 0000000..498d84c Binary files /dev/null and b/landing/assets/shots/main-es-light-320.webp differ diff --git a/landing/assets/shots/main-es-light-640.webp b/landing/assets/shots/main-es-light-640.webp new file mode 100644 index 0000000..fe6ae9f Binary files /dev/null and b/landing/assets/shots/main-es-light-640.webp differ diff --git a/landing/assets/shots/main-es-light-960.webp b/landing/assets/shots/main-es-light-960.webp new file mode 100644 index 0000000..bb67515 Binary files /dev/null and b/landing/assets/shots/main-es-light-960.webp differ diff --git a/landing/index.html b/landing/index.html index f02ae62..cb8e799 100644 --- a/landing/index.html +++ b/landing/index.html @@ -172,7 +172,11 @@
Capturas reales de la app, en los dos idiomas y los dos temas.