1import * as __WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__ from "@wordpress/interactivity";
2/******/ // The require scope
3/******/ var __webpack_require__ = {};
4/******/
5/************************************************************************/
6/******/ /* webpack/runtime/define property getters */
7/******/ (() => {
8/******/ // define getter functions for harmony exports
9/******/ __webpack_require__.d = (exports, definition) => {
10/******/ for(var key in definition) {
11/******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
12/******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
13/******/ }
14/******/ }
15/******/ };
16/******/ })();
17/******/
18/******/ /* webpack/runtime/hasOwnProperty shorthand */
19/******/ (() => {
20/******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
21/******/ })();
22/******/
23/************************************************************************/
24var __webpack_exports__ = {};
25
26;// external "@wordpress/interactivity"
27var x = (y) => {
28 var x = {}; __webpack_require__.d(x, y); return x
29}
30var y = (x) => (() => (x))
31const interactivity_namespaceObject = x({ ["getContext"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.getContext), ["getElement"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.getElement), ["store"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.store), ["withSyncEvent"]: () => (__WEBPACK_EXTERNAL_MODULE__wordpress_interactivity_8e89b257__.withSyncEvent) });
32;// ./node_modules/@wordpress/block-library/build-module/image/view.js
33
34let isTouching = false;
35let lastTouchTime = 0;
36const { state, actions, callbacks } = (0,interactivity_namespaceObject.store)(
37 "core/image",
38 {
39 state: {
40 currentImageId: null,
41 get currentImage() {
42 return state.metadata[state.currentImageId];
43 },
44 get overlayOpened() {
45 return state.currentImageId !== null;
46 },
47 get roleAttribute() {
48 return state.overlayOpened ? "dialog" : null;
49 },
50 get ariaModal() {
51 return state.overlayOpened ? "true" : null;
52 },
53 get enlargedSrc() {
54 return state.currentImage.uploadedSrc || "data:image/gif;base64,R0lGODlhAQABAAD/ACwAAAAAAQABAAACADs=";
55 },
56 get figureStyles() {
57 return state.overlayOpened && `${state.currentImage.figureStyles?.replace(
58 /margin[^;]*;?/g,
59 ""
60 )};`;
61 },
62 get imgStyles() {
63 return state.overlayOpened && `${state.currentImage.imgStyles?.replace(
64 /;$/,
65 ""
66 )}; object-fit:cover;`;
67 },
68 get imageButtonRight() {
69 const { imageId } = (0,interactivity_namespaceObject.getContext)();
70 return state.metadata[imageId].imageButtonRight;
71 },
72 get imageButtonTop() {
73 const { imageId } = (0,interactivity_namespaceObject.getContext)();
74 return state.metadata[imageId].imageButtonTop;
75 },
76 get isContentHidden() {
77 const ctx = (0,interactivity_namespaceObject.getContext)();
78 return state.overlayEnabled && state.currentImageId === ctx.imageId;
79 },
80 get isContentVisible() {
81 const ctx = (0,interactivity_namespaceObject.getContext)();
82 return !state.overlayEnabled && state.currentImageId === ctx.imageId;
83 }
84 },
85 actions: {
86 showLightbox() {
87 const { imageId } = (0,interactivity_namespaceObject.getContext)();
88 if (!state.metadata[imageId].imageRef?.complete) {
89 return;
90 }
91 state.scrollTopReset = document.documentElement.scrollTop;
92 state.scrollLeftReset = document.documentElement.scrollLeft;
93 state.overlayEnabled = true;
94 state.currentImageId = imageId;
95 callbacks.setOverlayStyles();
96 },
97 hideLightbox() {
98 if (state.overlayEnabled) {
99 state.overlayEnabled = false;
100 setTimeout(function() {
101 state.currentImage.buttonRef.focus({
102 preventScroll: true
103 });
104 state.currentImageId = null;
105 }, 450);
106 }
107 },
108 handleKeydown: (0,interactivity_namespaceObject.withSyncEvent)((event) => {
109 if (state.overlayEnabled) {
110 if (event.key === "Tab") {
111 event.preventDefault();
112 const { ref } = (0,interactivity_namespaceObject.getElement)();
113 ref.querySelector("button").focus();
114 }
115 if (event.key === "Escape") {
116 actions.hideLightbox();
117 }
118 }
119 }),
120 handleTouchMove: (0,interactivity_namespaceObject.withSyncEvent)((event) => {
121 if (state.overlayEnabled) {
122 event.preventDefault();
123 }
124 }),
125 handleTouchStart() {
126 isTouching = true;
127 },
128 handleTouchEnd() {
129 lastTouchTime = Date.now();
130 isTouching = false;
131 },
132 handleScroll() {
133 if (state.overlayOpened) {
134 if (!isTouching && Date.now() - lastTouchTime > 450) {
135 window.scrollTo(
136 state.scrollLeftReset,
137 state.scrollTopReset
138 );
139 }
140 }
141 }
142 },
143 callbacks: {
144 setOverlayStyles() {
145 if (!state.overlayEnabled) {
146 return;
147 }
148 let {
149 naturalWidth,
150 naturalHeight,
151 offsetWidth: originalWidth,
152 offsetHeight: originalHeight
153 } = state.currentImage.imageRef;
154 let { x: screenPosX, y: screenPosY } = state.currentImage.imageRef.getBoundingClientRect();
155 const naturalRatio = naturalWidth / naturalHeight;
156 let originalRatio = originalWidth / originalHeight;
157 if (state.currentImage.scaleAttr === "contain") {
158 if (naturalRatio > originalRatio) {
159 const heightWithoutSpace = originalWidth / naturalRatio;
160 screenPosY += (originalHeight - heightWithoutSpace) / 2;
161 originalHeight = heightWithoutSpace;
162 } else {
163 const widthWithoutSpace = originalHeight * naturalRatio;
164 screenPosX += (originalWidth - widthWithoutSpace) / 2;
165 originalWidth = widthWithoutSpace;
166 }
167 }
168 originalRatio = originalWidth / originalHeight;
169 let imgMaxWidth = parseFloat(
170 state.currentImage.targetWidth !== "none" ? state.currentImage.targetWidth : naturalWidth
171 );
172 let imgMaxHeight = parseFloat(
173 state.currentImage.targetHeight !== "none" ? state.currentImage.targetHeight : naturalHeight
174 );
175 let imgRatio = imgMaxWidth / imgMaxHeight;
176 let containerMaxWidth = imgMaxWidth;
177 let containerMaxHeight = imgMaxHeight;
178 let containerWidth = imgMaxWidth;
179 let containerHeight = imgMaxHeight;
180 if (naturalRatio.toFixed(2) !== imgRatio.toFixed(2)) {
181 if (naturalRatio > imgRatio) {
182 const reducedHeight = imgMaxWidth / naturalRatio;
183 if (imgMaxHeight - reducedHeight > imgMaxWidth) {
184 imgMaxHeight = reducedHeight;
185 imgMaxWidth = reducedHeight * naturalRatio;
186 } else {
187 imgMaxHeight = imgMaxWidth / naturalRatio;
188 }
189 } else {
190 const reducedWidth = imgMaxHeight * naturalRatio;
191 if (imgMaxWidth - reducedWidth > imgMaxHeight) {
192 imgMaxWidth = reducedWidth;
193 imgMaxHeight = reducedWidth / naturalRatio;
194 } else {
195 imgMaxWidth = imgMaxHeight * naturalRatio;
196 }
197 }
198 containerWidth = imgMaxWidth;
199 containerHeight = imgMaxHeight;
200 imgRatio = imgMaxWidth / imgMaxHeight;
201 if (originalRatio > imgRatio) {
202 containerMaxWidth = imgMaxWidth;
203 containerMaxHeight = containerMaxWidth / originalRatio;
204 } else {
205 containerMaxHeight = imgMaxHeight;
206 containerMaxWidth = containerMaxHeight * originalRatio;
207 }
208 }
209 if (originalWidth > containerWidth || originalHeight > containerHeight) {
210 containerWidth = originalWidth;
211 containerHeight = originalHeight;
212 }
213 let horizontalPadding = 0;
214 if (window.innerWidth > 480) {
215 horizontalPadding = 80;
216 } else if (window.innerWidth > 1920) {
217 horizontalPadding = 160;
218 }
219 const verticalPadding = 80;
220 const targetMaxWidth = Math.min(
221 window.innerWidth - horizontalPadding,
222 containerWidth
223 );
224 const targetMaxHeight = Math.min(
225 window.innerHeight - verticalPadding,
226 containerHeight
227 );
228 const targetContainerRatio = targetMaxWidth / targetMaxHeight;
229 if (originalRatio > targetContainerRatio) {
230 containerWidth = targetMaxWidth;
231 containerHeight = containerWidth / originalRatio;
232 } else {
233 containerHeight = targetMaxHeight;
234 containerWidth = containerHeight * originalRatio;
235 }
236 const containerScale = originalWidth / containerWidth;
237 const lightboxImgWidth = imgMaxWidth * (containerWidth / containerMaxWidth);
238 const lightboxImgHeight = imgMaxHeight * (containerHeight / containerMaxHeight);
239 state.overlayStyles = `
240 --wp--lightbox-initial-top-position: ${screenPosY}px;
241 --wp--lightbox-initial-left-position: ${screenPosX}px;
242 --wp--lightbox-container-width: ${containerWidth + 1}px;
243 --wp--lightbox-container-height: ${containerHeight + 1}px;
244 --wp--lightbox-image-width: ${lightboxImgWidth}px;
245 --wp--lightbox-image-height: ${lightboxImgHeight}px;
246 --wp--lightbox-scale: ${containerScale};
247 --wp--lightbox-scrollbar-width: ${window.innerWidth - document.documentElement.clientWidth}px;
248 `;
249 },
250 setButtonStyles() {
251 const { ref } = (0,interactivity_namespaceObject.getElement)();
252 if (!ref) {
253 return;
254 }
255 const { imageId } = (0,interactivity_namespaceObject.getContext)();
256 state.metadata[imageId].imageRef = ref;
257 state.metadata[imageId].currentSrc = ref.currentSrc;
258 const {
259 naturalWidth,
260 naturalHeight,
261 offsetWidth,
262 offsetHeight
263 } = ref;
264 if (naturalWidth === 0 || naturalHeight === 0) {
265 return;
266 }
267 const figure = ref.parentElement;
268 const figureWidth = ref.parentElement.clientWidth;
269 let figureHeight = ref.parentElement.clientHeight;
270 const caption = figure.querySelector("figcaption");
271 if (caption) {
272 const captionComputedStyle = window.getComputedStyle(caption);
273 if (!["absolute", "fixed"].includes(
274 captionComputedStyle.position
275 )) {
276 figureHeight = figureHeight - caption.offsetHeight - parseFloat(captionComputedStyle.marginTop) - parseFloat(captionComputedStyle.marginBottom);
277 }
278 }
279 const buttonOffsetTop = figureHeight - offsetHeight;
280 const buttonOffsetRight = figureWidth - offsetWidth;
281 let imageButtonTop = buttonOffsetTop + 16;
282 let imageButtonRight = buttonOffsetRight + 16;
283 if (state.metadata[imageId].scaleAttr === "contain") {
284 const naturalRatio = naturalWidth / naturalHeight;
285 const offsetRatio = offsetWidth / offsetHeight;
286 if (naturalRatio >= offsetRatio) {
287 const referenceHeight = offsetWidth / naturalRatio;
288 imageButtonTop = (offsetHeight - referenceHeight) / 2 + buttonOffsetTop + 16;
289 imageButtonRight = buttonOffsetRight + 16;
290 } else {
291 const referenceWidth = offsetHeight * naturalRatio;
292 imageButtonTop = buttonOffsetTop + 16;
293 imageButtonRight = (offsetWidth - referenceWidth) / 2 + buttonOffsetRight + 16;
294 }
295 }
296 state.metadata[imageId].imageButtonTop = imageButtonTop;
297 state.metadata[imageId].imageButtonRight = imageButtonRight;
298 },
299 setOverlayFocus() {
300 if (state.overlayEnabled) {
301 const { ref } = (0,interactivity_namespaceObject.getElement)();
302 ref.focus();
303 }
304 },
305 initTriggerButton() {
306 const { imageId } = (0,interactivity_namespaceObject.getContext)();
307 const { ref } = (0,interactivity_namespaceObject.getElement)();
308 state.metadata[imageId].buttonRef = ref;
309 }
310 }
311 },
312 { lock: true }
313);
314
315