
Naissance de l'œuvre
Le processus de création
Du premier trait à l'œuvre achevée, chaque étape révèle la naissance de « L'Ombre et la Grâce ».
01
Esquisse préparatoire
Les premières lignes posent la silhouette, l'équilibre et la direction du mouvement.
02
Premiers gestes
Les premières touches dorées installent l'énergie, le contraste et la tension de la composition.
03
Mise en peinture
La figure commence à apparaître. Les premières couches de peinture donnent corps à l'œuvre.
04
Œuvre achevée
L'équilibre final se révèle : une présence silencieuse, lumineuse et fragile à la fois.
05
Présence réelle
Une vue de biais révèle le volume, la texture et la présence physique de la toile.
06
Signature au dos
L'œuvre est signée au dos de la toile, identifiée comme pièce unique et accompagnée de son certificat d'authenticité.
✦
Détails de l'œuvre
Chaque gros plan révèle le geste, la lumière et la texture réelle de la peinture.
Détail symbolique
La cicatrice devient le signe visible d'une force intérieure intacte.
Matière picturale
Les touches dorées révèlent le mouvement de la robe et la lumière du corps.
Authenticité
Cette œuvre originale est signée à la main, accompagnée de son certificat d'authenticité et identifiée comme pièce unique — 1/1.

Naissance de l'œuvre
Le processus de création
Du premier trait à l'œuvre achevée, chaque étape révèle la naissance de « L'Ombre et la Grâce ».
Glissez pour découvrir
01
Esquisse préparatoire
Les premières lignes posent la silhouette, l'équilibre et la direction du mouvement.
02
Premiers gestes
Les premières touches dorées installent l'énergie, le contraste et la tension de la composition.
03
Mise en peinture
La figure commence à apparaître. Les premières couches de peinture donnent corps à l'œuvre.
04
Œuvre achevée
L'équilibre final se révèle : une présence silencieuse, lumineuse et fragile à la fois.
05
Présence réelle
Une vue de biais révèle le volume, la texture et la présence physique de la toile.
06
Signature au dos
L'œuvre est signée au dos de la toile, identifiée comme pièce unique et accompagnée de son certificat.
✦
Détails de l'œuvre
Chaque gros plan révèle le geste, la lumière et la texture réelle de la peinture.
Détail symbolique
La cicatrice devient le signe visible d'une force intérieure intacte.
Matière picturale
Les touches dorées révèlent le mouvement de la robe et la lumière du corps.
Authenticité
Cette œuvre originale est signée à la main, accompagnée de son certificat d'authenticité et identifiée comme pièce unique — 1/1.
(function() { var ticking = false; var lastVisible = null; function isMobileProcessLogoMode() { return window.innerWidth <= 768; } function getOrCreateLogo() { var logo = document.getElementById("mrProcessMobileFixedHome"); if (logo) { return logo; } logo = document.createElement("a"); logo.id = "mrProcessMobileFixedHome"; logo.href = "#home"; logo.setAttribute("aria-label", "Accueil"); document.body.appendChild(logo); return logo; } function shouldShowLogo() { var section = document.querySelector(".mrpm"); if (!section || !isMobileProcessLogoMode()) { return false; } var rect = section.getBoundingClientRect(); return ( rect.top <= 90 && rect.top > -170 && rect.bottom > 240 ); } function setLogoVisible(visible) { var logo = getOrCreateLogo(); if (!logo) { return; } if (lastVisible === visible) { return; } lastVisible = visible; if (visible) { logo.classList.add("is-instant"); logo.classList.add("is-visible"); window.setTimeout(function() { logo.classList.remove("is-instant"); }, 120); } else { logo.classList.remove("is-instant"); logo.classList.remove("is-visible"); } } function updateMobileProcessLogo() { setLogoVisible(shouldShowLogo()); } function requestMobileProcessLogoUpdate() { if (ticking) { return; } ticking = true; window.requestAnimationFrame(function() { updateMobileProcessLogo(); ticking = false; }); } function initMobileProcessLogo() { getOrCreateLogo(); updateMobileProcessLogo(); window.addEventListener("scroll", requestMobileProcessLogoUpdate, { passive: true }); window.addEventListener("resize", requestMobileProcessLogoUpdate); document.addEventListener("visibilitychange", function() { if (!document.hidden) { requestMobileProcessLogoUpdate(); } }); window.addEventListener("pageshow", function() { requestMobileProcessLogoUpdate(); }); window.addEventListener("hashchange", function() { requestMobileProcessLogoUpdate(); window.setTimeout(updateMobileProcessLogo, 180); window.setTimeout(updateMobileProcessLogo, 420); }); } if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", initMobileProcessLogo); } else { initMobileProcessLogo(); } })();
(function() { var current = 0; var slides = []; var mrTouchStartX = 0; var mrTouchStartY = 0; var mrTouchTracking = false; var mrGalleryHistoryOpen = false; var mrIgnoreNextPopstate = false; function isMobile() { return window.innerWidth <= 768; } function getVisibleFrames() { var selector = isMobile() ? ".mrpm .mrpm-img" : ".mrp .mrp-img, .mrp .mrp-detail-img"; return Array.prototype.slice.call(document.querySelectorAll(selector)); } function getArticle(frame) { return frame.closest("article") || frame.parentElement; } function getTitle(frame) { var article = getArticle(frame); var title = article ? article.querySelector("h3, h4") : null; var titleText = title ? title.textContent.trim() : "Œuvre"; if (isMobile() && titleText === "Esquisse préparatoire") { return "Esquisse"; } return titleText; } function getText(frame) { var article = getArticle(frame); var text = article ? article.querySelector("p") : null; return text ? text.textContent.trim() : ""; } function getNumber(frame, index) { var article = getArticle(frame); var number = article ? article.querySelector(".mrp-num, .mrpm-num") : null; return number ? number.textContent.trim() : String(index + 1).padStart(2, "0"); } function buildSlides() { slides = []; getVisibleFrames().forEach(function(frame, index) { var img = frame.querySelector("img"); if (!img) { return; } slides.push({ frame: frame, src: img.currentSrc || img.src, alt: img.alt || "", num: getNumber(frame, index), title: getTitle(frame), text: getText(frame) }); }); } function addGalleryHideStyle() { if (document.getElementById("mrEmergencyGalleryHideStyle")) { return; } var style = document.createElement("style"); style.id = "mrEmergencyGalleryHideStyle"; style.textContent = "html.mr-emergency-gallery-open #mrProcessViewportLogoFinal," + "html.mr-emergency-gallery-open #mrProcessMobileFixedHome," + "html.mr-emergency-gallery-open .mrpm-logo-progress-final," + "html.mr-emergency-gallery-open .mrpm-fixed-logo-final," + "html.mr-emergency-gallery-open .mrpm-clean-process-logo-v10," + "html.mr-emergency-gallery-open .mrpm-home," + "html.mr-emergency-gallery-open .mrp-home," + "html.mr-emergency-gallery-open .mrpm a[aria-label='Accueil']," + "html.mr-emergency-gallery-open .mrp a[aria-label='Accueil']{" + "opacity:0!important;" + "visibility:hidden!important;" + "pointer-events:none!important;" + "filter:none!important;" + "}" + "#mrEmergencyClose{" + "display:none!important;" + "opacity:0!important;" + "visibility:hidden!important;" + "pointer-events:none!important;" + "}"; document.head.appendChild(style); } function setGalleryOpenState(open) { if (open) { document.documentElement.classList.add("mr-emergency-gallery-open"); return; } document.documentElement.classList.remove("mr-emergency-gallery-open"); window.dispatchEvent(new Event("scroll")); window.setTimeout(function() { window.dispatchEvent(new Event("scroll")); }, 80); } function pushGalleryHistory() { if (mrGalleryHistoryOpen) { return; } try { window.history.pushState( { mrEmergencyGallery: true }, "", window.location.href ); mrGalleryHistoryOpen = true; } catch(e) {} } window.addEventListener("popstate", function() { if (mrIgnoreNextPopstate) { mrIgnoreNextPopstate = false; return; } var overlay = document.getElementById("mrEmergencyGallery"); if (overlay && overlay.style.display === "block") { closeGallery(true); } }); function addMobileSwipeStyle() { if (document.getElementById("mrMobileSwipeStyle")) { return; } var style = document.createElement("style"); style.id = "mrMobileSwipeStyle"; style.textContent = "@media(max-width:768px){" + "#mrEmergencyPrev,#mrEmergencyNext{" + "display:none!important;" + "visibility:hidden!important;" + "opacity:0!important;" + "pointer-events:none!important;" + "}" + ".mr-mobile-swipe-line{" + "position:fixed!important;" + "z-index:100000000!important;" + "width:34px!important;" + "height:1px!important;" + "pointer-events:none!important;" + "display:none;" + "background:linear-gradient(90deg,transparent,rgba(216,189,134,.92),transparent)!important;" + "box-shadow:0 0 12px rgba(216,189,134,.38)!important;" + "}" + ".mr-mobile-swipe-line:after{" + "content:''!important;" + "position:absolute!important;" + "left:50%!important;" + "top:50%!important;" + "width:4px!important;" + "height:4px!important;" + "border-radius:50%!important;" + "background:rgba(216,189,134,.82)!important;" + "transform:translate(-50%,-50%)!important;" + "box-shadow:0 0 12px rgba(216,189,134,.5)!important;" + "}" + "#mrMobileSwipeLeft{" + "animation:mrMobileSwipeLeft 1.45s ease-in-out infinite!important;" + "}" + "#mrMobileSwipeRight{" + "animation:mrMobileSwipeRight 1.45s ease-in-out infinite!important;" + "}" + "@keyframes mrMobileSwipeLeft{" + "0%{opacity:0;transform:translateX(-12px)}" + "30%{opacity:.72}" + "100%{opacity:0;transform:translateX(16px)}" + "}" + "@keyframes mrMobileSwipeRight{" + "0%{opacity:0;transform:translateX(12px)}" + "30%{opacity:.72}" + "100%{opacity:0;transform:translateX(-16px)}" + "}" + "}"; document.head.appendChild(style); } function updateMobileSwipeLines() { var overlay = document.getElementById("mrEmergencyGallery"); var image = document.getElementById("mrEmergencyImage"); var left = document.getElementById("mrMobileSwipeLeft"); var right = document.getElementById("mrMobileSwipeRight"); if (!left || !right) { return; } if (!isMobile() || !overlay || overlay.style.display !== "block" || !image) { left.style.display = "none"; right.style.display = "none"; return; } var rect = image.getBoundingClientRect(); if (!rect.width || !rect.height) { left.style.display = "none"; right.style.display = "none"; return; } var y = rect.top + rect.height / 2; var leftGap = rect.left; var rightGap = window.innerWidth - rect.right; var leftX = Math.max(8, (leftGap / 2) - 17); var rightX = rect.right + Math.max(8, (rightGap / 2) - 17); if (rightX > window.innerWidth - 42) { rightX = window.innerWidth - 42; } left.style.left = leftX + "px"; left.style.top = y + "px"; right.style.left = rightX + "px"; right.style.top = y + "px"; if (current > 0) { left.style.display = "block"; } else { left.style.display = "none"; } if (current < slides.length - 1) { right.style.display = "block"; } else { right.style.display = "none"; } } function makeButton(text) { var btn = document.createElement("button"); btn.type = "button"; btn.textContent = text; btn.style.border = "1px solid rgba(255,255,255,.28)"; btn.style.background = "rgba(0,0,0,.46)"; btn.style.color = "rgba(255,255,255,.86)"; btn.style.cursor = "pointer"; btn.style.fontFamily = "Arial, sans-serif"; return btn; } function createOverlay() { var old = document.getElementById("mrEmergencyGallery"); if (old) { return old; } addGalleryHideStyle(); addMobileSwipeStyle(); var overlay = document.createElement("div"); overlay.id = "mrEmergencyGallery"; overlay.style.position = "fixed"; overlay.style.inset = "0"; overlay.style.zIndex = "99999999"; overlay.style.display = "none"; overlay.style.background = "rgba(0,0,0,.965)"; overlay.style.color = "#f2eadf"; overlay.style.padding = "34px"; overlay.style.boxSizing = "border-box"; overlay.style.fontFamily = "Arial, sans-serif"; var close = makeButton("Fermer"); close.id = "mrEmergencyClose"; close.style.position = "fixed"; close.style.top = "26px"; close.style.right = "28px"; close.style.zIndex = "3"; close.style.height = "38px"; close.style.padding = "0 18px"; close.style.fontSize = "9px"; close.style.letterSpacing = ".16em"; close.style.textTransform = "uppercase"; close.style.display = "none"; close.style.opacity = "0"; close.style.visibility = "hidden"; close.style.pointerEvents = "none"; var prev = makeButton("‹"); prev.id = "mrEmergencyPrev"; prev.style.position = "fixed"; prev.style.left = "24px"; prev.style.top = "50%"; prev.style.zIndex = "3"; prev.style.width = "48px"; prev.style.height = "62px"; prev.style.fontSize = "38px"; prev.style.transform = "translateY(-50%)"; var next = makeButton("›"); next.id = "mrEmergencyNext"; next.style.position = "fixed"; next.style.right = "24px"; next.style.top = "50%"; next.style.zIndex = "3"; next.style.width = "48px"; next.style.height = "62px"; next.style.fontSize = "38px"; next.style.transform = "translateY(-50%)"; var leftLine = document.createElement("div"); leftLine.id = "mrMobileSwipeLeft"; leftLine.className = "mr-mobile-swipe-line"; var rightLine = document.createElement("div"); rightLine.id = "mrMobileSwipeRight"; rightLine.className = "mr-mobile-swipe-line"; var shell = document.createElement("div"); shell.style.width = "100%"; shell.style.height = "100%"; shell.style.display = "grid"; shell.style.gridTemplateRows = "minmax(0,1fr) auto"; shell.style.gap = "22px"; var stage = document.createElement("div"); stage.style.display = "flex"; stage.style.alignItems = "center"; stage.style.justifyContent = "center"; stage.style.minHeight = "0"; var image = document.createElement("img"); image.id = "mrEmergencyImage"; image.style.display = "block"; image.style.maxWidth = "84vw"; image.style.maxHeight = "74vh"; image.style.width = "auto"; image.style.height = "auto"; image.style.objectFit = "contain"; image.style.border = "1px solid rgba(255,255,255,.12)"; image.style.boxShadow = "0 30px 86px rgba(0,0,0,.66)"; image.style.background = "#050505"; var caption = document.createElement("div"); caption.style.maxWidth = "820px"; caption.style.margin = "0 auto"; caption.style.textAlign = "center"; var count = document.createElement("div"); count.id = "mrEmergencyCount"; count.style.marginBottom = "10px"; count.style.fontSize = "9px"; count.style.letterSpacing = ".22em"; count.style.textTransform = "uppercase"; count.style.color = "rgba(216,189,134,.76)"; var title = document.createElement("h3"); title.id = "mrEmergencyTitle"; title.style.margin = "0"; title.style.fontFamily = "Georgia, Times New Roman, serif"; title.style.fontSize = "25px"; title.style.lineHeight = "1.15"; title.style.fontWeight = "400"; title.style.letterSpacing = ".035em"; title.style.textTransform = "uppercase"; title.style.color = "rgba(242,234,223,.92)"; var text = document.createElement("p"); text.id = "mrEmergencyText"; text.style.maxWidth = "680px"; text.style.margin = "12px auto 0"; text.style.fontSize = "13px"; text.style.lineHeight = "1.62"; text.style.color = "rgba(242,234,223,.62)"; var back = makeButton("Retour au processus"); back.style.marginTop = "18px"; back.style.minHeight = "38px"; back.style.padding = "0 22px"; back.style.color = "rgba(216,189,134,.84)"; back.style.border = "1px solid rgba(216,189,134,.42)"; back.style.fontSize = "9px"; back.style.letterSpacing = ".16em"; back.style.textTransform = "uppercase"; stage.appendChild(image); caption.appendChild(count); caption.appendChild(title); caption.appendChild(text); caption.appendChild(back); shell.appendChild(stage); shell.appendChild(caption); overlay.appendChild(close); overlay.appendChild(prev); overlay.appendChild(next); overlay.appendChild(leftLine); overlay.appendChild(rightLine); overlay.appendChild(shell); document.body.appendChild(overlay); close.addEventListener("click", function() { closeGallery(false); }); back.addEventListener("click", function() { closeGallery(false); }); prev.addEventListener("click", function(e) { e.preventDefault(); e.stopPropagation(); showSlide(current - 1); }); next.addEventListener("click", function(e) { e.preventDefault(); e.stopPropagation(); showSlide(current + 1); }); overlay.addEventListener("click", function(e) { if (e.target === overlay) { closeGallery(false); } }); overlay.addEventListener("touchstart", function(e) { if (!isMobile() || overlay.style.display !== "block") { return; } if (!e.touches || e.touches.length !== 1) { mrTouchTracking = false; return; } mrTouchStartX = e.touches[0].clientX; mrTouchStartY = e.touches[0].clientY; mrTouchTracking = true; }, { passive: true }); overlay.addEventListener("touchend", function(e) { if (!mrTouchTracking || !isMobile() || overlay.style.display !== "block") { mrTouchTracking = false; return; } if (!e.changedTouches || !e.changedTouches.length) { mrTouchTracking = false; return; } var dx = e.changedTouches[0].clientX - mrTouchStartX; var dy = e.changedTouches[0].clientY - mrTouchStartY; mrTouchTracking = false; if (Math.abs(dx) < 46) { return; } if (Math.abs(dx) < Math.abs(dy) * 1.25) { return; } if (dx < 0 && current < slides.length - 1) { showSlide(current + 1); return; } if (dx > 0 && current > 0) { showSlide(current - 1); } }, { passive: true }); return overlay; } function showSlide(index) { if (!slides.length) { return; } if (index < 0) { index = slides.length - 1; } if (index >= slides.length) { index = 0; } current = index; var slide = slides[current]; var galleryImage = document.getElementById("mrEmergencyImage"); galleryImage.onload = function() { window.setTimeout(updateMobileSwipeLines, 40); }; galleryImage.src = slide.src; galleryImage.alt = slide.alt; document.getElementById("mrEmergencyCount").textContent = String(current + 1).padStart(2, "0") + " / " + String(slides.length).padStart(2, "0"); document.getElementById("mrEmergencyTitle").textContent = slide.num + " — " + slide.title; document.getElementById("mrEmergencyText").textContent = slide.text; window.setTimeout(updateMobileSwipeLines, 80); window.setTimeout(updateMobileSwipeLines, 280); } function openGallery(frame) { buildSlides(); createOverlay(); if (!slides.length) { alert("Фото не знайдені"); return; } var start = 0; slides.forEach(function(slide, index) { if (slide.frame === frame) { start = index; } }); setGalleryOpenState(true); showSlide(start); document.getElementById("mrEmergencyGallery").style.display = "block"; document.body.style.overflow = "hidden"; pushGalleryHistory(); window.setTimeout(function() { setGalleryOpenState(true); updateMobileSwipeLines(); }, 80); window.setTimeout(function() { setGalleryOpenState(true); updateMobileSwipeLines(); }, 280); window.setTimeout(function() { setGalleryOpenState(true); updateMobileSwipeLines(); }, 700); } function closeGallery(fromBrowserBack) { var overlay = document.getElementById("mrEmergencyGallery"); if (!overlay) { return; } overlay.style.display = "none"; document.body.style.overflow = ""; setGalleryOpenState(false); updateMobileSwipeLines(); if (mrGalleryHistoryOpen) { mrGalleryHistoryOpen = false; if (!fromBrowserBack) { mrIgnoreNextPopstate = true; try { window.history.back(); } catch(e) {} } } } function init() { document.querySelectorAll(".mrp .mrp-img, .mrp .mrp-detail-img, .mrpm .mrpm-img").forEach(function(frame) { frame.style.cursor = "zoom-in"; }); } document.addEventListener("click", function(e) { var frame = e.target.closest(".mrp-img, .mrp-detail-img, .mrpm-img"); if (!frame) { return; } if (!frame.closest(".mrp") && !frame.closest(".mrpm")) { return; } e.preventDefault(); e.stopPropagation(); openGallery(frame); }, true); document.addEventListener("keydown", function(e) { var overlay = document.getElementById("mrEmergencyGallery"); if (!overlay || overlay.style.display !== "block") { return; } if (e.key === "Escape") { closeGallery(false); } if (e.key === "ArrowLeft") { showSlide(current - 1); } if (e.key === "ArrowRight") { showSlide(current + 1); } }); window.addEventListener("resize", function() { window.setTimeout(updateMobileSwipeLines, 250); }); window.addEventListener("orientationchange", function() { window.setTimeout(updateMobileSwipeLines, 650); }); if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", init); } else { init(); } window.setTimeout(init, 500); window.setTimeout(init, 1500); window.setTimeout(init, 2500); })();
(function() { var zoom = 3.55; var size = 230; function isMobile() { return window.innerWidth <= 768; } function ensureStyle() { if (document.getElementById("mrEmergencyLoupeStyle")) { return; } var style = document.createElement("style"); style.id = "mrEmergencyLoupeStyle"; style.textContent = "#mrEmergencyLoupe{" + "position:fixed;" + "left:0;" + "top:0;" + "z-index:100000000;" + "width:" + size + "px;" + "height:" + size + "px;" + "display:none;" + "pointer-events:none;" + "overflow:hidden;" + "background-repeat:no-repeat;" + "background-color:#050505;" + "border:1px solid rgba(216,189,134,.92);" + "box-shadow:0 24px 70px rgba(0,0,0,.78),inset 0 0 0 1px rgba(255,255,255,.10);" + "transform:translate(-50%,-50%);" + "}" + "#mrEmergencyLoupe.is-active{display:block;}"; document.head.appendChild(style); } function ensureLoupe() { ensureStyle(); var loupe = document.getElementById("mrEmergencyLoupe"); if (loupe) { return loupe; } loupe = document.createElement("div"); loupe.id = "mrEmergencyLoupe"; document.body.appendChild(loupe); return loupe; } function hideLoupe() { var loupe = document.getElementById("mrEmergencyLoupe"); if (loupe) { loupe.classList.remove("is-active"); } } function moveLoupe(event) { if (isMobile()) { hideLoupe(); return; } var image = event.target && event.target.closest ? event.target.closest("#mrEmergencyImage") : null; if (!image) { return; } var overlay = document.getElementById("mrEmergencyGallery"); if (!overlay || overlay.style.display !== "block") { hideLoupe(); return; } if (!image.complete || !image.naturalWidth || !image.naturalHeight) { hideLoupe(); return; } var rect = image.getBoundingClientRect(); var x = event.clientX - rect.left; var y = event.clientY - rect.top; if (x < 0 || y < 0 || x > rect.width || y > rect.height) { hideLoupe(); return; } var loupe = ensureLoupe(); loupe.style.left = event.clientX + "px"; loupe.style.top = event.clientY + "px"; loupe.style.backgroundImage = "url('" + image.currentSrc + "')"; loupe.style.backgroundSize = (rect.width * zoom) + "px " + (rect.height * zoom) + "px"; loupe.style.backgroundPosition = ((size / 2) - (x * zoom)) + "px " + ((size / 2) - (y * zoom)) + "px"; loupe.classList.add("is-active"); } document.addEventListener("mousemove", moveLoupe, true); document.addEventListener("mouseout", function(event) { var image = event.target && event.target.closest ? event.target.closest("#mrEmergencyImage") : null; if (image) { hideLoupe(); } }, true); document.addEventListener("click", function(event) { if ( event.target.classList.contains("mr-clean-close") || event.target.textContent === "Fermer" || event.target.textContent === "Retour au processus" ) { hideLoupe(); } }, true); document.addEventListener("keydown", function(event) { if (event.key === "Escape") { hideLoupe(); } }); })();
(function(){ var ZOOM_SCALE = 2.6; var isZoomed = false; var panX = 0; var panY = 0; var isPanning = false; var panStartTouchX = 0; var panStartTouchY = 0; var panStartX = 0; var panStartY = 0; var lastTapTime = 0; var lastTapX = 0; var lastTapY = 0; function isMobile(){ return window.innerWidth <= 768; } function getOverlay(){ return document.getElementById("mrEmergencyGallery"); } function getImage(){ return document.getElementById("mrEmergencyImage"); } function applyTransform(animate){ var image = getImage(); if(!image) return; image.style.transition = animate ? "transform .28s ease" : "none"; image.style.transform = "translate(" + panX + "px," + panY + "px) scale(" + (isZoomed ? ZOOM_SCALE : 1) + ")"; image.style.cursor = isZoomed ? "grab" : "zoom-in"; } function clampPan(){ var image = getImage(); if(!image) return; var baseWidth = image.offsetWidth; var baseHeight = image.offsetHeight; var scaledWidth = baseWidth * ZOOM_SCALE; var scaledHeight = baseHeight * ZOOM_SCALE; var maxPanX = Math.max(0,(scaledWidth - window.innerWidth)/2); var maxPanY = Math.max(0,(scaledHeight - window.innerHeight)/2); if(panX>maxPanX) panX=maxPanX; if(panX<-maxPanX) panX=-maxPanX; if(panY>maxPanY) panY=maxPanY; if(panY<-maxPanY) panY=-maxPanY; } function resetZoom(animate){ isZoomed = false; panX = 0; panY = 0; applyTransform(!!animate); } function toggleZoom(){ isZoomed = !isZoomed; if(!isZoomed){ panX = 0; panY = 0; } applyTransform(true); } function ensureHint(){ var text = document.getElementById("mrEmergencyText"); if(!text || !text.parentElement) return; if(document.querySelector(".mr-emergency-zoom-hint")) return; var hint = document.createElement("div"); hint.className = "mr-emergency-zoom-hint"; hint.textContent = "Touchez deux fois pour zoomer"; text.insertAdjacentElement("afterend", hint); } function bindOverlay(overlay){ if(overlay.getAttribute("data-mr-zoom-bound")) return; overlay.setAttribute("data-mr-zoom-bound","1"); overlay.addEventListener("touchstart", function(e){ if(!isMobile() || overlay.style.display !== "block") return; if(!e.touches || e.touches.length !== 1){ isPanning = false; return; } var t = e.touches[0]; if(isZoomed){ isPanning = true; panStartTouchX = t.clientX; panStartTouchY = t.clientY; panStartX = panX; panStartY = panY; } }, {capture:true, passive:true}); overlay.addEventListener("touchmove", function(e){ if(!isMobile() || overlay.style.display !== "block") return; if(!isZoomed || !isPanning) return; if(!e.touches || e.touches.length !== 1) return; e.preventDefault(); var t = e.touches[0]; panX = panStartX + (t.clientX - panStartTouchX); panY = panStartY + (t.clientY - panStartTouchY); clampPan(); applyTransform(false); }, {capture:true, passive:false}); overlay.addEventListener("touchend", function(e){ if(!isMobile() || overlay.style.display !== "block"){ isPanning = false; return; } if(!e.changedTouches || !e.changedTouches.length){ isPanning = false; return; } var endT = e.changedTouches[0]; var onImage = e.target && e.target.closest && e.target.closest("#mrEmergencyImage"); var now = Date.now(); isPanning = false; var isDoubleTap = onImage && (now - lastTapTime) < 320 && Math.abs(endT.clientX - lastTapX) < 40 && Math.abs(endT.clientY - lastTapY) < 40; if(isDoubleTap){ lastTapTime = 0; toggleZoom(); if(e.stopImmediatePropagation) e.stopImmediatePropagation(); e.preventDefault(); return; } lastTapTime = now; lastTapX = endT.clientX; lastTapY = endT.clientY; /* коли наближено — блокуємо свайп-гортання з основного скрипта */ if(isZoomed){ if(e.stopImmediatePropagation) e.stopImmediatePropagation(); } }, {capture:true, passive:false}); } function watchImage(){ var image = getImage(); if(!image) return; if(image.getAttribute("data-mr-zoom-watched")) return; image.setAttribute("data-mr-zoom-watched","1"); image.style.transformOrigin = "center center"; image.style.willChange = "transform"; var observer = new MutationObserver(function(){ resetZoom(false); }); observer.observe(image, { attributes:true, attributeFilter:["src"] }); } function watchOverlayVisibility(overlay){ var observer = new MutationObserver(function(){ if(overlay.style.display === "none"){ resetZoom(false); } }); observer.observe(overlay, { attributes:true, attributeFilter:["style"] }); } function init(){ var overlay = getOverlay(); if(overlay){ bindOverlay(overlay); watchImage(); watchOverlayVisibility(overlay); ensureHint(); return true; } return false; } if(!init()){ var bodyObserver = new MutationObserver(function(){ if(init()){ bodyObserver.disconnect(); } }); bodyObserver.observe(document.body, {childList:true, subtree:true}); } window.setTimeout(init, 800); window.setTimeout(init, 2000); })();