From 8f8c4f703176b910aab0f55e778e3b8c483d71bc Mon Sep 17 00:00:00 2001 From: William Date: Mon, 4 Sep 2017 23:08:41 -0400 Subject: [PATCH] fix a drag issue when slides have img child --- dist/min/tiny-slider.js | 2 +- dist/sourcemaps/tiny-slider.js.map | 2 +- dist/tiny-slider.js | 85 +- src/tiny-slider.js | 85 +- src/tiny-slider.module.js | 85 +- tests/index.html | 1229 +++++++++++++++++++++++++++- tests/js/script.js | 24 +- tests/js/script.min.js | 109 ++- tests/templates/parts/layout.njk | 28 +- tests/tests.html | 66 ++ 10 files changed, 1475 insertions(+), 240 deletions(-) diff --git a/dist/min/tiny-slider.js b/dist/min/tiny-slider.js index 5350cc6e..e1e2006c 100644 --- a/dist/min/tiny-slider.js +++ b/dist/min/tiny-slider.js @@ -1,2 +1,2 @@ -var tns=function(){function t(){for(var t,e,n,i=arguments[0]||{},a=1,r=arguments.length;a=0?JSON.parse(t):t}function n(t,e){return localStorage.setItem(t,e),e}function i(){return void 0===window.tnsId?window.tnsId=1:window.tnsId++,"tns"+window.tnsId}function a(t){var e=document.createElement("style");return t&&e.setAttribute("media",t),document.querySelector("head").appendChild(e),e.sheet?e.sheet:e.styleSheet}function r(t,e){return Math.atan2(t,e)*(180/Math.PI)}function o(t,e){return Math.abs(90-Math.abs(t))>=90-e?"horizontal":Math.abs(90-Math.abs(t))<=e&&"vertical"}function s(t,e){return t.hasAttribute(e)}function l(t,e){return t.getAttribute(e)}function c(t){return void 0!==t.item}function u(t,e){if(t=c(t)||t instanceof Array?t:[t],"[object Object]"===Object.prototype.toString.call(e))for(var n=t.length;n--;)for(var i in e)t[n].setAttribute(i,e[i])}function d(t,e){t=c(t)||t instanceof Array?t:[t],e=e instanceof Array?e:[e];for(var n=e.length,i=t.length;i--;)for(var a=n;a--;)t[i].removeAttribute(e[a])}function f(t){s(t,"hidden")||u(t,{hidden:""})}function v(t){s(t,"hidden")&&d(t,"hidden")}function h(t){return"boolean"==typeof t.complete?t.complete:"number"==typeof t.naturalWidth?0!==t.naturalWidth:void 0}function p(t){for(var e=document.createElement("fakeelement"),n=(t.length,0);n0?setTimeout(s,l):o()}var l=Math.min(r,10),c=a.indexOf("%")>=0?"%":"px",a=a.replace(c,""),u=Number(t.style[e].replace(n,"").replace(i,"").replace(c,"")),d=(a-u)/r*l;setTimeout(s,l)}Object.keys||(Object.keys=function(t){var e=[];for(var n in t)Object.prototype.hasOwnProperty.call(t,n)&&e.push(n);return e}),function(){"use strict";"remove"in Element.prototype||(Element.prototype.remove=function(){this.parentNode&&this.parentNode.removeChild(this)})}(),function(){"use strict";var t,e,n,i=window,a=document,r=Object,o="length",s="item contains add remove toggle toString toLocaleString".split(" "),l=s[2],c=s[3],u=s[4],d="prototype",f="defineProperty"in r||"__defineGetter__"in r[d]||null,v=function(t,e,n,i){r.defineProperty?r.defineProperty(t,e,{configurable:!1===f||!!i,get:n}):t.__defineGetter__(e,n)},h=function(t,e){var n=this,i=[],a={},d=0,f=0,h=function(){if(d>=f)for(;f>>0,t[e]=i.join(" "),h())},n[c]=function(){p.apply(n,r=arguments);for(var r,s={},l=0,c=[];l>>0,t[e]=i.join(" "),h()},n[u]=function(t,e){return p.apply(n,[t]),void 0!==e?e?(n[l](t),!0):(n[c](t),!1):a[t]?(n[c](t),!1):(n[l](t),!0)},function(t,e){if(e)for(var n=0;n<7;++n)e(t,s[n],{enumerable:!1})}(n,r.defineProperty),n},p=function(t,e,n){v(t[d],e,function(){var t,i=this,r="__defineGetter__defineProperty"+e;if(i[r])return t;if(i[r]=!0,!1===f){for(var s,l=p.mirror=p.mirror||a.createElement("div"),c=l.childNodes,u=c[o],d=0;dt[o]&&(e=d[l],n=d[c],d[l]=function(){for(var t=0,n=arguments;t=0&&ee.forEach(function(e){Zt[e][t]&&(n=!0)}),n}function c(t,n){n=n?n:$t;var i;if("items"===t&&c("fixedWidth"))i=Math.floor(n/(c("fixedWidth")+c("gutter")));else if("slideBy"!==t||Bt)if("edgePadding"!==t||Bt)if("autoHeight"!==t||Bt&&"outer"!==ue){if(i=e[t],ee&&te.indexOf(t)>=0)for(var a=0,r=ee.length;a=o))break;t in Zt[o]&&(i=Zt[o][t])}}else i=!0;else i=!1;else i="page";return"items"===t&&(i=Math.max(1,Math.min(Jt,i))),"slideBy"===t&&"page"===i&&(i=c("items")),i}function p(t){return P?P+"("+100*t+"% / "+Ce+")":100*t/Ce+"%"}function m(t,e,n){var i="";if(t){var a=t;e&&(a+=e),i=n?"margin: 0px "+($t%(n+e)+e)/2+"px":Ut?"margin: 0 "+t+"px 0 "+a+"px;":"padding: "+a+"px 0 "+t+"px 0;"}else if(e&&!n){var r=Ut?"right":"bottom";i="margin-"+r+": -"+e+"px;"}return i}function C(t,e,n){n=Math.min(Jt,n);return t?(t+e)*Ce+"px":P?P+"("+100*Ce+"% / "+n+")":100*Ce/n+"%"}function w(t,e,n){n=Math.min(Jt,n);var i="";if(Ut){if(i="width:",t)i+=t+e+"px";else{var a=Bt?Ce:Math.min(Jt,n);i+=P?P+"(100% / "+a+")":100/a+"%"}i+=Fe+";"}return i}function L(t){var e="";if(t!==!1){e=(Ut?"padding-":"margin-")+(Ut?"right":"bottom")+": "+t+"px;"}return e}function D(t){t=t||A.event,clearTimeout(oe),oe=setTimeout(function(){$t!==Vt.clientWidth&&(M(),"outer"===ue&&He.emit("outerResized",Wt(t)))},100)}function M(){var t=ne,n=Ae,i=le,a=_e;if($t=Vt.clientWidth,qt=Xt.clientWidth,ee&&(ne=G()),t!==ne||ve){var r=he,o=ge,s=ve,l=fe,u=de,d=ne>0?Zt[ee[ne-1]]:e;if(le=c("items"),ce=c("slideBy"),_e=Jt<=le,le!==i&&(Se=Ce-le-Pe,Bn()),_e!==a&&_e&&(Ae=Bt?Ee:0),t!==ne&&(pe=d.speed||c("speed"),fe=d.edgePadding||c("edgePadding"),de=d.gutter||c("gutter"),ve=d.fixedWidth||c("fixedWidth"),ve!==s&&rt(),(ge=c("autoHeight"))!==o&&(ge||(Xt.style.height=""))),he=!_e&&(d.arrowKeys||c("arrowKeys")),he!==r&&(he?y(O,Ke):g(O,Ke)),Je){var h=sn,p=ln;sn=!_e&&(d.controls||c("controls")),ln=d.controlsText||c("controlsText"),sn!==h&&(sn?v(cn):f(cn)),ln!==p&&(nn.innerHTML=ln[0],an.innerHTML=ln[1])}if($e){var b=dn;dn=!_e&&(d.nav||c("nav")),dn!==b&&(dn?(v(fn),St()):f(fn))}if(tn){var x=Sn;Sn=!_e&&(d.touch||c("touch")),Sn!==x&&Bt&&(Sn?y(Kt,Ye):g(Kt,Ye))}if(en){var D=Hn;Hn=!_e&&(d.mouseDrag||c("mouseDrag")),Hn!==D&&Bt&&(Hn?y(Kt,Qe):g(Kt,Qe))}if(Ze){var M=bn,A=Cn,N=On,P=En;if(_e?bn=Cn=On=!1:(bn=d.autoplay||c("autoplay"),bn?(Cn=d.autoplayHoverPause||c("autoplayHoverPause"),On=d.autoplayResetOnVisibility||c("autoplayResetOnVisibility")):Cn=On=!1),En=d.autoplayText||c("autoplayText"),xn=d.autoplayTimeout||c("autoplayTimeout"),bn!==M&&(bn?(v(wn),Ln||ht()):(f(wn),Ln&&pt())),Cn!==A&&(Cn?y(Kt,Ve):g(Kt,Ve)),On!==N&&(On?y(O,Xe):g(O,Xe)),En!==P){var k=bn?1:0,W=wn.innerHTML,I=W.length-P[k].length;W.substring(I)===P[k]&&(wn.innerHTML=W.substring(0,I)+En[k])}}if(!S){fe===l&&de===u||(Xt.style.cssText=m(fe,de,ve)),Bt&&Ut&&(ve!==s||de!==u||le!==i)&&(Kt.style.width=C(ve,de,le));var H=w(ve,de,le);de!==u&&(H+=L(de)),H.length>0&&(be.removeRule(E(be)-1),T(be,"#"+Ge+" .tns-item",H,E(be))),ve||Ae!==n||st(0)}Ae!==n&&(He.emit("indexChanged",Wt()),st(0),Ne=Ae),le!==i&&(U(),J(),nt(),St(),$(),navigator.msMaxTouchPoints&&Q())}Ut||(Y(),Pt(),rt()),_(),V()}function G(){return ne=0,ee.forEach(function(t,e){$t>=t&&(ne=e+ie)}),ne}function _(){if(ve&&Ee)if(_e){if(!Qt[0].classList.contains("tns-transparent")){fe&&(Xt.style.margin="0");for(var t=Ee;t--;)Qt[t].classList.add("tns-transparent"),Qt[Ce-t-1].classList.add("tns-transparent")}}else if(fe&&($t<=ve+de?"0px"!==Xt.style.margin&&(Xt.style.margin="0"):Xt.style.cssText=m(fe,de,ve)),Qt[0].classList.contains("tns-transparent"))for(var t=Ee;t--;)Qt[t].classList.remove("tns-transparent"),Qt[Ce-t-1].classList.remove("tns-transparent")}function F(){Ln&&(pt(),Dn=!0)}function q(){!Ln&&Dn&&(ht(),Dn=!1)}function U(){if(xe){var t=Ae,e=Ae+le;for(fe&&(t-=1,e+=1);t=Ae&&t0)for(var n=0;nke&&(Ae-=ce,n=!0):(i&&i===an||1===e)&&(me&&Ae===Se?ut(0):Ae0&&Et(un[n(l-1)]);break;case N.UP:case N.HOME:l>0&&Et(un[n(0)]);break;case N.RIGHT:case N.PAGEDOWN:l0?Math.floor(n):Math.ceil(n),Ae+=n}else{var i=-(Nn+kn);if(i<=0)Ae=ke;else if(i>=re[re.length-1])Ae=Se;else{var a=0;do{a++,Ae=kn<0?a+1:a}while(a=re[a+1])}}0===t.type.indexOf("touch")?He.emit("touchEnd",Wt(t)):He.emit("dragEnd",Wt(t)),lt()}if(zn){zn=!1;var r=Lt(t);Dt(r)&&y(r,{click:function t(e){Mt(e),g(r,{click:t})}})}}function Pt(){Xt.style.height=re[Ae+le]-re[Ae]+"px"}function kt(){vn=[];for(var t=!ye&&fe?Ae-1:Ae,e=t%Jt%le;eJt&&(e=Jt-le),vn.push(e),e+=le;(ye&&vn.length*le0)&&vn.unshift(0)}function St(){dn&&!e.navContainer&&(kt(),vn!==hn&&(hn.length>0&&hn.forEach(function(t){u(un[t],{hidden:""})}),vn.length>0&&vn.forEach(function(t){d(un[t],"hidden")}),hn=vn))}function Wt(t){return{container:Kt,slideItems:Qt,navContainer:fn,navItems:un,controlsContainer:cn,prevButton:nn,nextButton:an,items:le,slideBy:ce,cloneCount:Ee,slideCount:Jt,slideCountNew:Ce,index:Ae,indexCached:Ne,navCurrent:mn,navCurrentCached:yn,visibleNavIndexes:vn,visibleNavIndexesCached:hn,event:t||{}}}if(e=t({container:O.querySelector(".slider"),mode:"carousel",axis:"horizontal",items:1,gutter:0,edgePadding:0,fixedWidth:!1,slideBy:1,controls:!0,controlsText:["prev","next"],controlsContainer:!1,nav:!0,navContainer:!1,arrowKeys:!1,speed:300,autoplay:!1,autoplayTimeout:5e3,autoplayDirection:"forward",autoplayText:["start","stop"],autoplayHoverPause:!1,autoplayButton:!1,autoplayResetOnVisibility:!0,loop:!0,rewind:!1,autoHeight:!1,responsive:!1,lazyload:!1,touch:!0,mouseDrag:!1,nested:!1,onInit:!1},e||{}),["container","controlsContainer","navContainer","autoplayButton"].forEach(function(t){"string"==typeof e[t]&&(e[t]=O.querySelector(e[t]))}),e.container&&e.container.nodeName&&!(e.container.children.length<2)){if(e.responsive){var It={},Ht=e.responsive;for(var Rt in Ht){var zt=Ht[Rt];It[Rt]="number"==typeof zt?{items:zt}:zt}e.responsive=It,It=null}var Bt="carousel"===e.mode;if(!Bt){e.axis="horizontal",e.rewind=!1,e.loop=!0;var jt="tns-fadeIn",Gt="tns-fadeOut",_t=!1,Ft=e.animateNormal||"tns-normal";B&&j&&(jt=e.animateIn||jt,Gt=e.animateOut||Gt,_t=e.animateDelay||_t)}var qt,Ut="horizontal"===e.axis,Vt=O.createElement("div"),Xt=O.createElement("div"),Kt=e.container,Yt=Kt.parentNode,Qt=Kt.children,Jt=Qt.length,$t=Yt.clientWidth,Zt=e.responsive,te=[],ee=!1,ne=0,ie=0;if(Zt){ee=Object.keys(Zt).map(function(t){return parseInt(t)}).sort(function(t,e){return t-e}),ee.indexOf(0)<0&&(ie=1),ee.forEach(function(t){te=te.concat(Object.keys(Zt[t]))});var ae=[];te.forEach(function(t){ae.indexOf(t)<0&&ae.push(t)}),te=ae,ne=G()}var re,oe,se,le=c("items"),ce="page"===c("slideBy")?le:c("slideBy"),ue=e.nested,de=c("gutter"),fe=c("edgePadding"),ve=c("fixedWidth"),he=c("arrowKeys"),pe=c("speed"),me=e.rewind,ye=!me&&e.loop,ge=c("autoHeight"),be=a(),xe=e.lazyload,Te=[],Ee=ye?2*Jt:n("edgePadding")?1:0,Ce=Bt?Jt+2*Ee:Jt+Ee,we=!(!ve||ye||fe),Le=!Bt||!ye,De=Ut?"left":"top",Me="",Oe="",Ae=Bt?Ee:0,Ne=Ae,Pe=!ye&&n("edgePadding")?1:0,ke=Pe,Se=Ce-le-Pe,We=!1,Ie=e.onInit,He=new b,Re=Kt.id,ze=Kt.className,Be=Qt[0].id,je=Qt[0].className,Ge=Kt.id||i(),_e=Jt<=le,Fe="inner"===ue?" !important":"",qe={click:dt,keydown:Tt},Ue={click:ft,keydown:Ct},Ve={mouseover:F,mouseout:q},Xe={visibilitychange:bt},Ke={keydown:xt},Ye={touchstart:Ot,touchmove:At,touchend:Nt,touchcancel:Nt},Qe={mousedown:Ot,mousemove:At,mouseup:Nt,mouseleave:Nt},Je=n("controls"),$e=n("nav"),Ze=n("autoplay"),tn=n("touch"),en=n("mouseDrag");if(Je)var nn,an,rn,on,sn=c("controls"),ln=c("controlsText"),cn=e.controlsContainer;if($e)var un,dn=c("nav"),fn=e.navContainer,vn=[],hn=vn,pn=-1,mn=0,yn=0;if(Ze)var gn,bn=c("autoplay"),xn=c("autoplayTimeout"),Tn="forward"===e.autoplayDirection?1:-1,En=c("autoplayText"),Cn=c("autoplayHoverPause"),wn=e.autoplayButton,Ln=!1,Dn=!1,Mn=[""," animation"],On=c("autoplayResetOnVisibility"),An=!1;if(tn)var Nn,Pn,kn,Sn=c("touch"),Wn=null,In=null;if(en)var Hn=c("mouseDrag"),Rn=!1,zn=!1;_e&&(sn=dn=Sn=Hn=he=bn=Cn=On=!1),W&&(De=W,Me="translate",Me+=Ut?"X(":"Y(",Oe=")"),function(){Vt.appendChild(Xt),Yt.insertBefore(Vt,Kt),Xt.appendChild(Kt),qt=Xt.clientWidth;var t="tns-outer",i="tns-inner",a=" tns-slider tns-"+e.mode;if(Bt&&(Ut&&(n("edgePadding")||n("gutter")&&!e.fixedWidth)?t+=" tns-ovh":i+=" tns-ovh"),Vt.className=t,Xt.className=i,Xt.id=Ge+"-iw",ge&&(Xt.className+=" tns-ah",Xt.style[I]=pe/1e3+"s"),""===Kt.id&&(Kt.id=Ge),a+=k?" tns-subpixel":" tns-no-subpixel",a+=P?" tns-calc":" tns-no-calc",Bt&&(a+=" tns-"+e.axis),Kt.className+=a,Bt&&B){var r={};r[B]=ct,y(Kt,r)}t=i=a=null;for(var o=0;o0&&(W=16*parseFloat(W)+"px"),T(be,"#"+Ge,"font-size:0;",E(be)),T(be,"#"+Ge+" .tns-item","font-size:"+W+";",E(be))}else[].forEach.call(Qt,function(t,e){t.style.marginLeft=p(e)});if(S){var H=m(e.edgePadding,e.gutter,e.fixedWidth);T(be,"#"+Ge+"-iw",H,E(be)),Bt&&Ut&&(H="width:"+C(e.fixedWidth,e.gutter,e.items),T(be,"#"+Ge,H,E(be))),(Ut||e.gutter)&&(H=w(e.fixedWidth,e.gutter,e.items)+L(e.gutter),T(be,"#"+Ge+" .tns-item",H,E(be)))}else if(Xt.style.cssText=m(fe,de,ve),Bt&&Ut&&(Kt.style.width=C(ve,de,le)),Ut||de){var H=w(ve,de,le)+L(de);T(be,"#"+Ge+" .tns-item",H,E(be))}if(Ut||(Y(),Pt()),Zt&&S&&ee.forEach(function(t){var e=Zt[t],i="",a="",r="",o="",s=c("items",t),l=c("fixedWidth",t),u=c("edgePadding",t),d=c("gutter",t);("edgePadding"in e||"gutter"in e)&&(a="#"+Ge+"-iw{"+m(u,d,l)+"}"),Bt&&Ut&&("fixedWidth"in e||"gutter"in e||"items"in e)&&(r="#"+Ge+"{width:"+C(l,d,s)+"}"),("fixedWidth"in e||n("fixedWidth")&&"gutter"in e)&&(o+=w(l,d,s)),"gutter"in e&&(o+=L(d)),o.length>0&&(o="#"+Ge+" .tns-item{"+o+"}"),i=a+r+o,i.length>0&&be.insertRule("@media (min-width: "+t/16+"em) {"+i+"}",be.cssRules.length)}),Bt&&rt(),navigator.msMaxTouchPoints&&(Vt.classList.add("ms-touch"),y(Vt,{scroll:wt}),Q()),$e){if(fn)u(fn,{"aria-label":"Carousel Pagination"}),un=fn.children,[].forEach.call(un,function(t,e){u(t,{"data-nav":e,tabindex:"-1","aria-selected":"false","aria-controls":Ge+"-item"+e})});else{for(var R="",N=0;N