172 lines
8.9 KiB
Plaintext
172 lines
8.9 KiB
Plaintext
(function(b){Type.registerNamespace("Telerik.Web.UI");
|
|
var a=Telerik.Web.UI;
|
|
Telerik.Web.UI.TouchScrollExtender=function(c){this._containerElements=b(c);
|
|
var d=arguments[1]||{};
|
|
this._autoScan="autoScan" in d?d.autoScan:false;
|
|
this._showScrollHints="showScrollHints" in d?d.showScrollHints:true;
|
|
this._useRoundedHints="useRoundedHints" in d?d.useRoundedHints:true;
|
|
this._hasHorizontalScrollHint=false;
|
|
this._hasVerticalScrollHint=false;
|
|
this._verticalScrollHint=false;
|
|
this._horizontalScrollHint=false;
|
|
this._lastAnimator=false;
|
|
this._dragCanceled=false;
|
|
this.containers=new Array();
|
|
this._enableTouchScroll=true;
|
|
};
|
|
Telerik.Web.UI.TouchScrollExtender._getNeedsScrollExtender=function(){return $telerik.isMobileSafari||$telerik.isAndroid;
|
|
};
|
|
Telerik.Web.UI.TouchScrollExtender.prototype={initialize:function(){if(this._enableTouchScroll){if(this._autoScan){this._containerElements=this._containerElements.add(b("*",this._containerElements)).filter(function(){return(b(this).css("overflow")=="scroll"||b(this).css("overflow")=="auto");
|
|
});
|
|
}var c=this;
|
|
this._containerElements.each(function(){this.style.overflow="hidden";
|
|
var e=b(this).addClass("RadTouchExtender").css("-webkit-tap-highlight-color","rgba(0, 0, 0, 0);");
|
|
var d={element:e.stop(),horizontalScrollHint:b('<div id="horizontalScrollHint" style="position: absolute; display: none; z-index: 200000; font-size: 0; height: 3px; border: 1px solid #333; background: #777; " />').appendTo(this.parentNode),verticalScrollHint:b('<div id="verticalScrollHint" style="position: absolute; display: none; z-index: 200000; width: 3px; border: 1px solid #333; background: #777; " />').appendTo(this.parentNode)};
|
|
if(this._useRoundedHints){d.horizontalScrollHint.css({"-moz-border-radius":"3px","-webkit-border-radius":"3px","border-radius":"3px"});
|
|
d.verticalScrollHint.css({"-moz-border-radius":"3px","-webkit-border-radius":"3px","border-radius":"3px"});
|
|
}e.data("dragID",c.containers.push(d)-1);
|
|
});
|
|
if(a.TouchScrollExtender._getNeedsScrollExtender()){this._containerElements.bind("touchstart",b.proxy(this._startDrag,this));
|
|
this._containerElements.bind("gesturestart",b.proxy(this._onGestureStart,this));
|
|
this._containerElements.bind("gestureend",b.proxy(this._onGestureEnd,this));
|
|
}else{this._containerElements.bind("mousedown",b.proxy(this._startDrag,this));
|
|
}this._storeLastLocation=b.throttle(100,function(d){this._lastAnimator.kX=d.x;
|
|
this._lastAnimator.kY=d.y;
|
|
});
|
|
this._alignScrollHints=b.throttle(20,function(){var g=0;
|
|
var d=0;
|
|
var j=this._lastAnimator.element[0];
|
|
var i=this._lastAnimator.horizontalScrollHint;
|
|
var e=this._lastAnimator.verticalScrollHint;
|
|
var h=this._getBorderBox(j);
|
|
var f=b(j).position();
|
|
if(this._hasHorizontalScrollHint&&i){g=Math.abs(j.scrollLeft)*this._widthConstant+f.left+h.left;
|
|
i.css({left:g});
|
|
}if(this._hasVerticalScrollHint&&e){d=Math.abs(j.scrollTop)*this._heightConstant+f.top+h.top;
|
|
e.css({top:d});
|
|
}});
|
|
this._throttleScroll=b.throttle(10,function(d){this._lastAnimator.element[0].scrollLeft=this._lastAnimator.dragStartX-d.x;
|
|
this._lastAnimator.element[0].scrollTop=this._lastAnimator.dragStartY-d.y;
|
|
});
|
|
}},dispose:function(){this.containers=null;
|
|
this._containerElements=null;
|
|
this._events=null;
|
|
},_startDrag:function(j){if(this._dragCanceled){return;
|
|
}var c=b(j.target);
|
|
var k=c.parents(".RadTouchExtender");
|
|
if(c.hasClass("RadTouchExtender")){k=k.add(c);
|
|
}var f=this._lastAnimator=this.containers[k.data("dragID")];
|
|
var h=f.element[0];
|
|
this._hasHorizontalScrollHint=h.offsetWidth<h.scrollWidth;
|
|
this._hasVerticalScrollHint=h.offsetHeight<h.scrollHeight;
|
|
f.hasDragged=false;
|
|
if(this._hasHorizontalScrollHint||this._hasVerticalScrollHint){f.element.stop(true);
|
|
f.originalEvent=j.originalEvent;
|
|
if(!a.TouchScrollExtender._getNeedsScrollExtender()){this._cancelEvents(j);
|
|
}var d=$telerik.getTouchEventLocation(j);
|
|
f.kX=d.x;
|
|
f.kY=d.y;
|
|
var g=h.scrollLeft||0;
|
|
var i=h.scrollTop||0;
|
|
f.dragStartX=(g>0?g:0)+d.x;
|
|
f.dragStartY=(i>0?i:0)+d.y;
|
|
if(a.TouchScrollExtender._getNeedsScrollExtender()){b(document.body).bind({touchmove:b.proxy(this._compositeDragger,this),touchend:b.proxy(this._endDrag,this)});
|
|
}else{b(document.body).bind({mousemove:b.proxy(this._compositeDragger,this),mouseup:b.proxy(this._endDrag,this)});
|
|
}}},_getBorderBox:function(e){var c={left:0,top:0,right:0,bottom:0,horizontal:0,vertical:0};
|
|
if(window.getComputedStyle){var d=window.getComputedStyle(e,null);
|
|
c.left=parseInt(d.getPropertyValue("border-left-width"),10);
|
|
c.right=parseInt(d.getPropertyValue("border-right-width"),10);
|
|
c.top=parseInt(d.getPropertyValue("border-top-width"),10);
|
|
c.bottom=parseInt(d.getPropertyValue("border-bottom-width"),10);
|
|
}else{c.left=e.currentStyle.borderLeftWidth;
|
|
c.right=e.currentStyle.borderRightWidth;
|
|
c.top=e.currentStyle.borderTopWidth;
|
|
c.bottom=e.currentStyle.borderBottomWidth;
|
|
}c.horizontal=c.left+c.right;
|
|
c.vertical=c.top+c.bottom;
|
|
return c;
|
|
},_addScrollHints:function(){if(this._showScrollHints){var h=0;
|
|
var c=0;
|
|
var e=this._lastAnimator;
|
|
var k=e.element[0];
|
|
var j=this._getBorderBox(k);
|
|
var g=b(k).position();
|
|
if(this._hasHorizontalScrollHint){var l=e.element.innerWidth();
|
|
var d=~~((l/k.scrollWidth)*l)-2;
|
|
this._widthConstant=(d/l);
|
|
setTimeout(function(){h=Math.abs(k.scrollLeft)*(d/l)+g.left+j.left;
|
|
c=k.offsetHeight+g.top+j.top-7;
|
|
e.horizontalScrollHint.width(d).css({left:h,top:c});
|
|
},0);
|
|
e.horizontalScrollHint.fadeTo(200,0.5);
|
|
}if(this._hasVerticalScrollHint){var f=e.element.innerHeight();
|
|
var i=~~((f/k.scrollHeight)*f)-2;
|
|
this._heightConstant=(i/f);
|
|
setTimeout(function(){c=Math.abs(k.scrollTop)*(i/f)+g.top+j.top;
|
|
h=k.offsetWidth+g.left+j.left-7;
|
|
e.verticalScrollHint.height(i).css({left:h,top:c});
|
|
},0);
|
|
e.verticalScrollHint.fadeTo(200,0.5);
|
|
}}},_removeScrollHints:function(){if(this._showScrollHints){var c=this._lastAnimator.horizontalScrollHint;
|
|
var d=this._lastAnimator.verticalScrollHint;
|
|
if(this._hasHorizontalScrollHint&&c){c.hide();
|
|
}if(this._hasVerticalScrollHint&&d){d.hide();
|
|
}}},_simpleDragger:function(d){if(this._dragCanceled){return;
|
|
}var c=$telerik.getTouchEventLocation(d);
|
|
if(this._lastAnimator.element.length){this._throttleScroll(c);
|
|
this._alignScrollHints();
|
|
}this._storeLastLocation(c);
|
|
},_compositeDragger:function(g){if(this._dragCanceled){return;
|
|
}this._cancelEvents(g);
|
|
var f=$telerik.getTouchEventLocation(g);
|
|
var c=this._lastAnimator;
|
|
var d=c.element[0];
|
|
if(Math.abs(c.kX-f.x)>10||Math.abs(c.kY-f.y)>10){c.hasDragged=true;
|
|
this._addScrollHints();
|
|
if(a.TouchScrollExtender._getNeedsScrollExtender()){b(document.body).unbind("touchmove",this._compositeDragger).bind("touchmove",b.proxy(this._simpleDragger,this));
|
|
}else{b(document.body).unbind("mousemove",this._compositeDragger).bind("mousemove",b.proxy(this._simpleDragger,this));
|
|
}if($telerik.isIE){c.element.bind("click",this._cancelEvents);
|
|
d.setCapture(true);
|
|
}else{d.addEventListener("click",this._cancelEvents,true);
|
|
}}},disable:function(){this._detachEvents();
|
|
this._dragCanceled=true;
|
|
},enable:function(){this._dragCanceled=false;
|
|
},_onGestureStart:function(){this._detachEvents();
|
|
this._dragCanceled=true;
|
|
},_onGestureEnd:function(){this._dragCanceled=false;
|
|
},_endDrag:function(i){if(this._dragCanceled){return;
|
|
}this._cancelEvents(i);
|
|
this._detachEvents();
|
|
if(a.TouchScrollExtender._getNeedsScrollExtender()){if(this._lastAnimator.originalEvent.touches.length==1&&!this._lastAnimator.hasDragged){var f=this._lastAnimator.originalEvent;
|
|
var g=document.createEvent("MouseEvents");
|
|
g.initMouseEvent("click",f.bubbles,f.cancelable,f.view,f.detail,f.screenX,f.screenY,f.clientX,f.clientY,false,false,false,false,f.button,f.relatedTarget);
|
|
f.target.dispatchEvent(g);
|
|
}}var d=this;
|
|
var c=$telerik.getTouchEventLocation(i);
|
|
var h=this._lastAnimator;
|
|
if($telerik.isIE){setTimeout(function(){h.element.unbind("click",d._cancelEvents);
|
|
document.releaseCapture();
|
|
},10);
|
|
}else{setTimeout(function(){h.element[0].removeEventListener("click",d._cancelEvents,true);
|
|
},0);
|
|
}if(h.hasDragged){if(h.element.length){h.endX=c.x;
|
|
h.endY=c.y;
|
|
}this._finishDrag(h);
|
|
}},_detachEvents:function(){if(a.TouchScrollExtender._getNeedsScrollExtender()){b(document.body).unbind("touchmove",this._simpleDragger).unbind("touchmove",this._compositeDragger).unbind("touchend",this._endDrag);
|
|
}else{b(document.body).unbind("mousemove",this._simpleDragger).unbind("mousemove",this._compositeDragger).unbind("mouseup",this._endDrag);
|
|
}},_finishDrag:function(d){var f=d.element[0].scrollLeft+d.kX-d.endX;
|
|
var e=d.element[0].scrollTop+d.kY-d.endY;
|
|
d.kX=0;
|
|
d.kY=0;
|
|
var c=this;
|
|
d.element.stop(true).animate({scrollLeft:f,scrollTop:e},{duration:500,easing:"easeOutQuad",complete:function(){c._removeScrollHints();
|
|
},step:function(){c._alignScrollHints();
|
|
}});
|
|
if(this._hasHorizontalScrollHint&&d.horizontalScrollHint){d.horizontalScrollHint.stop().css("opacity",0.5).fadeTo(450,0);
|
|
}if(this._hasVerticalScrollHint&&d.verticalScrollHint){d.verticalScrollHint.stop().css("opacity",0.5).fadeTo(450,0);
|
|
}},_cancelEvents:function(c){c.stopPropagation();
|
|
c.preventDefault();
|
|
}};
|
|
Telerik.Web.UI.TouchScrollExtender.registerClass("Telerik.Web.UI.TouchScrollExtender",null,Sys.IDisposable);
|
|
})($telerik.$);
|