diff options
Diffstat (limited to 'ishtar_common/static/lightgallery/js/lightgallery.js')
| -rw-r--r-- | ishtar_common/static/lightgallery/js/lightgallery.js | 1604 |
1 files changed, 1604 insertions, 0 deletions
diff --git a/ishtar_common/static/lightgallery/js/lightgallery.js b/ishtar_common/static/lightgallery/js/lightgallery.js new file mode 100644 index 000000000..ae1cdf3a7 --- /dev/null +++ b/ishtar_common/static/lightgallery/js/lightgallery.js @@ -0,0 +1,1604 @@ +/**! + * lightgallery.js | 1.0.2 | January 14th 2018 + * http://sachinchoolur.github.io/lightgallery.js/ + * Copyright (c) 2016 Sachin N; + * @license GPLv3 + */(function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.Lightgallery = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){ +(function (global, factory) { + if (typeof define === "function" && define.amd) { + define(['exports'], factory); + } else if (typeof exports !== "undefined") { + factory(exports); + } else { + var mod = { + exports: {} + }; + factory(mod.exports); + global.lgUtils = mod.exports; + } +})(this, function (exports) { + 'use strict'; + + Object.defineProperty(exports, "__esModule", { + value: true + }); + + /* + *@todo remove function from window and document. Update on and off functions + */ + window.getAttribute = function (label) { + return window[label]; + }; + + window.setAttribute = function (label, value) { + window[label] = value; + }; + + document.getAttribute = function (label) { + return document[label]; + }; + + document.setAttribute = function (label, value) { + document[label] = value; + }; + + var utils = { + wrap: function wrap(el, className) { + if (!el) { + return; + } + + var wrapper = document.createElement('div'); + wrapper.className = className; + el.parentNode.insertBefore(wrapper, el); + el.parentNode.removeChild(el); + wrapper.appendChild(el); + }, + + addClass: function addClass(el, className) { + if (!el) { + return; + } + + if (el.classList) { + el.classList.add(className); + } else { + el.className += ' ' + className; + } + }, + + removeClass: function removeClass(el, className) { + if (!el) { + return; + } + + if (el.classList) { + el.classList.remove(className); + } else { + el.className = el.className.replace(new RegExp('(^|\\b)' + className.split(' ').join('|') + '(\\b|$)', 'gi'), ' '); + } + }, + + hasClass: function hasClass(el, className) { + if (el.classList) { + return el.classList.contains(className); + } else { + return new RegExp('(^| )' + className + '( |$)', 'gi').test(el.className); + } + + return false; + }, + + // ex Transform + // ex TransitionTimingFunction + setVendor: function setVendor(el, property, value) { + if (!el) { + return; + } + + el.style[property.charAt(0).toLowerCase() + property.slice(1)] = value; + el.style['webkit' + property] = value; + el.style['moz' + property] = value; + el.style['ms' + property] = value; + el.style['o' + property] = value; + }, + + trigger: function trigger(el, event) { + var detail = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null; + + if (!el) { + return; + } + + var customEvent = new CustomEvent(event, { + detail: detail + }); + el.dispatchEvent(customEvent); + }, + + Listener: { + uid: 0 + }, + on: function on(el, events, fn) { + if (!el) { + return; + } + + events.split(' ').forEach(function (event) { + var _id = el.getAttribute('lg-event-uid') || ''; + utils.Listener.uid++; + _id += '&' + utils.Listener.uid; + el.setAttribute('lg-event-uid', _id); + utils.Listener[event + utils.Listener.uid] = fn; + el.addEventListener(event.split('.')[0], fn, false); + }); + }, + + off: function off(el, event) { + if (!el) { + return; + } + + var _id = el.getAttribute('lg-event-uid'); + if (_id) { + _id = _id.split('&'); + for (var i = 0; i < _id.length; i++) { + if (_id[i]) { + var _event = event + _id[i]; + if (_event.substring(0, 1) === '.') { + for (var key in utils.Listener) { + if (utils.Listener.hasOwnProperty(key)) { + if (key.split('.').indexOf(_event.split('.')[1]) > -1) { + el.removeEventListener(key.split('.')[0], utils.Listener[key]); + el.setAttribute('lg-event-uid', el.getAttribute('lg-event-uid').replace('&' + _id[i], '')); + delete utils.Listener[key]; + } + } + } + } else { + el.removeEventListener(_event.split('.')[0], utils.Listener[_event]); + el.setAttribute('lg-event-uid', el.getAttribute('lg-event-uid').replace('&' + _id[i], '')); + delete utils.Listener[_event]; + } + } + } + } + }, + + param: function param(obj) { + return Object.keys(obj).map(function (k) { + return encodeURIComponent(k) + '=' + encodeURIComponent(obj[k]); + }).join('&'); + } + }; + + exports.default = utils; +}); + +},{}],2:[function(require,module,exports){ +(function (global, factory) { + if (typeof define === "function" && define.amd) { + define(['./lg-utils'], factory); + } else if (typeof exports !== "undefined") { + factory(require('./lg-utils')); + } else { + var mod = { + exports: {} + }; + factory(global.lgUtils); + global.lightgallery = mod.exports; + } +})(this, function (_lgUtils) { + 'use strict'; + + var _lgUtils2 = _interopRequireDefault(_lgUtils); + + function _interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { + default: obj + }; + } + + var _extends = Object.assign || function (target) { + for (var i = 1; i < arguments.length; i++) { + var source = arguments[i]; + + for (var key in source) { + if (Object.prototype.hasOwnProperty.call(source, key)) { + target[key] = source[key]; + } + } + } + + return target; + }; + + /** Polyfill the CustomEvent() constructor functionality in Internet Explorer 9 and higher */ + (function () { + + if (typeof window.CustomEvent === 'function') { + return false; + } + + function CustomEvent(event, params) { + params = params || { + bubbles: false, + cancelable: false, + detail: undefined + }; + var evt = document.createEvent('CustomEvent'); + evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail); + return evt; + } + + CustomEvent.prototype = window.Event.prototype; + + window.CustomEvent = CustomEvent; + })(); + + window.utils = _lgUtils2.default; + window.lgData = { + uid: 0 + }; + + window.lgModules = {}; + var defaults = { + + mode: 'lg-slide', + + // Ex : 'ease' + cssEasing: 'ease', + + //'for jquery animation' + easing: 'linear', + speed: 600, + height: '100%', + width: '100%', + addClass: '', + startClass: 'lg-start-zoom', + backdropDuration: 150, + hideBarsDelay: 6000, + + useLeft: false, + + closable: true, + loop: true, + escKey: true, + keyPress: true, + controls: true, + slideEndAnimatoin: true, + hideControlOnEnd: false, + mousewheel: false, + + getCaptionFromTitleOrAlt: true, + + // .lg-item || '.lg-sub-html' + appendSubHtmlTo: '.lg-sub-html', + + subHtmlSelectorRelative: false, + + /** + * @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: '', + selectWithin: '', + 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; + + // lightGallery settings + this.s = _extends({}, defaults, options); + + // When using dynamic mode, ensure dynamicEl is an array + if (this.s.dynamic && this.s.dynamicEl !== 'undefined' && this.s.dynamicEl.constructor === Array && !this.s.dynamicEl.length) { + throw 'When using dynamic mode, you must also define dynamicEl as an Array.'; + } + + // 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; + } + + this.items = []; + + // Gallery items + if (this.s.dynamic) { + this.items = this.s.dynamicEl; + } else { + if (this.s.selector === 'this') { + this.items.push(this.el); + } else if (this.s.selector !== '') { + if (this.s.selectWithin) { + this.items = document.querySelector(this.s.selectWithin).querySelectorAll(this.s.selector); + } else { + this.items = this.el.querySelectorAll(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); + + _lgUtils2.default.addClass(document.body, 'lg-from-hash'); + if (!_lgUtils2.default.hasClass(document.body, 'lg-on')) { + _lgUtils2.default.addClass(document.body, 'lg-on'); + setTimeout(function () { + _this.build(_this.index); + }); + } + } + + if (_this.s.dynamic) { + + _lgUtils2.default.trigger(this.el, 'onBeforeOpen'); + + _this.index = _this.s.index || 0; + + // prevent accidental double execution + if (!_lgUtils2.default.hasClass(document.body, 'lg-on')) { + _lgUtils2.default.addClass(document.body, 'lg-on'); + setTimeout(function () { + _this.build(_this.index); + }); + } + } else { + + for (var i = 0; i < _this.items.length; i++) { + + /*jshint loopfunc: true */ + (function (index) { + + // Using different namespace for click because click event should not unbind if selector is same object('this') + _lgUtils2.default.on(_this.items[index], 'click.lgcustom', function (e) { + + e.preventDefault(); + + _lgUtils2.default.trigger(_this.el, 'onBeforeOpen'); + + _this.index = _this.s.index || index; + + if (!_lgUtils2.default.hasClass(document.body, 'lg-on')) { + _this.build(_this.index); + _lgUtils2.default.addClass(document.body, 'lg-on'); + } + }); + })(i); + } + } + }; + + Plugin.prototype.build = function (index) { + + var _this = this; + + _this.structure(); + + for (var key in window.lgModules) { + _this.modules[key] = new window.lgModules[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(); + + _lgUtils2.default.trigger(_this.el, 'onAfterOpen'); + + // Hide controllers if mouse doesn't move for some period + _lgUtils2.default.on(_this.outer, 'mousemove.lg click.lg touchstart.lg', function () { + + _lgUtils2.default.removeClass(_this.outer, 'lg-hide-items'); + + clearTimeout(_this.hideBartimeout); + + // Timeout will be cleared on each slide movement also + _this.hideBartimeout = setTimeout(function () { + _lgUtils2.default.addClass(_this.outer, 'lg-hide-items'); + }, _this.s.hideBarsDelay); + }); + }; + + Plugin.prototype.structure = function () { + var list = ''; + var controls = ''; + var i = 0; + var subHtmlCont = ''; + var template; + var _this = this; + + document.body.insertAdjacentHTML('beforeend', '<div class="lg-backdrop"></div>'); + _lgUtils2.default.setVendor(document.querySelector('.lg-backdrop'), 'TransitionDuration', this.s.backdropDuration + 'ms'); + + // Create gallery items + for (i = 0; i < this.items.length; i++) { + list += '<div class="lg-item"></div>'; + } + + // Create controlls + if (this.s.controls && this.items.length > 1) { + controls = '<div class="lg-actions">' + '<div class="lg-prev lg-icon">' + this.s.prevHtml + '</div>' + '<div class="lg-next lg-icon">' + this.s.nextHtml + '</div>' + '</div>'; + } + + if (this.s.appendSubHtmlTo === '.lg-sub-html') { + subHtmlCont = '<div class="lg-sub-html"></div>'; + } + + template = '<div class="lg-outer ' + this.s.addClass + ' ' + this.s.startClass + '">' + '<div class="lg" style="width:' + this.s.width + '; height:' + this.s.height + '">' + '<div class="lg-inner">' + list + '</div>' + '<div class="lg-toolbar group">' + '<span class="lg-close lg-icon"></span>' + '</div>' + controls + subHtmlCont + '</div>' + '</div>'; + + document.body.insertAdjacentHTML('beforeend', template); + this.outer = document.querySelector('.lg-outer'); + this.___slide = this.outer.querySelectorAll('.lg-item'); + + if (this.s.useLeft) { + _lgUtils2.default.addClass(this.outer, 'lg-use-left'); + + // Set mode lg-slide if use left is true; + this.s.mode = 'lg-slide'; + } else { + _lgUtils2.default.addClass(this.outer, 'lg-use-css3'); + } + + // For fixed height gallery + _this.setTop(); + _lgUtils2.default.on(window, 'resize.lg orientationchange.lg', function () { + setTimeout(function () { + _this.setTop(); + }, 100); + }); + + // add class lg-current to remove initial transition + _lgUtils2.default.addClass(this.___slide[this.index], 'lg-current'); + + // add Class for css support and transition mode + if (this.doCss()) { + _lgUtils2.default.addClass(this.outer, 'lg-css3'); + } else { + _lgUtils2.default.addClass(this.outer, 'lg-css'); + + // Set speed 0 because no animation will happen if browser doesn't support css3 + this.s.speed = 0; + } + + _lgUtils2.default.addClass(this.outer, this.s.mode); + + if (this.s.enableDrag && this.items.length > 1) { + _lgUtils2.default.addClass(this.outer, 'lg-grab'); + } + + if (this.s.showAfterLoad) { + _lgUtils2.default.addClass(this.outer, 'lg-show-after-load'); + } + + if (this.doCss()) { + var inner = this.outer.querySelector('.lg-inner'); + _lgUtils2.default.setVendor(inner, 'TransitionTimingFunction', this.s.cssEasing); + _lgUtils2.default.setVendor(inner, 'TransitionDuration', this.s.speed + 'ms'); + } + + setTimeout(function () { + _lgUtils2.default.addClass(document.querySelector('.lg-backdrop'), 'in'); + }); + + setTimeout(function () { + _lgUtils2.default.addClass(_this.outer, 'lg-visible'); + }, this.s.backdropDuration); + + if (this.s.download) { + this.outer.querySelector('.lg-toolbar').insertAdjacentHTML('beforeend', '<a id="lg-download" target="_blank" download class="lg-download lg-icon"></a>'); + } + + // Store the current scroll top value to scroll back after closing the gallery.. + this.prevScrollTop = document.documentElement.scrollTop || document.body.scrollTop; + }; + + // For fixed height gallery + Plugin.prototype.setTop = function () { + if (this.s.height !== '100%') { + var wH = window.innerHeight; + var top = (wH - parseInt(this.s.height, 10)) / 2; + var lGallery = this.outer.querySelector('.lg'); + if (wH >= parseInt(this.s.height, 10)) { + lGallery.style.top = top + 'px'; + } else { + lGallery.style.top = '0px'; + } + } + }; + + // Find css3 support + Plugin.prototype.doCss = function () { + // check for css animation support + var support = function support() { + 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) { + + if (!src) { + throw new Error("Make sure that slide " + index + " has an image/video src"); + } + + var html; + if (this.s.dynamic) { + html = this.s.dynamicEl[index].html; + } else { + html = this.items[index].getAttribute('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); + var vk = src.match(/\/\/(?:www\.)?(?:vk\.com|vkontakte\.ru)\/(?:video_ext\.php\?)(.*)/i); + + if (youtube) { + return { + youtube: youtube + }; + } else if (vimeo) { + return { + vimeo: vimeo + }; + } else if (dailymotion) { + return { + dailymotion: dailymotion + }; + } else if (vk) { + return { + vk: vk + }; + } + }; + + /** + * @desc Create image counter + * Ex: 1/10 + */ + Plugin.prototype.counter = function () { + if (this.s.counter) { + this.outer.querySelector(this.s.appendCounterTo).insertAdjacentHTML('beforeend', '<div id="lg-counter"><span id="lg-counter-current">' + (parseInt(this.index, 10) + 1) + '</span> / <span id="lg-counter-all">' + this.items.length + '</span></div>'); + } + }; + + /** + * @desc add sub-html into the slide + * @param {Number} index - index of the slide + */ + Plugin.prototype.addHtml = function (index) { + var subHtml = null; + var currentEle; + if (this.s.dynamic) { + subHtml = this.s.dynamicEl[index].subHtml; + } else { + currentEle = this.items[index]; + subHtml = currentEle.getAttribute('data-sub-html'); + if (this.s.getCaptionFromTitleOrAlt && !subHtml) { + subHtml = currentEle.getAttribute('title'); + if (subHtml && currentEle.querySelector('img')) { + subHtml = currentEle.querySelector('img').getAttribute('alt'); + } + } + } + + 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 === '#') { + if (this.s.subHtmlSelectorRelative && !this.s.dynamic) { + subHtml = currentEle.querySelector(subHtml).innerHTML; + } else { + subHtml = document.querySelector(subHtml).innerHTML; + } + } + } else { + subHtml = ''; + } + + if (this.s.appendSubHtmlTo === '.lg-sub-html') { + this.outer.querySelector(this.s.appendSubHtmlTo).innerHTML = subHtml; + } else { + this.___slide[index].insertAdjacentHTML('beforeend', subHtml); + } + + // Add lg-empty-html class if title doesn't exist + if (typeof subHtml !== 'undefined' && subHtml !== null) { + if (subHtml === '') { + _lgUtils2.default.addClass(this.outer.querySelector(this.s.appendSubHtmlTo), 'lg-empty-html'); + } else { + _lgUtils2.default.removeClass(this.outer.querySelector(this.s.appendSubHtmlTo), 'lg-empty-html'); + } + } + + _lgUtils2.default.trigger(this.el, 'onAfterAppendSubHtml', { + index: 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 _poster; + var _srcset; + var _sizes; + var _html; + var getResponsiveSrc = function getResponsiveSrc(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.innerWidth; + 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[index].getAttribute('data-poster')) { + _hasPoster = true; + _poster = _this.items[index].getAttribute('data-poster'); + } + + _html = _this.items[index].getAttribute('data-html'); + _src = _this.items[index].getAttribute('href') || _this.items[index].getAttribute('data-src'); + + if (_this.items[index].getAttribute('data-responsive')) { + var srcItms = _this.items[index].getAttribute('data-responsive').split(','); + getResponsiveSrc(srcItms); + } + + _srcset = _this.items[index].getAttribute('data-srcset'); + _sizes = _this.items[index].getAttribute('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[index].getAttribute('data-iframe') === 'true') { + iframe = true; + } + } + + var _isVideo = _this.isVideo(_src, index); + if (!_lgUtils2.default.hasClass(_this.___slide[index], 'lg-loaded')) { + if (iframe) { + _this.___slide[index].insertAdjacentHTML('afterbegin', '<div class="lg-video-cont" style="max-width:' + _this.s.iframeMaxWidth + '"><div class="lg-video"><iframe class="lg-object" frameborder="0" src="' + _src + '" allowfullscreen="true"></iframe></div></div>'); + } 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[index].insertAdjacentHTML('beforeend', '<div class="lg-video-cont ' + videoClass + ' "><div class="lg-video"><span class="lg-video-play"></span><img class="lg-object lg-has-poster" src="' + _poster + '" /></div></div>'); + } else if (_isVideo) { + _this.___slide[index].insertAdjacentHTML('beforeend', '<div class="lg-video-cont "><div class="lg-video"></div></div>'); + _lgUtils2.default.trigger(_this.el, 'hasVideo', { + index: index, + src: _src, + html: _html + }); + } else { + _this.___slide[index].insertAdjacentHTML('beforeend', '<div class="lg-img-wrap"><img class="lg-object lg-image" src="' + _src + '" /></div>'); + } + + _lgUtils2.default.trigger(_this.el, 'onAferAppendSlide', { + index: index + }); + + _img = _this.___slide[index].querySelector('.lg-object'); + if (_sizes) { + _img.setAttribute('sizes', _sizes); + } + + if (_srcset) { + _img.setAttribute('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); + } + + _lgUtils2.default.addClass(_this.___slide[index], 'lg-loaded'); + } + + _lgUtils2.default.on(_this.___slide[index].querySelector('.lg-object'), '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 && !_lgUtils2.default.hasClass(document.body, 'lg-from-hash')) { + _speed = delay; + } + + setTimeout(function () { + _lgUtils2.default.addClass(_this.___slide[index], 'lg-complete'); + + _lgUtils2.default.trigger(_this.el, 'onSlideItemLoad', { + index: index, + delay: delay || 0 + }); + }, _speed); + }); + + // @todo check load state for html5 videos + if (_isVideo && _isVideo.html5 && !_hasPoster) { + _lgUtils2.default.addClass(_this.___slide[index], 'lg-complete'); + } + + if (rec === true) { + if (!_lgUtils2.default.hasClass(_this.___slide[index], 'lg-complete')) { + _lgUtils2.default.on(_this.___slide[index].querySelector('.lg-object'), '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 = 0; + for (var i = 0; i < this.___slide.length; i++) { + if (_lgUtils2.default.hasClass(this.___slide[i], 'lg-current')) { + _prevIndex = i; + break; + } + } + + 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) { + + if (this.s.download) { + var _src; + if (_this.s.dynamic) { + _src = _this.s.dynamicEl[index].downloadUrl !== false && (_this.s.dynamicEl[index].downloadUrl || _this.s.dynamicEl[index].src); + } else { + _src = _this.items[index].getAttribute('data-download-url') !== 'false' && (_this.items[index].getAttribute('data-download-url') || _this.items[index].getAttribute('href') || _this.items[index].getAttribute('data-src')); + } + + if (_src) { + document.getElementById('lg-download').setAttribute('href', _src); + _lgUtils2.default.removeClass(_this.outer, 'lg-hide-download'); + } else { + _lgUtils2.default.addClass(_this.outer, 'lg-hide-download'); + } + } + + _lgUtils2.default.trigger(_this.el, 'onBeforeSlide', { + prevIndex: _prevIndex, + index: index, + fromTouch: fromTouch, + fromThumb: 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 + _lgUtils2.default.addClass(_this.outer, 'lg-no-trans'); + + for (var j = 0; j < this.___slide.length; j++) { + _lgUtils2.default.removeClass(this.___slide[j], 'lg-prev-slide'); + _lgUtils2.default.removeClass(this.___slide[j], '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 + _lgUtils2.default.addClass(this.___slide[index], 'lg-prev-slide'); + _lgUtils2.default.addClass(this.___slide[_prevIndex], 'lg-next-slide'); + } else if (_next) { + + // next slide + _lgUtils2.default.addClass(this.___slide[index], 'lg-next-slide'); + _lgUtils2.default.addClass(this.___slide[_prevIndex], 'lg-prev-slide'); + } + + // give 50 ms for browser to add/remove class + setTimeout(function () { + _lgUtils2.default.removeClass(_this.outer.querySelector('.lg-current'), 'lg-current'); + + //_this.$slide.eq(_prevIndex).removeClass('lg-current'); + _lgUtils2.default.addClass(_this.___slide[index], 'lg-current'); + + // reset all transitions + _lgUtils2.default.removeClass(_this.outer, '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; + } + + _lgUtils2.default.removeClass(_this.outer.querySelector('.lg-prev-slide'), 'lg-prev-slide'); + _lgUtils2.default.removeClass(_this.outer.querySelector('.lg-current'), 'lg-current'); + _lgUtils2.default.removeClass(_this.outer.querySelector('.lg-next-slide'), 'lg-next-slide'); + _lgUtils2.default.addClass(_this.___slide[touchPrev], 'lg-prev-slide'); + _lgUtils2.default.addClass(_this.___slide[touchNext], 'lg-next-slide'); + _lgUtils2.default.addClass(_this.___slide[index], 'lg-current'); + } + + if (_this.lGalleryOn) { + setTimeout(function () { + _this.loadContent(index, true, 0); + }, this.s.speed + 50); + + setTimeout(function () { + _this.lgBusy = false; + _lgUtils2.default.trigger(_this.el, 'onAfterSlide', { + prevIndex: _prevIndex, + index: index, + fromTouch: fromTouch, + fromThumb: fromThumb + }); + }, this.s.speed); + } else { + _this.loadContent(index, true, _this.s.backdropDuration); + + _this.lgBusy = false; + _lgUtils2.default.trigger(_this.el, 'onAfterSlide', { + prevIndex: _prevIndex, + index: index, + fromTouch: fromTouch, + fromThumb: fromThumb + }); + } + + _this.lGalleryOn = true; + + if (this.s.counter) { + if (document.getElementById('lg-counter-current')) { + document.getElementById('lg-counter-current').innerHTML = 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++; + _lgUtils2.default.trigger(_this.el, 'onBeforeNextSlide', { + index: _this.index + }); + _this.slide(_this.index, fromTouch, false); + } else { + if (_this.s.loop) { + _this.index = 0; + _lgUtils2.default.trigger(_this.el, 'onBeforeNextSlide', { + index: _this.index + }); + _this.slide(_this.index, fromTouch, false); + } else if (_this.s.slideEndAnimatoin) { + _lgUtils2.default.addClass(_this.outer, 'lg-right-end'); + setTimeout(function () { + _lgUtils2.default.removeClass(_this.outer, '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--; + _lgUtils2.default.trigger(_this.el, 'onBeforePrevSlide', { + index: _this.index, + fromTouch: fromTouch + }); + _this.slide(_this.index, fromTouch, false); + } else { + if (_this.s.loop) { + _this.index = _this.items.length - 1; + _lgUtils2.default.trigger(_this.el, 'onBeforePrevSlide', { + index: _this.index, + fromTouch: fromTouch + }); + _this.slide(_this.index, fromTouch, false); + } else if (_this.s.slideEndAnimatoin) { + _lgUtils2.default.addClass(_this.outer, 'lg-left-end'); + setTimeout(function () { + _lgUtils2.default.removeClass(_this.outer, 'lg-left-end'); + }, 400); + } + } + } + }; + + Plugin.prototype.keyPress = function () { + var _this = this; + if (this.items.length > 1) { + _lgUtils2.default.on(window, '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(); + } + } + }); + } + + _lgUtils2.default.on(window, 'keydown.lg', function (e) { + if (_this.s.escKey === true && e.keyCode === 27) { + e.preventDefault(); + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-thumb-open')) { + _this.destroy(); + } else { + _lgUtils2.default.removeClass(_this.outer, 'lg-thumb-open'); + } + } + }); + }; + + Plugin.prototype.arrow = function () { + var _this = this; + _lgUtils2.default.on(this.outer.querySelector('.lg-prev'), 'click.lg', function () { + _this.goToPrevSlide(); + }); + + _lgUtils2.default.on(this.outer.querySelector('.lg-next'), 'click.lg', function () { + _this.goToNextSlide(); + }); + }; + + Plugin.prototype.arrowDisable = function (index) { + + // Disable arrows if s.hideControlOnEnd is true + if (!this.s.loop && this.s.hideControlOnEnd) { + var next = this.outer.querySelector('.lg-next'); + var prev = this.outer.querySelector('.lg-prev'); + if (index + 1 < this.___slide.length) { + next.removeAttribute('disabled'); + _lgUtils2.default.removeClass(next, 'disabled'); + } else { + next.setAttribute('disabled', 'disabled'); + _lgUtils2.default.addClass(next, 'disabled'); + } + + if (index > 0) { + prev.removeAttribute('disabled'); + _lgUtils2.default.removeClass(prev, 'disabled'); + } else { + next.setAttribute('disabled', 'disabled'); + _lgUtils2.default.addClass(next, 'disabled'); + } + } + }; + + Plugin.prototype.setTranslate = function (el, xValue, yValue) { + // jQuery supports Automatic CSS prefixing since jQuery 1.8.0 + if (this.s.useLeft) { + el.style.left = xValue; + } else { + _lgUtils2.default.setVendor(el, 'Transform', 'translate3d(' + xValue + 'px, ' + yValue + 'px, 0px)'); + } + }; + + Plugin.prototype.touchMove = function (startCoords, endCoords) { + + var distance = endCoords - startCoords; + + if (Math.abs(distance) > 15) { + // reset opacity and transition duration + _lgUtils2.default.addClass(this.outer, 'lg-dragging'); + + // move current slide + this.setTranslate(this.___slide[this.index], distance, 0); + + // move next and prev slide with current slide + this.setTranslate(document.querySelector('.lg-prev-slide'), -this.___slide[this.index].clientWidth + distance, 0); + this.setTranslate(document.querySelector('.lg-next-slide'), this.___slide[this.index].clientWidth + 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') { + _lgUtils2.default.addClass(_this.outer, 'lg-slide'); + } + + for (var i = 0; i < this.___slide.length; i++) { + if (!_lgUtils2.default.hasClass(this.___slide[i], 'lg-current') && !_lgUtils2.default.hasClass(this.___slide[i], 'lg-prev-slide') && !_lgUtils2.default.hasClass(this.___slide[i], 'lg-next-slide')) { + this.___slide[i].style.opacity = '0'; + } + } + + // set transition duration + setTimeout(function () { + _lgUtils2.default.removeClass(_this.outer, '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 + _lgUtils2.default.trigger(_this.el, 'onSlideClick'); + } + + for (var i = 0; i < _this.___slide.length; i++) { + _this.___slide[i].removeAttribute('style'); + } + }); + + // remove slide class once drag/swipe is completed if mode is not slide + setTimeout(function () { + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-dragging') && _this.s.mode !== 'lg-slide') { + _lgUtils2.default.removeClass(_this.outer, '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()) { + + for (var i = 0; i < _this.___slide.length; i++) { + /*jshint loopfunc: true */ + _lgUtils2.default.on(_this.___slide[i], 'touchstart.lg', function (e) { + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-zoomed') && !_this.lgBusy) { + e.preventDefault(); + _this.manageSwipeClass(); + startCoords = e.targetTouches[0].pageX; + } + }); + } + + for (var j = 0; j < _this.___slide.length; j++) { + /*jshint loopfunc: true */ + _lgUtils2.default.on(_this.___slide[j], 'touchmove.lg', function (e) { + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-zoomed')) { + e.preventDefault(); + endCoords = e.targetTouches[0].pageX; + _this.touchMove(startCoords, endCoords); + isMoved = true; + } + }); + } + + for (var k = 0; k < _this.___slide.length; k++) { + /*jshint loopfunc: true */ + _lgUtils2.default.on(_this.___slide[k], 'touchend.lg', function () { + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-zoomed')) { + if (isMoved) { + isMoved = false; + _this.touchEnd(endCoords - startCoords); + } else { + _lgUtils2.default.trigger(_this.el, 'onSlideClick'); + } + } + }); + } + } + }; + + 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()) { + for (var i = 0; i < _this.___slide.length; i++) { + /*jshint loopfunc: true */ + _lgUtils2.default.on(_this.___slide[i], 'mousedown.lg', function (e) { + // execute only on .lg-object + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-zoomed')) { + if (_lgUtils2.default.hasClass(e.target, 'lg-object') || _lgUtils2.default.hasClass(e.target, '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; + + // * + + _lgUtils2.default.removeClass(_this.outer, 'lg-grab'); + _lgUtils2.default.addClass(_this.outer, 'lg-grabbing'); + + _lgUtils2.default.trigger(_this.el, 'onDragstart'); + } + } + } + }); + } + + _lgUtils2.default.on(window, 'mousemove.lg', function (e) { + if (isDraging) { + isMoved = true; + endCoords = e.pageX; + _this.touchMove(startCoords, endCoords); + _lgUtils2.default.trigger(_this.el, 'onDragmove'); + } + }); + + _lgUtils2.default.on(window, 'mouseup.lg', function (e) { + if (isMoved) { + isMoved = false; + _this.touchEnd(endCoords - startCoords); + _lgUtils2.default.trigger(_this.el, 'onDragend'); + } else if (_lgUtils2.default.hasClass(e.target, 'lg-object') || _lgUtils2.default.hasClass(e.target, 'lg-video-play')) { + _lgUtils2.default.trigger(_this.el, 'onSlideClick'); + } + + // Prevent execution on click + if (isDraging) { + isDraging = false; + _lgUtils2.default.removeClass(_this.outer, 'lg-grabbing'); + _lgUtils2.default.addClass(_this.outer, '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; + } + } + + for (var i = 0; i < this.___slide.length; i++) { + _lgUtils2.default.removeClass(this.___slide[i], 'lg-next-slide'); + _lgUtils2.default.removeClass(this.___slide[i], 'lg-prev-slide'); + } + + if (touchPrev > -1) { + _lgUtils2.default.addClass(this.___slide[touchPrev], 'lg-prev-slide'); + } + + _lgUtils2.default.addClass(this.___slide[touchNext], 'lg-next-slide'); + }; + + Plugin.prototype.mousewheel = function () { + var _this = this; + _lgUtils2.default.on(_this.outer, '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; + _lgUtils2.default.on(this.outer.querySelector('.lg-close'), '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 + _lgUtils2.default.on(_this.outer, 'mousedown.lg', function (e) { + + if (_lgUtils2.default.hasClass(e.target, 'lg-outer') || _lgUtils2.default.hasClass(e.target, 'lg-item') || _lgUtils2.default.hasClass(e.target, 'lg-img-wrap')) { + mousedown = true; + } else { + mousedown = false; + } + }); + + _lgUtils2.default.on(_this.outer, 'mouseup.lg', function (e) { + + if (_lgUtils2.default.hasClass(e.target, 'lg-outer') || _lgUtils2.default.hasClass(e.target, 'lg-item') || _lgUtils2.default.hasClass(e.target, 'lg-img-wrap') && mousedown) { + if (!_lgUtils2.default.hasClass(_this.outer, 'lg-dragging')) { + _this.destroy(); + } + } + }); + } + }; + + Plugin.prototype.destroy = function (d) { + + var _this = this; + + if (!d) { + _lgUtils2.default.trigger(_this.el, 'onBeforeClose'); + } + + document.body.scrollTop = _this.prevScrollTop; + document.documentElement.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) { + if (!_this.s.dynamic) { + // only when not using dynamic mode is $items a jquery collection + + for (var i = 0; i < this.items.length; i++) { + _lgUtils2.default.off(this.items[i], '.lg'); + _lgUtils2.default.off(this.items[i], '.lgcustom'); + } + } + + var lguid = _this.el.getAttribute('lg-uid'); + delete window.lgData[lguid]; + _this.el.removeAttribute('lg-uid'); + } + + // Unbind all events added by lightGallery + _lgUtils2.default.off(this.el, '.lgtm'); + + // Distroy all lightGallery modules + for (var key in window.lgModules) { + if (_this.modules[key]) { + _this.modules[key].destroy(); + } + } + + this.lGalleryOn = false; + + clearTimeout(_this.hideBartimeout); + this.hideBartimeout = false; + _lgUtils2.default.off(window, '.lg'); + _lgUtils2.default.removeClass(document.body, 'lg-on'); + _lgUtils2.default.removeClass(document.body, 'lg-from-hash'); + + if (_this.outer) { + _lgUtils2.default.removeClass(_this.outer, 'lg-visible'); + } + + _lgUtils2.default.removeClass(document.querySelector('.lg-backdrop'), 'in'); + setTimeout(function () { + try { + if (_this.outer) { + _this.outer.parentNode.removeChild(_this.outer); + } + + if (document.querySelector('.lg-backdrop')) { + document.querySelector('.lg-backdrop').parentNode.removeChild(document.querySelector('.lg-backdrop')); + } + + if (!d) { + _lgUtils2.default.trigger(_this.el, 'onCloseAfter'); + } + } catch (err) {} + }, _this.s.backdropDuration + 50); + }; + + window.lightGallery = function (el, options) { + if (!el) { + return; + } + + try { + if (!el.getAttribute('lg-uid')) { + var uid = 'lg' + window.lgData.uid++; + window.lgData[uid] = new Plugin(el, options); + el.setAttribute('lg-uid', uid); + } else { + try { + window.lgData[el.getAttribute('lg-uid')].init(); + } catch (err) { + console.error('lightGallery has not initiated properly'); + } + } + } catch (err) { + console.error('lightGallery has not initiated properly'); + } + }; +}); + +},{"./lg-utils":1}]},{},[2])(2) +});
\ No newline at end of file |