lg-pager.js 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. /*! lightgallery - v1.2.21 - 2016-06-28
  2. * http://sachinchoolur.github.io/lightGallery/
  3. * Copyright (c) 2016 Sachin N; Licensed Apache 2.0 */
  4. (function($, window, document, undefined) {
  5. 'use strict';
  6. var defaults = {
  7. pager: false
  8. };
  9. var Pager = function(element) {
  10. this.core = $(element).data('lightGallery');
  11. this.$el = $(element);
  12. this.core.s = $.extend({}, defaults, this.core.s);
  13. if (this.core.s.pager && this.core.$items.length > 1) {
  14. this.init();
  15. }
  16. return this;
  17. };
  18. Pager.prototype.init = function() {
  19. var _this = this;
  20. var pagerList = '';
  21. var $pagerCont;
  22. var $pagerOuter;
  23. var timeout;
  24. _this.core.$outer.find('.lg').append('<div class="lg-pager-outer"></div>');
  25. if (_this.core.s.dynamic) {
  26. for (var i = 0; i < _this.core.s.dynamicEl.length; i++) {
  27. pagerList += '<span class="lg-pager-cont"> <span class="lg-pager"></span><div class="lg-pager-thumb-cont"><span class="lg-caret"></span> <img src="' + _this.core.s.dynamicEl[i].thumb + '" /></div></span>';
  28. }
  29. } else {
  30. _this.core.$items.each(function() {
  31. if (!_this.core.s.exThumbImage) {
  32. pagerList += '<span class="lg-pager-cont"> <span class="lg-pager"></span><div class="lg-pager-thumb-cont"><span class="lg-caret"></span> <img src="' + $(this).find('img').attr('src') + '" /></div></span>';
  33. } else {
  34. pagerList += '<span class="lg-pager-cont"> <span class="lg-pager"></span><div class="lg-pager-thumb-cont"><span class="lg-caret"></span> <img src="' + $(this).attr(_this.core.s.exThumbImage) + '" /></div></span>';
  35. }
  36. });
  37. }
  38. $pagerOuter = _this.core.$outer.find('.lg-pager-outer');
  39. $pagerOuter.html(pagerList);
  40. $pagerCont = _this.core.$outer.find('.lg-pager-cont');
  41. $pagerCont.on('click.lg touchend.lg', function() {
  42. var _$this = $(this);
  43. _this.core.index = _$this.index();
  44. _this.core.slide(_this.core.index, false, false);
  45. });
  46. $pagerOuter.on('mouseover.lg', function() {
  47. clearTimeout(timeout);
  48. $pagerOuter.addClass('lg-pager-hover');
  49. });
  50. $pagerOuter.on('mouseout.lg', function() {
  51. timeout = setTimeout(function() {
  52. $pagerOuter.removeClass('lg-pager-hover');
  53. });
  54. });
  55. _this.core.$el.on('onBeforeSlide.lg.tm', function(e, prevIndex, index) {
  56. $pagerCont.removeClass('lg-pager-active');
  57. $pagerCont.eq(index).addClass('lg-pager-active');
  58. });
  59. };
  60. Pager.prototype.destroy = function() {
  61. };
  62. $.fn.lightGallery.modules.pager = Pager;
  63. })(jQuery, window, document);