https://emun.beitjala-city.org/Eservice/assets/js/fancybox/jquery.fancybox.custom.js

1jQuery(function ($) {
2
3    // Navigation object
4    var btnsTpl = {
5        next: '<div class="fancybox-wrap-popup-next"><svg preserveAspectRatio="xMinYMin meet" viewBox="0 0 37 72" xmlns="http://www.w3.org/2000/svg"><g><polygon points="37.569,36.279 3.066,-0.001 1.749,1.249 34.939,36.149 0.431,70.793 1.764,72.001 36.179,37.452 36.252,37.529"/></g></svg></div>', // Navigation buttons Next
6        prev: '<div class="fancybox-wrap-popup-prev"><svg preserveAspectRatio="xMinYMin meet" viewBox="0 0 37 72" mlns="http://www.w3.org/2000/svg"><g><polygon points="1.748,37.529 1.82,37.452 36.235,72.001 37.568,70.793 3.061,36.149 36.251,1.249 34.934,-0.001 0.432,36.279"/></g></svg></div>', // Navigation buttons Prev
7        closeBtn: '<div class="fancybox-wrap-popup-close"><svg preserveAspectRatio="xMinYMin meet" viewBox="0 0 23 23" xmlns="http://www.w3.org/2000/svg"><g><polygon points="23,0.717 22.283,0 11.5,10.783 0.716,0 0,0.717 10.783,11.5 0,22.283 0.716,23 11.5,12.216 22.283,23 23,22.283 12.216,11.5"/></g></svg></div>' // Navigation buttons Close
8    };
9
10    var navigationInit = false,
11        modalMargin = 100,
12        modalMarginUpdate;
13
14    function setMargin() {
15        if ($(window).width() > (BREAK.LG)) {
16            modalMarginUpdate = 100;
17        } else if ($(window).width() > (BREAK.SM)) {
18            modalMarginUpdate = 74;
19        } else if ($(window).width() >= (BREAK.MN_L)) {
20            modalMarginUpdate = 65;
21        } else {
22            modalMarginUpdate = 40;
23        }
24
25        if (modalMargin !== modalMarginUpdate) {
26            modalMargin = modalMarginUpdate;
27        }
28    }
29
30    var fancyboxCustom = {
31        navigation: false,
32        init: function ($container) {
33            setMargin();
34            this.initFancybox($container);
35        },
36        initFancybox: (function () {
37            return function ($container) {
38                $container.fancybox({
39                    openEffect: 'elastic',
40                    closeEffect: 'elastic',
41                    maxWidth: 1220,
42                    maxHeight: 680,
43                    autoSize: true,
44                    minWidth: 190,
45                    margin: modalMargin,
46                    padding: 0,
47                    aspectRatio: true,
48                    tpl: {
49                        wrap: '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-wrap-popup fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>'
50                    },
51                    helpers: {
52                        title: {
53                            type: 'inside'
54                        }
55                    },
56                    afterLoad: function () {
57                        this.title = '<span class="fancybox-counter">' + (this.index + 1) + ' of ' + this.group.length + '</span>' + (this.title ? '<span class="fancybox-title-text">' + this.title + '</span>' : '');
58
59                        var $wrapper = $('.fancybox-overlay');
60                        if (!navigationInit) {
61                            $wrapper.append(btnsTpl.next).append(btnsTpl.prev).append(btnsTpl.closeBtn);
62                            navigationInit = true;
63                        }
64
65                        // Callback
66                        $('.fancybox-wrap-popup-close').on('click', function () {
67                            $.fancybox.close();
68                            return false;
69                        });
70                        $('.fancybox-wrap-popup-next').on('click', function () {
71                            $.fancybox.next();
72                        });
73
74                        $('.fancybox-wrap-popup-prev').on('click', function () {
75                            $.fancybox.prev();
76                        });
77                    },
78                    afterClose: function () {
79                        navigationInit = false;
80                    },
81                    onUpdate: function () {
82                        setMargin();
83                        if (modalMargin !== modalMarginUpdate) {
84                            $.fancybox.update();
85                        }
86                    }
87                });
88            }
89        })()
90    };
91    fancyboxCustom.init($('.fancybox'));
92});