https://youthwrite.com/shout/web/v6.51.1.R20260831/shout/modules/g…/resources/js/shoutcms_galleria_gallery.js

1//jQuery(function($){
2window.Shout.initializeGalleries = function($) {
3    if (Galleria)
4    {
5        if (!Shout.configuration.module.gallery2)
6        {
7            return;
8        }
9
10        $.each(Shout.configuration.module.gallery2.galleria.galleries,
11            function(index, value)
12            {
13                var gallery_key = index;
14//                var gallery_configuration = Shout.configuration.module.gallery2.galleria.galleries[gallery_key];
15                var gallery_configuration = value;
16                var gallery_configuration_options = gallery_configuration.options;
17
18                gallery_configuration_options = $.extend(gallery_configuration_options, {
19                        extend: function(options) {
20                            var gallery = this;
21
22                            // update global options
23                            options = $.extend(true, {
24                                shoutcms: {
25                                    clickToggleFullscreen: {
26                                        enabled: false
27                                    },
28                                    levelHeight: {
29                                        enabled: false,
30                                        height: 240,
31                                        offset: 100
32                                    },
33                                    setalt: true,
34                                }
35                            }, options);
36
37                            if (true === options.shoutcms.clickToggleFullscreen.enabled)
38                            {
39                                gallery.bind('image',
40                                    function(e)
41                                    {
42                                        $(e.imageTarget).off('click').click(
43                                            function()
44                                            {
45                                                gallery.toggleFullscreen();
46                                            }
47                                        );
48                                    }
49                                );
50                            }
51
52                            if (true === options.shoutcms.levelHeight.enabled)
53                            {
54                                var $self           = $(gallery._target);
55
56                                var offset          = options.shoutcms.levelHeight.offset;
57                                var leveled_height  = options.shoutcms.levelHeight.height;
58
59                                var _resize = function()
60                                {
61                                    var viewport_height = window.innerHeight - offset;
62                                    var best_height     = Math.min(viewport_height, leveled_height);
63
64                                    $self.find('.galleria-container').css('max-height', best_height+'px');
65
66                                    gallery.resize();
67                                };
68
69                                _resize();
70
71                                $(window).on('resize', _.debounce(
72                                        function()
73                                        {
74                                            _resize();
75                                        },
76                                        100
77                                    )
78                                );
79                            }
80
81                            // ADD close button in fullscreen mode for Carousel, Thumbnail and Milimal
82                            switch(options.theme){
83                            case 'shoutcmsazur':        //Carousel Gallery
84                            case 'shoutcmsazurlarge':    //Carousel Gallery
85                            case 'shoutcmsfolio':        //Thumbnail Gallery
86                            case 'shoutcmsminiml':        //Minimal Gallery
87                                gallery
88                                .addElement("close")
89                                .append({
90                                            stage : ["close"]
91                                        });
92
93                                var updateCloseButtonVisibility = function(){
94                                    gallery.$('close').toggle(gallery.isFullscreen());
95                                };
96
97                                gallery.$("close").on("click:fast", function() {
98                                    gallery.exitFullscreen();
99                                });
100
101                                // https://stackoverflow.com/a/25667884
102                                // https://galleria.io/forums/topic/alt-tags-missing-from-folio-thumbn

102ails/
103                                if (true == options.shoutcms.setalt)
104                                {
105                                    gallery.bind('image', function(e) {
106                                        // add alt to big image
107                                        if (e.galleriaData.original.alt)
108                                        {
109                                            e.imageTarget.alt = e.galleriaData.original.alt;
110                                        }
111                                    });
112                                    gallery.bind('thumbnail', function(e) {
113                                        // add alt to thumbnails image
114                                        if (e.galleriaData.original.alt)
115                                        {
116                                            e.thumbTarget.alt = e.galleriaData.original.alt;
117                                        }
118                                    });
119                                }
120
121                                updateCloseButtonVisibility();
122
123                                gallery.bind('fullscreen_enter', updateCloseButtonVisibility);
124                                gallery.bind('fullscreen_exit', updateCloseButtonVisibility);
125                            }
126
127                            switch (options.theme)
128                            {
129                                case 'shoutcmsazur':
130                                case 'shoutcmsazurlarge':
131                                case 'shoutcmsminiml':
132                                    var container = $(gallery._target).find('.galleria-container');
133                                    var stage     = container.find('.galleria-stage');
134
135                                    var height_new = container.height() + (container.height() - stage.height());
136
137                                    gallery.setOptions({
138                                        height: height_new
139                                    });
140
141                                    var _resize2 = function() {
142                                        gallery.resize({
143                                            height: height_new
144                                        });
145                                    };
146
147                                    _resize2();
148
149                                    $(window).on('resize', _.debounce(function() {
150                                        _resize2();
151                                    }, 100));
152
153                                    break;
154                            }
155                        },
156                    }
157                );
158
159                if (!$('#shout-gallery-' + gallery_key).length)
160                {
161                    return;
162                }
163
164                if (!$('#shout-gallery-' + gallery_key).is(":visible"))
165                {
166                    function onIntersection(entities) {
167                        entities.forEach(entity => {
168                            if (entity.isIntersecting) {
169                                observer.unobserve(entity.target);
170
171                                var target = $(entity.target);
172
173                                if (!target.hasClass('initialized'))
174                                {
175                                    target.addClass('initialized');
176
177                                    Galleria.loadTheme(gallery_configuration.themePath);
178
179                                    target.galleria(gallery_configuration_options);
180                                }
181                            }
182                        });
183                    }
184
185                    var observer = new IntersectionObserver(onIntersection, {});
186
187                    setTimeout(function() {
188                        observer.observe($('#shout-gallery-' + gallery_key).get(0));
189                    }, 100);
190
191                    return;
192                }
193
194                if (!$('#shout-gallery-' + gallery_key).hasClass('initialized'))
195                {
196                    $('#shout-gallery-' + gallery_key).addClass('initialized');
197
198                    Galleria.loadTheme(gallery_configuration.themePath);
199
200    //             Galleria.configure(gallery_configuration_options);
201    //             Galleria.run('#shout-gallery-'+gallery_key, gallery_configuration_options);
202                    $('#shout-gallery-'+gallery_key).galleria(gallery_configuration_options);
203                }
204            }
205        );
206    }
207};
208
209jQuery(function($) {
210    window.Shout.initializeGalleries($);
211});