UNPKG

@progress/kendo-ui

Version:

This package is part of the [Kendo UI for jQuery](http://www.telerik.com/kendo-ui) suite.

3 lines 10.7 kB
/* @license */ (function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require(`kendo.fx.min.js`),require(`kendo.draganddrop.min.js`)):typeof define==`function`&&define.amd?define([`exports`,`kendo.fx.min`,`kendo.draganddrop.min`],t):(e=typeof globalThis<`u`?globalThis:e||self,t((e.kendo=e.kendo||{},e.kendo._globals=e.kendo._globals||{},e.kendo._globals.MobileScroller={}),e.kendo._globals.Fx,e.kendo._globals.Draganddrop))})(this,function(e,t,n){Object.defineProperties(e,{__esModule:{value:!0},[Symbol.toStringTag]:{value:`Module`}});let r={id:`mobile.scroller`,name:`Scroller`,category:`mobile`,description:`The Kendo Mobile Scroller widget enables touch friendly kinetic scrolling for the contents of a given DOM element.`,depends:[`fx`,`draganddrop`]};(function(e,t){var n=window.kendo,r=n.mobile,i=n.effects,a=r.ui,o=e.extend,s=a.Widget,c=n.Class,l=n.ui.Movable,u=n.ui.Pane,d=n.ui.PaneDimensions,f=i.Transition,p=i.Animation,m=Math.abs,h=500,g=.7,_=.96,v=10,y=55,b=.5,x=5,S=`km-scroller-release`,C=`km-scroller-refresh`,w=`pull`,T=`change`,E=`resize`,D=`scroll`,O=2,k=p.extend({init:function(e){var t=this;p.fn.init.call(t),o(t,e),t.userEvents.bind(`gestureend`,t.start.bind(t)),t.tapCapture.bind(`press`,t.cancel.bind(t))},enabled:function(){return this.movable.scale<this.dimensions.minScale},done:function(){return this.dimensions.minScale-this.movable.scale<.01},tick:function(){var e=this.movable;e.scaleWith(1.1),this.dimensions.rescale(e.scale)},onEnd:function(){var e=this.movable;e.scaleTo(this.dimensions.minScale),this.dimensions.rescale(e.scale)}}),A=p.extend({init:function(e){var t=this;p.fn.init.call(t),o(t,e,{transition:new f({axis:e.axis,movable:e.movable,onEnd:function(){t._end()}})}),t.tapCapture.bind(`press`,function(){t.cancel()}),t.userEvents.bind(`end`,t.start.bind(t)),t.userEvents.bind(`gestureend`,t.start.bind(t)),t.userEvents.bind(`tap`,t.onEnd.bind(t))},onCancel:function(){this.transition.cancel()},freeze:function(e){var t=this;t.cancel(),t._moveTo(e)},onEnd:function(){var e=this;e.paneAxis.outOfBounds()?e._snapBack():e._end()},done:function(){return m(this.velocity)<1},start:function(e){var t=this,n;t.dimension.enabled&&(t.paneAxis.outOfBounds()?t.transition._started?(t.transition.cancel(),t.velocity=Math.min(e.touch[t.axis].velocity*t.velocityMultiplier,y),p.fn.start.call(t)):t._snapBack():(n=e.touch.id===O?0:e.touch[t.axis].velocity,t.velocity=Math.max(Math.min(n*t.velocityMultiplier,y),-y),t.tapCapture.captureNext(),p.fn.start.call(t)))},tick:function(){var e=this,t=e.dimension,n=e.paneAxis.outOfBounds()?b:e.friction,r=e.velocity*=n,i=e.movable[e.axis]+r;!e.elastic&&t.outOfBounds(i)&&(i=Math.max(Math.min(i,t.max),t.min),e.velocity=0),e.movable.moveAxis(e.axis,i)},_end:function(){this.tapCapture.cancelCapture(),this.end()},_snapBack:function(){var e=this,t=e.dimension,n=e.movable[e.axis]>t.max?t.max:t.min;e._moveTo(n)},_moveTo:function(e){this.transition.moveTo({location:e,duration:h,ease:f.easeOutExpo})}}),j=p.extend({init:function(e){var t=this;n.effects.Animation.fn.init.call(this),o(t,e,{origin:{},destination:{},offset:{}})},tick:function(){this._updateCoordinates(),this.moveTo(this.origin)},done:function(){return m(this.offset.y)<x&&m(this.offset.x)<x},onEnd:function(){this.moveTo(this.destination),this.callback&&this.callback.call()},setCoordinates:function(e,t){this.offset={},this.origin=e,this.destination=t},setCallback:function(e){e&&n.isFunction(e)?this.callback=e:e=t},_updateCoordinates:function(){this.offset={x:(this.destination.x-this.origin.x)/4,y:(this.destination.y-this.origin.y)/4},this.origin={y:this.origin.y+this.offset.y,x:this.origin.x+this.offset.x}}}),M=c.extend({init:function(t){var n=this,r=t.axis===`x`,i=e(`<div role="scrollbar" aria-controls="`+t.controlsId+`" class="km-touch-scrollbar km-`+(r?`horizontal`:`vertical`)+`-scrollbar" />`);r&&i.attr(`aria-orientation`,`horizontal`),o(n,t,{element:i,elementSize:0,movable:new l(i),scrollMovable:t.movable,alwaysVisible:t.alwaysVisible,size:r?`width`:`height`}),n.scrollMovable.bind(T,n.refresh.bind(n)),n.container.append(i),t.alwaysVisible&&n.show()},refresh:function(){var e=this,t=e.axis,n=e.dimension,r=n.size,i=e.scrollMovable,a=r/n.total,o=Math.round(-i[t]*a),s=Math.round(r*a);a>=1?this.element.css(`display`,`none`):this.element.css(`display`,``),o+s>r?s=r-o:o<0&&(s+=o,o=0),e.elementSize!=s&&(e.element.css(e.size,s+`px`),e.elementSize=s),e._ariaValue(o,n.size-e.elementSize),e.movable.moveAxis(t,o)},show:function(){this.element.css({opacity:g,visibility:`visible`})},hide:function(){this.alwaysVisible||this.element.css({opacity:0})},_ariaValue:function(e,t){var n=this.element;e>t&&(e=t),n.attr(`aria-valuemax`,t),n.attr(`aria-valuenow`,e)}}),N=s.extend({init:function(t,r){var i=this;if(s.fn.init.call(i,t,r),t=i.element,i._native=i.options.useNative&&n.support.hasNativeScrolling,i._native){t.addClass(`km-native-scroller`).prepend(`<div class="km-scroll-header"/>`),o(i,{scrollElement:t,fixedContainer:t.children().first()});return}t.css(`overflow`,`hidden`).addClass(`km-scroll-wrapper`).wrapInner(`<div class="km-scroll-container"/>`).prepend(`<div class="km-scroll-header"/>`);var a=t.children().eq(1),c=new n.TapCapture(t),f=new l(a),p=new d({element:a,container:t,forcedEnabled:i.options.zoom}),h=this.options.avoidScrolling,g=new n.UserEvents(t,{touchAction:`pan-y`,fastTap:!0,allowSelection:!0,preventDragEvent:!0,captureUpIfMoved:!0,multiTouch:i.options.zoom,supportDoubleTap:i.options.supportDoubleTap,start:function(t){p.refresh();var n=m(t.x.velocity),r=m(t.y.velocity),a=n*2>=r,o=e.contains(i.fixedContainer[0],t.event.target),s=r*2>=n;!o&&!h(t)&&i.enabled&&(p.x.enabled&&a||p.y.enabled&&s)?g.capture():g.cancel()}}),_=new u({movable:f,dimensions:p,userEvents:g,elastic:i.options.elastic}),v=new k({movable:f,dimensions:p,userEvents:g,tapCapture:c}),y=new j({moveTo:function(e){i.scrollTo(e.x,e.y)}});f.bind(T,function(){i.scrollTop=-f.y,i.scrollLeft=-f.x,i.trigger(D,{scrollTop:i.scrollTop,scrollLeft:i.scrollLeft})}),i.options.mousewheelScrolling&&t.on(`DOMMouseScroll mousewheel`,this._wheelScroll.bind(this)),o(i,{movable:f,dimensions:p,zoomSnapBack:v,animatedScroller:y,userEvents:g,pane:_,tapCapture:c,pulled:!1,enabled:!0,scrollElement:a,scrollTop:0,scrollLeft:0,fixedContainer:t.children().first()}),i._initAxis(`x`),i._initAxis(`y`),i._wheelEnd=function(){i._wheel=!1,i.userEvents.end(0,i._wheelY)},p.refresh(),i.options.pullToRefresh&&i._initPullToRefresh()},_wheelScroll:function(e){if(!e.ctrlKey){this._wheel||(this._wheel=!0,this._wheelY=0,this.userEvents.press(0,this._wheelY)),clearTimeout(this._wheelTimeout),this._wheelTimeout=setTimeout(this._wheelEnd,50);var t=n.wheelDeltaY(e);t&&(this._wheelY+=t,this.userEvents.move(0,this._wheelY)),e.preventDefault()}},makeVirtual:function(){this.dimensions.y.makeVirtual()},virtualSize:function(e,t){this.dimensions.y.virtualSize(e,t)},height:function(){return this.dimensions.y.size},scrollHeight:function(){return this.scrollElement[0].scrollHeight},scrollWidth:function(){return this.scrollElement[0].scrollWidth},options:{name:`Scroller`,zoom:!1,pullOffset:140,visibleScrollHints:!1,elastic:!0,useNative:!1,mousewheelScrolling:!0,avoidScrolling:function(){return!1},pullToRefresh:!1,messages:{pullTemplate:`Pull to refresh`,releaseTemplate:`Release to refresh`,refreshTemplate:`Refreshing`}},events:[w,D,E],_resize:function(){this._native||this.contentResized()},setOptions:function(e){var t=this;s.fn.setOptions.call(t,e),e.pullToRefresh&&t._initPullToRefresh()},reset:function(){this._native?this.scrollElement.scrollTop(0):(this.movable.moveTo({x:0,y:0}),this._scale(1))},contentResized:function(){this.dimensions.refresh(),this.pane.x.outOfBounds()&&this.movable.moveAxis(`x`,this.dimensions.x.min),this.pane.y.outOfBounds()&&this.movable.moveAxis(`y`,this.dimensions.y.min)},zoomOut:function(){var e=this.dimensions;e.refresh(),this._scale(e.fitScale),this.movable.moveTo(e.centerCoordinates())},enable:function(){this.enabled=!0},disable:function(){this.enabled=!1},scrollTo:function(e,t){this._native?(n.scrollLeft(this.scrollElement,m(e)),this.scrollElement.scrollTop(m(t))):(this.dimensions.refresh(),this.movable.moveTo({x:e,y:t}))},animatedScrollTo:function(e,t,n){var r,i;this._native?this.scrollTo(e,t):(r={x:this.movable.x,y:this.movable.y},i={x:e,y:t},this.animatedScroller.setCoordinates(r,i),this.animatedScroller.setCallback(n),this.animatedScroller.start())},pullHandled:function(){var e=this;e.refreshHint.removeClass(C),e.hintContainer.html(e.pullTemplate({})),e.yinertia.onEnd(),e.xinertia.onEnd(),e.userEvents.cancel()},destroy:function(){s.fn.destroy.call(this),this.userEvents&&this.userEvents.destroy()},_scale:function(e){this.dimensions.rescale(e),this.movable.scaleTo(e)},_initPullToRefresh:function(){var e=this;e.dimensions.y.forceEnabled(),e.pullTemplate=n.template(e.options.messages.pullTemplate),e.releaseTemplate=n.template(e.options.messages.releaseTemplate),e.refreshTemplate=n.template(e.options.messages.refreshTemplate),e.scrollElement.prepend(`<span class="km-scroller-pull"><span class="km-icon"></span><span class="km-loading-left"></span><span class="km-loading-right"></span><span class="km-template">`+e.pullTemplate({})+`</span></span>`),e.refreshHint=e.scrollElement.children().first(),e.hintContainer=e.refreshHint.children(`.km-template`),e.pane.y.bind(`change`,e._paneChange.bind(e)),e.userEvents.bind(`end`,e._dragEnd.bind(e))},_dragEnd:function(){var e=this;e.pulled&&(e.pulled=!1,e.refreshHint.removeClass(S).addClass(C),e.hintContainer.html(e.refreshTemplate({})),e.yinertia.freeze(e.options.pullOffset/2),e.trigger(`pull`))},_paneChange:function(){var e=this;e.movable.y/b>e.options.pullOffset?e.pulled||(e.pulled=!0,e.refreshHint.removeClass(C).addClass(S),e.hintContainer.html(e.releaseTemplate({}))):e.pulled&&(e.pulled=!1,e.refreshHint.removeClass(S),e.hintContainer.html(e.pullTemplate({})))},_initAxis:function(e){var t=this,r=t.element.attr(`id`),i=t.movable,a=t.dimensions[e],o=t.tapCapture,s=t.pane[e],c;r||(r=n.guid(),t.element.attr(`id`,r)),c=new M({axis:e,movable:i,dimension:a,container:t.element,alwaysVisible:t.options.visibleScrollHints,controlsId:r}),a.bind(T,function(){c.refresh()}),s.bind(T,function(){c.show()}),t[e+`inertia`]=new A({axis:e,paneAxis:s,movable:i,tapCapture:o,userEvents:t.userEvents,dimension:a,elastic:t.options.elastic,friction:t.options.friction||_,velocityMultiplier:t.options.velocityMultiplier||v,end:function(){c.hide(),t.trigger(`scrollEnd`,{axis:e,scrollTop:t.scrollTop,scrollLeft:t.scrollLeft})}})}});a.plugin(N)})(window.kendo.jQuery);var i=kendo;e.__meta__=r,e.default=i}); //# sourceMappingURL=kendo.mobile.scroller.min.js.map