From f7a894240155582bf463db278cc3194071aabf98 Mon Sep 17 00:00:00 2001 From: Hendrik Liebau Date: Wed, 11 Nov 2015 16:07:41 +0100 Subject: [PATCH] fix(lory.js): call reset() *before* dispatching resize event This fixes a problem when trying to read the index after a resize in an 'on.lory.resize' handler, where the old index is returned instead of 0, as set in reset(). Ideally lory.js would not register the resize handler at all and instead let the application register a resize handler (maybe even debounced) that calls lory.reset(). --- demo/js/jquery.lory.js | 22 +++++++++++++--------- demo/js/jquery.lory.min.js | 2 +- demo/js/lory.js | 22 +++++++++++++--------- demo/js/lory.min.js | 2 +- dist/jquery.lory.js | 22 +++++++++++++--------- dist/jquery.lory.min.js | 2 +- dist/lory.js | 22 +++++++++++++--------- dist/lory.min.js | 2 +- src/defaults.js | 8 +++++++- src/lory.js | 8 ++++---- test/lory.test.js | 31 +++++++++++++++++++++++++++++++ 11 files changed, 98 insertions(+), 45 deletions(-) diff --git a/demo/js/jquery.lory.js b/demo/js/jquery.lory.js index 80d2d25..7dec713 100644 --- a/demo/js/jquery.lory.js +++ b/demo/js/jquery.lory.js @@ -79,7 +79,7 @@ return /******/ (function(modules) { // webpackBootstrap 'use strict'; - 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; }; + 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; }; /* globals jQuery */ Object.defineProperty(exports, "__esModule", { value: true @@ -100,8 +100,6 @@ return /******/ (function(modules) { // webpackBootstrap function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } - function _instanceof(left, right) { if (right != null && right[Symbol.hasInstance]) { return right[Symbol.hasInstance](left); } else { return left instanceof right; } } /* globals jQuery */ - var slice = Array.prototype.slice; function lory(slider, opts) { @@ -126,7 +124,7 @@ return /******/ (function(modules) { // webpackBootstrap /** * if object is jQuery convert to native DOM element */ - if (typeof jQuery !== 'undefined' && _instanceof(slider, jQuery)) { + if (typeof jQuery !== 'undefined' && slider instanceof jQuery) { slider = slider[0]; } @@ -353,7 +351,7 @@ return /******/ (function(modules) { // webpackBootstrap slideContainer.addEventListener('click', onClick); } - window.addEventListener('resize', onResize); + options.window.addEventListener('resize', onResize); dispatchSliderEvent('after', 'init'); } @@ -439,7 +437,7 @@ return /******/ (function(modules) { // webpackBootstrap slideContainer.removeEventListener('mouseleave', onTouchend); slideContainer.removeEventListener('click', onClick); - window.removeEventListener('resize', onResize); + options.window.removeEventListener('resize', onResize); if (prevCtrl) { prevCtrl.removeEventListener('click', prev); @@ -588,11 +586,11 @@ return /******/ (function(modules) { // webpackBootstrap } function onResize(event) { + reset(); + dispatchSliderEvent('on', 'resize', { event: event }); - - reset(); } // trigger initial setup @@ -851,7 +849,13 @@ return /******/ (function(modules) { // webpackBootstrap * enables mouse events for swiping on desktop devices * @enableMouseEvents {boolean} */ - enableMouseEvents: false + enableMouseEvents: false, + + /** + * window instance + * @window {object} + */ + window: window }; /***/ } diff --git a/demo/js/jquery.lory.min.js b/demo/js/jquery.lory.min.js index 4cb8e8a..c6f2ea2 100644 --- a/demo/js/jquery.lory.min.js +++ b/demo/js/jquery.lory.min.js @@ -1 +1 @@ -!function(e,t){if("object"==typeof exports&&"object"==typeof module)module.exports=t();else if("function"==typeof define&&define.amd)define([],t);else{var n=t();for(var o in n)("object"==typeof exports?exports:e)[o]=n[o]}}(this,function(){return function(e){function t(o){if(n[o])return n[o].exports;var i=n[o]={exports:{},id:o,loaded:!1};return e[o].call(i.exports,i,i.exports,t),i.loaded=!0,i.exports}var n={};return t.m=e,t.c=n,t.p="",t(0)}([function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}var i=n(1),r=o(i);$.fn.lory=function(e){return this.each(function(){var t;$.data(this,"lory")||(t=$.extend({},e,$(this).data()),$.data(this,"lory",(0,r["default"])(this,t)))})}},function(e,t,n){"use strict";function o(e){return e&&e.__esModule?e:{"default":e}}function i(e,t){return null!=t&&t[Symbol.hasInstance]?t[Symbol.hasInstance](e):e instanceof t}function r(e,t){function n(e,t){var n=$,o=n.classNameActiveSlide;e.forEach(function(e,t){e.classList.contains(o)&&e.classList.remove(o)}),e[t].classList.add(o)}function o(e){var t=$,n=t.infinite,o=e.slice(0,n),i=e.slice(e.length-n,e.length);return o.forEach(function(e){var t=e.cloneNode(!0);k.appendChild(t)}),i.reverse().forEach(function(e){var t=e.cloneNode(!0);k.insertBefore(t,k.firstChild)}),k.addEventListener(P.transitionEnd,x),f.call(k.children)}function r(t,n,o){(0,c["default"])(e,t+".lory."+n,o)}function s(e,t,n){var o=k&&k.style;o&&(o[P.transition+"TimingFunction"]=n,o[P.transition+"Duration"]=t+"ms",P.hasTranslate3d?o[P.transform]="translate3d("+e+"px, 0, 0)":o[P.transform]="translate("+e+"px, 0)")}function u(e,t){var o=$,i=o.slideSpeed,a=o.slidesToScroll,d=o.infinite,u=o.rewind,c=o.rewindSpeed,l=o.ease,v=o.classNameActiveSlide,m=i,h=t?D+1:D-1,p=Math.round(S-_);r("before","slide",{index:D,nextSlide:h}),"number"!=typeof e&&(e=t?D+a:D-a),e=Math.min(Math.max(e,0),j.length-1),d&&void 0===t&&(e+=d);var b=Math.min(Math.max(-1*j[e].offsetLeft,-1*p),0);u&&Math.abs(N.x)===p&&t&&(b=0,e=0,m=c),s(b,m,l),N.x=b,j[e].offsetLeft<=p&&(D=e),!d||Math.abs(b)!==p&&0!==Math.abs(b)||(t&&(D=d),t||(D=j.length-2*d),N.x=-1*j[D].offsetLeft,A=function(){s(-1*j[D].offsetLeft,0,void 0)}),v&&n(f.call(j),D),r("after","slide",{currentSlide:D})}function l(){r("before","init"),P=(0,d["default"])(),$=a({},v["default"],t);var i=$,s=i.classNameFrame,u=i.classNameSlideContainer,c=i.classNamePrevCtrl,l=i.classNameNextCtrl,h=i.enableMouseEvents,p=i.classNameActiveSlide;B=e.getElementsByClassName(s)[0],k=B.getElementsByClassName(u)[0],T=e.getElementsByClassName(c)[0],O=e.getElementsByClassName(l)[0],N={x:k.offsetLeft,y:k.offsetTop},j=$.infinite?o(f.call(k.children)):f.call(k.children),m(),p&&n(j,D),T&&O&&(T.addEventListener("click",b),O.addEventListener("click",E)),k.addEventListener("touchstart",L),h&&(k.addEventListener("mousedown",L),k.addEventListener("click",M)),window.addEventListener("resize",C),r("after","init")}function m(){var e=$,t=e.infinite,n=e.ease,o=e.rewindSpeed;S=k.getBoundingClientRect().width||k.offsetWidth,_=B.getBoundingClientRect().width||B.offsetWidth,_===S&&(S=j.reduce(function(e,t){return e+t.getBoundingClientRect().width||t.offsetWidth},0)),D=0,t?(s(-1*j[D+t].offsetLeft,0,null),D+=t,N.x=-1*j[D].offsetLeft):s(0,o,n)}function h(e){u(e)}function p(){return D}function b(){u(!1,!1)}function E(){u(!1,!0)}function y(){r("before","destroy"),k.removeEventListener(P.transitionEnd,x),k.removeEventListener("touchstart",L),k.removeEventListener("touchmove",g),k.removeEventListener("touchend",w),k.removeEventListener("mousemove",g),k.removeEventListener("mousedown",L),k.removeEventListener("mouseup",w),k.removeEventListener("mouseleave",w),k.removeEventListener("click",M),window.removeEventListener("resize",C),T&&T.removeEventListener("click",b),O&&O.removeEventListener("click",E),r("after","destroy")}function x(){A&&(A(),A=void 0)}function L(e){var t=$,n=t.enableMouseEvents,o=e.touches?e.touches[0]:e;n&&(k.addEventListener("mousemove",g),k.addEventListener("mouseup",w),k.addEventListener("mouseleave",w)),k.addEventListener("touchmove",g),k.addEventListener("touchend",w);var i=o.pageX,a=o.pageY;z={x:i,y:a,time:Date.now()},I=void 0,F={},r("on","touchstart",{event:e})}function g(e){var t=e.touches?e.touches[0]:e,n=t.pageX,o=t.pageY;F={x:n-z.x,y:o-z.y},"undefined"==typeof I&&(I=!!(I||Math.abs(F.x)25||Math.abs(F.x)>_/3,o=!D&&F.x>0||D===j.length-1&&F.x<0,i=F.x<0;I||(n&&!o?u(!1,i):s(N.x,$.snapBackSpeed)),z=void 0,k.removeEventListener("touchmove",g),k.removeEventListener("touchend",w),k.removeEventListener("mousemove",g),k.removeEventListener("mouseup",w),k.removeEventListener("mouseleave",w),r("on","touchend",{event:e})}function M(e){F.x&&e.preventDefault()}function C(e){r("on","resize",{event:e}),m()}var N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=void 0,D=0,$={};"undefined"!=typeof jQuery&&i(e,jQuery)&&(e=e[0]);var z=void 0,F=void 0,I=void 0;return l(),{setup:l,reset:m,slideTo:h,returnIndex:p,prev:b,next:E,destroy:y}}var a=Object.assign||function(e){for(var t=1;t25||Math.abs(z.x)>_/3,o=!A&&z.x>0||A===S.length-1&&z.x<0,r=z.x<0;F||(n&&!o?d(!1,r):a(C.x,D.snapBackSpeed)),$=void 0,B.removeEventListener("touchmove",L),B.removeEventListener("touchend",g),B.removeEventListener("mousemove",L),B.removeEventListener("mouseup",g),B.removeEventListener("mouseleave",g),i("on","touchend",{event:e})}function w(e){z.x&&e.preventDefault()}function M(e){f(),i("on","resize",{event:e})}var C=void 0,N=void 0,_=void 0,S=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=0,D={};"undefined"!=typeof jQuery&&e instanceof jQuery&&(e=e[0]);var $=void 0,z=void 0,F=void 0;return c(),{setup:c,reset:f,slideTo:m,returnIndex:h,prev:p,next:b,destroy:E}}var r=Object.assign||function(e){for(var t=1;t25||Math.abs(I.x)>_/3,o=!D&&I.x>0||D===j.length-1&&I.x<0,i=I.x<0;R||(n&&!o?c(!1,i):s(N.x,z.snapBackSpeed)),F=void 0,k.removeEventListener("touchmove",g),k.removeEventListener("touchend",w),k.removeEventListener("mousemove",g),k.removeEventListener("mouseup",w),k.removeEventListener("mouseleave",w),r("on","touchend",{event:e})}function C(e){I.x&&e.preventDefault()}function M(e){r("on","resize",{event:e}),m()}var N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=void 0,D=0,z={};"undefined"!=typeof jQuery&&i(e,jQuery)&&(e=e[0]);var F=void 0,I=void 0,R=void 0;return u(),{setup:u,reset:m,slideTo:p,returnIndex:h,prev:b,next:E,destroy:y}}var a=Object.assign||function(e){for(var t=1;t25||Math.abs(F.x)>S/3,o=!A&&F.x>0||A===_.length-1&&F.x<0,r=F.x<0;R||(n&&!o?d(!1,r):a(M.x,D.snapBackSpeed)),z=void 0,B.removeEventListener("touchmove",L),B.removeEventListener("touchend",g),B.removeEventListener("mousemove",L),B.removeEventListener("mouseup",g),B.removeEventListener("mouseleave",g),i("on","touchend",{event:e})}function w(e){F.x&&e.preventDefault()}function C(e){f(),i("on","resize",{event:e})}var M=void 0,N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=0,D={};"undefined"!=typeof jQuery&&e instanceof jQuery&&(e=e[0]);var z=void 0,F=void 0,R=void 0;return l(),{setup:l,reset:f,slideTo:m,returnIndex:p,prev:h,next:b,destroy:E}}var r=Object.assign||function(e){for(var t=1;t25||Math.abs(F.x)>_/3,o=!D&&F.x>0||D===j.length-1&&F.x<0,i=F.x<0;I||(n&&!o?u(!1,i):s(N.x,$.snapBackSpeed)),z=void 0,k.removeEventListener("touchmove",g),k.removeEventListener("touchend",w),k.removeEventListener("mousemove",g),k.removeEventListener("mouseup",w),k.removeEventListener("mouseleave",w),r("on","touchend",{event:e})}function M(e){F.x&&e.preventDefault()}function C(e){r("on","resize",{event:e}),m()}var N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=void 0,D=0,$={};"undefined"!=typeof jQuery&&i(e,jQuery)&&(e=e[0]);var z=void 0,F=void 0,I=void 0;return l(),{setup:l,reset:m,slideTo:h,returnIndex:p,prev:b,next:E,destroy:y}}var a=Object.assign||function(e){for(var t=1;t25||Math.abs(z.x)>_/3,o=!A&&z.x>0||A===S.length-1&&z.x<0,r=z.x<0;F||(n&&!o?d(!1,r):a(C.x,D.snapBackSpeed)),$=void 0,B.removeEventListener("touchmove",L),B.removeEventListener("touchend",g),B.removeEventListener("mousemove",L),B.removeEventListener("mouseup",g),B.removeEventListener("mouseleave",g),i("on","touchend",{event:e})}function w(e){z.x&&e.preventDefault()}function M(e){f(),i("on","resize",{event:e})}var C=void 0,N=void 0,_=void 0,S=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=0,D={};"undefined"!=typeof jQuery&&e instanceof jQuery&&(e=e[0]);var $=void 0,z=void 0,F=void 0;return c(),{setup:c,reset:f,slideTo:m,returnIndex:h,prev:p,next:b,destroy:E}}var r=Object.assign||function(e){for(var t=1;t25||Math.abs(I.x)>_/3,o=!D&&I.x>0||D===j.length-1&&I.x<0,i=I.x<0;R||(n&&!o?c(!1,i):s(N.x,z.snapBackSpeed)),F=void 0,k.removeEventListener("touchmove",g),k.removeEventListener("touchend",w),k.removeEventListener("mousemove",g),k.removeEventListener("mouseup",w),k.removeEventListener("mouseleave",w),r("on","touchend",{event:e})}function C(e){I.x&&e.preventDefault()}function M(e){r("on","resize",{event:e}),m()}var N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=void 0,D=0,z={};"undefined"!=typeof jQuery&&i(e,jQuery)&&(e=e[0]);var F=void 0,I=void 0,R=void 0;return u(),{setup:u,reset:m,slideTo:p,returnIndex:h,prev:b,next:E,destroy:y}}var a=Object.assign||function(e){for(var t=1;t25||Math.abs(F.x)>S/3,o=!A&&F.x>0||A===_.length-1&&F.x<0,r=F.x<0;R||(n&&!o?d(!1,r):a(M.x,D.snapBackSpeed)),z=void 0,B.removeEventListener("touchmove",L),B.removeEventListener("touchend",g),B.removeEventListener("mousemove",L),B.removeEventListener("mouseup",g),B.removeEventListener("mouseleave",g),i("on","touchend",{event:e})}function w(e){F.x&&e.preventDefault()}function C(e){f(),i("on","resize",{event:e})}var M=void 0,N=void 0,S=void 0,_=void 0,j=void 0,B=void 0,k=void 0,T=void 0,O=void 0,P=void 0,A=0,D={};"undefined"!=typeof jQuery&&e instanceof jQuery&&(e=e[0]);var z=void 0,F=void 0,R=void 0;return l(),{setup:l,reset:f,slideTo:m,returnIndex:p,prev:h,next:b,destroy:E}}var r=Object.assign||function(e){for(var t=1;t