https://globecapital.com/wp-content/themes/globe-universal/assets/js/gc-widget-swiper.js

1/**
2 * GC Widget Swiper Manager
3 *
4 * Initializes Swiper instances on [data-gc-widget-swiper="1"] elements
5 * using individual data-* attributes for configuration.
6 *
7 * @package globe-universal
8 */
9
10(function ($, window, document) {
11    'use strict';
12
13    function GCWidgetSwiperManager(options) {
14        this.options    = $.extend({}, GCWidgetSwiperManager.defaults, options || {});
15        this.ns         = '.gcWidgetSwiper';
16        this.initialized = false;
17    }
18
19    GCWidgetSwiperManager.defaults = {
20        debug: false
21    };
22
23    /** Parse data-* attribute to integer with fallback. */
24    GCWidgetSwiperManager.prototype._toInt = function (value, fallback) {
25        var parsed = parseInt(value, 10);
26        return Number.isFinite(parsed) ? parsed : fallback;
27    };
28
29    /** Build Swiper config from element data attributes. */
30    GCWidgetSwiperManager.prototype.getConfig = function (slider, controls) {
31        var auto = slider.getAttribute('data-autoplay') === '1';
32        return {
33            loop:          slider.getAttribute('data-loop') === '1',
34            speed:         this._toInt(slider.getAttribute('data-speed'), 600),
35            spaceBetween:  this._toInt(slider.getAttribute('data-space-between'), 24),
36            slidesPerView: this._toInt(slider.getAttribute('data-slides-mobile'), 1),
37            autoplay: auto ? {
38                delay:               this._toInt(slider.getAttribute('data-autoplay-delay'), 3000),
39                disableOnInteraction: false
40            } : false,
41            pagination: controls.paginationEl ? {
42                el:        controls.paginationEl,
43                clickable: true,
44                type:      slider.getAttribute('data-pagination-type') || 'bullets'
45            } : false,
46            navigation: controls.nextEl && controls.prevEl ? {
47                nextEl: controls.nextEl,
48                prevEl: controls.prevEl
49            } : false,
50            breakpoints: {
51                481:  { slidesPerView: this._toInt(slider.getAttribute('data-slides-tablet'), 2) },
52                769:  { slidesPerView: this._toInt(slider.getAttribute('data-slides-tablet'), 2) },
53                1025: { slidesPerView: this._toInt(slider.getAttribute('data-slides-desktop'), 3) },
54                1201: { slidesPerView: this._toInt(slider.getAttribute('data-slides-desktop'), 3) }
55            }
56        };
57    };
58
59    /** Find controls scoped to the outer wrapper (not inside overflow-hidden viewport). */
60    GCWidgetSwiperManager.prototype.getControls = function (slider) {
61        var wrap = slider.closest('[data-gc-widget-slider-wrap="1"]');
62        if (!wrap) wrap = slider.closest('.gc-widget-slider');
63        if (!wrap) return {};
64        var showDots   = slider.getAttribute('data-show-dots') === '1';
65        var showArrows = slider.getAttribute('data-show-arrows') === '1';
66        return {
67            paginationEl: showDots   ? wrap.querySelector('.gc-widget-slider-pagination') : null,
68            nextEl:       showArrows ? wrap.querySelector('.gc-widget-next')             : null,
69            prevEl:       showArrows ? wrap.querySelector('.gc-widget-prev')             : null
70        };
71    };
72
73    /** Destroy Swiper instance on element if present. */
74    GCWidgetSwiperManager.prototype.destroySwiper = function (slider) {
75        if (slider.swiper) {
76            slider.swiper.destroy(true, true);
77        }
78    };
79
80    /** Initialize one Swiper instance. */
81    GCWidgetSwiperManager.prototype.initSwiper = function (slider) {
82        if (slider.dataset.gcSwiperReady === '1') return;
83
84        var swiperWrapper = slider.querySelector('.swiper-wrapper');
85        if (!swiperWrapper) {
86            if (this.options.debug && window.console) {
87                console.warn('GCWidgetSwiper: .swiper-wrapper missing.', slider);
88            }
89            return;
90        }
91
92        slider.dataset.gcSwiperReady = '1';
93
94        try {
95            var controls = this.getControls(slider);
96            var config   = this.getConfig(slider, controls);
97            var swiper   = new Swiper(slider, config);
98            this._bindArrowActive(swiper, controls);
99        } catch (e) {
100            delete slider.dataset.gcSwiperReady;
101            if (window.console) console.error('GCWidgetSwiper init failed:', e);
102        }
103    };
104
105    /** Flash active class on arrow click. */
106    GCWidgetSwiperManager.prototype._bindArrowActive = function (swiper, controls) {

107        if (controls.prevEl) {
108            controls.prevEl.addEventListener('click', function () {
109                controls.prevEl.classList.add('active');
110            });
111        }
112        if (controls.nextEl) {
113            controls.nextEl.addEventListener('click', function () {
114                controls.nextEl.classList.add('active');
115            });
116        }
117        // Remove active from both on slide change
118        swiper.on('slideChange', function () {
119            if (controls.prevEl) controls.prevEl.classList.remove('active');
120            if (controls.nextEl) controls.nextEl.classList.remove('active');
121        });
122    };
123
124    /** Initialize all sliders within a scope. */
125    GCWidgetSwiperManager.prototype.init = function (scope) {
126        var context = scope || document;
127        if (typeof Swiper === 'undefined') {
128            if (window.console) console.warn('GCWidgetSwiper: Swiper not loaded.');
129            return;
130        }
131        var self    = this;
132        var sliders = context.querySelectorAll('[data-gc-widget-swiper="1"]');
133        Array.prototype.forEach.call(sliders, function (el) { self.initSwiper(el); });
134    };
135
136    /** Bind widget save reinit. */
137    GCWidgetSwiperManager.prototype.bind = function () {
138        var self = this;
139        $(document).off('widget-added' + this.ns + ' widget-updated' + this.ns)
140            .on('widget-added' + this.ns + ' widget-updated' + this.ns, function () {
141                self.init(document);
142            });
143    };
144
145    /* ─── Singleton + bootstrap ────────────────────────────────────────── */
146    window.GCWidgetSwiperManager = new GCWidgetSwiperManager();
147
148    $(function () { window.GCWidgetSwiperManager.init(); });
149    if ($.fn.jquery) { window.GCWidgetSwiperManager.bind(); }
150
151    /* Backward-compat alias for old global. */
152    window.GCInitWidgetSwipers = function (scope) {
153        window.GCWidgetSwiperManager.init(scope);
154    };
155
156})((typeof jQuery !== 'undefined' ? jQuery : function () { return {}; }), window, document);