/*! lightgallery - v1.2.6 - 2015-10-07 * http://sachinchoolur.github.io/lightGallery/ * Copyright (c) 2015 Sachin N; Licensed Apache 2.0 */ (function($, window, document, undefined) { 'use strict'; var defaults = { mode: 'lg-slide', // Ex : 'ease' cssEasing: 'cubic-bezier(0.25, 0, 0.25, 1)', //'for jquery animation' easing: 'linear', speed: 500, height: '100%', width: '100%', addClass: '', startClass: 'lg-start-zoom', backdropDuration: 150, hideBarsDelay: 5000, useLeft: false, closable: true, loop: true, escKey: true, keyPress: true, controls: true, slideEndAnimatoin: true, hideControlOnEnd: false, mousewheel: true, // .lg-item || '.lg-sub-html' appendSubHtmlTo: '.lg-sub-html', /** * @desc number of preload slides * will exicute only after the current slide is fully loaded. * * @ex you clicked on 4th image and if preload = 1 then 3rd slide and 5th * slide will be loaded in the background after the 4th slide is fully loaded.. * if preload is 2 then 2nd 3rd 5th 6th slides will be preloaded.. ... ... * */ preload: 1, showAfterLoad: true, selector: '', nextHtml: '', prevHtml: '', // 0, 1 index: false, iframeMaxWidth: '100%', download: true, counter: true, appendCounterTo: '.lg-toolbar', swipeThreshold: 50, enableSwipe: true, enableDrag: true, dynamic: false, dynamicEl: [], galleryId: 1 }; function Plugin(element, options) { // Current lightGallery element this.el = element; // Current jquery element this.$el = $(element); // lightGallery settings this.s = $.extend({}, defaults, options); // lightGallery modules this.modules = {}; // false when lightgallery complete first slide; this.lGalleryOn = false; this.lgBusy = false; // Timeout function for hiding controls; this.hideBartimeout = false; // To determine browser supports for touch events; this.isTouch = ('ontouchstart' in document.documentElement); // DIsable hideControlOnEnd if sildeEndAnimation is true if (this.s.slideEndAnimatoin) { this.s.hideControlOnEnd = false; } // Gallery items if (this.s.dynamic) { this.$items = this.s.dynamicEl; } else { if (this.s.selector === 'this') { this.$items = this.$el; } else if (this.s.selector !== '') { this.$items = this.$el.find($(this.s.selector)); } else { this.$items = this.$el.children(); } } // .lg-item this.$slide = ''; // .lg-outer this.$outer = ''; this.init(); return this; } Plugin.prototype.init = function() { var _this = this; // s.preload should not be more than $item.length if (_this.s.preload > _this.$items.length) { _this.s.preload = _this.$items.length; } // if dynamic option is enabled execute immediately var _hash = window.location.hash; if (_hash.indexOf('lg=' + this.s.galleryId) > 0) { _this.index = parseInt(_hash.split('&slide=')[1], 10); $('body').addClass('lg-from-hash'); if (!$('body').hasClass('lg-on')) { setTimeout(function() { _this.build(_this.index); $('body').addClass('lg-on'); }); } } if (_this.s.dynamic) { _this.$el.trigger('onBeforeOpen.lg'); _this.index = _this.s.index || 0; // prevent accidental double execution if (!$('body').hasClass('lg-on')) { setTimeout(function() { _this.build(_this.index); $('body').addClass('lg-on'); }); } } else { // Using different namespace for click because click event should not unbind if selector is same object('this') _this.$items.on('click.lgcustom', function(event) { // For IE8 try { event.preventDefault(); event.preventDefault(); } catch (er) { event.returnValue = false; } _this.$el.trigger('onBeforeOpen.lg'); _this.index = _this.s.index || _this.$items.index(this); // prevent accidental double execution if (!$('body').hasClass('lg-on')) { _this.build(_this.index); $('body').addClass('lg-on'); } }); } }; Plugin.prototype.build = function(index) { var _this = this; _this.structure(); // module constructor $.each($.fn.lightGallery.modules, function(key) { _this.modules[key] = new $.fn.lightGallery.modules[key](_this.el); }); // initiate slide function _this.slide(index, false, false); if (_this.s.keyPress) { _this.keyPress(); } if (_this.$items.length > 1) { _this.arrow(); setTimeout(function() { _this.enableDrag(); _this.enableSwipe(); }, 50); if (_this.s.mousewheel) { _this.mousewheel(); } } _this.counter(); _this.closeGallery(); _this.$el.trigger('onAfterOpen.lg'); // Hide controllers if mouse doesn't move for some period _this.$outer.on('mousemove.lg click.lg touchstart.lg', function() { _this.$outer.removeClass('lg-hide-items'); clearTimeout(_this.hideBartimeout); // Timeout will be cleared on each slide movement also _this.hideBartimeout = setTimeout(function() { _this.$outer.addClass('lg-hide-items'); }, _this.s.hideBarsDelay); }); }; Plugin.prototype.structure = function() { var list = ''; var controls = ''; var i = 0; var subHtmlCont = ''; var template; var _this = this; $('body').append('
'); $('.lg-backdrop').css('transition-duration', this.s.backdropDuration + 'ms'); // Create gallery items for (i = 0; i < this.$items.length; i++) { list += '
'; } // Create controlls if (this.s.controls && this.$items.length > 1) { controls = '
' + '
' + this.s.prevHtml + '
' + '
' + this.s.nextHtml + '
' + '
'; } if (this.s.appendSubHtmlTo === '.lg-sub-html') { subHtmlCont = '
'; } template = '
' + '
' + '
' + list + '
' + '
' + '' + '
' + controls + subHtmlCont + '
' + '
'; $('body').append(template); this.$outer = $('.lg-outer'); this.$slide = this.$outer.find('.lg-item'); if (this.s.useLeft) { this.$outer.addClass('lg-use-left'); // Set mode lg-slide if use left is true; this.s.mode = 'lg-slide'; } else { this.$outer.addClass('lg-use-css3'); } // For fixed height gallery _this.setTop(); $(window).on('resize.lg orientationchange.lg', function() { setTimeout(function() { _this.setTop(); }, 100); }); // add class lg-current to remove initial transition this.$slide.eq(this.index).addClass('lg-current'); // add Class for css support and transition mode if (this.doCss()) { this.$outer.addClass('lg-css3'); } else { this.$outer.addClass('lg-css'); // Set speed 0 because no animation will happen if browser doesn't support css3 this.s.speed = 0; } this.$outer.addClass(this.s.mode); if (this.s.enableDrag && this.$items.length > 1) { this.$outer.addClass('lg-grab'); } if (this.s.showAfterLoad) { this.$outer.addClass('lg-show-after-load'); } if (this.doCss()) { var $inner = this.$outer.find('.lg-inner'); $inner.css('transition-timing-function', this.s.cssEasing); $inner.css('transition-duration', this.s.speed + 'ms'); } $('.lg-backdrop').addClass('in'); setTimeout(function() { _this.$outer.addClass('lg-visible'); }, this.s.backdropDuration); if (this.s.download) { this.$outer.find('.lg-toolbar').append(''); } // Store the current scroll top value to scroll back after closing the gallery.. this.prevScrollTop = $(window).scrollTop(); }; // For fixed height gallery Plugin.prototype.setTop = function() { if (this.s.height !== '100%') { var wH = $(window).height(); var top = (wH - parseInt(this.s.height, 10)) / 2; var $lGallery = this.$outer.find('.lg'); if (wH >= parseInt(this.s.height, 10)) { $lGallery.css('top', top + 'px'); } else { $lGallery.css('top', '0px'); } } }; // Find css3 support Plugin.prototype.doCss = function() { // check for css animation support var support = function() { var transition = ['transition', 'MozTransition', 'WebkitTransition', 'OTransition', 'msTransition', 'KhtmlTransition']; var root = document.documentElement; var i = 0; for (i = 0; i < transition.length; i++) { if (transition[i] in root.style) { return true; } } }; if (support()) { return true; } return false; }; /** * @desc Check the given src is video * @param {String} src * @return {Object} video type * Ex:{ youtube : ["//www.youtube.com/watch?v=c0asJgSyxcY", "c0asJgSyxcY"] } */ Plugin.prototype.isVideo = function(src, index) { var html; if (this.s.dynamic) { html = this.s.dynamicEl[index].html; } else { html = this.$items.eq(index).attr('data-html'); } if (!src && html) { return { html5: true }; } var youtube = src.match(/\/\/(?:www\.)?youtu(?:\.be|be\.com)\/(?:watch\?v=|embed\/)?([a-z0-9\-\_\%]+)/i); var vimeo = src.match(/\/\/(?:www\.)?vimeo.com\/([0-9a-z\-_]+)/i); var dailymotion = src.match(/\/\/(?:www\.)?dai.ly\/([0-9a-z\-_]+)/i); if (youtube) { return { youtube: youtube }; } else if (vimeo) { return { vimeo: vimeo }; } else if (dailymotion) { return { dailymotion: dailymotion }; } }; /** * @desc Create image counter * Ex: 1/10 */ Plugin.prototype.counter = function() { if (this.s.counter) { $(this.s.appendCounterTo).append('
' + (parseInt(this.index, 10) + 1) + ' / ' + this.$items.length + '
'); } }; /** * @desc add sub-html into the slide * @param {Number} index - index of the slide */ Plugin.prototype.addHtml = function(index) { var subHtml = null; var subHtmlUrl; if (this.s.dynamic) { if (this.s.dynamicEl[index].subHtmlUrl) { subHtmlUrl = this.s.dynamicEl[index].subHtmlUrl; } else { subHtml = this.s.dynamicEl[index].subHtml; } } else { if (this.$items.eq(index).attr('data-sub-html-url')) { subHtmlUrl = this.$items.eq(index).attr('data-sub-html-url'); } else { subHtml = this.$items.eq(index).attr('data-sub-html'); } } if (!subHtmlUrl) { if (typeof subHtml !== 'undefined' && subHtml !== null) { // get first letter of subhtml // if first letter starts with . or # get the html form the jQuery object var fL = subHtml.substring(0, 1); if (fL === '.' || fL === '#') { subHtml = $(subHtml).html(); } else { subHtml = subHtml; } } else { subHtml = ''; } } if (this.s.appendSubHtmlTo === '.lg-sub-html') { if (subHtmlUrl) { this.$outer.find(this.s.appendSubHtmlTo).load(subHtmlUrl); } else { this.$outer.find(this.s.appendSubHtmlTo).html(subHtml); } } else { if (subHtmlUrl) { this.$slide.eq(index).load(subHtmlUrl); } else { this.$slide.eq(index).append(subHtml); } } // Add lg-empty-html class if title doesn't exist if (typeof subHtml !== 'undefined' && subHtml !== null) { if (subHtml === '') { this.$outer.find(this.s.appendSubHtmlTo).addClass('lg-empty-html'); } else { this.$outer.find(this.s.appendSubHtmlTo).removeClass('lg-empty-html'); } } this.$el.trigger('onAfterAppendSubHtml.lg', [index]); }; /** * @desc Preload slides * @param {Number} index - index of the slide */ Plugin.prototype.preload = function(index) { var i = 1; var j = 1; for (i = 1; i <= this.s.preload; i++) { if (i >= this.$items.length - index) { break; } this.loadContent(index + i, false, 0); } for (j = 1; j <= this.s.preload; j++) { if (index - j < 0) { break; } this.loadContent(index - j, false, 0); } }; /** * @desc Load slide content into slide. * @param {Number} index - index of the slide. * @param {Boolean} rec - if true call loadcontent() function again. * @param {Boolean} delay - delay for adding complete class. it is 0 except first time. */ Plugin.prototype.loadContent = function(index, rec, delay) { var _this = this; var _hasPoster = false; var _$img; var _src; var _src2; var _poster; var _srcset; var _sizes; var _html; var getResponsiveSrc = function(srcItms) { var rsWidth = []; var rsSrc = []; for (var i = 0; i < srcItms.length; i++) { var __src = srcItms[i].split(' '); // Manage empty space if (__src[0] === '') { __src.splice(0, 1); } rsSrc.push(__src[0]); rsWidth.push(__src[1]); } var wWidth = $(window).width(); for (var j = 0; j < rsWidth.length; j++) { if (parseInt(rsWidth[j], 10) > wWidth) { _src = rsSrc[j]; break; } } }; if (_this.s.dynamic) { if (_this.s.dynamicEl[index].poster) { _hasPoster = true; _poster = _this.s.dynamicEl[index].poster; } _html = _this.s.dynamicEl[index].html; _src = _this.s.dynamicEl[index].src; if (_this.s.dynamicEl[index].responsive) { var srcDyItms = _this.s.dynamicEl[index].responsive.split(','); getResponsiveSrc(srcDyItms); } _srcset = _this.s.dynamicEl[index].srcset; _sizes = _this.s.dynamicEl[index].sizes; } else { if (_this.$items.eq(index).attr('data-poster')) { _hasPoster = true; _poster = _this.$items.eq(index).attr('data-poster'); } _html = _this.$items.eq(index).attr('data-html'); _src = _this.$items.eq(index).attr('href') || _this.$items.eq(index).attr('data-src'); if (_this.$items.eq(index).attr('data-responsive')) { var srcItms = _this.$items.eq(index).attr('data-responsive').split(','); getResponsiveSrc(srcItms); } _srcset = _this.$items.eq(index).attr('data-srcset'); _sizes = _this.$items.eq(index).attr('data-sizes'); } //if (_src || _srcset || _sizes || _poster) { var iframe = false; if (_this.s.dynamic) { if (_this.s.dynamicEl[index].iframe) { iframe = true; } } else { if (_this.$items.eq(index).attr('data-iframe') === 'true') { iframe = true; } } var _isVideo = _this.isVideo(_src, index); if (!_this.$slide.eq(index).hasClass('lg-loaded')) { if (iframe) { _this.$slide.eq(index).prepend('
'); } else if (_hasPoster) { var videoClass = ''; if (_isVideo && _isVideo.youtube) { videoClass = 'lg-has-youtube'; } else if (_isVideo && _isVideo.vimeo) { videoClass = 'lg-has-vimeo'; } else { videoClass = 'lg-has-html5'; } _this.$slide.eq(index).prepend('
'); } else if (_isVideo) { _this.$slide.eq(index).prepend('
'); _this.$el.trigger('hasVideo.lg', [index, _src, _html]); } else { _this.$slide.eq(index).prepend('
'); } _this.$el.trigger('onAferAppendSlide.lg', [index]); _$img = _this.$slide.eq(index).find('.lg-object'); if (_sizes) { _$img.attr('sizes', _sizes); } if (_srcset) { _$img.attr('srcset', _srcset); try { picturefill({ elements: [_$img[0]] }); } catch (e) { console.error('Make sure you have included Picturefill version 2'); } } if (this.s.appendSubHtmlTo !== '.lg-sub-html') { _this.addHtml(index); } _this.$slide.eq(index).addClass('lg-loaded'); } _this.$slide.eq(index).find('.lg-object').on('load.lg error.lg', function() { // For first time add some delay for displaying the start animation. var _speed = 0; // Do not change the delay value because it is required for zoom plugin. // If gallery opened from direct url (hash) speed value should be 0 if (delay && !$('body').hasClass('lg-from-hash')) { _speed = delay; } setTimeout(function() { _this.$slide.eq(index).addClass('lg-complete'); _this.$el.trigger('onSlideItemLoad.lg', [index, delay || 0]); }, _speed); }); // @todo check load state for html5 videos if (_isVideo && _isVideo.html5 && !_hasPoster) { _this.$slide.eq(index).addClass('lg-complete'); } if (rec === true) { if (!_this.$slide.eq(index).hasClass('lg-complete')) { _this.$slide.eq(index).find('.lg-object').on('load.lg error.lg', function() { _this.preload(index); }); } else { _this.preload(index); } } //} }; /** * @desc slide function for lightgallery ** Slide() gets call on start ** ** Set lg.on true once slide() function gets called. ** Call loadContent() on slide() function inside setTimeout ** ** On first slide we do not want any animation like slide of fade ** ** So on first slide( if lg.on if false that is first slide) loadContent() should start loading immediately ** ** Else loadContent() should wait for the transition to complete. ** ** So set timeout s.speed + 50 <=> ** loadContent() will load slide content in to the particular slide ** ** It has recursion (rec) parameter. if rec === true loadContent() will call preload() function. ** ** preload will execute only when the previous slide is fully loaded (images iframe) ** ** avoid simultaneous image load <=> ** Preload() will check for s.preload value and call loadContent() again accoring to preload value ** loadContent() <====> Preload(); * @param {Number} index - index of the slide * @param {Boolean} fromTouch - true if slide function called via touch event or mouse drag * @param {Boolean} fromThumb - true if slide function called via thumbnail click */ Plugin.prototype.slide = function(index, fromTouch, fromThumb) { var _prevIndex = this.$outer.find('.lg-current').index(); var _this = this; // Prevent if multiple call // Required for hsh plugin if (_this.lGalleryOn && (_prevIndex === index)) { return; } var _length = this.$slide.length; var _time = _this.lGalleryOn ? this.s.speed : 0; var _next = false; var _prev = false; if (!_this.lgBusy) { this.$el.trigger('onBeforeSlide.lg', [_prevIndex, index, fromTouch, fromThumb]); _this.lgBusy = true; clearTimeout(_this.hideBartimeout); // Add title if this.s.appendSubHtmlTo === lg-sub-html if (this.s.appendSubHtmlTo === '.lg-sub-html') { // wait for slide animation to complete setTimeout(function() { _this.addHtml(index); }, _time); } this.arrowDisable(index); if (!fromTouch) { // remove all transitions _this.$outer.addClass('lg-no-trans'); this.$slide.removeClass('lg-prev-slide lg-next-slide'); if (index < _prevIndex) { _prev = true; if ((index === 0) && (_prevIndex === _length - 1) && !fromThumb) { _prev = false; _next = true; } } else if (index > _prevIndex) { _next = true; if ((index === _length - 1) && (_prevIndex === 0) && !fromThumb) { _prev = true; _next = false; } } if (_prev) { //prevslide this.$slide.eq(index).addClass('lg-prev-slide'); this.$slide.eq(_prevIndex).addClass('lg-next-slide'); } else if (_next) { // next slide this.$slide.eq(index).addClass('lg-next-slide'); this.$slide.eq(_prevIndex).addClass('lg-prev-slide'); } // give 50 ms for browser to add/remove class setTimeout(function() { _this.$slide.removeClass('lg-current'); //_this.$slide.eq(_prevIndex).removeClass('lg-current'); _this.$slide.eq(index).addClass('lg-current'); // reset all transitions _this.$outer.removeClass('lg-no-trans'); }, 50); } else { var touchPrev = index - 1; var touchNext = index + 1; if ((index === 0) && (_prevIndex === _length - 1)) { // next slide touchNext = 0; touchPrev = _length - 1; } else if ((index === _length - 1) && (_prevIndex === 0)) { // prev slide touchNext = 0; touchPrev = _length - 1; } this.$slide.removeClass('lg-prev-slide lg-current lg-next-slide'); _this.$slide.eq(touchPrev).addClass('lg-prev-slide'); _this.$slide.eq(touchNext).addClass('lg-next-slide'); _this.$slide.eq(index).addClass('lg-current'); } if (_this.lGalleryOn) { setTimeout(function() { _this.loadContent(index, true, 0); }, this.s.speed + 50); setTimeout(function() { _this.lgBusy = false; _this.$el.trigger('onAfterSlide.lg', [_prevIndex, index, fromTouch, fromThumb]); }, this.s.speed); } else { _this.loadContent(index, true, _this.s.backdropDuration); _this.lgBusy = false; _this.$el.trigger('onAfterSlide.lg', [_prevIndex, index, fromTouch, fromThumb]); } if (this.s.download) { var _src; var _src2; if (_this.s.dynamic) { _src = _this.s.dynamicEl[index].downloadUrl || _this.s.dynamicEl[index].src; _src2 = '/images/photo_download.php?img=' + _src; } else { _src = _this.$items.eq(index).attr('data-download-url') || _this.$items.eq(index).attr('href') || _this.$items.eq(index).attr('data-src'); _src2 = '/images/photo_download.php?img=' + _src; } $('#lg-download').attr('href', _src2); } _this.lGalleryOn = true; if (this.s.counter) { $('#lg-counter-current').text(index + 1); } } }; /** * @desc Go to next slide * @param {Boolean} fromTouch - true if slide function called via touch event */ Plugin.prototype.goToNextSlide = function(fromTouch) { var _this = this; if (!_this.lgBusy) { if ((_this.index + 1) < _this.$slide.length) { _this.index++; _this.$el.trigger('onBeforeNextSlide.lg', [_this.index]); _this.slide(_this.index, fromTouch, false); } else { if (_this.s.loop) { _this.index = 0; _this.$el.trigger('onBeforeNextSlide.lg', [_this.index]); _this.slide(_this.index, fromTouch, false); } else if (_this.s.slideEndAnimatoin) { _this.$outer.addClass('lg-right-end'); setTimeout(function() { _this.$outer.removeClass('lg-right-end'); }, 400); } } } }; /** * @desc Go to previous slide * @param {Boolean} fromTouch - true if slide function called via touch event */ Plugin.prototype.goToPrevSlide = function(fromTouch) { var _this = this; if (!_this.lgBusy) { if (_this.index > 0) { _this.index--; _this.$el.trigger('onBeforePrevSlide.lg', [_this.index, fromTouch]); _this.slide(_this.index, fromTouch, false); } else { if (_this.s.loop) { _this.index = _this.$items.length - 1; _this.$el.trigger('onBeforePrevSlide.lg', [_this.index, fromTouch]); _this.slide(_this.index, fromTouch, false); } else if (_this.s.slideEndAnimatoin) { _this.$outer.addClass('lg-left-end'); setTimeout(function() { _this.$outer.removeClass('lg-left-end'); }, 400); } } } }; Plugin.prototype.keyPress = function() { var _this = this; if (this.$items.length > 1) { $(window).on('keyup.lg', function(e) { if (_this.$items.length > 1) { if (e.keyCode === 37) { e.preventDefault(); _this.goToPrevSlide(); } if (e.keyCode === 39) { e.preventDefault(); _this.goToNextSlide(); } } }); } $(window).on('keydown.lg', function(e) { if (_this.s.escKey === true && e.keyCode === 27) { e.preventDefault(); if (!_this.$outer.hasClass('lg-thumb-open')) { _this.destroy(); } else { _this.$outer.removeClass('lg-thumb-open'); } } }); }; Plugin.prototype.arrow = function() { var _this = this; this.$outer.find('.lg-prev').on('click.lg', function() { _this.goToPrevSlide(); }); this.$outer.find('.lg-next').on('click.lg', function() { _this.goToNextSlide(); }); }; Plugin.prototype.arrowDisable = function(index) { // Disable arrows if s.hideControlOnEnd is true if (!this.s.loop && this.s.hideControlOnEnd) { if ((index + 1) < this.$slide.length) { this.$outer.find('.lg-next').removeAttr('disabled').removeClass('disabled'); } else { this.$outer.find('.lg-next').attr('disabled', 'disabled').addClass('disabled'); } if (index > 0) { this.$outer.find('.lg-prev').removeAttr('disabled').removeClass('disabled'); } else { this.$outer.find('.lg-prev').attr('disabled', 'disabled').addClass('disabled'); } } }; Plugin.prototype.setTranslate = function($el, xValue, yValue) { // jQuery supports Automatic CSS prefixing since jQuery 1.8.0 if (this.s.useLeft) { $el.css('left', xValue); } else { $el.css({ transform: 'translate3d(' + (xValue) + 'px, ' + yValue + 'px, 0px)' }); } }; Plugin.prototype.touchMove = function(startCoords, endCoords) { var distance = endCoords - startCoords; // reset opacity and transition duration this.$outer.addClass('lg-dragging'); // move current slide this.setTranslate(this.$slide.eq(this.index), distance, 0); // move next and prev slide with current slide this.setTranslate($('.lg-prev-slide'), -this.$slide.eq(this.index).width() + distance, 0); this.setTranslate($('.lg-next-slide'), this.$slide.eq(this.index).width() + distance, 0); }; Plugin.prototype.touchEnd = function(distance) { var _this = this; // keep slide animation for any mode while dragg/swipe if (_this.s.mode !== 'lg-slide') { _this.$outer.addClass('lg-slide'); } this.$slide.not('.lg-current, .lg-prev-slide, .lg-next-slide').css('opacity', '0'); // set transition duration setTimeout(function() { _this.$outer.removeClass('lg-dragging'); if ((distance < 0) && (Math.abs(distance) > _this.s.swipeThreshold)) { _this.goToNextSlide(true); } else if ((distance > 0) && (Math.abs(distance) > _this.s.swipeThreshold)) { _this.goToPrevSlide(true); } else if (Math.abs(distance) < 5) { // Trigger click if distance is less than 5 pix _this.$el.trigger('onSlideClick.lg'); } _this.$slide.removeAttr('style'); }); // remove slide class once drag/swipe is completed if mode is not slide setTimeout(function() { if (!_this.$outer.hasClass('lg-dragging') && _this.s.mode !== 'lg-slide') { _this.$outer.removeClass('lg-slide'); } }, _this.s.speed + 100); }; Plugin.prototype.enableSwipe = function() { var _this = this; var startCoords = 0; var endCoords = 0; var isMoved = false; if (_this.s.enableSwipe && _this.isTouch && _this.doCss()) { _this.$slide.on('touchstart.lg', function(e) { if (!_this.$outer.hasClass('lg-zoomed') && !_this.lgBusy) { e.preventDefault(); _this.manageSwipeClass(); startCoords = e.originalEvent.targetTouches[0].pageX; } }); _this.$slide.on('touchmove.lg', function(e) { if (!_this.$outer.hasClass('lg-zoomed')) { e.preventDefault(); endCoords = e.originalEvent.targetTouches[0].pageX; _this.touchMove(startCoords, endCoords); isMoved = true; } }); _this.$slide.on('touchend.lg', function() { if (!_this.$outer.hasClass('lg-zoomed')) { if (isMoved) { isMoved = false; _this.touchEnd(endCoords - startCoords); } else { _this.$el.trigger('onSlideClick.lg'); } } }); } }; Plugin.prototype.enableDrag = function() { var _this = this; var startCoords = 0; var endCoords = 0; var isDraging = false; var isMoved = false; if (_this.s.enableDrag && !_this.isTouch && _this.doCss()) { _this.$slide.on('mousedown.lg', function(e) { // execute only on .lg-object if (!_this.$outer.hasClass('lg-zoomed')) { if ($(e.target).hasClass('lg-object') || $(e.target).hasClass('lg-video-play')) { e.preventDefault(); if (!_this.lgBusy) { _this.manageSwipeClass(); startCoords = e.pageX; isDraging = true; // ** Fix for webkit cursor issue https://code.google.com/p/chromium/issues/detail?id=26723 _this.$outer.scrollLeft += 1; _this.$outer.scrollLeft -= 1; // * _this.$outer.removeClass('lg-grab').addClass('lg-grabbing'); _this.$el.trigger('onDragstart.lg'); } } } }); $(window).on('mousemove.lg', function(e) { if (isDraging) { isMoved = true; endCoords = e.pageX; _this.touchMove(startCoords, endCoords); _this.$el.trigger('onDragmove.lg'); } }); $(window).on('mouseup.lg', function(e) { if (isMoved) { isMoved = false; _this.touchEnd(endCoords - startCoords); _this.$el.trigger('onDragend.lg'); } else if ($(e.target).hasClass('lg-object') || $(e.target).hasClass('lg-video-play')) { _this.$el.trigger('onSlideClick.lg'); } // Prevent execution on click if (isDraging) { isDraging = false; _this.$outer.removeClass('lg-grabbing').addClass('lg-grab'); } }); } }; Plugin.prototype.manageSwipeClass = function() { var touchNext = this.index + 1; var touchPrev = this.index - 1; var length = this.$slide.length; if (this.s.loop) { if (this.index === 0) { touchPrev = length - 1; } else if (this.index === length - 1) { touchNext = 0; } } this.$slide.removeClass('lg-next-slide lg-prev-slide'); if (touchPrev > -1) { this.$slide.eq(touchPrev).addClass('lg-prev-slide'); } this.$slide.eq(touchNext).addClass('lg-next-slide'); }; Plugin.prototype.mousewheel = function() { var _this = this; _this.$outer.on('mousewheel.lg', function(e) { if (!e.deltaY) { return; } if (e.deltaY > 0) { _this.goToPrevSlide(); } else { _this.goToNextSlide(); } e.preventDefault(); }); }; Plugin.prototype.closeGallery = function() { var _this = this; var mousedown = false; this.$outer.find('.lg-close').on('click.lg', function() { _this.destroy(); }); if (_this.s.closable) { // If you drag the slide and release outside gallery gets close on chrome // for preventing this check mousedown and mouseup happened on .lg-item or lg-outer _this.$outer.on('mousedown.lg', function(e) { if ($(e.target).is('.lg-outer') || $(e.target).is('.lg-item ') || $(e.target).is('.lg-img-wrap')) { mousedown = true; } else { mousedown = false; } }); _this.$outer.on('mouseup.lg', function(e) { if ($(e.target).is('.lg-outer') || $(e.target).is('.lg-item ') || $(e.target).is('.lg-img-wrap') && mousedown) { if (!_this.$outer.hasClass('lg-dragging')) { _this.destroy(); } } }); } }; Plugin.prototype.destroy = function(d) { var _this = this; _this.$el.trigger('onBeforeClose.lg'); $(window).scrollTop(_this.prevScrollTop); /** * if d is false or undefined destroy will only close the gallery * plugins instance remains with the element * if d is true destroy will completely remove the plugin */ if (d) { this.$items.off('click.lg click.lgcustom'); $.removeData(_this.el, 'lightGallery'); } // Unbind all events added by lightGallery this.$el.off('.lg.tm'); // Distroy all lightGallery modules $.each($.fn.lightGallery.modules, function(key) { if (_this.modules[key]) { _this.modules[key].destroy(); } }); this.lGalleryOn = false; clearTimeout(_this.hideBartimeout); this.hideBartimeout = false; $(window).off('.lg'); $('body').removeClass('lg-on lg-from-hash'); if (_this.$outer) { _this.$outer.removeClass('lg-visible'); } $('.lg-backdrop').removeClass('in'); setTimeout(function() { if (_this.$outer) { _this.$outer.remove(); } $('.lg-backdrop').remove(); _this.$el.trigger('onCloseAfter.lg'); }, _this.s.backdropDuration + 50); }; $.fn.lightGallery = function(options) { return this.each(function() { if (!$.data(this, 'lightGallery')) { $.data(this, 'lightGallery', new Plugin(this, options)); } else { try { $(this).data('lightGallery').init(); } catch (err) { console.error('lightGallery has not initiated properly'); } } }); }; $.fn.lightGallery.modules = {}; })(jQuery,window,document);