https://lautrecanalnancy.fr/sites/all/themes/tssks/js/ssks-photoswipe.js?tly8hu

1
2(function($) {
3    Drupal.behaviors.ssks_photoswipe = {
4
5        attach: function(context, settings) {
6            Drupal.behaviors.ssks_photoswipe.initPhotoswipe();
7        },
8
9        onAjaxComplete: function () {
10            Drupal.behaviors.ssks_photoswipe.initPhotoswipe();
11        },
12        
13        /*---------------------------------------------------------------------
14        :: Intialisation photoswipe
15        -------------------------------------------------------------------*/
16
17        initPhotoswipe: function() {
18            // GALERIE PHOTO
19            var $pswp = $('.pswp')[0];
20            var $pswpLien = $('.pswp-lien');
21            var image = [];
22
23            function getItems() {
24                var items = [];
25                $pswpLien.each(function() {
26                    var $sizeMedium   = $(this).data('size-medium').split('x');
27                    var $size   = $(this).data('size').split('x');
28
29                    var item = {
30
31                        mediumImage: {
32                            src : $(this).data('medium'),
33                            w   : $sizeMedium[0],
34                            h   : $sizeMedium[1],
35                        },
36                        originalImage: {
37                            src : $(this).attr('href'),
38                            w   : $size[0],
39                            h   : $size[1],
40                        },
41                        title: $(".pswp-auteur", this).text()
42                    }
43
44                    items.push(item);
45
46                });
47                return items;
48            }
49            var pswpitems = getItems();
50
51            $pswpLien.not('.processed').addClass('processed').on('click', function(event) {
52                event.preventDefault();
53                var currentItem = $(this);
54
55                var $index = $pswpLien.index($(this));
56                var options = {
57                    history :false,
58                    index: $index,
59                    bgOpacity: 0.92,
60                    showHideOpacity: true,
61                    counterEl: true,
62                    getThumbBoundsFn: function(index) {
63                        var thumbnail = $('img',currentItem)[0],
64                            pageYScroll = window.pageYOffset || document.documentElement.scrollTop,
65                            rect = thumbnail.getBoundingClientRect();
66
67                        return {x:rect.left, y:rect.top + pageYScroll, w:rect.width};
68                    }
69
70                }
71
72                var lightbox = new PhotoSwipe($pswp, PhotoSwipeUI_Default, pswpitems, options);
73
74                var realViewportWidth;
75                var useLargeImages = false;
76                var firstResize = true;
77                var imageSrcWillChange;
78
79                lightbox.listen('beforeResize', function() {
80                    // lightbox.viewportSize.x - width of PhotoSwipe viewport
81                    // lightbox.viewportSize.y - height of PhotoSwipe viewport
82                    // window.devicePixelRatio - ratio between physical pixels and device independent pixels (Number)
83                    //                          1 (regular display), 2 (@2x, retina) ...
84
85
86                    // calculate real pixels when size changes
87                    realViewportWidth = lightbox.viewportSize.x * window.devicePixelRatio;
88
89                    // Code below is needed if you want image to switch dynamically on window.resize
90
91                    // Find out if current images need to be changed
92                    if(useLargeImages && realViewportWidth < 1000) {
93                        useLargeImages = false;
94                        imageSrcWillChange = true;
95                    } else if(!useLargeImages && realViewportWidth >= 1000) {
96                        useLargeImages = true;
97                        imageSrcWillChange = true;
98                    }
99
100                    // Invalidate items only when source is changed and when it's not the first update
101                    if(imageSrcWillChange && !firstResize) {
102                        // invalidateCurrItems sets a flag on slides that are in DOM,
103                        // which will force update of content (image) on window.resize.
104                        lightbox.invalidateCurrItems();
105                    }
106
107                    if(firstResize) {
108                        firstResize = false;

109                    }
110
111                    imageSrcWillChange = false;
112
113                });
114
115                // gettingData event fires each time PhotoSwipe retrieves image source & size
116                lightbox.listen('gettingData', function(index, item) {
117
118                    // Set image source & size based on real viewport width
119                    if( useLargeImages ) {
120                        item.src = item.originalImage.src;
121                        item.w = item.originalImage.w;
122                        item.h = item.originalImage.h;
123                    } else {
124                        item.src = item.mediumImage.src;
125                        item.w = item.mediumImage.w;
126                        item.h = item.mediumImage.h;
127                    }
128
129                    // It doesn't really matter what will you do here,
130                    // as long as item.src, item.w and item.h have valid values.
131                    //
132                    // Just avoid http requests in this listener, as it fires quite often
133
134                });
135
136
137                lightbox.init();
138
139            });
140
141
142            //UPDATE :
143            // pswpitems = getItems();
144        },
145
146        updatePhotoswipe: function() {
147
148        }
149
150
151    }
152})(jQuery) ;