1/*! lg-autoplay - v1.0.2 - 2017-01-22
2* http://sachinchoolur.github.io/lightGallery
3* Copyright (c) 2017 Sachin N; Licensed GPLv3 */
4
5(function (root, factory) {
6  if (typeof define === 'function' && define.amd) {
7    // AMD. Register as an anonymous module unless amdModuleId is set
8    define(['jquery'], function (a0) {
9      return (factory(a0));
10    });
11  } else if (typeof exports === 'object') {
12    // Node. Does not work with strict CommonJS, but
13    // only CommonJS-like environments that support module.exports,
14    // like Node.
15    module.exports = factory(require('jquery'));
16  } else {
17    factory(jQuery);
18  }
19}(this, function ($) {
20
21
22(function() {
23
24    'use strict';
25
26    var defaults = {
27        autoplay: false,
28        pause: 5000,
29        progressBar: true,
30        fourceAutoplay: false,
31        autoplayControls: true,
32        appendAutoplayControlsTo: '.lg-toolbar'
33    };
34
35    /**
36     * Creates the autoplay plugin.
37     * @param {object} element - lightGallery element
38     */
39    var Autoplay = function(element) {
40
41        this.core = $(element).data('lightGallery');
42
43        this.$el = $(element);
44
45        // Execute only if items are above 1
46        if (this.core.$items.length < 2) {
47            return false;
48        }
49
50        this.core.s = $.extend({}, defaults, this.core.s);
51        this.interval = false;
52
53        // Identify if slide happened from autoplay
54        this.fromAuto = true;
55
56        // Identify if autoplay canceled from touch/drag
57        this.canceledOnTouch = false;
58
59        // save fourceautoplay value
60        this.fourceAutoplayTemp = this.core.s.fourceAutoplay;
61
62        // do not allow progress bar if browser does not support css3 transitions
63        if (!this.core.doCss()) {
64            this.core.s.progressBar = false;
65        }
66
67        this.init();
68
69        return this;
70    };
71
72    Autoplay.prototype.init = function() {
73        var _this = this;
74
75        // append autoplay controls
76        if (_this.core.s.autoplayControls) {
77            _this.controls();
78        }
79
80        // Create progress bar
81        if (_this.core.s.progressBar) {
82            _this.core.$outer.find('.lg').append('<div class="lg-progress-bar"><div class="lg-progress"></div></div>');
83        }
84
85        // set progress
86        _this.progress();
87
88        // Start autoplay
89        if (_this.core.s.autoplay) {
90            _this.startlAuto();
91        }
92
93        // cancel interval on touchstart and dragstart
94        _this.$el.on('onDragstart.lg.tm touchstart.lg.tm', function() {
95            if (_this.interval) {
96                _this.cancelAuto();
97                _this.canceledOnTouch = true;
98            }
99        });
100
101        // restore autoplay if autoplay canceled from touchstart / dragstart
102        _this.$el.on('onDragend.lg.tm touchend.lg.tm onSlideClick.lg.tm', function() {
103            if (!_this.interval && _this.canceledOnTouch) {
104                _this.startlAuto();
105                _this.canceledOnTouch = false;
106            }
107        });
108
109    };
110
111    Autoplay.prototype.progress = function() {
112
113        var _this = this;
114        var _$progressBar;
115        var _$progress;
116
117        _this.$el.on('onBeforeSlide.lg.tm', function() {
118
119            // start progress bar animation
120            if (_this.core.s.progressBar && _this.fromAuto) {
121                _$progressBar = _this.core.$outer.find('.lg-progress-bar');
122                _$progress = _this.core.$outer.find('.lg-progress');
123                if (_this.interval) {
124                    _$progress.removeAttr('style');
125                    _$progressBar.removeClass('lg-start');
126                    setTimeout(function() {
127                        _$progress.css('transition', 'width ' + (_this.core.s.speed + _this.core.s.pause) + 'ms ease 0s');
128                        _$progressBar.addClass('lg-start');
129                    }, 20);
130                }
131            }
132
133            // Remove setinterval if slide is triggered manually and fourceautoplay is false
134            if (!_this.fromAuto && !_this.core.s.fourceAutoplay) {
135                _this.cancelAuto();
136            }
137
138            _this.fromAuto = false;
139
140        });
141    };
142
143    // Manage autoplay via play/stop buttons
144    Autoplay.prototype.controls = function() {
145        var _this = this;
146        var _html = '<span class="lg-autoplay-button lg-icon"></span>';
147
148        // Append autoplay controls
149        $(this.core.s.appendAutoplayControlsTo).append(_html);
150
151        _this.core.$outer.find('.lg-autoplay-button').on('click.lg', function() {
152            if ($(_this.core.$outer).hasClass('lg-show-autoplay')) {
153                _this.cancelAuto();
154                _this.core.s.fourceAutoplay = false;
155            } else {
156                if (!_this.interval) {
157                    _this.startlAuto();
158                    _this.core.s.fourceAutoplay = _this.fourceAutoplayTemp;
159                }
160            }
161        });
162    };
163
164    // Autostart gallery
165    Autoplay.prototype.startlAuto = function() {
166        var _this = this;
167
168        _this.core.$outer.find('.lg-progress').css('transition', 'width ' + (_this.core.s.speed + _this.core.s.pause) + 'ms ease 0s');
169        _this.core.$outer.addClass('lg-show-autoplay');
170        _this.core.$outer.find('.lg-progress-bar').addClass('lg-start');
171
172        _this.interval = setInterval(function() {
173            if (_this.core.index + 1 < _this.core.$items.length) {
174                _this.core.index++;
175            } else {
176                _this.core.index = 0;
177            }
178
179            _this.fromAuto = true;
180            _this.core.slide(_this.core.index, false, false, 'next');
181        }, _this.core.s.speed + _this.core.s.pause);
182    };
183
184    // cancel Autostart
185    Autoplay.prototype.cancelAuto = function() {
186        clearInterval(this.interval);
187        this.interval = false;
188        this.core.$outer.find('.lg-progress').removeAttr('style');
189        this.core.$outer.removeClass('lg-show-autoplay');
190        this.core.$outer.find('.lg-progress-bar').removeClass('lg-start');
191    };
192
193    Autoplay.prototype.destroy = function() {
194
195        this.cancelAuto();
196        this.core.$outer.find('.lg-progress-bar').remove();
197    };
198
199    $.fn.lightGallery.modules.autoplay = Autoplay;
200
201})();
202
203
204}));
205