https://www.f-bsupport.de/wp-content/themes/fbsupport/addons/photoswipe/photoswipe.init.js

1var initPhotoSwipeFromDOM = function(gallerySelector) {
2
3	var parseThumbnailElements = function(el) {
4	    var thumbElements = el.childNodes,
5	        numNodes = thumbElements.length,
6	        items = [],
7	        el,
8	        childElements,
9	        thumbnailEl,
10	        size,
11	        item;
12
13	    for(var i = 0; i < numNodes; i++) {
14	        el = thumbElements[i];
15
16	        // include only element nodes 
17	        if(el.nodeType !== 1) {
18	          continue;
19	        }
20
21	        childElements = el.children;
22
23	        size = el.getAttribute('data-size').split('x');
24
25	        // create slide object
26	        item = {
27				src: el.getAttribute('href'),
28				w: parseInt(size[0], 10),
29				h: parseInt(size[1], 10),
30				author: el.getAttribute('data-author')
31	        };
32
33	        item.el = el; // save link to element for getThumbBoundsFn
34
35	        if(childElements.length > 0) {
36	          item.msrc = childElements[0].getAttribute('src'); // thumbnail url
37	          if(childElements.length > 1) {
38	              item.title = childElements[1].innerHTML; // caption (contents of figure)
39	          }
40	        }
41
42
43			var mediumSrc = el.getAttribute('data-med');
44          	if(mediumSrc) {
45            	size = el.getAttribute('data-med-size').split('x');
46            	// "medium-sized" image
47            	item.m = {
48              		src: mediumSrc,
49              		w: parseInt(size[0], 10),
50              		h: parseInt(size[1], 10)
51            	};
52          	}
53          	// original image
54          	item.o = {
55          		src: item.src,
56          		w: item.w,
57          		h: item.h
58          	};
59
60	        items.push(item);
61	    }
62
63	    return items;
64	};
65
66	// find nearest parent element
67	var closest = function closest(el, fn) {
68	    return el && ( fn(el) ? el : closest(el.parentNode, fn) );
69	};
70
71	var onThumbnailsClick = function(e) {
72	    e = e || window.event;
73	    e.preventDefault ? e.preventDefault() : e.returnValue = false;
74
75	    var eTarget = e.target || e.srcElement;
76
77	    var clickedListItem = closest(eTarget, function(el) {
78	        return el.tagName === 'A';
79	    });
80
81	    if(!clickedListItem) {
82	        return;
83	    }
84
85	    var clickedGallery = clickedListItem.parentNode;
86
87	    var childNodes = clickedListItem.parentNode.childNodes,
88	        numChildNodes = childNodes.length,
89	        nodeIndex = 0,
90	        index;
91
92	    for (var i = 0; i < numChildNodes; i++) {
93	        if(childNodes[i].nodeType !== 1) { 
94	            continue; 
95	        }
96
97	        if(childNodes[i] === clickedListItem) {
98	            index = nodeIndex;
99	            break;
100	        }
101	        nodeIndex++;
102	    }
103
104	    if(index >= 0) {
105	        openPhotoSwipe( index, clickedGallery );
106	    }
107	    return false;
108	};
109
110	var photoswipeParseHash = function() {
111		var hash = window.location.hash.substring(1),
112	    params = {};
113
114	    if(hash.length < 5) { // pid=1
115	        return params;
116	    }
117
118	    var vars = hash.split('&');
119	    for (var i = 0; i < vars.length; i++) {
120	        if(!vars[i]) {
121	            continue;
122	        }
123	        var pair = vars[i].split('=');  
124	        if(pair.length < 2) {
125	            continue;
126	        }           
127	        params[pair[0]] = pair[1];
128	    }
129
130	    if(params.gid) {
131	    	params.gid = parseInt(params.gid, 10);
132	    }
133
134	    return params;
135	};
136
137	var openPhotoSwipe = function(index, galleryElement, disableAnimation, fromURL) {
138	    var pswpElement = document.querySelectorAll('.pswp')[0],
139	        gallery,
140	        options,
141	        items;
142
143		items = parseThumbnailElements(galleryElement);
144
145	    // define options (if needed)
146	    options = {
147
148	        galleryUID: galleryElement.getAttribute('data-pswp-uid'),
149
150	        getThumbBoundsFn: function(index) {
151	            // See Options->getThumbBoundsFn section of docs for more info
152	            var thumbnail = items[index].el.children[0],
153	                pageYScroll = window.pageYOffset || document.documentElement.scrollTop,
154	                rect = thumbnail.getBoundingClientRect(); 
155
156	            return {x:rect.left, y:rect.top + pageYScroll, w:rect.width};
157	        },
158
159	        addCaptionHTMLFn: function(item, captionEl, isFake) {
160				if(!item.title) {
161					captionEl.children[0].innerText = '';
162					return false;

163				}
164				captionEl.children[0].innerHTML = item.title +  '<br/><small>Photo: ' + item.author + '</small>';
165				return true;
166	        },
167			
168	    };
169
170
171	    if(fromURL) {
172	    	if(options.galleryPIDs) {
173	    		// parse real index when custom PIDs are used 
174	    		// https://photoswipe.com/documentation/faq.html#custom-pid-in-url
175	    		for(var j = 0; j < items.length; j++) {
176	    			if(items[j].pid == index) {
177	    				options.index = j;
178	    				break;
179	    			}
180	    		}
181		    } else {
182		    	options.index = parseInt(index, 10) - 1;
183		    }
184	    } else {
185	    	options.index = parseInt(index, 10);
186	    }
187
188	    // exit if index not found
189	    if( isNaN(options.index) ) {
190	    	return;
191	    }
192
193    	options.mainClass = 'pswp--minimal--dark';
194        options.barsSize = {top:0,bottom:0};
195		options.captionEl = false;
196		options.fullscreenEl = false;
197		options.shareEl = false;
198		options.bgOpacity = 0.85;
199		options.tapToClose = true;
200		options.tapToToggleControls = false;
201
202	    if(disableAnimation) {
203	        options.showAnimationDuration = 0;
204	    }
205
206	    // Pass data to PhotoSwipe and initialize it
207	    gallery = new PhotoSwipe( pswpElement, PhotoSwipeUI_Default, items, options);
208
209	    // see: http://photoswipe.com/documentation/responsive-images.html
210		var realViewportWidth,
211		    useLargeImages = false,
212		    firstResize = true,
213		    imageSrcWillChange;
214
215		gallery.listen('beforeResize', function() {
216
217			var dpiRatio = window.devicePixelRatio ? window.devicePixelRatio : 1;
218			dpiRatio = Math.min(dpiRatio, 2.5);
219		    realViewportWidth = gallery.viewportSize.x * dpiRatio;
220
221
222		    if(realViewportWidth >= 1200 || (!gallery.likelyTouchDevice && realViewportWidth > 800) || screen.width > 1200 ) {
223		    	if(!useLargeImages) {
224		    		useLargeImages = true;
225		        	imageSrcWillChange = true;
226		    	}
227		        
228		    } else {
229		    	if(useLargeImages) {
230		    		useLargeImages = false;
231		        	imageSrcWillChange = true;
232		    	}
233		    }
234
235		    if(imageSrcWillChange && !firstResize) {
236		        gallery.invalidateCurrItems();
237		    }
238
239		    if(firstResize) {
240		        firstResize = false;
241		    }
242
243		    imageSrcWillChange = false;
244
245		});
246
247		gallery.listen('gettingData', function(index, item) {
248		    if( useLargeImages ) {
249		        item.src = item.o.src;
250		        item.w = item.o.w;
251		        item.h = item.o.h;
252		    } else {
253		        item.src = item.m.src;
254		        item.w = item.m.w;
255		        item.h = item.m.h;
256		    }
257		});
258
259	    gallery.init();
260	};
261
262	// select all gallery elements
263	var galleryElements = document.querySelectorAll( gallerySelector );
264	for(var i = 0, l = galleryElements.length; i < l; i++) {
265		galleryElements[i].setAttribute('data-pswp-uid', i+1);
266		galleryElements[i].onclick = onThumbnailsClick;
267	}
268
269	// Parse URL and open gallery if it contains #&pid=3&gid=1
270	var hashData = photoswipeParseHash();
271	if(hashData.pid && hashData.gid) {
272		openPhotoSwipe( hashData.pid,  galleryElements[ hashData.gid - 1 ], true, true );
273	}
274};